From a075bb005217002b47112bcc4c82d717fb8feb85 Mon Sep 17 00:00:00 2001
From: Salman Mohammed <smohammed@squareup.com>
Date: Mon, 31 Mar 2025 08:48:37 -0400
Subject: [PATCH] feat: add more metadata for shared session view (#1919)

---
 .../sessions/SessionHistoryView.tsx           |  4 +++-
 .../components/sessions/SharedSessionView.tsx | 21 +++++++++++++++--
 ui/desktop/src/sharedSessions.ts              | 23 +++++++++++++++----
 3 files changed, 40 insertions(+), 8 deletions(-)

diff --git a/ui/desktop/src/components/sessions/SessionHistoryView.tsx b/ui/desktop/src/components/sessions/SessionHistoryView.tsx
index 2f74d017..12fc9e1a 100644
--- a/ui/desktop/src/components/sessions/SessionHistoryView.tsx
+++ b/ui/desktop/src/components/sessions/SessionHistoryView.tsx
@@ -65,8 +65,10 @@ const SessionHistoryView: React.FC<SessionHistoryViewProps> = ({
       // Create a shared session
       const shareToken = await createSharedSession(
         config.baseUrl,
+        session.metadata.working_dir,
         session.messages,
-        session.metadata.description || 'Shared Session'
+        session.metadata.description || 'Shared Session',
+        session.metadata.total_tokens
       );
 
       // Create the shareable link
diff --git a/ui/desktop/src/components/sessions/SharedSessionView.tsx b/ui/desktop/src/components/sessions/SharedSessionView.tsx
index 96958568..2a684661 100644
--- a/ui/desktop/src/components/sessions/SharedSessionView.tsx
+++ b/ui/desktop/src/components/sessions/SharedSessionView.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Clock, Globe } from 'lucide-react';
+import { Clock, Globe, MessageSquare, Folder } from 'lucide-react';
 import { type SharedSessionDetails } from '../../sharedSessions';
 import { SessionHeaderCard, SessionMessages } from './SessionViewComponents';
 
@@ -35,9 +35,26 @@ const SharedSessionView: React.FC<SharedSessionViewProps> = ({
                 <Clock className="w-4 h-4 mr-1" />
                 {new Date(session.messages[0]?.created * 1000).toLocaleString()}
               </span>
-              <span className="flex items-center">
+              {/* <span className="flex items-center">
                 <Globe className="w-4 h-4 mr-1" />
                 {session.base_url}
+              </span> */}
+              <span className="flex items-center">
+                <MessageSquare className="w-4 h-4 mr-1" />
+                {session.message_count} messages
+              </span>
+              {session.total_tokens !== null && (
+                <span className="flex items-center">
+                  {session.total_tokens.toLocaleString()} tokens
+                </span>
+              )}
+            </div>
+          )}
+          {session && (
+            <div className="flex items-center text-sm text-textSubtle mt-1">
+              <span className="flex items-center">
+                <Folder className="w-4 h-4 mr-1" />
+                {session.working_dir}
               </span>
             </div>
           )}
diff --git a/ui/desktop/src/sharedSessions.ts b/ui/desktop/src/sharedSessions.ts
index 877e4d1f..1f4e2cae 100644
--- a/ui/desktop/src/sharedSessions.ts
+++ b/ui/desktop/src/sharedSessions.ts
@@ -1,11 +1,14 @@
-import { Message, createUserMessage, createAssistantMessage } from './types/message';
+import { Message } from './types/message';
 
 export interface SharedSessionDetails {
   share_token: string;
   created_at: number;
   base_url: string;
   description: string;
+  working_dir: string;
   messages: Message[];
+  message_count: number;
+  total_tokens: number | null;
 }
 
 /**
@@ -42,8 +45,11 @@ export async function fetchSharedSessionDetails(
       share_token: data.share_token,
       created_at: data.created_at,
       base_url: data.base_url,
-      description: data.description || 'Shared Session',
+      description: data.description,
+      working_dir: data.working_dir,
       messages: data.messages,
+      message_count: data.message_count,
+      total_tokens: data.total_tokens,
     };
   } catch (error) {
     console.error('Error fetching shared session:', error);
@@ -54,14 +60,19 @@ export async function fetchSharedSessionDetails(
 /**
  * Creates a new shared session
  * @param baseUrl The base URL for session sharing API
+ * @param workingDir The working directory for the shared session
  * @param messages The messages to include in the shared session
- * @param description Optional description for the shared session
+ * @param description Description for the shared session
+ * @param totalTokens Total token count for the session, or null if not available
+ * @param userName The user name for who is sharing the session
  * @returns Promise with the share token
  */
 export async function createSharedSession(
   baseUrl: string,
+  workingDir: string,
   messages: Message[],
-  description?: string
+  description: string,
+  totalTokens: number | null
 ): Promise<string> {
   try {
     const response = await fetch(`${baseUrl}/sessions/share`, {
@@ -70,9 +81,11 @@ export async function createSharedSession(
         'Content-Type': 'application/json',
       },
       body: JSON.stringify({
+        working_dir: workingDir,
         messages,
-        description: description || 'Shared Session',
+        description: description,
         base_url: baseUrl,
+        total_tokens: totalTokens ?? null,
       }),
     });