fix merge conflicts studio <> invalid interrupts

starmorph · starmorph · commit f525528f1232 · 2025-04-23T16:40:45.000-07:00
diff --git a/src/components/agent-inbox/components/generic-inbox-item.tsx b/src/components/agent-inbox/components/generic-inbox-item.tsx
@@ -4,18 +4,16 @@ import { ThreadIdCopyable } from "./thread-id";
 import { InboxItemStatuses } from "./statuses";
 import { format } from "date-fns";
 import { useQueryParams } from "../hooks/use-query-params";
-import { VIEW_STATE_THREAD_QUERY_PARAM } from "../constants";
-
-import { GenericThreadData } from "../types";
-import { useToast } from "@/hooks/use-toast";
-import { constructOpenInStudioURL } from "../utils";
-import { Button } from "@/components/ui/button";
-import { useThreadsContext } from "../contexts/ThreadContext";
-import { useQueryParams } from "../hooks/use-query-params";
 import {
   STUDIO_NOT_WORKING_TROUBLESHOOTING_URL,
   VIEW_STATE_THREAD_QUERY_PARAM,
 } from "../constants";
+import { GenericThreadData } from "../types";
+import { useToast } from "@/hooks/use-toast";
+import { Button } from "@/components/ui/button";
+import { useThreadsContext } from "../contexts/ThreadContext";
+
+import { constructOpenInStudioURL } from "../utils";
 
 interface GenericInboxItemProps<
   ThreadValues extends Record<string, any> = Record<string, any>,
@@ -34,6 +32,8 @@ export function GenericInboxItem<
   ThreadValues extends Record<string, any> = Record<string, any>,
 >({ threadData, isLast }: GenericInboxItemProps<ThreadValues>) {
   const { updateQueryParams } = useQueryParams();
+  const { toast } = useToast();
+  const { agentInboxes } = useThreadsContext();
 
   const selectedInbox = agentInboxes.find((i) => i.selected);
 
@@ -82,7 +82,6 @@ export function GenericInboxItem<
     }
   };
 
-
   const updatedAtDateString = format(
     new Date(threadData.thread.updated_at),
     "MM/dd h:mm a"
@@ -101,22 +100,22 @@ export function GenericInboxItem<
         !isLast && "border-b-[1px] border-gray-200"
       )}
     >
-        <div className="flex items-center gap-2">
-          <div className="col-span-1 flex justify-center pt-6">
+      <div className="col-span-1 flex justify-center items-center">
         {/* Empty space for alignment with interrupted items */}
       </div>
+
       <div
         className={cn(
-          "flex items-center justify-start gap-2",
-          selectedInbox ? "col-span-7" : "col-span-9"
+          "col-span-6 flex items-center justify-start gap-2",
+          !selectedInbox && "col-span-9"
         )}
       >
-       <p className="text-sm font-semibold text-black">Thread ID:</p>
+        <p className="text-sm font-semibold text-black">Thread ID:</p>
         <ThreadIdCopyable showUUID threadId={threadData.thread.thread_id} />
       </div>
 
       {selectedInbox && (
-        <div className="col-span-2">
+        <div className="col-span-2 flex items-center">
           <Button
             size="sm"
             variant="outline"
@@ -126,19 +125,18 @@ export function GenericInboxItem<
             Studio
           </Button>
         </div>
-      </div>
-
-
-      <div className={cn("col-span-2", !selectedInbox && "col-start-10")}>
-        <InboxItemStatuses status={threadData.status} />
-      </div>
+      )}
 
-      <p
+      <div
         className={cn(
-          "col-span-1 text-gray-600 font-light text-sm",
-          !selectedInbox && "col-start-12"
+          "col-span-2 flex items-center",
+          !selectedInbox && "col-start-10"
         )}
       >
+        <InboxItemStatuses status={threadData.status} />
+      </div>
+
+      <p className="col-span-1 text-right text-sm text-gray-600 font-light pt-2">
         {updatedAtDateString}
       </p>
     </div>
diff --git a/src/components/agent-inbox/components/thread-actions-view.tsx b/src/components/agent-inbox/components/thread-actions-view.tsx
@@ -36,7 +36,6 @@ interface ThreadActionsViewProps<
   ThreadValues extends Record<string, any> = Record<string, any>,
 > {
   threadData: ThreadData<ThreadValues>;
-  interruptedActions: ReturnType<typeof useInterruptedActions>;
   isInterrupted: boolean;
   threadTitle: string;
   showState: boolean;
@@ -106,8 +105,7 @@ export function ThreadActionsView<
   ThreadValues extends Record<string, any> = Record<string, any>,
 >({
   threadData,
-  interruptedActions,
-  isInterrupted,
+  isInterrupted: _propIsInterrupted,
   threadTitle,
   showDescription,
   showState,
@@ -118,9 +116,9 @@ export function ThreadActionsView<
   const { updateQueryParams } = useQueryParams();
   const [refreshing, setRefreshing] = useState(false);
 
-
   // Get the selected inbox object
   const selectedInbox = agentInboxes.find((i) => i.selected);
+  const deploymentUrl = selectedInbox?.deploymentUrl;
 
   // Only use interrupted actions for interrupted threads
   const isInterrupted =
@@ -129,16 +127,15 @@ export function ThreadActionsView<
     threadData.interrupts.length > 0;
 
   // Initialize the hook outside of conditional to satisfy React rules of hooks
-  // Pass null values when not needed
-  const interruptedActions = useInterruptedActions<ThreadValues>({
+  const actions = useInterruptedActions<ThreadValues>({
     threadData: isInterrupted
       ? {
           thread: threadData.thread,
           status: "interrupted",
           interrupts: threadData.interrupts || [],
         }
       : null,
-    setThreadData: isInterrupted ? setThreadData : null,
+    setThreadData: null,
   });
 
   const handleOpenInStudio = () => {
@@ -316,8 +313,8 @@ export function ThreadActionsView<
             <Button
               variant="outline"
               className="text-gray-800 border-gray-500 font-normal bg-white"
-              onClick={interruptedActions?.handleIgnore} // Assuming ignore doesn't need config
-              disabled={interruptedActions?.loading}
+              onClick={actions?.handleIgnore} // Assuming ignore doesn't need config
+              disabled={actions?.loading}
             >
               Ignore Thread
             </Button>
@@ -506,8 +503,8 @@ export function ThreadActionsView<
         <Button
           variant="outline"
           className="text-gray-800 border-gray-500 font-normal bg-white"
-          onClick={interruptedActions?.handleResolve}
-          disabled={interruptedActions?.loading}
+          onClick={actions?.handleResolve}
+          disabled={actions?.loading}
         >
           Mark as Resolved
         </Button>
@@ -517,8 +514,8 @@ export function ThreadActionsView<
               <Button
                 variant="outline"
                 size="sm"
-                onClick={interruptedActions?.handleIgnore}
-                disabled={interruptedActions?.loading}
+                onClick={actions?.handleIgnore}
+                disabled={actions?.loading}
               >
                 Ignore
               </Button>
@@ -533,28 +530,20 @@ export function ThreadActionsView<
       {/* Actions */}
       <InboxItemInput
         acceptAllowed={acceptAllowed}
-        hasEdited={interruptedActions?.hasEdited ?? false}
-        hasAddedResponse={interruptedActions?.hasAddedResponse ?? false}
+        hasEdited={actions?.hasEdited ?? false}
+        hasAddedResponse={actions?.hasAddedResponse ?? false}
         interruptValue={firstInterrupt!}
-        humanResponse={interruptedActions?.humanResponse as any}
-        initialValues={
-          interruptedActions?.initialHumanInterruptEditValue.current || {}
-        }
-        setHumanResponse={interruptedActions?.setHumanResponse ?? (() => {})}
-        streaming={interruptedActions?.streaming ?? false}
-        streamFinished={interruptedActions?.streamFinished ?? false}
-        currentNode={interruptedActions?.currentNode ?? ""}
-        supportsMultipleMethods={
-          interruptedActions?.supportsMultipleMethods ?? false
-        }
-        setSelectedSubmitType={
-          interruptedActions?.setSelectedSubmitType ?? (() => {})
-        }
-        setHasAddedResponse={
-          interruptedActions?.setHasAddedResponse ?? (() => {})
-        }
-        setHasEdited={interruptedActions?.setHasEdited ?? (() => {})}
-        handleSubmit={interruptedActions?.handleSubmit ?? (async () => {})}
+        humanResponse={actions?.humanResponse as any}
+        initialValues={actions?.initialHumanInterruptEditValue.current || {}}
+        setHumanResponse={actions?.setHumanResponse ?? (() => {})}
+        streaming={actions?.streaming ?? false}
+        streamFinished={actions?.streamFinished ?? false}
+        currentNode={actions?.currentNode ?? ""}
+        supportsMultipleMethods={actions?.supportsMultipleMethods ?? false}
+        setSelectedSubmitType={actions?.setSelectedSubmitType ?? (() => {})}
+        setHasAddedResponse={actions?.setHasAddedResponse ?? (() => {})}
+        setHasEdited={actions?.setHasEdited ?? (() => {})}
+        handleSubmit={actions?.handleSubmit ?? (async () => {})}
       />
     </div>
   );
diff --git a/src/components/agent-inbox/hooks/use-inboxes.tsx b/src/components/agent-inbox/hooks/use-inboxes.tsx
@@ -121,78 +121,75 @@ export function useInboxes() {
         return;
       }
 
-    // Ensure each agent inbox has an ID, and if not, add one
-    parsedAgentInboxes = parsedAgentInboxes.map((i) => {
-      return {
-        ...i,
-        id: i.id || uuidv4(),
-      };
-    });
-
-    // If there is no agent inbox search param, or the search param is not
-    // a valid UUID, update search param and local storage
-    if (!agentInboxSearchParam || !validate(agentInboxSearchParam)) {
-      const selectedInbox = parsedAgentInboxes.find((i) => i.selected);
-      if (!selectedInbox) {
-        parsedAgentInboxes[0].selected = true;
-        updateQueryParams(
-          [AGENT_INBOX_PARAM, OFFSET_PARAM, LIMIT_PARAM, INBOX_PARAM],
-          [parsedAgentInboxes[0].id, "0", "10", "interrupted"]
-        );
-        setAgentInboxes(parsedAgentInboxes);
-        setItem(
-          AGENT_INBOXES_LOCAL_STORAGE_KEY,
-          JSON.stringify(parsedAgentInboxes)
-        );
-      } else {
-        updateQueryParams(
-          [AGENT_INBOX_PARAM, OFFSET_PARAM, LIMIT_PARAM, INBOX_PARAM],
-          [selectedInbox.id, "0", "10", "interrupted"]
-        );
-        setAgentInboxes(parsedAgentInboxes);
-        setItem(
-          AGENT_INBOXES_LOCAL_STORAGE_KEY,
-          JSON.stringify(parsedAgentInboxes)
+      // Ensure each agent inbox has an ID, and if not, add one
+      currentInboxes = currentInboxes.map((inbox) => {
+        return {
+          ...inbox,
+          id: inbox.id || uuidv4(),
+        };
+      });
 
       const agentInboxSearchParam = getSearchParam(AGENT_INBOX_PARAM);
       logger.log(
         "Agent inbox search param for selection:",
         agentInboxSearchParam
       );
 
-      let finalSelectedInboxId: string | null = null;
-
+      // If there is no agent inbox search param, or the search param does not match any inbox
+      // update search param and local storage
       if (!agentInboxSearchParam) {
-        // No param: Select first or already selected (in memory)
-        const alreadySelected = currentInboxes.find((inbox) => inbox.selected);
-        finalSelectedInboxId =
-          alreadySelected?.id || currentInboxes[0]?.id || null;
-        logger.log("No search param, selecting inbox:", finalSelectedInboxId);
-        if (finalSelectedInboxId && !initialLoadComplete.current) {
+        const selectedInbox = currentInboxes.find((inbox) => inbox.selected);
+        if (!selectedInbox) {
+          currentInboxes[0].selected = true;
+          updateQueryParams(
+            [AGENT_INBOX_PARAM, OFFSET_PARAM, LIMIT_PARAM, INBOX_PARAM],
+            [currentInboxes[0].id, "0", "10", "interrupted"]
+          );
+          setAgentInboxes(currentInboxes);
+          setItem(
+            AGENT_INBOXES_LOCAL_STORAGE_KEY,
+            JSON.stringify(currentInboxes)
+          );
+        } else {
+          updateQueryParams(
+            [AGENT_INBOX_PARAM, OFFSET_PARAM, LIMIT_PARAM, INBOX_PARAM],
+            [selectedInbox.id, "0", "10", "interrupted"]
+          );
+          setAgentInboxes(currentInboxes);
+          setItem(
+            AGENT_INBOXES_LOCAL_STORAGE_KEY,
+            JSON.stringify(currentInboxes)
+          );
+        }
+
+        // Mark initial load as complete
+        if (!initialLoadComplete.current) {
           initialLoadComplete.current = true;
-          // Update URL only on initial load if needed
-          updateQueryParams(AGENT_INBOX_PARAM, finalSelectedInboxId);
         }
-      } else {
-        // Param exists: Find inbox by param ID
-        const selectedByParam = currentInboxes.find(
-          (inbox) => inbox.id === agentInboxSearchParam
 
+        return;
+      }
+
+      let finalSelectedInboxId: string | null = null;
+
+      // Param exists: Find inbox by param ID
+      const selectedByParam = currentInboxes.find(
+        (inbox) => inbox.id === agentInboxSearchParam
+      );
+
+      if (selectedByParam) {
+        finalSelectedInboxId = selectedByParam.id;
+        logger.log("Found inbox by search param:", finalSelectedInboxId);
+      } else {
+        // Param exists but inbox not found: Select first
+        finalSelectedInboxId = currentInboxes[0]?.id || null;
+        logger.log(
+          "Inbox for search param not found, selecting first inbox:",
+          finalSelectedInboxId
         );
-        if (selectedByParam) {
-          finalSelectedInboxId = selectedByParam.id;
-          logger.log("Found inbox by search param:", finalSelectedInboxId);
-        } else {
-          // Param exists but inbox not found: Select first
-          finalSelectedInboxId = currentInboxes[0]?.id || null;
-          logger.log(
-            "Inbox for search param not found, selecting first inbox:",
-            finalSelectedInboxId
-          );
-          if (finalSelectedInboxId) {
-            // Update URL to reflect the actual selection
-            updateQueryParams(AGENT_INBOX_PARAM, finalSelectedInboxId);
-          }
+        if (finalSelectedInboxId) {
+          // Update URL to reflect the actual selection
+          updateQueryParams(AGENT_INBOX_PARAM, finalSelectedInboxId);
         }
       }
 
@@ -244,19 +241,6 @@ export function useInboxes() {
         return;
       }
 
-      const parsedAgentInboxes = JSON.parse(agentInboxes);
-      parsedAgentInboxes.push(newInbox);
-      setAgentInboxes(parsedAgentInboxes);
-      setItem(
-        AGENT_INBOXES_LOCAL_STORAGE_KEY,
-        JSON.stringify(parsedAgentInboxes)
-      );
-      // Set agent inbox, offset, and limit
-      updateQueryParams(
-        [AGENT_INBOX_PARAM, OFFSET_PARAM, LIMIT_PARAM, INBOX_PARAM],
-        [newInbox.id, "0", "10", "interrupted"]
-      );
-
       try {
         const parsedAgentInboxes: AgentInbox[] = JSON.parse(agentInboxesStr);
 
@@ -402,7 +386,6 @@ export function useInboxes() {
 
       // Update URL parameters
       if (!replaceAll) {
-
         // Set agent inbox, offset, limit, and inbox param
         updateQueryParams(
           [AGENT_INBOX_PARAM, OFFSET_PARAM, LIMIT_PARAM, INBOX_PARAM],
@@ -418,7 +401,6 @@ export function useInboxes() {
         });
         const newUrl = url.pathname + "?" + newParams.toString();
         window.location.href = newUrl;
-
       }
     },
     [getItem, setItem, updateQueryParams, router]
diff --git a/src/components/agent-inbox/thread-view.tsx b/src/components/agent-inbox/thread-view.tsx
