refactor: update Chat, AgentItem, and LaunchpadPage components to use preference hooks

- Replaced useSettings with usePreference in AgentItem and LaunchpadPage for better state management.
- Adjusted Chat component's Main element to include width styling for improved layout consistency.

src/renderer/src/pages/home/Chat.tsx

@@ -204,7 +204,10 @@ const Chat: FC<Props> = (props) => {
           }}
           transition={{ duration: 0.3, ease: 'easeInOut' }}
           style={{ flex: 1, display: 'flex', minWidth: 0 }}>
-          <Main ref={mainRef} id="chat-main" style={{ maxWidth: chatMaxWidth, height: mainHeight }}>
+          <Main
+            ref={mainRef}
+            id="chat-main"
+            style={{ maxWidth: chatMaxWidth, width: chatMaxWidth, height: mainHeight }}>
             <QuickPanelProvider>
               <ChatNavbar
                 activeAssistant={props.assistant}

src/renderer/src/pages/home/Tabs/components/AgentItem.tsx

@@ -1,7 +1,7 @@
+import { usePreference } from '@data/hooks/usePreference'
 import { cn } from '@heroui/react'
 import { DeleteIcon, EditIcon } from '@renderer/components/Icons'
 import { useSessions } from '@renderer/hooks/agents/useSessions'
-import { useSettings } from '@renderer/hooks/useSettings'
 import AgentSettingsPopup from '@renderer/pages/settings/AgentSettings/AgentSettingsPopup'
 import { AgentLabel } from '@renderer/pages/settings/AgentSettings/shared'
 import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService'
@@ -23,7 +23,8 @@ interface AgentItemProps {
 const AgentItem: FC<AgentItemProps> = ({ agent, isActive, onDelete, onPress }) => {
   const { t } = useTranslation()
   const { sessions } = useSessions(agent.id)
-  const { clickAssistantToShowTopic, topicPosition } = useSettings()
+  const [topicPosition] = usePreference('topic.position')
+  const [clickAssistantToShowTopic] = usePreference('assistant.click_to_show_topic')
 
   const handlePress = useCallback(() => {
     // Show session sidebar if setting is enabled (reusing the assistant setting for consistency)

src/renderer/src/pages/launchpad/LaunchpadPage.tsx

@@ -1,6 +1,6 @@
+import { usePreference } from '@data/hooks/usePreference'
 import App from '@renderer/components/MinApp/MinApp'
 import { useMinapps } from '@renderer/hooks/useMinapps'
-import { useSettings } from '@renderer/hooks/useSettings'
 import { Code, FileSearch, Folder, Languages, LayoutGrid, NotepadText, Palette, Sparkle } from 'lucide-react'
 import type { FC } from 'react'
 import { useMemo } from 'react'
@@ -11,7 +11,7 @@ import styled from 'styled-components'
 const LaunchpadPage: FC = () => {
   const navigate = useNavigate()
   const { t } = useTranslation()
-  const { defaultPaintingProvider } = useSettings()
+  const [defaultPaintingProvider] = usePreference('topic.position')
   const { pinned, openedKeepAliveMinapps } = useMinapps()
 
   const appMenuItems = [