✨ feat(vscode): 会话 tab 可交接对话给同事

vscode/webview-ui/src/components/BottomTabs.tsx

@@ -11,7 +11,7 @@
  */
 
 import type { ClaudeProfile } from '../hooks/useIssues'
-import type { ProfilesData } from '../lib/messages'
+import type { ProfilesData, SessionHandoffPendingItem } from '../lib/messages'
 import type { Issue, ManagedSessionsData } from '../types'
 import { ClipboardList, FileDiff, Layers, MessagesSquare } from 'lucide-react'
 import { useState } from 'react'
@@ -72,6 +72,9 @@ interface BottomTabsProps {
   importableLoading: boolean
   onListImportableSessions: () => void
   onImportNamedSession: (sessionId: string, name: string) => void
+  pendingHandoffs: SessionHandoffPendingItem[]
+  onSessionHandoff: (sessionId: string) => void
+  onAcceptSessionHandoff: (attachmentId: number) => void
 }
 
 export function BottomTabs(props: BottomTabsProps) {
@@ -98,6 +101,7 @@ export function BottomTabs(props: BottomTabsProps) {
           onClick={() => setTab('sessions')}
           icon={<MessagesSquare className="size-4" />}
           title="会话"
+          badge={props.pendingHandoffs.length}
         />
         <TabButton
           active={tab === 'changes'}
@@ -176,6 +180,9 @@ export function BottomTabs(props: BottomTabsProps) {
             importableLoading={props.importableLoading}
             onListImportable={props.onListImportableSessions}
             onImport={props.onImportNamedSession}
+            pendingHandoffs={props.pendingHandoffs}
+            onHandoff={props.onSessionHandoff}
+            onAcceptHandoff={props.onAcceptSessionHandoff}
           />
         </div>
         <div
@@ -195,9 +202,10 @@ interface TabButtonProps {
   onClick: () => void
   icon: React.ReactNode
   title: string
+  badge?: number
 }
 
-function TabButton({ active, onClick, icon, title }: TabButtonProps) {
+function TabButton({ active, onClick, icon, title, badge }: TabButtonProps) {
   return (
     <button
       type="button"
@@ -215,6 +223,11 @@ function TabButton({ active, onClick, icon, title }: TabButtonProps) {
         <span className="absolute left-0 top-0 h-full w-[2px] bg-[var(--vscode-focusBorder)]" />
       )}
       {icon}
+      {badge != null && badge > 0 && (
+        <span className="absolute right-0.5 top-0.5 min-w-[14px] rounded-full bg-[var(--vscode-activityBarBadge-background)] px-0.5 text-center text-[9px] leading-[14px] text-[var(--vscode-activityBarBadge-foreground)]">
+          {badge > 9 ? '9+' : badge}
+        </span>
+      )}
     </button>
   )
 }