@everysk/apps-sdk 0.2.0 → 0.3.0-beta-20261016180126

package/src/lib/queryClient.ts

@@ -8,22 +8,20 @@ async function throwIfResNotOk(res: Response) {
 }
 
 type UnauthorizedBehavior = "returnNull" | "throw";
-export const getQueryFn: <T>(options: {
-    on401: UnauthorizedBehavior;
-}) => QueryFunction<T> =
+export const getQueryFn: <T>(options: { on401: UnauthorizedBehavior }) => QueryFunction<T> =
     ({ on401: unauthorizedBehavior }) =>
-        async ({ queryKey }) => {
-            const res = await fetch(queryKey.join("/") as string, {
-                credentials: "include",
-            });
+    async ({ queryKey }) => {
+        const res = await fetch(queryKey.join("/") as string, {
+            credentials: "include",
+        });
 
-            if (unauthorizedBehavior === "returnNull" && res.status === 401) {
-                return null;
-            }
+        if (unauthorizedBehavior === "returnNull" && res.status === 401) {
+            return null;
+        }
 
-            await throwIfResNotOk(res);
-            return await res.json();
-        };
+        await throwIfResNotOk(res);
+        return await res.json();
+    };
 
 /**
  * createQueryClient

package/src/lib/workflowRun.ts

@@ -0,0 +1,329 @@
+import { isRetryableFailure } from "@/api/request";
+import { isTerminalRunStatus } from "@/api/workflow";
+import { abortable, createDeadline, unlessAborted } from "@/lib/abort";
+import type { WebSocketNotification, WebSocketStatus } from "@/contexts/webSocketContext/types";
+import type { WorkflowExecution } from "@/types/workflow";
+
+/** The alert a run hook shows when its failure carries no message of its own. */
+export const RUN_FAILED_MESSAGE = "Unable to run the workflow. Please try again.";
+
+/** The events the backend sends when a run's Ender finishes. */
+const RUN_END_EVENTS: readonly string[] = [
+    "WORKFLOW_EXECUTION_COMPLETED",
+    "WORKFLOW_EXECUTION_FAILED",
+];
+
+const isRunEndEvent = (event: WebSocketNotification) => RUN_END_EVENTS.includes(event.event_type);
+
+/**
+ * The error a run ends with when its caller stopped it — the screen went away, or the app's own
+ * signal — with that signal's reason as the cause. One class for both phases, the wait and the
+ * result read, so a caller can tell a stop from a failure with `instanceof` rather than by its
+ * message.
+ */
+export class WorkflowRunAbortedError extends Error {
+    constructor(reason: unknown) {
+        super("Waiting for the workflow run was aborted", { cause: reason });
+        this.name = "WorkflowRunAbortedError";
+    }
+}
+
+/** The longest delay `setTimeout` honours; it fires a longer one after 1 ms. */
+const MAX_TIMER_DELAY_MS = 2 ** 31 - 1;
+
+/**
+ * Throws when a wait option is not a positive number a timer can wait: zero or NaN would read
+ * back to back, and above `MAX_TIMER_DELAY_MS` the timer fires at once.
+ */
+const requireTimerDelays = (options: Record<string, number>) => {
+    for (const [name, value] of Object.entries(options)) {
+        if (!(value > 0 && value <= MAX_TIMER_DELAY_MS)) {
+            throw new Error(
+                `[apps-sdk] runWorkflowToEnd: ${name} must be a positive number of milliseconds up to ${MAX_TIMER_DELAY_MS}, got ${value}`,
+            );
+        }
+    }
+};
+
+export type WorkflowWaitOptions = {
+    /**
+     * How long the run may go without any event before the execution is read anyway, in
+     * milliseconds. Defaults to a minute. It covers a lost event, and a long worker, which sends
+     * nothing while it runs.
+     */
+    silenceMs?: number;
+    /** How long to wait for the run to end before giving up, in milliseconds. Defaults to 5 minutes. */
+    timeoutMs?: number;
+    /**
+     * The first gap between reads after the end event, while the run still reads RUNNING, in
+     * milliseconds. It doubles each time it passes without a new event, up to `silenceMs`.
+     * Defaults to 1 second.
+     */
+    confirmIntervalMs?: number;
+    /**
+     * How long the socket may stay in `error` before the run is given up on as unfollowable, in
+     * milliseconds. Defaults to 30 seconds: socket.io keeps retrying after a failed reconnect, on
+     * a backoff that alone can reach about 7.5 seconds between attempts.
+     */
+    unavailableAfterMs?: number;
+    /** Stops waiting. `useRunWorkflow` also stops when its screen unmounts. */
+    signal?: AbortSignal;
+};
+
+export type RunWorkflowToEndParams = WorkflowWaitOptions & {
+    /** Starts the run (`POST /workflows/:id/run`) and returns the execution it created. */
+    startRun: () => Promise<WorkflowExecution>;
+    /**
+     * Reads the execution; its `run_status` is what says the run ended, and how. Pass `signal` to
+     * the request, so a timeout or an abort cancels a read in flight.
+     */
+    getExecution: (workflowExecutionId: string, signal: AbortSignal) => Promise<WorkflowExecution>;
+    /** The websocket context's `subscribe`. */
+    subscribeToEvents: (listener: (event: WebSocketNotification) => void) => () => void;
+    /**
+     * The websocket context's `subscribeStatus`, which tells a new listener the current status at
+     * once: that is how the wait learns the status it begins in.
+     */
+    subscribeToStatus: (listener: (status: WebSocketStatus) => void) => () => void;
+};
+
+/**
+ * What wakes the wait up: an event of the run (`progress`, or `end` for the Ender's), the socket
+ * coming back (`reconnect`) or going (`unavailable`), or nothing at all for `silenceMs` (`silence`).
+ */
+type Trigger = "progress" | "end" | "reconnect" | "unavailable" | "silence";
+
+/** The triggers kept for later while the loop is busy reading, highest first. */
+const PENDING_PRIORITY: Trigger[] = ["unavailable", "end", "reconnect"];
+
+const socketUnavailableError = () =>
+    new Error(
+        "Real-time notifications are unavailable, so the end of the workflow run cannot be followed. " +
+            "The run itself may still be going on on the server.",
+    );
+
+/**
+ * The triggers, handed by the socket listeners to the wait loop one at a time, so the loop reads
+ * as a sequence while the listeners stay callbacks.
+ *
+ * Only one trigger is kept for later while the loop is busy reading, the highest in
+ * `PENDING_PRIORITY`; `progress` only restarts the silence, which matters only while the loop
+ * waits. `unavailable` outranks everything, since it ends the wait; `end` outranks `reconnect`,
+ * since both lead to a read and the end's read is the one that keeps going.
+ */
+const createTriggerQueue = (signal: AbortSignal) => {
+    let pending: Trigger | null = null;
+    let wake: ((trigger: Trigger) => void) | null = null;
+    const outranks = (trigger: Trigger) =>
+        PENDING_PRIORITY.includes(trigger) &&
+        (!pending || PENDING_PRIORITY.indexOf(trigger) < PENDING_PRIORITY.indexOf(pending));
+
+    return {
+        push(trigger: Trigger) {
+            if (wake) return wake(trigger);
+            if (outranks(trigger)) pending = trigger;
+        },
+        /** The next trigger, or `silence` when none comes within `silenceMs`. */
+        next(silenceMs: number): Promise<Trigger> {
+            if (pending) {
+                const trigger = pending;
+                pending = null;
+                return Promise.resolve(trigger);
+            }
+            return abortable<Trigger>(signal, (resolve) => {
+                const silenceTimer = setTimeout(() => resolve("silence"), silenceMs);
+                wake = resolve;
+                return () => {
+                    clearTimeout(silenceTimer);
+                    wake = null;
+                };
+            });
+        },
+    };
+};
+
+/**
+ * Hands `onEvent` the events of one execution. Listening starts at once, and events are kept
+ * until `follow` names the execution: a quick run can end before `POST /run` answers. After that,
+ * only that execution's events pass — the channel carries every run of the account.
+ */
+const listenToRun = (
+    subscribeToEvents: RunWorkflowToEndParams["subscribeToEvents"],
+    onEvent: (event: WebSocketNotification) => void,
+) => {
+    let workflowExecutionId: string | null = null;
+    const buffered: WebSocketNotification[] = [];
+    const isFollowed = (event: WebSocketNotification) =>
+        event.workflow_execution_id === workflowExecutionId;
+
+    const stop = subscribeToEvents((event) => {
+        if (!workflowExecutionId) buffered.push(event);
+        else if (isFollowed(event)) onEvent(event);
+    });
+
+    return {
+        follow(id: string) {
+            workflowExecutionId = id;
+            buffered.splice(0).filter(isFollowed).forEach(onEvent);
+        },
+        stop,
+    };
+};
+
+/**
+ * Follows the socket's status for the wait, starting from the one the subscription reports at
+ * once. It reports the socket coming back (`connected` after any other status) and going: an
+ * `error` that lasts `unavailableAfterMs` without a reconnect, counted from the first one, since
+ * `connecting` in between only means socket.io is retrying. `isConnected` is false from any other
+ * status until the next `connected`; the run is not started before then.
+ */
+const watchSocket = (
+    subscribeToStatus: RunWorkflowToEndParams["subscribeToStatus"],
+    {
+        unavailableAfterMs,
+        onReconnect,
+        onUnavailable,
+    }: { unavailableAfterMs: number; onReconnect: () => void; onUnavailable: () => void },
+) => {
+    let connected = true;
+    let graceTimer: ReturnType<typeof setTimeout> | undefined;
+    const endGrace = () => {
+        clearTimeout(graceTimer);
+        graceTimer = undefined;
+    };
+
+    const stopListening = subscribeToStatus((status) => {
+        if (status === "error" && graceTimer === undefined)
+            graceTimer = setTimeout(onUnavailable, unavailableAfterMs);
+        if (status !== "connected") {
+            connected = false;
+            return;
+        }
+        endGrace();
+        if (!connected) {
+            connected = true;
+            onReconnect();
+        }
+    });
+
+    return {
+        isConnected: () => connected,
+        stop() {
+            endGrace();
+            stopListening();
+        },
+    };
+};
+
+/**
+ * runWorkflowToEnd
+ *
+ * Starts a workflow run and waits for it to end, listening to the websocket rather than polling;
+ * the end itself is read from the API. Resolves with the ended execution, whatever its
+ * `run_status` — deciding what counts as success is the caller's.
+ *
+ * The websocket says *when* to read, never *what* happened. The backend publishes a
+ * `WORKER_EXECUTION_*` event per worker and a `WORKFLOW_EXECUTION_COMPLETED|FAILED` one when the
+ * Ender finishes, all on the account's channel. That end event goes out before `run_status` is
+ * written, and its `COMPLETED` is the Ender's status, not the run's: so it triggers a read, and
+ * then more on a short, doubling delay (`confirmIntervalMs`, capped at `silenceMs`) until the run
+ * reads ended — no later event would trigger one.
+ *
+ * Delivery is at most once, with no replay, and the server cuts every socket about once an hour.
+ * So the execution is also read after `silenceMs` without any event of the run, and as soon as
+ * the socket reconnects. A read that fails in a way that may pass (no response, a 5XX, a 429) does
+ * not end the wait — the next trigger reads again — and the last such failure is the cause if the
+ * wait times out, until a read succeeds. Any other failure ends it at once: a 4XX, or anything
+ * that is not a request failure, such as a body that is not the expected JSON.
+ *
+ * The run's end cannot be followed without the socket, so a socket in `error` for
+ * `unavailableAfterMs` — its config failed, or the server dropped it — fails the wait. The run is
+ * held back until the socket is connected, so it is never started unfollowable, and nothing it
+ * publishes goes out before the wait is listening.
+ *
+ * A timeout or an abort stops everything at once through one signal: the wait, the pause between
+ * reads, and the read in flight, whose request is cancelled. The start request is abandoned
+ * rather than cancelled — `startRun` takes no signal — so the run may still begin on the server.
+ *
+ * @param params - The start and read calls, the websocket subscriptions and the wait options.
+ * @returns The execution, once its `run_status` is terminal.
+ * @throws {Error} If a wait option is not a positive number, the run cannot be started or has no
+ *   execution id, a read fails for good, the socket stays unavailable for `unavailableAfterMs`, or
+ *   the wait times out or is aborted (`WorkflowRunAbortedError`, with the signal's reason as the cause).
+ */
+export const runWorkflowToEnd = async ({
+    startRun,
+    getExecution,
+    subscribeToEvents,
+    subscribeToStatus,
+    silenceMs = 60_000,
+    timeoutMs = 5 * 60_000,
+    confirmIntervalMs = 1_000,
+    unavailableAfterMs = 30_000,
+    signal,
+}: RunWorkflowToEndParams): Promise<WorkflowExecution> => {
+    requireTimerDelays({ silenceMs, timeoutMs, confirmIntervalMs, unavailableAfterMs });
+
+    let lastError: unknown;
+    const deadline = createDeadline({
+        timeoutMs,
+        signal,
+        timeoutError: () =>
+            new Error("Timed out while waiting for the workflow run to end", { cause: lastError }),
+        abortError: () => new WorkflowRunAbortedError(signal?.reason),
+    });
+    const waitSignal = deadline.signal;
+
+    const triggers = createTriggerQueue(waitSignal);
+    const runEvents = listenToRun(subscribeToEvents, (event) =>
+        triggers.push(isRunEndEvent(event) ? "end" : "progress"),
+    );
+    const connection = watchSocket(subscribeToStatus, {
+        unavailableAfterMs,
+        onReconnect: () => triggers.push("reconnect"),
+        onUnavailable: () => triggers.push("unavailable"),
+    });
+
+    /** Reads the execution once; `null` while the run has not ended. */
+    const readIfEnded = async (id: string) => {
+        try {
+            const execution = await unlessAborted(getExecution(id, waitSignal), waitSignal);
+            lastError = undefined;
+            return isTerminalRunStatus(execution.run_status) ? execution : null;
+        } catch (error) {
+            if (waitSignal.aborted) throw waitSignal.reason;
+            if (!isRetryableFailure(error)) throw error;
+            lastError = error;
+            return null;
+        }
+    };
+
+    try {
+        if (waitSignal.aborted) throw waitSignal.reason;
+        while (!connection.isConnected()) {
+            if ((await triggers.next(silenceMs)) === "unavailable") throw socketUnavailableError();
+        }
+
+        const id = (await unlessAborted(startRun(), waitSignal))?.id;
+        if (!id) throw new Error("Workflow run did not return an execution id");
+        runEvents.follow(id);
+
+        let confirmDelay: number | undefined;
+        for (;;) {
+            const trigger = await triggers.next(confirmDelay ?? silenceMs);
+            if (trigger === "unavailable") throw socketUnavailableError();
+            if (trigger === "progress") continue;
+
+            if (trigger === "end") confirmDelay = confirmIntervalMs;
+            else if (trigger === "silence" && confirmDelay !== undefined)
+                confirmDelay = Math.min(confirmDelay * 2, silenceMs);
+
+            const ended = await readIfEnded(id);
+            if (ended) return ended;
+        }
+    } finally {
+        deadline.dispose();
+        runEvents.stop();
+        connection.stop();
+    }
+};

package/src/socket/index.ts

@@ -11,9 +11,7 @@
 export * from "@/contexts/webSocketContext";
 export * from "@/contexts/webSocketContext/provider";
 export * from "@/contexts/webSocketContext/types";
-export * from "@/contexts/webSocketContext/constants";
-export * from "@/contexts/webSocketContext/handler";
+export { APP_NOTIFICATION_EVENT_TYPE } from "@/contexts/webSocketContext/constants";
 export * from "@/contexts/webSocketContext/hooks/useWebSocket";
 export * from "@/contexts/webSocketContext/hooks/useWebSocketSubscription";
 export * from "@/contexts/webSocketContext/hooks/useAppNotificationSubscription";
-export * from "@/api/websocketsConfig";

package/src/test/mocks/index.ts

@@ -8,11 +8,7 @@
 // break every suite in an app that never installed them.
 
 export { agGridReactMock } from "./agGridReact";
-export {
-    agGridEnterpriseMock,
-    getAgGridLicenseKey,
-    resetAgGridLicense,
-} from "./agGridEnterprise";
+export { agGridEnterpriseMock, getAgGridLicenseKey, resetAgGridLicense } from "./agGridEnterprise";
 export {
     socketIoClientMock,
     createMockSocket,

package/src/test/renderWithProviders.tsx

@@ -9,7 +9,7 @@ import {
 import userEvent from "@testing-library/user-event";
 import { QueryClient } from "@tanstack/react-query";
 
-import { EveryskApp, type ProviderComponent } from "@/EveryskApp";
+import { EveryskApp, type ProviderEntry } from "@/EveryskApp";
 import type { AnyRecord } from "@/types/anyRecord";
 
 /**
@@ -39,14 +39,19 @@ export function createTestQueryClient(): QueryClient {
 type ProviderOptions = {
     queryClient?: QueryClient;
     /** Extra providers, mounted inside the core tree and around the subject. */
-    providers?: ProviderComponent[];
+    providers?: ProviderEntry[];
     /** Injected instead of `window.APP_ID`, so a test needs no page globals. */
     appId?: string | null;
     /** Injected instead of `window.APP_CONFIG`. */
     appEnvironmentVar?: AnyRecord;
 };
 
-const buildWrapper = ({ queryClient, providers, appId, appEnvironmentVar }: ProviderOptions & {
+const buildWrapper = ({
+    queryClient,
+    providers,
+    appId,
+    appEnvironmentVar,
+}: ProviderOptions & {
     queryClient: QueryClient;
 }) =>
     function Wrapper({ children }: { children?: React.ReactNode }) {

package/src/test/setup.ts

@@ -5,31 +5,31 @@ import "@testing-library/jest-dom/vitest";
 
 // Unmount React trees and clear the jsdom document between tests so they stay isolated.
 afterEach(() => {
-  cleanup();
+    cleanup();
 });
 
 // jsdom does not implement matchMedia; MUI's `useMediaQuery` needs it. The theme no longer
 // reads it — it is pinned to the brand dark theme — but responsive components still do.
 if (!window.matchMedia) {
-  window.matchMedia = vi.fn().mockImplementation((query: string) => ({
-    matches: false,
-    media: query,
-    onchange: null,
-    addListener: vi.fn(),
-    removeListener: vi.fn(),
-    addEventListener: vi.fn(),
-    removeEventListener: vi.fn(),
-    dispatchEvent: vi.fn(),
-  }));
+    window.matchMedia = vi.fn().mockImplementation((query: string) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: vi.fn(),
+        removeListener: vi.fn(),
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+        dispatchEvent: vi.fn(),
+    }));
 }
 
 // jsdom does not implement ResizeObserver; several MUI components observe their container.
 if (!globalThis.ResizeObserver) {
-  globalThis.ResizeObserver = class {
-    observe(): void {}
-    unobserve(): void {}
-    disconnect(): void {}
-  };
+    globalThis.ResizeObserver = class {
+        observe(): void {}
+        unobserve(): void {}
+        disconnect(): void {}
+    };
 }
 
 // The template stubbed `BroadcastChannel` here, which jsdom does not implement. Nothing in

package/src/theme/index.ts

@@ -12,4 +12,4 @@ export { EveryskDarkTheme } from "./themes/EveryskDark";
 export { DefaultLightTheme } from "./themes/DefaultLight";
 export { DefaultDarkTheme } from "./themes/DefaultDark";
 export { MidnightEmberTheme } from "./themes/MidnightEmber";
-export { components } from "./overrides";
+export { componentOverrides } from "./overrides";

package/src/theme/overrides/index.ts

@@ -1,6 +1,6 @@
 import type { Components, Theme } from "@mui/material/styles";
 
-import type { } from '@mui/x-date-pickers/themeAugmentation';
+import type {} from "@mui/x-date-pickers/themeAugmentation";
 
 import { MuiCssBaseline } from "./muiCssBaseline";
 import { MuiDatePicker } from "./muiDatePicker";
@@ -15,9 +15,11 @@ import { MuiButton } from "./muiButton";
 
 /**
  * Shared MUI component overrides applied by every theme (light, dark and branded).
- * They read `theme.palette.mode`, so the same set works for any palette.
+ * They read `theme.palette.mode`, so the same set works for any palette. Public as
+ * `componentOverrides` for an app that builds its own theme; `components` alone, at the root of
+ * the package, did not say whose components.
  */
-export const components: Components<Omit<Theme, "components">> = {
+export const componentOverrides: Components<Omit<Theme, "components">> = {
     MuiCssBaseline,
     MuiDatePicker,
     MuiTextField,

package/src/theme/overrides/muiButton.ts

@@ -1,7 +1,7 @@
-import type { Components, Theme } from '@mui/material/styles';
+import type { Components, Theme } from "@mui/material/styles";
 
-export const MuiButton: Components<Theme>['MuiButton'] = {
+export const MuiButton: Components<Theme>["MuiButton"] = {
     defaultProps: {
-        size: 'small',
+        size: "small",
     },
 };

package/src/theme/overrides/muiCssBaseline.ts

@@ -9,27 +9,26 @@ export const MuiCssBaseline = {
         },
         "*::-webkit-scrollbar-thumb": {
             borderRadius: 10,
-            backgroundColor: '#959595'
-
+            backgroundColor: "#959595",
         },
         "*::-webkit-scrollbar-thumb:hover ": {
-            backgroundColor: '#959595'
+            backgroundColor: "#959595",
         },
         "*:hover::-webkit-scrollbar-thumb": {
-            backgroundColor: '#959595'
+            backgroundColor: "#959595",
         },
 
         "*::-webkit-scrollbar-thumb:active": {
-            backgroundColor: theme.palette.primary.main
+            backgroundColor: theme.palette.primary.main,
         },
 
         "*::-moz-selection": {
-            color: (theme.palette.mode === "dark" ? colors.common.black : colors.common.white),
-            backgroundColor: theme.palette.primary.main
+            color: theme.palette.mode === "dark" ? colors.common.black : colors.common.white,
+            backgroundColor: theme.palette.primary.main,
         },
         "*::selection": {
-            color: (theme.palette.mode === "dark") ? colors.common.black : colors.common.white,
-            backgroundColor: theme.palette.primary.main
-        }
-    })
-}
+            color: theme.palette.mode === "dark" ? colors.common.black : colors.common.white,
+            backgroundColor: theme.palette.primary.main,
+        },
+    }),
+};

package/src/theme/overrides/muiDatePicker.ts

@@ -1,5 +1,5 @@
 export const MuiDatePicker = {
     defaultProps: {
-        slotProps: { textField: { size: 'small' as const } },
+        slotProps: { textField: { size: "small" as const } },
     },
-};
+};

package/src/theme/overrides/muiFormControl.ts

@@ -2,6 +2,6 @@ import type { Components, Theme } from "@mui/material/styles";
 
 export const MuiFormControl: Components<Theme>["MuiFormControl"] = {
     defaultProps: {
-        size: 'small',
+        size: "small",
     },
-};
+};

package/src/theme/overrides/muiIconButton.ts

@@ -1,7 +1,7 @@
-import type { Components, Theme } from '@mui/material/styles';
+import type { Components, Theme } from "@mui/material/styles";
 
-export const MuiIconButton: Components<Theme>['MuiIconButton'] = {
+export const MuiIconButton: Components<Theme>["MuiIconButton"] = {
     defaultProps: {
-        size: 'small',
+        size: "small",
     },
 };

package/src/theme/overrides/muiSelect.ts

@@ -2,6 +2,6 @@ import type { Components, Theme } from "@mui/material/styles";
 
 export const MuiSelect: Components<Theme>["MuiSelect"] = {
     defaultProps: {
-        size: 'small',
+        size: "small",
     },
-}
+};

package/src/theme/overrides/muiSvgIcon.ts

@@ -2,6 +2,6 @@ import type { Components, Theme } from "@mui/material/styles";
 
 export const MuiSvgIcon: Components<Theme>["MuiSvgIcon"] = {
     defaultProps: {
-        fontSize: 'small',
+        fontSize: "small",
     },
-}
+};

package/src/theme/overrides/muiTextField.ts

@@ -4,4 +4,4 @@ export const MuiTextField: Components<Theme>["MuiTextField"] = {
     defaultProps: {
         size: "small",
     },
-};
+};

package/src/theme/overrides/muiToggleButton.ts

@@ -1,7 +1,7 @@
-import type { Components, Theme } from '@mui/material/styles';
+import type { Components, Theme } from "@mui/material/styles";
 
-export const MuiToggleButton: Components<Theme>['MuiToggleButton'] = {
+export const MuiToggleButton: Components<Theme>["MuiToggleButton"] = {
     defaultProps: {
-        size: 'small',
+        size: "small",
     },
-};
+};

package/src/theme/overrides/muiToggleButtonGroup.ts

@@ -1,7 +1,7 @@
-import type { Components, Theme } from '@mui/material/styles';
+import type { Components, Theme } from "@mui/material/styles";
 
-export const MuiToggleButtonGroup: Components<Theme>['MuiToggleButtonGroup'] = {
+export const MuiToggleButtonGroup: Components<Theme>["MuiToggleButtonGroup"] = {
     defaultProps: {
-        size: 'small',
+        size: "small",
     },
-};
+};

package/src/theme/themes/DefaultDark.ts

@@ -1,6 +1,6 @@
 import { createTheme, type Theme } from "@mui/material/styles";
 
-import { components } from "@/theme/overrides";
+import { componentOverrides } from "@/theme/overrides";
 
 /**
  * Neutral dark theme. Uses MUI's default palette (no brand color) plus the
@@ -10,5 +10,5 @@ export const DefaultDarkTheme: Theme = createTheme({
     palette: {
         mode: "dark",
     },
-    components,
+    components: componentOverrides,
 });

package/src/theme/themes/DefaultLight.ts

@@ -1,6 +1,6 @@
 import { createTheme, type Theme } from "@mui/material/styles";
 
-import { components } from "@/theme/overrides";
+import { componentOverrides } from "@/theme/overrides";
 
 /**
  * Neutral light theme. Uses MUI's default palette (no brand color) plus the
@@ -10,5 +10,5 @@ export const DefaultLightTheme: Theme = createTheme({
     palette: {
         mode: "light",
     },
-    components,
+    components: componentOverrides,
 });