fix prototype

src/components/Sidebar/DiscussionsButton.tsx

@@ -0,0 +1,19 @@
+import { usePrimaryPage } from '@/PageManager'
+import { MessageCircle } from 'lucide-react'
+import { useTranslation } from 'react-i18next'
+import SidebarItem from './SidebarItem'
+
+export default function DiscussionsButton() {
+  const { t } = useTranslation()
+  const { navigate, current } = usePrimaryPage()
+
+  return (
+    <SidebarItem
+      title={t('Discussions')}
+      onClick={() => navigate('discussions')}
+      active={current === 'discussions'}
+    >
+      <MessageCircle strokeWidth={3} />
+    </SidebarItem>
+  )
+}

src/components/Sidebar/index.tsx

@@ -2,6 +2,7 @@ import Icon from '@/assets/Icon'
 import Logo from '@/assets/Logo'
 import { useScreenSize } from '@/providers/ScreenSizeProvider'
 import AccountButton from './AccountButton'
+import DiscussionsButton from './DiscussionsButton'
 import RelaysButton from './ExploreButton'
 import HomeButton from './HomeButton'
 import NotificationsButton from './NotificationButton'
@@ -23,6 +24,7 @@ export default function PrimaryPageSidebar() {
         </div>
         <HomeButton />
         <RelaysButton />
+        <DiscussionsButton />
         <NotificationsButton />
         <SearchButton />
         <ProfileButton />

src/pages/primary/DiscussionsPage/TopicFilter.tsx

@@ -22,7 +22,7 @@ export default function TopicFilter({ topics, selectedTopic, onTopicChange }: To
       <DropdownMenuTrigger asChild>
         <Button 
           variant="outline" 
-          className="flex items-center gap-2 h-10 px-3"
+          className="flex items-center gap-2 h-10 px-3 min-w-40"
         >
           <Hash className="w-4 h-4" />
           <span className="hidden sm:inline">{selectedTopicInfo.label}</span>
@@ -30,7 +30,7 @@ export default function TopicFilter({ topics, selectedTopic, onTopicChange }: To
           <ChevronDown className="w-4 h-4" />
         </Button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="start" className="w-56">
+      <DropdownMenuContent align="start" className="w-72">
         {topics.map(topic => (
           <DropdownMenuItem
             key={topic.id}

src/pages/primary/DiscussionsPage/index.tsx

@@ -99,7 +99,7 @@ const DiscussionsPage = forwardRef((_, ref) => {
               <select
                 value={selectedRelay || ''}
                 onChange={(e) => setSelectedRelay(e.target.value || null)}
-                className="px-2 py-1 rounded border bg-background text-sm"
+                className="px-3 h-10 rounded border bg-background text-sm"
               >
                 <option value="">All Relays</option>
                 {availableRelays.map(relay => (