@cstar.help/react 0.10.4 → 0.11.0

package/dist/index.cjs

@@ -465,105 +465,117 @@ function useCategories() {
 }
 
 // src/library/useArticles.ts
+var import_react11 = require("react");
+
+// src/useLatestCall.ts
 var import_react10 = require("react");
+function useLatestCall() {
+  const latest = (0, import_react10.useRef)(0);
+  (0, import_react10.useEffect)(
+    () => () => {
+      latest.current += 1;
+    },
+    []
+  );
+  return (0, import_react10.useCallback)(() => {
+    const call = latest.current += 1;
+    return () => call === latest.current;
+  }, []);
+}
+
+// src/library/useArticles.ts
 function useArticles(params) {
   const client = useLibraryClient();
-  const [articles, setArticles] = (0, import_react10.useState)([]);
-  const [isLoading, setIsLoading] = (0, import_react10.useState)(true);
-  const [error, setError] = (0, import_react10.useState)(null);
-  const mountedRef = (0, import_react10.useRef)(true);
+  const [articles, setArticles] = (0, import_react11.useState)([]);
+  const [isLoading, setIsLoading] = (0, import_react11.useState)(true);
+  const [error, setError] = (0, import_react11.useState)(null);
+  const startCall = useLatestCall();
   const categorySlug = params?.categorySlug;
   const limit = params?.limit;
   const offset = params?.offset;
-  const refresh = (0, import_react10.useCallback)(async () => {
+  const refresh = (0, import_react11.useCallback)(async () => {
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const data = await client.articles({ categorySlug, limit, offset });
-      if (mountedRef.current) {
+      if (isLatest()) {
         setArticles(data);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, categorySlug, limit, offset]);
-  (0, import_react10.useEffect)(() => {
-    mountedRef.current = true;
+  }, [client, categorySlug, limit, offset, startCall]);
+  (0, import_react11.useEffect)(() => {
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
   }, [refresh]);
   return { articles, isLoading, error, refresh };
 }
 
 // src/library/useArticle.ts
-var import_react11 = require("react");
+var import_react12 = require("react");
 function useArticle(slug) {
   const client = useLibraryClient();
-  const [article, setArticle] = (0, import_react11.useState)(null);
-  const [isLoading, setIsLoading] = (0, import_react11.useState)(true);
-  const [error, setError] = (0, import_react11.useState)(null);
-  const mountedRef = (0, import_react11.useRef)(true);
-  const refresh = (0, import_react11.useCallback)(async () => {
+  const [article, setArticle] = (0, import_react12.useState)(null);
+  const [isLoading, setIsLoading] = (0, import_react12.useState)(true);
+  const [error, setError] = (0, import_react12.useState)(null);
+  const startCall = useLatestCall();
+  const refresh = (0, import_react12.useCallback)(async () => {
     if (!slug) return;
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const data = await client.article(slug);
-      if (mountedRef.current) {
+      if (isLatest()) {
         setArticle(data);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, slug]);
-  const recordView = (0, import_react11.useCallback)(async () => {
+  }, [client, slug, startCall]);
+  const recordView = (0, import_react12.useCallback)(async () => {
     if (!slug) return;
     try {
       await client.recordView(slug);
     } catch {
     }
   }, [client, slug]);
-  (0, import_react11.useEffect)(() => {
-    mountedRef.current = true;
+  (0, import_react12.useEffect)(() => {
     if (!slug) {
+      startCall();
       setArticle(null);
       setIsLoading(false);
       return;
     }
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
-  }, [slug, refresh]);
+  }, [slug, refresh, startCall]);
   return { article, isLoading, error, refresh, recordView };
 }
 
 // src/library/useArticleSearch.ts
-var import_react12 = require("react");
+var import_react13 = require("react");
 var DEBOUNCE_MS = 300;
 function useArticleSearch(query) {
   const client = useLibraryClient();
-  const [results, setResults] = (0, import_react12.useState)([]);
-  const [totalCount, setTotalCount] = (0, import_react12.useState)(0);
-  const [isLoading, setIsLoading] = (0, import_react12.useState)(false);
-  const [error, setError] = (0, import_react12.useState)(null);
-  const mountedRef = (0, import_react12.useRef)(true);
-  (0, import_react12.useEffect)(() => {
-    mountedRef.current = true;
+  const [results, setResults] = (0, import_react13.useState)([]);
+  const [totalCount, setTotalCount] = (0, import_react13.useState)(0);
+  const [isLoading, setIsLoading] = (0, import_react13.useState)(false);
+  const [error, setError] = (0, import_react13.useState)(null);
+  (0, import_react13.useEffect)(() => {
+    let cancelled = false;
     const trimmed = query.trim();
     if (!trimmed) {
       setResults([]);
@@ -576,23 +588,23 @@ function useArticleSearch(query) {
     const timer = setTimeout(async () => {
       try {
         const result = await client.search(trimmed);
-        if (mountedRef.current) {
+        if (!cancelled) {
           setResults(result.data);
           setTotalCount(result.count);
           setError(null);
         }
       } catch (err) {
-        if (mountedRef.current) {
+        if (!cancelled) {
           setError(err instanceof Error ? err : new Error(String(err)));
         }
       } finally {
-        if (mountedRef.current) {
+        if (!cancelled) {
           setIsLoading(false);
         }
       }
     }, DEBOUNCE_MS);
     return () => {
-      mountedRef.current = false;
+      cancelled = true;
       clearTimeout(timer);
     };
   }, [client, query]);
@@ -600,11 +612,11 @@ function useArticleSearch(query) {
 }
 
 // src/community/CStarCommunityProvider.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_community = require("@cstar.help/js/community");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function CStarCommunityProvider({ children, ...config }) {
-  const clientRef = (0, import_react13.useRef)(null);
+  const clientRef = (0, import_react14.useRef)(null);
   if (!clientRef.current) {
     clientRef.current = new import_community.CommunityClient(config);
   }
@@ -612,14 +624,14 @@ function CStarCommunityProvider({ children, ...config }) {
 }
 
 // src/community/useTopics.ts
-var import_react14 = require("react");
+var import_react15 = require("react");
 function useTopics() {
   const client = useCommunityClient();
-  const [topics, setTopics] = (0, import_react14.useState)([]);
-  const [isLoading, setIsLoading] = (0, import_react14.useState)(true);
-  const [error, setError] = (0, import_react14.useState)(null);
-  const mountedRef = (0, import_react14.useRef)(true);
-  const refresh = (0, import_react14.useCallback)(async () => {
+  const [topics, setTopics] = (0, import_react15.useState)([]);
+  const [isLoading, setIsLoading] = (0, import_react15.useState)(true);
+  const [error, setError] = (0, import_react15.useState)(null);
+  const mountedRef = (0, import_react15.useRef)(true);
+  const refresh = (0, import_react15.useCallback)(async () => {
     setIsLoading(true);
     setError(null);
     try {
@@ -637,7 +649,7 @@ function useTopics() {
       }
     }
   }, [client]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     mountedRef.current = true;
     refresh();
     return () => {
@@ -648,131 +660,121 @@ function useTopics() {
 }
 
 // src/community/usePosts.ts
-var import_react15 = require("react");
+var import_react16 = require("react");
 function usePosts(params) {
   const client = useCommunityClient();
-  const [posts, setPosts] = (0, import_react15.useState)([]);
-  const [count, setCount] = (0, import_react15.useState)(0);
-  const [isLoading, setIsLoading] = (0, import_react15.useState)(true);
-  const [error, setError] = (0, import_react15.useState)(null);
-  const mountedRef = (0, import_react15.useRef)(true);
+  const [posts, setPosts] = (0, import_react16.useState)([]);
+  const [count, setCount] = (0, import_react16.useState)(0);
+  const [isLoading, setIsLoading] = (0, import_react16.useState)(true);
+  const [error, setError] = (0, import_react16.useState)(null);
+  const startCall = useLatestCall();
   const topicSlug = params?.topicSlug;
   const status = params?.status;
   const sort = params?.sort;
   const limit = params?.limit;
   const offset = params?.offset;
-  const refresh = (0, import_react15.useCallback)(async () => {
+  const refresh = (0, import_react16.useCallback)(async () => {
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const result = await client.posts({ topicSlug, status, sort, limit, offset });
-      if (mountedRef.current) {
+      if (isLatest()) {
         setPosts(result.posts);
         setCount(result.count);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, topicSlug, status, sort, limit, offset]);
-  (0, import_react15.useEffect)(() => {
-    mountedRef.current = true;
+  }, [client, topicSlug, status, sort, limit, offset, startCall]);
+  (0, import_react16.useEffect)(() => {
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
   }, [refresh]);
   return { posts, count, isLoading, error, refresh };
 }
 
 // src/community/usePost.ts
-var import_react16 = require("react");
+var import_react17 = require("react");
 function usePost(slug) {
   const client = useCommunityClient();
-  const [data, setData] = (0, import_react16.useState)(null);
-  const [isLoading, setIsLoading] = (0, import_react16.useState)(true);
-  const [error, setError] = (0, import_react16.useState)(null);
-  const mountedRef = (0, import_react16.useRef)(true);
-  const refresh = (0, import_react16.useCallback)(async () => {
+  const [data, setData] = (0, import_react17.useState)(null);
+  const [isLoading, setIsLoading] = (0, import_react17.useState)(true);
+  const [error, setError] = (0, import_react17.useState)(null);
+  const startCall = useLatestCall();
+  const refresh = (0, import_react17.useCallback)(async () => {
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const result = await client.post(slug);
-      if (mountedRef.current) {
+      if (isLatest()) {
         setData(result);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, slug]);
-  (0, import_react16.useEffect)(() => {
-    mountedRef.current = true;
+  }, [client, slug, startCall]);
+  (0, import_react17.useEffect)(() => {
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
   }, [refresh]);
   return { data, isLoading, error, refresh };
 }
 
 // src/community/useCommunitySearch.ts
-var import_react17 = require("react");
+var import_react18 = require("react");
 function useCommunitySearch() {
   const client = useCommunityClient();
-  const [results, setResults] = (0, import_react17.useState)(null);
-  const [isLoading, setIsLoading] = (0, import_react17.useState)(false);
-  const [error, setError] = (0, import_react17.useState)(null);
-  const mountedRef = (0, import_react17.useRef)(true);
-  (0, import_react17.useEffect)(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  const search = (0, import_react17.useCallback)(
+  const [results, setResults] = (0, import_react18.useState)(null);
+  const [isLoading, setIsLoading] = (0, import_react18.useState)(false);
+  const [error, setError] = (0, import_react18.useState)(null);
+  const startCall = useLatestCall();
+  const search = (0, import_react18.useCallback)(
     async (query) => {
+      const isLatest = startCall();
       if (!query.trim()) {
         setResults(null);
+        setIsLoading(false);
         return;
       }
       setIsLoading(true);
       setError(null);
       try {
         const data = await client.search(query);
-        if (mountedRef.current) {
+        if (isLatest()) {
           setResults(data);
         }
       } catch (err) {
-        if (mountedRef.current) {
+        if (isLatest()) {
           setError(err instanceof Error ? err : new Error(String(err)));
         }
       } finally {
-        if (mountedRef.current) {
+        if (isLatest()) {
           setIsLoading(false);
         }
       }
     },
-    [client]
+    [client, startCall]
   );
   return { results, isLoading, error, search };
 }
 
 // src/dashboard/CStarDashboardProvider.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 var import_js = require("@cstar.help/js");
 var import_jsx_runtime4 = require("react/jsx-runtime");
-var CStarDashboardContext = (0, import_react18.createContext)(null);
+var CStarDashboardContext = (0, import_react19.createContext)(null);
 function CStarDashboardProvider({
   config,
   client: providedClient,
@@ -783,7 +785,7 @@ function CStarDashboardProvider({
       "CStarDashboardProvider requires either a `config` prop (`{ apiKey, teamId }`, recommended) or a `client` prop (a pre-built CStarClient instance, deprecated). See https://www.cstar.help/developers/sdk/react#dashboard"
     );
   }
-  const client = (0, import_react18.useMemo)(() => {
+  const client = (0, import_react19.useMemo)(() => {
     if (providedClient) return providedClient;
     return new import_js.CStarClient(config);
   }, [
@@ -795,12 +797,12 @@ function CStarDashboardProvider({
     config?.maxRetries,
     config?.timeout
   ]);
-  const contextValue = (0, import_react18.useMemo)(() => ({ client }), [client]);
+  const contextValue = (0, import_react19.useMemo)(() => ({ client }), [client]);
   useDisconnectOnUnmount(providedClient ? null : client, (owned) => owned.realtime?.disconnect?.());
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CStarDashboardContext.Provider, { value: contextValue, children });
 }
 function useDashboardClient() {
-  const ctx = (0, import_react18.useContext)(CStarDashboardContext);
+  const ctx = (0, import_react19.useContext)(CStarDashboardContext);
   if (!ctx) {
     throw new Error("useDashboardClient must be used within a <CStarDashboardProvider>");
   }
@@ -808,7 +810,7 @@ function useDashboardClient() {
 }
 
 // src/dashboard/useCStarQuery.ts
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_js2 = require("@cstar.help/js");
 function resolveResource(client, path) {
   const parts = path.split(".");
@@ -827,12 +829,12 @@ function useCStarQuery(resource, params) {
     );
   }
   const client = useDashboardClient();
-  const [data, setData] = (0, import_react19.useState)(null);
-  const [loading, setLoading] = (0, import_react19.useState)(true);
-  const [error, setError] = (0, import_react19.useState)(null);
-  const subscriptionRef = (0, import_react19.useRef)(null);
+  const [data, setData] = (0, import_react20.useState)(null);
+  const [loading, setLoading] = (0, import_react20.useState)(true);
+  const [error, setError] = (0, import_react20.useState)(null);
+  const subscriptionRef = (0, import_react20.useRef)(null);
   const paramsKey = params ? JSON.stringify(params) : "";
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     const resolved = resolveResource(client, resource);
     if (!resolved) {
       setError(new Error(`Invalid resource path: ${resource}. Expected format: 'tickets.list'`));
@@ -855,7 +857,7 @@ function useCStarQuery(resource, params) {
       subscriptionRef.current = null;
     };
   }, [client, resource, paramsKey]);
-  const refresh = (0, import_react19.useCallback)(async () => {
+  const refresh = (0, import_react20.useCallback)(async () => {
     if (subscriptionRef.current) {
       await subscriptionRef.current.refresh();
     }
@@ -864,37 +866,38 @@ function useCStarQuery(resource, params) {
 }
 
 // src/dashboard/useCStarMutation.ts
-var import_react20 = require("react");
+var import_react21 = require("react");
 function resolveMutation(client, path) {
   const parts = path.split(".");
   if (parts.length < 2) return null;
-  const resourceName = parts[0];
-  const methodName = parts[1];
-  const resource = client[resourceName];
-  if (!resource || typeof resource !== "object") return null;
-  const lookupName = methodName === "delete" ? "del" : methodName;
-  const method = resource[lookupName];
-  if (typeof method !== "function") return null;
-  if (methodName === "update") {
-    return (params) => {
-      const p = params;
-      const { id, ...rest } = p;
-      return method.call(resource, id, rest);
-    };
+  const last = parts[parts.length - 1];
+  const methodName = last === "delete" ? "del" : last;
+  let resource = client;
+  for (const part of parts.slice(0, -1)) {
+    resource = resource?.[part];
+    if (!resource || typeof resource !== "object") return null;
   }
-  if (methodName === "del" || methodName === "delete") {
-    return (params) => {
-      const p = params;
-      return method.call(resource, p.id);
-    };
-  }
-  return (params) => method.call(resource, params);
+  const method = resource[methodName];
+  if (typeof method !== "function") return null;
+  const call = method;
+  const needsId = methodName === "del" || methodName === "update" && call.length >= 2;
+  return (params) => {
+    if (Array.isArray(params)) return call.apply(resource, params);
+    const { id, ...rest } = params ?? {};
+    if (typeof id === "string" && id) {
+      return Object.keys(rest).length > 0 ? call.call(resource, id, rest) : call.call(resource, id);
+    }
+    if (needsId) {
+      return Promise.reject(new Error(`Missing or invalid "id" for ${methodName} operation`));
+    }
+    return call.call(resource, params);
+  };
 }
 function useCStarMutation(resource) {
   const client = useDashboardClient();
-  const [loading, setLoading] = (0, import_react20.useState)(false);
-  const [error, setError] = (0, import_react20.useState)(null);
-  const mutate = (0, import_react20.useCallback)(
+  const [loading, setLoading] = (0, import_react21.useState)(false);
+  const [error, setError] = (0, import_react21.useState)(null);
+  const mutate = (0, import_react21.useCallback)(
     async (params) => {
       const fn = resolveMutation(client, resource);
       if (!fn) {
@@ -919,14 +922,14 @@ function useCStarMutation(resource) {
 }
 
 // src/dashboard/useCStarEvents.ts
-var import_react21 = require("react");
+var import_react22 = require("react");
 var MAX_EVENTS = 100;
 function useCStarEvents(types) {
   const client = useDashboardClient();
-  const [events, setEvents] = (0, import_react21.useState)([]);
-  const [connected, setConnected] = (0, import_react21.useState)(false);
+  const [events, setEvents] = (0, import_react22.useState)([]);
+  const [connected, setConnected] = (0, import_react22.useState)(false);
   const typesKey = types ? types.join(",") : "";
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     const realtime = client.realtime;
     const handler = (event) => {
       if (types && types.length > 0) {
@@ -958,14 +961,14 @@ function useCStarEvents(types) {
 }
 
 // src/dashboard/useBossBattle.ts
-var import_react22 = require("react");
+var import_react23 = require("react");
 function useBossBattle() {
   const client = useDashboardClient();
-  const [boss, setBoss] = (0, import_react22.useState)(null);
-  const [loading, setLoading] = (0, import_react22.useState)(true);
-  const [error, setError] = (0, import_react22.useState)(null);
-  const subRef = (0, import_react22.useRef)(null);
-  (0, import_react22.useEffect)(() => {
+  const [boss, setBoss] = (0, import_react23.useState)(null);
+  const [loading, setLoading] = (0, import_react23.useState)(true);
+  const [error, setError] = (0, import_react23.useState)(null);
+  const subRef = (0, import_react23.useRef)(null);
+  (0, import_react23.useEffect)(() => {
     const sub = client.game.subscribeBoss(client.realtime);
     subRef.current = sub;
     sub.on("change", (data) => {
@@ -982,21 +985,21 @@ function useBossBattle() {
       subRef.current = null;
     };
   }, [client]);
-  const refresh = (0, import_react22.useCallback)(async () => {
+  const refresh = (0, import_react23.useCallback)(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { boss, active: boss !== null, loading, error, refresh };
 }
 
 // src/dashboard/usePlayerStats.ts
-var import_react23 = require("react");
+var import_react24 = require("react");
 function usePlayerStats(memberId) {
   const client = useDashboardClient();
-  const [player, setPlayer] = (0, import_react23.useState)(null);
-  const [loading, setLoading] = (0, import_react23.useState)(true);
-  const [error, setError] = (0, import_react23.useState)(null);
-  const subRef = (0, import_react23.useRef)(null);
-  (0, import_react23.useEffect)(() => {
+  const [player, setPlayer] = (0, import_react24.useState)(null);
+  const [loading, setLoading] = (0, import_react24.useState)(true);
+  const [error, setError] = (0, import_react24.useState)(null);
+  const subRef = (0, import_react24.useRef)(null);
+  (0, import_react24.useEffect)(() => {
     const sub = client.game.subscribePlayer(client.realtime, memberId);
     subRef.current = sub;
     sub.on("change", (data) => {
@@ -1013,21 +1016,21 @@ function usePlayerStats(memberId) {
       subRef.current = null;
     };
   }, [client, memberId]);
-  const refresh = (0, import_react23.useCallback)(async () => {
+  const refresh = (0, import_react24.useCallback)(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { player, loading, error, refresh };
 }
 
 // src/dashboard/useLeaderboard.ts
-var import_react24 = require("react");
+var import_react25 = require("react");
 function useLeaderboard(period) {
   const client = useDashboardClient();
-  const [entries, setEntries] = (0, import_react24.useState)([]);
-  const [loading, setLoading] = (0, import_react24.useState)(true);
-  const [error, setError] = (0, import_react24.useState)(null);
-  const subRef = (0, import_react24.useRef)(null);
-  (0, import_react24.useEffect)(() => {
+  const [entries, setEntries] = (0, import_react25.useState)([]);
+  const [loading, setLoading] = (0, import_react25.useState)(true);
+  const [error, setError] = (0, import_react25.useState)(null);
+  const subRef = (0, import_react25.useRef)(null);
+  (0, import_react25.useEffect)(() => {
     const sub = client.game.subscribeLeaderboard(client.realtime, period ? { period } : void 0);
     subRef.current = sub;
     sub.on("change", (data) => {
@@ -1044,21 +1047,21 @@ function useLeaderboard(period) {
       subRef.current = null;
     };
   }, [client, period]);
-  const refresh = (0, import_react24.useCallback)(async () => {
+  const refresh = (0, import_react25.useCallback)(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { entries, loading, error, refresh };
 }
 
 // src/dashboard/useGameActivity.ts
-var import_react25 = require("react");
+var import_react26 = require("react");
 function useGameActivity() {
   const client = useDashboardClient();
-  const [events, setEvents] = (0, import_react25.useState)([]);
-  const [loading, setLoading] = (0, import_react25.useState)(true);
-  const [error, setError] = (0, import_react25.useState)(null);
-  const subRef = (0, import_react25.useRef)(null);
-  (0, import_react25.useEffect)(() => {
+  const [events, setEvents] = (0, import_react26.useState)([]);
+  const [loading, setLoading] = (0, import_react26.useState)(true);
+  const [error, setError] = (0, import_react26.useState)(null);
+  const subRef = (0, import_react26.useRef)(null);
+  (0, import_react26.useEffect)(() => {
     const sub = client.game.subscribeActivity(client.realtime);
     subRef.current = sub;
     sub.on("change", (data) => {
@@ -1075,7 +1078,7 @@ function useGameActivity() {
       subRef.current = null;
     };
   }, [client]);
-  const refresh = (0, import_react25.useCallback)(async () => {
+  const refresh = (0, import_react26.useCallback)(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { events, loading, error, refresh };

package/dist/index.js

@@ -411,95 +411,108 @@ function useCategories() {
 }
 
 // src/library/useArticles.ts
-import { useState as useState6, useEffect as useEffect7, useCallback as useCallback6, useRef as useRef8 } from "react";
+import { useState as useState6, useEffect as useEffect8, useCallback as useCallback7 } from "react";
+
+// src/useLatestCall.ts
+import { useCallback as useCallback6, useEffect as useEffect7, useRef as useRef8 } from "react";
+function useLatestCall() {
+  const latest = useRef8(0);
+  useEffect7(
+    () => () => {
+      latest.current += 1;
+    },
+    []
+  );
+  return useCallback6(() => {
+    const call = latest.current += 1;
+    return () => call === latest.current;
+  }, []);
+}
+
+// src/library/useArticles.ts
 function useArticles(params) {
   const client = useLibraryClient();
   const [articles, setArticles] = useState6([]);
   const [isLoading, setIsLoading] = useState6(true);
   const [error, setError] = useState6(null);
-  const mountedRef = useRef8(true);
+  const startCall = useLatestCall();
   const categorySlug = params?.categorySlug;
   const limit = params?.limit;
   const offset = params?.offset;
-  const refresh = useCallback6(async () => {
+  const refresh = useCallback7(async () => {
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const data = await client.articles({ categorySlug, limit, offset });
-      if (mountedRef.current) {
+      if (isLatest()) {
         setArticles(data);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, categorySlug, limit, offset]);
-  useEffect7(() => {
-    mountedRef.current = true;
+  }, [client, categorySlug, limit, offset, startCall]);
+  useEffect8(() => {
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
   }, [refresh]);
   return { articles, isLoading, error, refresh };
 }
 
 // src/library/useArticle.ts
-import { useState as useState7, useEffect as useEffect8, useCallback as useCallback7, useRef as useRef9 } from "react";
+import { useState as useState7, useEffect as useEffect9, useCallback as useCallback8 } from "react";
 function useArticle(slug) {
   const client = useLibraryClient();
   const [article, setArticle] = useState7(null);
   const [isLoading, setIsLoading] = useState7(true);
   const [error, setError] = useState7(null);
-  const mountedRef = useRef9(true);
-  const refresh = useCallback7(async () => {
+  const startCall = useLatestCall();
+  const refresh = useCallback8(async () => {
     if (!slug) return;
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const data = await client.article(slug);
-      if (mountedRef.current) {
+      if (isLatest()) {
         setArticle(data);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, slug]);
-  const recordView = useCallback7(async () => {
+  }, [client, slug, startCall]);
+  const recordView = useCallback8(async () => {
     if (!slug) return;
     try {
       await client.recordView(slug);
     } catch {
     }
   }, [client, slug]);
-  useEffect8(() => {
-    mountedRef.current = true;
+  useEffect9(() => {
     if (!slug) {
+      startCall();
       setArticle(null);
       setIsLoading(false);
       return;
     }
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
-  }, [slug, refresh]);
+  }, [slug, refresh, startCall]);
   return { article, isLoading, error, refresh, recordView };
 }
 
 // src/library/useArticleSearch.ts
-import { useState as useState8, useEffect as useEffect9, useRef as useRef10 } from "react";
+import { useState as useState8, useEffect as useEffect10 } from "react";
 var DEBOUNCE_MS = 300;
 function useArticleSearch(query) {
   const client = useLibraryClient();
@@ -507,9 +520,8 @@ function useArticleSearch(query) {
   const [totalCount, setTotalCount] = useState8(0);
   const [isLoading, setIsLoading] = useState8(false);
   const [error, setError] = useState8(null);
-  const mountedRef = useRef10(true);
-  useEffect9(() => {
-    mountedRef.current = true;
+  useEffect10(() => {
+    let cancelled = false;
     const trimmed = query.trim();
     if (!trimmed) {
       setResults([]);
@@ -522,23 +534,23 @@ function useArticleSearch(query) {
     const timer = setTimeout(async () => {
       try {
         const result = await client.search(trimmed);
-        if (mountedRef.current) {
+        if (!cancelled) {
           setResults(result.data);
           setTotalCount(result.count);
           setError(null);
         }
       } catch (err) {
-        if (mountedRef.current) {
+        if (!cancelled) {
           setError(err instanceof Error ? err : new Error(String(err)));
         }
       } finally {
-        if (mountedRef.current) {
+        if (!cancelled) {
           setIsLoading(false);
         }
       }
     }, DEBOUNCE_MS);
     return () => {
-      mountedRef.current = false;
+      cancelled = true;
       clearTimeout(timer);
     };
   }, [client, query]);
@@ -546,11 +558,11 @@ function useArticleSearch(query) {
 }
 
 // src/community/CStarCommunityProvider.tsx
-import { useRef as useRef11 } from "react";
+import { useRef as useRef9 } from "react";
 import { CommunityClient } from "@cstar.help/js/community";
 import { jsx as jsx3 } from "react/jsx-runtime";
 function CStarCommunityProvider({ children, ...config }) {
-  const clientRef = useRef11(null);
+  const clientRef = useRef9(null);
   if (!clientRef.current) {
     clientRef.current = new CommunityClient(config);
   }
@@ -558,14 +570,14 @@ function CStarCommunityProvider({ children, ...config }) {
 }
 
 // src/community/useTopics.ts
-import { useState as useState9, useEffect as useEffect10, useCallback as useCallback8, useRef as useRef12 } from "react";
+import { useState as useState9, useEffect as useEffect11, useCallback as useCallback9, useRef as useRef10 } from "react";
 function useTopics() {
   const client = useCommunityClient();
   const [topics, setTopics] = useState9([]);
   const [isLoading, setIsLoading] = useState9(true);
   const [error, setError] = useState9(null);
-  const mountedRef = useRef12(true);
-  const refresh = useCallback8(async () => {
+  const mountedRef = useRef10(true);
+  const refresh = useCallback9(async () => {
     setIsLoading(true);
     setError(null);
     try {
@@ -583,7 +595,7 @@ function useTopics() {
       }
     }
   }, [client]);
-  useEffect10(() => {
+  useEffect11(() => {
     mountedRef.current = true;
     refresh();
     return () => {
@@ -594,122 +606,112 @@ function useTopics() {
 }
 
 // src/community/usePosts.ts
-import { useState as useState10, useEffect as useEffect11, useCallback as useCallback9, useRef as useRef13 } from "react";
+import { useState as useState10, useEffect as useEffect12, useCallback as useCallback10 } from "react";
 function usePosts(params) {
   const client = useCommunityClient();
   const [posts, setPosts] = useState10([]);
   const [count, setCount] = useState10(0);
   const [isLoading, setIsLoading] = useState10(true);
   const [error, setError] = useState10(null);
-  const mountedRef = useRef13(true);
+  const startCall = useLatestCall();
   const topicSlug = params?.topicSlug;
   const status = params?.status;
   const sort = params?.sort;
   const limit = params?.limit;
   const offset = params?.offset;
-  const refresh = useCallback9(async () => {
+  const refresh = useCallback10(async () => {
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const result = await client.posts({ topicSlug, status, sort, limit, offset });
-      if (mountedRef.current) {
+      if (isLatest()) {
         setPosts(result.posts);
         setCount(result.count);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, topicSlug, status, sort, limit, offset]);
-  useEffect11(() => {
-    mountedRef.current = true;
+  }, [client, topicSlug, status, sort, limit, offset, startCall]);
+  useEffect12(() => {
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
   }, [refresh]);
   return { posts, count, isLoading, error, refresh };
 }
 
 // src/community/usePost.ts
-import { useState as useState11, useEffect as useEffect12, useCallback as useCallback10, useRef as useRef14 } from "react";
+import { useState as useState11, useEffect as useEffect13, useCallback as useCallback11 } from "react";
 function usePost(slug) {
   const client = useCommunityClient();
   const [data, setData] = useState11(null);
   const [isLoading, setIsLoading] = useState11(true);
   const [error, setError] = useState11(null);
-  const mountedRef = useRef14(true);
-  const refresh = useCallback10(async () => {
+  const startCall = useLatestCall();
+  const refresh = useCallback11(async () => {
+    const isLatest = startCall();
     setIsLoading(true);
     setError(null);
     try {
       const result = await client.post(slug);
-      if (mountedRef.current) {
+      if (isLatest()) {
         setData(result);
       }
     } catch (err) {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setError(err instanceof Error ? err : new Error(String(err)));
       }
     } finally {
-      if (mountedRef.current) {
+      if (isLatest()) {
         setIsLoading(false);
       }
     }
-  }, [client, slug]);
-  useEffect12(() => {
-    mountedRef.current = true;
+  }, [client, slug, startCall]);
+  useEffect13(() => {
     refresh();
-    return () => {
-      mountedRef.current = false;
-    };
   }, [refresh]);
   return { data, isLoading, error, refresh };
 }
 
 // src/community/useCommunitySearch.ts
-import { useState as useState12, useEffect as useEffect13, useCallback as useCallback11, useRef as useRef15 } from "react";
+import { useState as useState12, useCallback as useCallback12 } from "react";
 function useCommunitySearch() {
   const client = useCommunityClient();
   const [results, setResults] = useState12(null);
   const [isLoading, setIsLoading] = useState12(false);
   const [error, setError] = useState12(null);
-  const mountedRef = useRef15(true);
-  useEffect13(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  const search = useCallback11(
+  const startCall = useLatestCall();
+  const search = useCallback12(
     async (query) => {
+      const isLatest = startCall();
       if (!query.trim()) {
         setResults(null);
+        setIsLoading(false);
         return;
       }
       setIsLoading(true);
       setError(null);
       try {
         const data = await client.search(query);
-        if (mountedRef.current) {
+        if (isLatest()) {
           setResults(data);
         }
       } catch (err) {
-        if (mountedRef.current) {
+        if (isLatest()) {
           setError(err instanceof Error ? err : new Error(String(err)));
         }
       } finally {
-        if (mountedRef.current) {
+        if (isLatest()) {
           setIsLoading(false);
         }
       }
     },
-    [client]
+    [client, startCall]
   );
   return { results, isLoading, error, search };
 }
@@ -754,7 +756,7 @@ function useDashboardClient() {
 }
 
 // src/dashboard/useCStarQuery.ts
-import { useState as useState13, useEffect as useEffect14, useRef as useRef16, useCallback as useCallback12 } from "react";
+import { useState as useState13, useEffect as useEffect14, useRef as useRef11, useCallback as useCallback13 } from "react";
 import { CStarValidationError } from "@cstar.help/js";
 function resolveResource(client, path) {
   const parts = path.split(".");
@@ -776,7 +778,7 @@ function useCStarQuery(resource, params) {
   const [data, setData] = useState13(null);
   const [loading, setLoading] = useState13(true);
   const [error, setError] = useState13(null);
-  const subscriptionRef = useRef16(null);
+  const subscriptionRef = useRef11(null);
   const paramsKey = params ? JSON.stringify(params) : "";
   useEffect14(() => {
     const resolved = resolveResource(client, resource);
@@ -801,7 +803,7 @@ function useCStarQuery(resource, params) {
       subscriptionRef.current = null;
     };
   }, [client, resource, paramsKey]);
-  const refresh = useCallback12(async () => {
+  const refresh = useCallback13(async () => {
     if (subscriptionRef.current) {
       await subscriptionRef.current.refresh();
     }
@@ -810,37 +812,38 @@ function useCStarQuery(resource, params) {
 }
 
 // src/dashboard/useCStarMutation.ts
-import { useState as useState14, useCallback as useCallback13 } from "react";
+import { useState as useState14, useCallback as useCallback14 } from "react";
 function resolveMutation(client, path) {
   const parts = path.split(".");
   if (parts.length < 2) return null;
-  const resourceName = parts[0];
-  const methodName = parts[1];
-  const resource = client[resourceName];
-  if (!resource || typeof resource !== "object") return null;
-  const lookupName = methodName === "delete" ? "del" : methodName;
-  const method = resource[lookupName];
-  if (typeof method !== "function") return null;
-  if (methodName === "update") {
-    return (params) => {
-      const p = params;
-      const { id, ...rest } = p;
-      return method.call(resource, id, rest);
-    };
-  }
-  if (methodName === "del" || methodName === "delete") {
-    return (params) => {
-      const p = params;
-      return method.call(resource, p.id);
-    };
+  const last = parts[parts.length - 1];
+  const methodName = last === "delete" ? "del" : last;
+  let resource = client;
+  for (const part of parts.slice(0, -1)) {
+    resource = resource?.[part];
+    if (!resource || typeof resource !== "object") return null;
   }
-  return (params) => method.call(resource, params);
+  const method = resource[methodName];
+  if (typeof method !== "function") return null;
+  const call = method;
+  const needsId = methodName === "del" || methodName === "update" && call.length >= 2;
+  return (params) => {
+    if (Array.isArray(params)) return call.apply(resource, params);
+    const { id, ...rest } = params ?? {};
+    if (typeof id === "string" && id) {
+      return Object.keys(rest).length > 0 ? call.call(resource, id, rest) : call.call(resource, id);
+    }
+    if (needsId) {
+      return Promise.reject(new Error(`Missing or invalid "id" for ${methodName} operation`));
+    }
+    return call.call(resource, params);
+  };
 }
 function useCStarMutation(resource) {
   const client = useDashboardClient();
   const [loading, setLoading] = useState14(false);
   const [error, setError] = useState14(null);
-  const mutate = useCallback13(
+  const mutate = useCallback14(
     async (params) => {
       const fn = resolveMutation(client, resource);
       if (!fn) {
@@ -904,13 +907,13 @@ function useCStarEvents(types) {
 }
 
 // src/dashboard/useBossBattle.ts
-import { useState as useState16, useEffect as useEffect16, useRef as useRef17, useCallback as useCallback14 } from "react";
+import { useState as useState16, useEffect as useEffect16, useRef as useRef12, useCallback as useCallback15 } from "react";
 function useBossBattle() {
   const client = useDashboardClient();
   const [boss, setBoss] = useState16(null);
   const [loading, setLoading] = useState16(true);
   const [error, setError] = useState16(null);
-  const subRef = useRef17(null);
+  const subRef = useRef12(null);
   useEffect16(() => {
     const sub = client.game.subscribeBoss(client.realtime);
     subRef.current = sub;
@@ -928,20 +931,20 @@ function useBossBattle() {
       subRef.current = null;
     };
   }, [client]);
-  const refresh = useCallback14(async () => {
+  const refresh = useCallback15(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { boss, active: boss !== null, loading, error, refresh };
 }
 
 // src/dashboard/usePlayerStats.ts
-import { useState as useState17, useEffect as useEffect17, useRef as useRef18, useCallback as useCallback15 } from "react";
+import { useState as useState17, useEffect as useEffect17, useRef as useRef13, useCallback as useCallback16 } from "react";
 function usePlayerStats(memberId) {
   const client = useDashboardClient();
   const [player, setPlayer] = useState17(null);
   const [loading, setLoading] = useState17(true);
   const [error, setError] = useState17(null);
-  const subRef = useRef18(null);
+  const subRef = useRef13(null);
   useEffect17(() => {
     const sub = client.game.subscribePlayer(client.realtime, memberId);
     subRef.current = sub;
@@ -959,20 +962,20 @@ function usePlayerStats(memberId) {
       subRef.current = null;
     };
   }, [client, memberId]);
-  const refresh = useCallback15(async () => {
+  const refresh = useCallback16(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { player, loading, error, refresh };
 }
 
 // src/dashboard/useLeaderboard.ts
-import { useState as useState18, useEffect as useEffect18, useRef as useRef19, useCallback as useCallback16 } from "react";
+import { useState as useState18, useEffect as useEffect18, useRef as useRef14, useCallback as useCallback17 } from "react";
 function useLeaderboard(period) {
   const client = useDashboardClient();
   const [entries, setEntries] = useState18([]);
   const [loading, setLoading] = useState18(true);
   const [error, setError] = useState18(null);
-  const subRef = useRef19(null);
+  const subRef = useRef14(null);
   useEffect18(() => {
     const sub = client.game.subscribeLeaderboard(client.realtime, period ? { period } : void 0);
     subRef.current = sub;
@@ -990,20 +993,20 @@ function useLeaderboard(period) {
       subRef.current = null;
     };
   }, [client, period]);
-  const refresh = useCallback16(async () => {
+  const refresh = useCallback17(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { entries, loading, error, refresh };
 }
 
 // src/dashboard/useGameActivity.ts
-import { useState as useState19, useEffect as useEffect19, useRef as useRef20, useCallback as useCallback17 } from "react";
+import { useState as useState19, useEffect as useEffect19, useRef as useRef15, useCallback as useCallback18 } from "react";
 function useGameActivity() {
   const client = useDashboardClient();
   const [events, setEvents] = useState19([]);
   const [loading, setLoading] = useState19(true);
   const [error, setError] = useState19(null);
-  const subRef = useRef20(null);
+  const subRef = useRef15(null);
   useEffect19(() => {
     const sub = client.game.subscribeActivity(client.realtime);
     subRef.current = sub;
@@ -1021,7 +1024,7 @@ function useGameActivity() {
       subRef.current = null;
     };
   }, [client]);
-  const refresh = useCallback17(async () => {
+  const refresh = useCallback18(async () => {
     if (subRef.current) await subRef.current.refresh();
   }, []);
   return { events, loading, error, refresh };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@cstar.help/react",
-	"version": "0.10.4",
+	"version": "0.11.0",
 	"description": "React hooks for the cStar customer support platform",
 	"type": "module",
 	"main": "./dist/index.cjs",
@@ -30,12 +30,12 @@
 	},
 	"peerDependencies": {
 		"react": ">=18.0.0",
-		"@cstar.help/js": "^0.18.5"
+		"@cstar.help/js": "^0.19.0"
 	},
 	"devDependencies": {
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"@cstar.help/js": "^0.18.5",
+		"@cstar.help/js": "^0.19.0",
 		"@testing-library/react": "^16.1.0",
 		"@types/react": "^18.3.0",
 		"@types/react-dom": "^18.3.0",