fix(webui): prevent redundant thread and media reloads (#5164)

webui/src/providers/ClientProvider.tsx

@@ -1,4 +1,11 @@
-import { createContext, useContext, type ReactNode } from "react";
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useRef,
+  type ReactNode,
+} from "react";
 
 import type { NanobotClient } from "@/lib/nanobot-client";
 import type { WebUIIngressLimits } from "@/lib/types";
@@ -6,6 +13,7 @@ import type { WebUIIngressLimits } from "@/lib/types";
 interface ClientContextValue {
   client: NanobotClient;
   token: string;
+  getToken: () => string;
   modelName: string | null;
   ingressLimits: WebUIIngressLimits | null;
 }
@@ -25,8 +33,16 @@ export function ClientProvider({
   ingressLimits?: WebUIIngressLimits | null;
   children: ReactNode;
 }) {
+  const tokenRef = useRef(token);
+  tokenRef.current = token;
+  const getToken = useCallback(() => tokenRef.current, []);
+  const value = useMemo(
+    () => ({ client, token, getToken, modelName, ingressLimits }),
+    [client, getToken, ingressLimits, modelName, token],
+  );
+
   return (
-    <ClientContext.Provider value={{ client, token, modelName, ingressLimits }}>
+    <ClientContext.Provider value={value}>
       {children}
     </ClientContext.Provider>
   );