refactor: improve FloatingSidebar and HomeTabs components

- Simplified the onOpenChange handler in FloatingSidebar for better readability.
- Added style prop to HomeTabs for enhanced customization.
- Adjusted Container style in HomeTabs to merge with existing border styles.

src/renderer/src/components/Popups/FloatingSidebar.tsx

@@ -52,29 +52,28 @@ const FloatingSidebar: FC<Props> = ({
         setActiveAssistant={setActiveAssistant}
         setActiveTopic={setActiveTopic}
         position={position}
-        forceToSeeAllTab={true}></HomeTabs>
+        forceToSeeAllTab={true}
+        style={{
+          background: 'transparent',
+          border: 'none'
+        }}
+      />
     </PopoverContent>
   )
 
   return (
     <Popover
       open={open}
-      onOpenChange={(visible) => {
+      onOpenChange={setOpen}
-        setOpen(visible)
-      }}
       content={content}
       trigger={['hover', 'click', 'contextMenu']}
       placement="bottomRight"
-      arrow={false}
+      showArrow
       mouseEnterDelay={0.8} // 800ms delay before showing
       mouseLeaveDelay={20}
       styles={{
         body: {
-          padding: 0,
+          padding: 0
-          background: 'var(--color-background)',
-          border: '1px solid var(--color-border)',
-          borderRadius: '8px',
-          boxShadow: '0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12)'
         }
       }}>
       {children}

src/renderer/src/pages/home/Tabs/index.tsx

@@ -21,6 +21,7 @@ interface Props {
   setActiveTopic: (topic: Topic) => void
   position: 'left' | 'right'
   forceToSeeAllTab?: boolean
+  style?: React.CSSProperties
 }
 
 type Tab = 'assistants' | 'topic' | 'settings'
@@ -33,7 +34,8 @@ const HomeTabs: FC<Props> = ({
   setActiveAssistant,
   setActiveTopic,
   position,
-  forceToSeeAllTab
+  forceToSeeAllTab,
+  style
 }) => {
   const { addAssistant } = useAssistants()
   const [tab, setTab] = useState<Tab>(position === 'left' ? _tab || 'assistants' : 'topic')
@@ -100,7 +102,7 @@ const HomeTabs: FC<Props> = ({
   }, [position, tab, topicPosition, forceToSeeAllTab])
 
   return (
-    <Container style={border} className="home-tabs">
+    <Container style={{ ...border, ...style }} className="home-tabs">
       {(showTab || (forceToSeeAllTab == true && !showTopics)) && (
         <Segmented
           value={tab}