Fix focusing of imported chats. #233

src/apps/chat/AppChat.tsx

@@ -414,7 +414,7 @@ export function AppChat() {
     {!!flattenConversationId && <FlattenerModal conversationId={flattenConversationId} onClose={() => setFlattenConversationId(null)} />}
 
     {/* Import / Export  */}
-    {!!tradeConfig && <TradeModal config={tradeConfig} onClose={() => setTradeConfig(null)} />}
+    {!!tradeConfig && <TradeModal config={tradeConfig} onConversationActivate={setFocusedConversationId} onClose={() => setTradeConfig(null)} />}
 
 
     {/* [confirmation] Reset Conversation */}

src/modules/trade/ImportChats.tsx

@@ -29,7 +29,7 @@ const chatGptMedia: FormRadioOption<'source' | 'link'>[] = [
  * Components and functionality to import conversations
  * Supports our own JSON files, and ChatGPT Share Links
  */
-export function ImportConversations(props: { onClose: () => void }) {
+export function ImportConversations(props: { onConversationActivate: (conversationId: DConversationId) => void, onClose: () => void }) {
 
   // state
   const [importMedia, importMediaControl] = useFormRadio('link', chatGptMedia);
@@ -71,8 +71,10 @@ export function ImportConversations(props: { onClose: () => void }) {
 
     // import conversations (warning - will overwrite things)
     for (const conversation of [...outcome.conversations].reverse()) {
-      if (conversation.success)
-        useChatStore.getState().importConversation(conversation.conversation, false);
+      if (conversation.success) {
+        const conversationId: DConversationId = useChatStore.getState().importConversation(conversation.conversation, false);
+        props.onConversationActivate(conversationId);
+      }
     }
 
     // show the outcome of the import
@@ -128,6 +130,7 @@ export function ImportConversations(props: { onClose: () => void }) {
     const success = conversation.messages.length >= 1;
     if (success) {
       useChatStore.getState().importConversation(conversation, false);
+      props.onConversationActivate(conversationId);
       outcome.conversations.push({ success: true, fileName: 'chatgpt', conversation });
     } else
       outcome.conversations.push({ success: false, fileName: 'chatgpt', error: `Empty conversation` });

src/modules/trade/TradeModal.tsx

@@ -2,6 +2,7 @@ import * as React from 'react';
 
 import { Divider } from '@mui/joy';
 
+import { DConversationId } from '~/common/state/store-chats';
 import { GoodModal } from '~/common/components/GoodModal';
 
 import { ExportChats, ExportConfig } from './ExportChats';
@@ -9,11 +10,11 @@ import { ImportConfig, ImportConversations } from './ImportChats';
 
 export type TradeConfig = ImportConfig | ExportConfig;
 
-export function TradeModal(props: { config: TradeConfig, onClose: () => void }) {
+export function TradeModal(props: { config: TradeConfig, onConversationActivate: (conversationId: DConversationId) => void, onClose: () => void }) {
   return (
     <GoodModal title={<><b>{props.config.dir === 'import' ? 'Import ' : props.config.dir === 'export' ? 'Export ' : ''}</b> conversations</>} open onClose={props.onClose}>
       <Divider />
-      {props.config.dir === 'import' && <ImportConversations onClose={props.onClose} />}
+      {props.config.dir === 'import' && <ImportConversations onConversationActivate={props.onConversationActivate} onClose={props.onClose} />}
       {props.config.dir === 'export' && <ExportChats config={props.config} onClose={props.onClose} />}
       <Divider />
     </GoodModal>