Skip to content

Commit b0a1f9a

Browse files
bracesproulbracesproul
committed
cr
1 parent f525528 commit b0a1f9a

File tree

3 files changed

+89
-86
lines changed

3 files changed

+89
-86
lines changed

‎src/components/agent-inbox/components/generic-interrupt-value.tsx‎

Lines changed: 82 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -153,93 +153,91 @@ export function GenericInterruptValue({
153153
animate={{ height: "auto" }} // Let content dictate height
154154
transition={{ duration: 0.3, ease: "easeInOut" }}
155155
>
156-
<div className="p-3">
157-
<AnimatePresence mode="wait" initial={false}>
158-
{
159-
// Determine rendering mode
160-
(() => {
161-
const showTable =
162-
complex && (!shouldShowExpandButton || isExpanded);
163-
const showCollapsedPreview =
164-
complex && shouldShowExpandButton && !isExpanded;
165-
const showSimpleValue = !complex;
156+
<AnimatePresence mode="wait" initial={false}>
157+
{
158+
// Determine rendering mode
159+
(() => {
160+
const showTable =
161+
complex && (!shouldShowExpandButton || isExpanded);
162+
const showCollapsedPreview =
163+
complex && shouldShowExpandButton && !isExpanded;
164+
const showSimpleValue = !complex;
166165

167-
return (
168-
<motion.div
169-
key={showTable ? "table" : "preview"} // Key based on what's visible
170-
initial={{ opacity: 0, height: 0 }}
171-
animate={{ opacity: 1, height: "auto" }}
172-
exit={{ opacity: 0, height: 0 }}
173-
transition={{ duration: 0.2, ease: "easeInOut" }}
174-
style={{ overflow: "hidden" }} // Important for height animation
175-
>
176-
{showSimpleValue && (
177-
<div className="px-4 py-2 text-sm">
178-
{renderCollapsedValue(interrupt, false)}
179-
</div>
180-
)}
181-
{showCollapsedPreview && (
182-
<div className="px-4 py-2 text-sm">
183-
{renderCollapsedValue(interrupt, true)}{" "}
184-
{/* Render the preview */}
185-
</div>
186-
)}
187-
{showTable && (
188-
// Render expanded table
189-
<div
190-
className="overflow-x-auto"
191-
style={{
192-
maxHeight:
193-
"500px" /* Limit height for very long tables */,
194-
}}
195-
>
196-
<table className="min-w-full divide-y divide-gray-200">
197-
<thead className="bg-gray-50 sticky top-0 z-10">
198-
{" "}
199-
{/* Sticky header */}
166+
return (
167+
<motion.div
168+
key={showTable ? "table" : "preview"} // Key based on what's visible
169+
initial={{ opacity: 0, height: 0 }}
170+
animate={{ opacity: 1, height: "auto" }}
171+
exit={{ opacity: 0, height: 0 }}
172+
transition={{ duration: 0.2, ease: "easeInOut" }}
173+
style={{ overflow: "hidden" }} // Important for height animation
174+
>
175+
{showSimpleValue && (
176+
<div className="px-4 py-2 text-sm">
177+
{renderCollapsedValue(interrupt, false)}
178+
</div>
179+
)}
180+
{showCollapsedPreview && (
181+
<div className="px-4 py-2 text-sm">
182+
{renderCollapsedValue(interrupt, true)}{" "}
183+
{/* Render the preview */}
184+
</div>
185+
)}
186+
{showTable && (
187+
// Render expanded table
188+
<div
189+
className="overflow-x-auto"
190+
style={{
191+
maxHeight:
192+
"500px" /* Limit height for very long tables */,
193+
}}
194+
>
195+
<table className="min-w-full divide-y divide-gray-200">
196+
<thead className="bg-gray-50 sticky top-0 z-10">
197+
{" "}
198+
{/* Sticky header */}
199+
<tr>
200+
<th className="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
201+
{Array.isArray(interrupt) ? "Index" : "Key"}
202+
</th>
203+
<th className="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
204+
Value
205+
</th>
206+
</tr>
207+
</thead>
208+
<tbody className="divide-y divide-gray-200 bg-white">
209+
{displayEntries.length === 0 && (
200210
<tr>
201-
<th className="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
202-
{Array.isArray(interrupt) ? "Index" : "Key"}
203-
</th>
204-
<th className="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
205-
Value
206-
</th>
211+
<td
212+
colSpan={2}
213+
className="px-4 py-4 text-center text-sm text-gray-500"
214+
>
215+
{Array.isArray(interrupt)
216+
? "Array is empty"
217+
: "Object is empty"}
218+
</td>
207219
</tr>
208-
</thead>
209-
<tbody className="divide-y divide-gray-200 bg-white">
210-
{displayEntries.length === 0 && (
211-
<tr>
212-
<td
213-
colSpan={2}
214-
className="px-4 py-4 text-center text-sm text-gray-500"
215-
>
216-
{Array.isArray(interrupt)
217-
? "Array is empty"
218-
: "Object is empty"}
219-
</td>
220-
</tr>
221-
)}
222-
{displayEntries.map(([key, value]) => (
223-
<tr key={key}>
224-
<td className="px-4 py-2 text-sm font-medium whitespace-nowrap text-gray-900 align-top">
225-
{key}
226-
</td>
227-
<td className="px-4 py-2 text-sm text-gray-500 align-top">
228-
{/* Render cell value using the helper */}
229-
{renderTableCellValue(value)}
230-
</td>
231-
</tr>
232-
))}
233-
</tbody>
234-
</table>
235-
</div>
236-
)}
237-
</motion.div>
238-
);
239-
})()
240-
}
241-
</AnimatePresence>
242-
</div>
220+
)}
221+
{displayEntries.map(([key, value]) => (
222+
<tr key={key}>
223+
<td className="px-4 py-2 text-sm font-medium whitespace-nowrap text-gray-900 align-top">
224+
{key}
225+
</td>
226+
<td className="px-4 py-2 text-sm text-gray-500 align-top">
227+
{/* Render cell value using the helper */}
228+
{renderTableCellValue(value)}
229+
</td>
230+
</tr>
231+
))}
232+
</tbody>
233+
</table>
234+
</div>
235+
)}
236+
</motion.div>
237+
);
238+
})()
239+
}
240+
</AnimatePresence>
243241
</motion.div>
244242
</div>
245243
);

‎src/components/agent-inbox/components/thread-actions-view.tsx‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,9 @@ interface ThreadActionsViewProps<
4141
showState: boolean;
4242
showDescription: boolean;
4343
handleShowSidePanel?: (showState: boolean, showDescription: boolean) => void;
44+
setThreadData: React.Dispatch<
45+
React.SetStateAction<ThreadData<ThreadValues> | undefined>
46+
>;
4447
}
4548

4649
function ButtonGroup({
@@ -110,6 +113,7 @@ export function ThreadActionsView<
110113
showDescription,
111114
showState,
112115
handleShowSidePanel,
116+
setThreadData,
113117
}: ThreadActionsViewProps<ThreadValues>) {
114118
const { agentInboxes, fetchSingleThread } = useThreadsContext<ThreadValues>();
115119
const { toast } = useToast();
@@ -125,7 +129,7 @@ export function ThreadActionsView<
125129
threadData.status === "interrupted" &&
126130
threadData.interrupts !== undefined &&
127131
threadData.interrupts.length > 0;
128-
132+
console.log("isInterrupted", isInterrupted);
129133
// Initialize the hook outside of conditional to satisfy React rules of hooks
130134
const actions = useInterruptedActions<ThreadValues>({
131135
threadData: isInterrupted
@@ -135,7 +139,7 @@ export function ThreadActionsView<
135139
interrupts: threadData.interrupts || [],
136140
}
137141
: null,
138-
setThreadData: null,
142+
setThreadData,
139143
});
140144

141145
const handleOpenInStudio = () => {

‎src/components/agent-inbox/thread-view.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -110,6 +110,7 @@ export function ThreadView<
110110
showState={showState}
111111
showDescription={showDescription}
112112
handleShowSidePanel={handleShowSidePanel}
113+
setThreadData={setThreadData}
113114
/>
114115
</div>
115116
<div

0 commit comments

Comments
 (0)