fix: loading shared sessions (#3607)
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import React from 'react';
|
||||
import { Calendar, MessageSquareText, Folder, Target } from 'lucide-react';
|
||||
import { Calendar, MessageSquareText, Folder, Target, LoaderCircle, Share2 } from 'lucide-react';
|
||||
import { type SharedSessionDetails } from '../../sharedSessions';
|
||||
import { SessionHeaderCard, SessionMessages } from './SessionViewComponents';
|
||||
import { SessionMessages } from './SessionViewComponents';
|
||||
import { formatMessageTimestamp } from '../../utils/timeUtils';
|
||||
import { MainPanelLayout } from '../Layout/MainPanelLayout';
|
||||
|
||||
@@ -9,53 +9,73 @@ interface SharedSessionViewProps {
|
||||
session: SharedSessionDetails | null;
|
||||
isLoading: boolean;
|
||||
error: string | null;
|
||||
onBack: () => void;
|
||||
onRetry: () => void;
|
||||
}
|
||||
|
||||
// Custom SessionHeader component matching SessionHistoryView style
|
||||
const SessionHeader: React.FC<{
|
||||
children: React.ReactNode;
|
||||
title: string;
|
||||
}> = ({ children, title }) => {
|
||||
return (
|
||||
<div className="flex flex-col pb-8 border-b">
|
||||
<h1 className="text-4xl font-light mb-4 pt-6">{title}</h1>
|
||||
<div className="flex items-center">{children}</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const SharedSessionView: React.FC<SharedSessionViewProps> = ({
|
||||
session,
|
||||
isLoading,
|
||||
error,
|
||||
onBack,
|
||||
onRetry,
|
||||
}) => {
|
||||
return (
|
||||
<MainPanelLayout>
|
||||
<div className="flex flex-col h-full">
|
||||
<div className="relative flex items-center h-14 w-full"></div>
|
||||
|
||||
{/* Top Row - back, info (fixed) */}
|
||||
<SessionHeaderCard onBack={onBack}>
|
||||
{/* Session info row */}
|
||||
<div className="ml-8">
|
||||
<h1 className="text-lg text-textStandardInverse">
|
||||
{session ? session.description : 'Shared Session'}
|
||||
</h1>
|
||||
<div className="flex items-center text-sm text-textSubtle mt-1 space-x-5">
|
||||
<span className="flex items-center">
|
||||
<Calendar className="w-4 h-4 mr-1" />
|
||||
{session ? formatMessageTimestamp(session.messages[0]?.created) : 'Unknown'}
|
||||
</span>
|
||||
<span className="flex items-center">
|
||||
<MessageSquareText className="w-4 h-4 mr-1" />
|
||||
{session ? session.message_count : 0}
|
||||
</span>
|
||||
{session && session.total_tokens !== null && (
|
||||
<span className="flex items-center">
|
||||
<Target className="w-4 h-4 mr-1" />
|
||||
{session.total_tokens.toLocaleString()}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center text-sm text-textSubtle space-x-5">
|
||||
<span className="flex items-center">
|
||||
<Folder className="w-4 h-4 mr-1" />
|
||||
{session ? session.working_dir : 'Unknown'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col min-h-0 px-8">
|
||||
<div className="flex items-center py-4 border-b border-border-subtle mb-6">
|
||||
<div className="flex items-center text-text-muted">
|
||||
<Share2 className="w-5 h-5 mr-2" />
|
||||
<span className="text-sm font-medium">Shared Session</span>
|
||||
</div>
|
||||
</SessionHeaderCard>
|
||||
</div>
|
||||
|
||||
<SessionHeader title={session ? session.description : 'Shared Session'}>
|
||||
<div className="flex flex-col">
|
||||
{!isLoading && session && session.messages.length > 0 ? (
|
||||
<>
|
||||
<div className="flex items-center text-text-muted text-sm space-x-5 font-mono">
|
||||
<span className="flex items-center">
|
||||
<Calendar className="w-4 h-4 mr-1" />
|
||||
{formatMessageTimestamp(session.messages[0]?.created)}
|
||||
</span>
|
||||
<span className="flex items-center">
|
||||
<MessageSquareText className="w-4 h-4 mr-1" />
|
||||
{session.message_count}
|
||||
</span>
|
||||
{session.total_tokens !== null && (
|
||||
<span className="flex items-center">
|
||||
<Target className="w-4 h-4 mr-1" />
|
||||
{session.total_tokens.toLocaleString()}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center text-text-muted text-sm mt-1 font-mono">
|
||||
<span className="flex items-center">
|
||||
<Folder className="w-4 h-4 mr-1" />
|
||||
{session.working_dir}
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="flex items-center text-text-muted text-sm">
|
||||
<LoaderCircle className="w-4 h-4 mr-2 animate-spin" />
|
||||
<span>Loading session details...</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</SessionHeader>
|
||||
|
||||
<SessionMessages
|
||||
messages={session?.messages || []}
|
||||
|
||||
Reference in New Issue
Block a user