diff --git a/src-tauri/src/main.rs b/src-tauri/src/main.rs index ffb3671..21e1e0b 100644 --- a/src-tauri/src/main.rs +++ b/src-tauri/src/main.rs @@ -83,7 +83,10 @@ impl AppState { let finished_output = &output_handler.lock().await.output; - window.emit("output", finished_output.clone()).unwrap(); + window.emit( + format!("cell-outputs-{}", cell_id).as_str(), + Some(finished_output.clone()), + ).unwrap(); return true; } } diff --git a/src/components/Cell.tsx b/src/components/Cell.tsx index 7513e4b..bb0f1c2 100644 --- a/src/components/Cell.tsx +++ b/src/components/Cell.tsx @@ -4,7 +4,8 @@ import { useCell } from "@/hooks/useCell"; import { Editor } from "@/components//Editor"; const Cell = ({ cellId }: { cellId: string }) => { - const { executeCell, executionState, executionCount } = useCell(cellId); + const { executeCell, executionState, executionCount, outputs } = + useCell(cellId); let actionIcon = "▶"; let showExecutionCountAs = executionCount === null ? " " : executionCount; @@ -24,16 +25,25 @@ const Cell = ({ cellId }: { cellId: string }) => { } return ( -
- - +
+
+ + +
+ {outputs && outputs.length > 0 ? ( +
{JSON.stringify(outputs, 2, null)}
+ ) : null}
); }; diff --git a/src/hooks/useCell.ts b/src/hooks/useCell.ts index e29b8ab..5cc678a 100644 --- a/src/hooks/useCell.ts +++ b/src/hooks/useCell.ts @@ -10,14 +10,16 @@ enum ExecutionState { Submitted = "submitted" } -type Action = { type: 'setSubmitted' } | { type: 'reset' }; +type Action = { type: 'setSubmitted' } | { type: 'reset' } | {type: "setOutputs", outputs: []} type CellState = { executionState: ExecutionState; + outputs: []; } const initialState: CellState = { - executionState: ExecutionState.Idle + executionState: ExecutionState.Idle, + outputs: [] }; function cellReducer(state: CellState, action: Action) { @@ -26,7 +28,8 @@ function cellReducer(state: CellState, action: Action) { return { ...state, executionState: ExecutionState.Submitted }; case 'reset': return { ...state, executionState: ExecutionState.Idle }; - // Handle other actions here + case 'setOutputs': + return {...state, outputs: action.outputs } default: return state; } @@ -58,28 +61,22 @@ export function useCell(cellId: string) { }, [cellId]); useEffect(() => { - let isMounted = true; - const setupListener = async () => { - const unlisten = await listen(`cell-${cellId}`, (event) => { - if (isMounted) { - console.log(event); - // Update state based on event here - } + const unlisten = await listen(`cell-outputs-${cellId}`, (event) => { + // Q(Kyle): Do we need to check if the event.windowLabel matches ours + const outputs = event.payload as []; + + dispatch({type: "setOutputs", outputs}) + }); return () => { - isMounted = false; unlisten(); }; }; setupListener(); - - return () => { - isMounted = false; - }; }, [cellId]); - return { ...state, content, executeCell, updateCell, executionCount: null }; + return { ...state, content, executeCell, updateCell, executionCount: null}; }