feat(team): integrate Team components into main application

- Add Team tab to Sidebar with TeamList component
- Update MainViewType to include 'team' view
- Add TeamCollaborationView rendering in App.tsx
- Add selectedTeamId and onSelectTeam props to Sidebar
- Create TeamList component for sidebar team navigation

UI Integration:
- Team tab shows list of teams with status indicators
- Selecting a team displays TeamCollaborationView
- Empty state shows guidance for creating teams

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

desktop/src/App.tsx

@@ -7,7 +7,9 @@ import { SettingsLayout } from './components/Settings/SettingsLayout';
 import { HandTaskPanel } from './components/HandTaskPanel';
 import { WorkflowList } from './components/WorkflowList';
 import { TriggersPanel } from './components/TriggersPanel';
+import { TeamCollaborationView } from './components/TeamCollaborationView';
 import { useGatewayStore } from './store/gatewayStore';
+import { useTeamStore } from './store/teamStore';
 import { getStoredGatewayToken } from './lib/gateway-client';
 
 type View = 'main' | 'settings';
@@ -16,7 +18,9 @@ function App() {
   const [view, setView] = useState<View>('main');
   const [mainContentView, setMainContentView] = useState<MainViewType>('chat');
   const [selectedHandId, setSelectedHandId] = useState<string | undefined>(undefined);
+  const [selectedTeamId, setSelectedTeamId] = useState<string | undefined>(undefined);
   const { connect, connectionState } = useGatewayStore();
+  const { activeTeam, setActiveTeam, teams } = useTeamStore();
 
   useEffect(() => {
     document.title = 'ZCLAW';
@@ -38,6 +42,14 @@ function App() {
     }
   };
 
+  const handleSelectTeam = (teamId: string) => {
+    const team = teams.find(t => t.id === teamId);
+    if (team) {
+      setActiveTeam(team);
+      setSelectedTeamId(teamId);
+    }
+  };
+
   if (view === 'settings') {
     return <SettingsLayout onBack={() => setView('main')} />;
   }
@@ -50,6 +62,8 @@ function App() {
         onMainViewChange={handleMainViewChange}
         selectedHandId={selectedHandId}
         onSelectHand={setSelectedHandId}
+        selectedTeamId={selectedTeamId}
+        onSelectTeam={handleSelectTeam}
       />
 
       {/* 中间区域 */}
@@ -76,6 +90,22 @@ function App() {
             <WorkflowList />
             <TriggersPanel />
           </div>
+        ) : mainContentView === 'team' ? (
+          activeTeam ? (
+            <TeamCollaborationView teamId={activeTeam.id} />
+          ) : (
+            <div className="flex-1 flex items-center justify-center p-6">
+              <div className="text-center">
+                <div className="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                  <span className="text-4xl">👥</span>
+                </div>
+                <h3 className="text-lg font-semibold text-gray-700 mb-2">选择或创建团队</h3>
+                <p className="text-sm text-gray-400 max-w-sm">
+                  从左侧列表选择一个团队，或点击 + 创建新的多 Agent 协作团队。
+                </p>
+              </div>
+            </div>
+          )
         ) : (
           <ChatArea />
         )}