fix(teamsbot): session switcher in session view, fix navigation from dashboard details button

Co-authored-by: Cursor <cursoragent@cursor.com>

src/pages/views/teamsbot/TeamsbotSessionView.tsx

@@ -15,6 +15,7 @@ export const TeamsbotSessionView: React.FC = () => {
   const sessionId = searchParams.get('sessionId') || '';
 
   const [session, setSession] = useState<TeamsbotSession | null>(null);
+  const [allSessions, setAllSessions] = useState<TeamsbotSession[]>([]);
   const [transcripts, setTranscripts] = useState<TeamsbotTranscript[]>([]);
   const [botResponses, setBotResponses] = useState<TeamsbotBotResponse[]>([]);
   const [loading, setLoading] = useState(true);
@@ -32,19 +33,23 @@ export const TeamsbotSessionView: React.FC = () => {
       setLoading(true);
       setNoSessions(false);
 
-      let targetSessionId = sessionId;
-
-      // No sessionId in URL -> find the most recent session
-      if (!targetSessionId) {
+      // Always load the full session list for the switcher
       const listResult = await teamsbotApi.listSessions(instanceId, true);
       const sessions = listResult.sessions || [];
+      setAllSessions(sessions);
+
+      let targetSessionId = sessionId;
+
+      // No sessionId in URL -> find the most recent active or latest session
+      if (!targetSessionId) {
         if (sessions.length === 0) {
           setNoSessions(true);
           setLoading(false);
           return;
         }
-        // Pick the most recent (first in list, sorted by creation date desc)
-        targetSessionId = sessions[0].id;
+        // Prefer active sessions, then most recent
+        const activeSession = sessions.find(s => ['active', 'joining', 'pending'].includes(s.status));
+        targetSessionId = activeSession ? activeSession.id : sessions[0].id;
         setSearchParams({ sessionId: targetSessionId }, { replace: true });
       }
 
@@ -178,8 +183,37 @@ export const TeamsbotSessionView: React.FC = () => {
   );
   if (!session) return <div className={styles.errorBanner}>Sitzung nicht gefunden</div>;
 
+  const _switchSession = (newSessionId: string) => {
+    setSearchParams({ sessionId: newSessionId });
+  };
+
   return (
     <div className={styles.sessionContainer}>
+      {/* Session Switcher (if multiple sessions exist) */}
+      {allSessions.length > 1 && (
+        <div style={{ display: 'flex', gap: '8px', marginBottom: '12px', flexWrap: 'wrap' }}>
+          {allSessions.map((s) => (
+            <button
+              key={s.id}
+              onClick={() => _switchSession(s.id)}
+              style={{
+                padding: '6px 12px',
+                borderRadius: '6px',
+                border: s.id === sessionId ? '2px solid #4A90D9' : '1px solid #ddd',
+                background: s.id === sessionId ? '#EBF3FC' : '#fff',
+                cursor: 'pointer',
+                fontSize: '13px',
+                fontWeight: s.id === sessionId ? 600 : 400,
+              }}
+            >
+              {s.botName}
+              {['active', 'joining', 'pending'].includes(s.status) && ' (aktiv)'}
+              {s.status === 'ended' && ' (beendet)'}
+            </button>
+          ))}
+        </div>
+      )}
+
       {/* Session Header */}
       <div className={styles.sessionViewHeader}>
         <div className={styles.sessionInfo}>