@dbx-tools/ui-mastra 0.6.82 → 0.6.85

package/index.ts

@@ -23,6 +23,7 @@ export * as supportDownload from "./src/support/download.ts";
 export * as supportExport from "./src/support/export.ts";
 export * as supportMastraClient from "./src/support/mastra-client.ts";
 export * as supportMastraStream from "./src/support/mastra-stream.ts";
+export * as supportModelSelection from "./src/support/model-selection.ts";
 export * as supportShikiPlugin from "./src/support/shiki-plugin.ts";
 export * as supportThreadLabels from "./src/support/thread-labels.ts";
 export * as supportThreadSessions from "./src/support/thread-sessions.ts";
@@ -52,6 +53,7 @@ export type { ExportFormat, ExportBrand, EmbedResolver, ExportChatOptions } from
 export { MastraPluginClient, useMastraConfig, useMastraClient, useMastraModels, useMastraDefaultModel, useMastraSuggestions, useMastraThreads, useChartFetch, useStatementFetch } from "./src/support/mastra-client.ts";
 export type { ByIdFetchState } from "./src/support/mastra-client.ts";
 export type { MastraStreamChunk, MastraStreamResponse } from "./src/support/mastra-stream.ts";
+export { modelStorageKey, readStoredModel, storeSelectedModel } from "./src/support/model-selection.ts";
 export { DEFAULT_THREAD_SESSION_KEY } from "./src/support/thread-sessions.ts";
 export type { ThreadSession } from "./src/support/thread-sessions.ts";
 export { THREAD_TAB_SEED_MAX } from "./src/support/thread-tabs.ts";

package/package.json

@@ -24,12 +24,12 @@
     "typescript": "^5.9.3"
   },
   "dependencies": {
-    "@dbx-tools/shared-core": "0.6.82",
-    "@dbx-tools/shared-genie": "0.6.82",
-    "@dbx-tools/shared-mastra": "0.6.82",
-    "@dbx-tools/shared-model": "0.6.82",
-    "@dbx-tools/ui-appkit": "0.6.82",
-    "@dbx-tools/ui-branding": "0.6.82",
+    "@dbx-tools/shared-core": "0.6.85",
+    "@dbx-tools/shared-genie": "0.6.85",
+    "@dbx-tools/shared-mastra": "0.6.85",
+    "@dbx-tools/shared-model": "0.6.85",
+    "@dbx-tools/ui-appkit": "0.6.85",
+    "@dbx-tools/ui-branding": "0.6.85",
     "@mastra/client-js": "^1.28.0",
     "@tanstack/react-table": "^8.21.3",
     "ai": "^5.0.0",
@@ -47,7 +47,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.6.82",
+  "version": "0.6.85",
   "type": "module",
   "exports": {
     "./react": "./src/react/index.ts",

package/src/react/mastra-chat.tsx

@@ -24,6 +24,11 @@ import {
   useMastraThreads,
 } from "../support/mastra-client.ts";
 import type { MastraStreamResponse } from "../support/mastra-stream.ts";
+import {
+  modelStorageKey,
+  readStoredModel,
+  storeSelectedModel,
+} from "../support/model-selection.ts";
 import {
   createThreadSession,
   DEFAULT_THREAD_SESSION_KEY,
@@ -250,7 +255,6 @@ class StreamAborted extends Error {}
 export const useMastraChat = (
   options: UseMastraChatOptions = {},
 ): Omit<ChatViewProps, "className"> => {
-  const [model, setModel] = useState("");
   // One client drives both the agent stream and the plugin's custom
   // routes (history / threads / models / suggestions / feedback /
   // embeds). Its identity is
@@ -258,6 +262,20 @@ export const useMastraChat = (
   // using it as a hook dep doesn't refire the initial-history fetch on
   // every parent render.
   const mastraClient = useMastraClient();
+  const agentId = options.agentId ?? mastraClient.defaultAgent;
+  const showModelPicker = Boolean(options.showModelPicker);
+  const modelKey = modelStorageKey(mastraClient.basePath, agentId);
+  const [model, setModel] = useState(() => (showModelPicker ? readStoredModel(modelKey) : ""));
+  const handleModelChange = useCallback(
+    (nextModel: string) => {
+      setModel(nextModel);
+      storeSelectedModel(modelKey, nextModel);
+    },
+    [modelKey],
+  );
+  useEffect(() => {
+    setModel(showModelPicker ? readStoredModel(modelKey) : "");
+  }, [modelKey, showModelPicker]);
   // The selected model rides each turn as a per-call override (see
   // `runStream`), never stored on the shared client - so two threads can
   // stream under different models without clobbering each other. Mirror it
@@ -265,7 +283,6 @@ export const useMastraChat = (
   // `model` to its dependency list.
   const modelRef = useRef(model);
   modelRef.current = model;
-  const agentId = options.agentId ?? mastraClient.defaultAgent;
   // Built-in conversation management. When on, the chat always drives an
   // explicit client thread id (rather than leaning on the per-session
   // cookie) so it can reference, persist, and switch between the
@@ -359,7 +376,6 @@ export const useMastraChat = (
   );
   // Picker is opt-in: an omitted (or falsy) `showModelPicker` keeps it
   // hidden and skips the catalogue fetch entirely.
-  const showModelPicker = Boolean(options.showModelPicker);
   const { models } = useMastraModels(showModelPicker);
   // The humanized name of the model the active agent falls back to when no
   // model is pinned, so the picker can label its default option. Fetched only
@@ -1453,7 +1469,7 @@ export const useMastraChat = (
     // it (ChatView shows it only when both are present).
     models: showModelPicker ? models : undefined,
     model,
-    onModelChange: showModelPicker ? setModel : undefined,
+    onModelChange: showModelPicker ? handleModelChange : undefined,
     defaultModelName: showModelPicker ? (defaultModelName ?? undefined) : undefined,
     onLoadMore: loadOlderHistory,
     isLoadingMore,

package/src/support/model-selection.ts

@@ -0,0 +1,38 @@
+type StorageLike = Pick<Storage, "getItem" | "setItem">;
+
+/** Namespace the last-selected model by plugin mount and agent. */
+export const modelStorageKey = (basePath: string, agentId: string): string =>
+  `dbx-mastra-model:${basePath}:${agentId}`;
+
+const browserStorage = (): StorageLike | undefined => {
+  try {
+    return typeof window === "undefined" ? undefined : window.localStorage;
+  } catch {
+    return undefined;
+  }
+};
+
+/** Read the last-selected model, tolerating unavailable browser storage. */
+export const readStoredModel = (
+  key: string,
+  storage: StorageLike | undefined = browserStorage(),
+): string => {
+  try {
+    return storage?.getItem(key) ?? "";
+  } catch {
+    return "";
+  }
+};
+
+/** Persist the selected model, including the empty server-default choice. */
+export const storeSelectedModel = (
+  key: string,
+  model: string,
+  storage: StorageLike | undefined = browserStorage(),
+): void => {
+  try {
+    storage?.setItem(key, model);
+  } catch {
+    // Best-effort; the in-memory selection still works without persistence.
+  }
+};