@marimo-team/frontend 0.21.2-dev76 → 0.21.2-dev77

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/frontend",
-  "version": "0.21.2-dev76",
+  "version": "0.21.2-dev77",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",

package/src/core/cells/__tests__/document-changes.test.ts

@@ -51,10 +51,7 @@ function createEditor(code: string) {
 }
 
 /** Dispatch an action through the reducer and auto-create editor handles. */
-function dispatch(
-  state: NotebookState,
-  action: { type: string; payload: unknown },
-): NotebookState {
+function dispatch(state: NotebookState, action: CellAction): NotebookState {
   const next = reducer(state, action);
   for (const [cellIdString, handle] of Object.entries(next.cellHandles)) {
     const cid = cellIdString as CellId;

package/src/core/cells/__tests__/runs.test.ts

@@ -148,7 +148,7 @@ describe("RunsState Reducer", () => {
           run_id: runId,
           cell_id: testCellId,
           timestamp: runStartTimestamp + 5000,
-          status: "success",
+          status: "idle",
         },
         code: "console.log('Hello World');",
       },
@@ -226,7 +226,8 @@ describe("RunsState Reducer", () => {
           status: "running",
           output: {
             channel: "stderr",
-            text: "Error occurred",
+            data: "Error occurred",
+            mimetype: "text/plain",
           },
         },
         code: "console.log('Hello World');",
@@ -254,7 +255,8 @@ describe("RunsState Reducer", () => {
           status: "running",
           output: {
             channel: "marimo-error",
-            text: "Error occurred",
+            data: "Error occurred",
+            mimetype: "text/plain",
           },
         },
         code: "console.log('Hello World');",
@@ -278,6 +280,8 @@ describe("RunsState Reducer", () => {
           timestamp,
           output: {
             channel: "marimo-error",
+            data: "",
+            mimetype: "text/plain",
           },
         },
         code: "console.log('Hello World');",

package/src/core/cells/cells.ts

@@ -1425,7 +1425,6 @@ const {
 // We apply the middleware here (rather than inline in createReducerAndAtoms)
 // so that the document transaction middleware can import CellActions and
 // strictly type the dispatched actions without creating a circular dependency.
-// @ts-expect-error - TODO: We should have better types for the middleware that are strict
 addMiddleware(documentTransactionMiddleware);
 
 function isCellCodeHidden(state: NotebookState, cellId: CellId): boolean {

package/src/utils/__tests__/createReducer.test.ts

@@ -133,7 +133,7 @@ describe("createReducerAndAtoms", () => {
     ]);
 
     const state = { count: 0 };
-    const action = { type: "increment", payload: 5 };
+    const action = { type: "increment", payload: 5 } as const;
     reducer(state, action);
 
     expect(middleware).toHaveBeenCalledWith(state, { count: 5 }, action);
@@ -150,6 +150,7 @@ describe("createReducerAndAtoms", () => {
 
     const { reducer } = createReducerAndAtoms(initialState, reducers);
     const state = { count: 0 };
+    // @ts-expect-error - we are testing this
     const newState = reducer(state, { type: "nonexistent", payload: null });
 
     expect(newState).toBe(state);

package/src/utils/createReducer.ts

@@ -7,12 +7,7 @@ import { Logger } from "@/utils/Logger";
 
 export type NoInfer<T> = [T][T extends any ? 0 : never];
 
-interface ReducerAction<T> {
-  type: string;
-  payload: T;
-}
-
-type Dispatch = (action: ReducerAction<any>) => void;
+type Dispatch<RH> = (action: ReducerActionOf<RH>) => void;
 type IfUnknown<T, Y, N> = unknown extends T ? Y : N;
 
 type ReducerHandler<State, Payload> = (state: State, payload: Payload) => State;
@@ -34,6 +29,12 @@ export type DispatchedActionOf<T> = {
     : never;
 }[keyof T & string];
 
+type ReducerActionOf<RH> = {
+  [Type in keyof RH]: RH[Type] extends ReducerHandler<any, infer Payload>
+    ? { type: Type; payload: Payload }
+    : never;
+}[keyof RH & string];
+
 export interface ReducerCreatorResult<
   State,
   RH extends ReducerHandlers<State>,
@@ -45,7 +46,7 @@ export interface ReducerCreatorResult<
   /**
    * Given a dispatch function, returns an object containing all the actions.
    */
-  createActions: (dispatch: Dispatch) => ReducerActions<RH>;
+  createActions: (dispatch: Dispatch<RH>) => ReducerActions<RH>;
 }
 
 /**
@@ -56,7 +57,7 @@ export function createReducer<
   RH extends ReducerHandlers<NoInfer<State>>,
 >(initialState: () => State, reducers: RH): ReducerCreatorResult<State, RH> {
   return {
-    reducer: (state, action: ReducerAction<RH>) => {
+    reducer: (state, action: ReducerActionOf<RH>) => {
       state = state || initialState();
       if (action.type in reducers) {
         return reducers[action.type](state, action.payload);
@@ -65,11 +66,11 @@ export function createReducer<
       Logger.error(`Action type ${action.type} is not defined in reducers.`);
       return state;
     },
-    createActions: (dispatch: Dispatch) => {
+    createActions: (dispatch: Dispatch<RH>) => {
       const actions = {} as ReducerActions<RH>;
       for (const type in reducers) {
         (actions as any)[type] = (payload: any) => {
-          dispatch({ type, payload });
+          dispatch({ type, payload } as any);
         };
       }
       return actions;
@@ -77,23 +78,27 @@ export function createReducer<
   };
 }
 
-type Middleware<State> = (
+type Middleware<State, RH> = (
   prevState: State,
   newState: State,
-  action: ReducerAction<any>,
+  action: ReducerActionOf<RH>,
 ) => void;
 
 export function createReducerAndAtoms<
   State,
   RH extends ReducerHandlers<NoInfer<State>>,
->(initialState: () => State, reducers: RH, middleware?: Middleware<State>[]) {
+>(
+  initialState: () => State,
+  reducers: RH,
+  middleware?: Middleware<State, NoInfer<RH>>[],
+) {
   const allMiddleware = [...(middleware ?? [])];
-  const addMiddleware = (mw: Middleware<State>) => {
+  const addMiddleware = (mw: Middleware<State, RH>) => {
     allMiddleware.push(mw);
   };
   const { reducer, createActions } = createReducer(initialState, reducers);
 
-  const reducerWithMiddleware = (state: State, action: ReducerAction<any>) => {
+  const reducerWithMiddleware = (state: State, action: ReducerActionOf<RH>) => {
     try {
       const newState = reducer(state, action);
       for (const mw of allMiddleware) {
@@ -120,7 +125,7 @@ export function createReducerAndAtoms<
     const setState = useSetAtom(valueAtom);
 
     if (options.skipMiddleware === true) {
-      return createActions((action: ReducerAction<any>) => {
+      return createActions((action: ReducerActionOf<RH>) => {
         setState((state: State) => reducer(state, action));
       });
     }
@@ -128,7 +133,7 @@ export function createReducerAndAtoms<
     if (!actionsMap.has(setState)) {
       actionsMap.set(
         setState,
-        createActions((action: ReducerAction<any>) => {
+        createActions((action: ReducerActionOf<RH>) => {
           setState((state: State) => reducerWithMiddleware(state, action));
         }),
       );