style: Updated component styles and layouts.

- Added new styles for the business smart assistant icon.
- Adjusted the sizes and positions of the ArrowRightButton components.
- Removed conditional style for NavbarLeft component.
- Implemented logic to resolve tab initialization based on component position.

src/renderer/src/assets/styles/index.scss

@@ -224,6 +224,9 @@ body,
   .anticon-setting {
     font-size: 12px;
   }
+  .icon-business-smart-assistant {
+    margin-right: -2px;
+  }
   .ant-segmented-item-icon + * {
     margin-left: 4px;
   }

src/renderer/src/pages/home/Assistants.tsx

@@ -181,14 +181,14 @@ const ArrowRightButton = styled.div`
   flex-direction: row;
   justify-content: center;
   align-items: center;
-  width: 24px;
-  height: 24px;
-  min-width: 24px;
-  min-height: 24px;
+  width: 22px;
+  height: 22px;
+  min-width: 22px;
+  min-height: 22px;
   border-radius: 4px;
   position: absolute;
-  right: 10px;
-  top: 5px;
+  right: 9px;
+  top: 6px;
   .anticon {
     font-size: 14px;
   }

src/renderer/src/pages/home/Navbar.tsx

@@ -42,13 +42,7 @@ const HeaderNavbar: FC<Props> = ({ activeAssistant, setActiveAssistant }) => {
   return (
     <Navbar>
       {showAssistants && (
-        <NavbarLeft
-          style={{
-            justifyContent: 'space-between',
-            borderRight: 'none',
-            padding: '0 8px',
-            width: topicPosition === 'left' ? '300px' : 'var(--assistants-width)'
-          }}>
+        <NavbarLeft style={{ justifyContent: 'space-between', borderRight: 'none', padding: '0 8px' }}>
           <NewButton onClick={toggleShowAssistants} style={{ marginLeft: isMac ? 8 : 0 }}>
             <i className="iconfont icon-hide-sidebar" />
           </NewButton>

src/renderer/src/pages/home/RightSidebar.tsx

@@ -22,9 +22,13 @@ interface Props {
   position: 'left' | 'right'
 }
 
+type Tab = 'assistants' | 'topic' | 'settings'
+
+let _tab = ''
+
 const RightSidebar: FC<Props> = ({ activeAssistant, activeTopic, setActiveAssistant, setActiveTopic, position }) => {
   const { addAssistant } = useAssistants()
-  const [tab, setTab] = useState<'assistants' | 'topic' | 'settings'>(position === 'left' ? 'assistants' : 'topic')
+  const [tab, setTab] = useState<Tab>(_tab || position === 'left' ? 'assistants' : 'topic')
   const { topicPosition } = useSettings()
   const { defaultAssistant } = useDefaultAssistant()
   const { toggleShowTopics } = useShowTopics()
@@ -33,6 +37,7 @@ const RightSidebar: FC<Props> = ({ activeAssistant, activeTopic, setActiveAssist
 
   const borderStyle = '0.5px solid var(--color-border)'
   const border = position === 'left' ? { borderRight: borderStyle } : { borderLeft: borderStyle }
+  _tab = tab
 
   const showTab = !(position === 'left' && topicPosition === 'right')
   const assistantTab = {
@@ -74,12 +79,7 @@ const RightSidebar: FC<Props> = ({ activeAssistant, activeTopic, setActiveAssist
         <Segmented
           value={tab}
           className="segmented-tab"
-          style={{
-            borderRadius: 0,
-            padding: '10px',
-            gap: 3,
-            borderBottom: '0.5px solid var(--color-border)'
-          }}
+          style={{ borderRadius: 0, padding: '10px', gap: 2, borderBottom: borderStyle }}
           options={
             [
               position === 'left' && topicPosition === 'left' ? assistantTab : undefined,