@ic-reactor/react 3.3.0 → 3.4.0

package/dist/utils.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Shared internal utilities for query and mutation factories.
+ */
+import type { QueryKey } from "@tanstack/react-query";
+/**
+ * Internal query-key segment used to distinguish per-call factory args
+ * from the base query key. Not part of the public API.
+ */
+export declare const FACTORY_KEY_ARGS_QUERY_KEY = "__ic_reactor_factory_key_args";
+/**
+ * Merge a base query key, optional per-call query key, and optional key-args
+ * into a single query key array.
+ *
+ * Used by createInfiniteQueryFactory and createSuspenseInfiniteQueryFactory to
+ * ensure each unique set of factory args produces a distinct cache entry.
+ */
+export declare function mergeFactoryQueryKey(baseQueryKey?: QueryKey, callQueryKey?: QueryKey, keyArgs?: unknown): QueryKey | undefined;
+/**
+ * Build a chained select function that first applies the config-level select
+ * (if any) and then the hook-level select (if any).
+ *
+ * This enables `createQuery` / `createSuspenseQuery` to support two-level
+ * select chaining without duplicating the logic.
+ */
+export declare function buildChainedSelect<TData, TSelected, TFinal = TSelected>(configSelect: ((data: TData) => TSelected) | undefined, hookSelect: ((data: TSelected) => TFinal) | undefined): (rawData: TData) => TSelected | TFinal;
+//# sourceMappingURL=utils.d.ts.map

package/dist/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAErD;;;GAGG;AACH,eAAO,MAAM,0BAA0B,kCAAkC,CAAA;AAEzE;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAClC,YAAY,CAAC,EAAE,QAAQ,EACvB,YAAY,CAAC,EAAE,QAAQ,EACvB,OAAO,CAAC,EAAE,OAAO,GAChB,QAAQ,GAAG,SAAS,CAStB;AAED;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,SAAS,EAAE,MAAM,GAAG,SAAS,EACrE,YAAY,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC,GAAG,SAAS,EACtD,UAAU,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,KAAK,MAAM,CAAC,GAAG,SAAS,GACpD,CAAC,OAAO,EAAE,KAAK,KAAK,SAAS,GAAG,MAAM,CAOxC"}

package/dist/utils.js

@@ -0,0 +1,41 @@
+/**
+ * Shared internal utilities for query and mutation factories.
+ */
+/**
+ * Internal query-key segment used to distinguish per-call factory args
+ * from the base query key. Not part of the public API.
+ */
+export const FACTORY_KEY_ARGS_QUERY_KEY = "__ic_reactor_factory_key_args";
+/**
+ * Merge a base query key, optional per-call query key, and optional key-args
+ * into a single query key array.
+ *
+ * Used by createInfiniteQueryFactory and createSuspenseInfiniteQueryFactory to
+ * ensure each unique set of factory args produces a distinct cache entry.
+ */
+export function mergeFactoryQueryKey(baseQueryKey, callQueryKey, keyArgs) {
+    const merged = [];
+    if (baseQueryKey)
+        merged.push(...baseQueryKey);
+    if (callQueryKey)
+        merged.push(...callQueryKey);
+    if (keyArgs !== undefined)
+        merged.push({ [FACTORY_KEY_ARGS_QUERY_KEY]: keyArgs });
+    return merged.length > 0 ? merged : undefined;
+}
+/**
+ * Build a chained select function that first applies the config-level select
+ * (if any) and then the hook-level select (if any).
+ *
+ * This enables `createQuery` / `createSuspenseQuery` to support two-level
+ * select chaining without duplicating the logic.
+ */
+export function buildChainedSelect(configSelect, hookSelect) {
+    return (rawData) => {
+        const firstPass = configSelect
+            ? configSelect(rawData)
+            : rawData;
+        return hookSelect ? hookSelect(firstPass) : firstPass;
+    };
+}
+//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH;;;GAGG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,+BAA+B,CAAA;AAEzE;;;;;;GAMG;AACH,MAAM,UAAU,oBAAoB,CAClC,YAAuB,EACvB,YAAuB,EACvB,OAAiB;IAEjB,MAAM,MAAM,GAAc,EAAE,CAAA;IAE5B,IAAI,YAAY;QAAE,MAAM,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,CAAA;IAC9C,IAAI,YAAY;QAAE,MAAM,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,CAAA;IAC9C,IAAI,OAAO,KAAK,SAAS;QACvB,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,0BAA0B,CAAC,EAAE,OAAO,EAAE,CAAC,CAAA;IAExD,OAAO,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAA;AAC/C,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,kBAAkB,CAChC,YAAsD,EACtD,UAAqD;IAErD,OAAO,CAAC,OAAc,EAAE,EAAE;QACxB,MAAM,SAAS,GAAG,YAAY;YAC5B,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC;YACvB,CAAC,CAAE,OAAgC,CAAA;QACrC,OAAO,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IACvD,CAAC,CAAA;AACH,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ic-reactor/react",
-  "version": "3.3.0",
+  "version": "3.4.0",
   "description": "IC Reactor React Library",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -42,29 +42,35 @@
   "author": "Behrad Deylami",
   "license": "MIT",
   "dependencies": {
-    "@ic-reactor/core": "^3.3.0"
+    "@ic-reactor/core": "^3.4.0"
   },
   "peerDependencies": {
+    "@icp-sdk/auth": "^6.0.0",
     "@tanstack/react-query": "^5.0.0",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },
+  "peerDependenciesMeta": {
+    "@icp-sdk/auth": {
+      "optional": true
+    }
+  },
   "devDependencies": {
-    "@icp-sdk/auth": "^5.0.0",
-    "@icp-sdk/core": "^5.2.1",
-    "@size-limit/preset-small-lib": "^12.0.1",
-    "@tanstack/react-query": "^5.96.2",
+    "@icp-sdk/auth": "^6.0.0",
+    "@icp-sdk/core": "^5.3.1",
+    "@size-limit/preset-small-lib": "^12.1.0",
+    "@tanstack/react-query": "^5.100.5",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
     "fake-indexeddb": "^6.2.5",
-    "jsdom": "^29.0.1",
-    "react": "^19.2.4",
-    "react-dom": "^19.2.4",
-    "size-limit": "^12.0.1",
-    "vitest": "^4.1.2"
+    "jsdom": "^29.1.0",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "size-limit": "^12.1.0",
+    "vitest": "^4.1.5"
   },
   "size-limit": [
     {

package/src/createActorHooks.ts

@@ -33,18 +33,17 @@ import {
   UseMutationResult,
   InfiniteData,
 } from "@tanstack/react-query"
-import { createQuery } from "./createQuery"
-import { createSuspenseQuery } from "./createSuspenseQuery"
-import { createInfiniteQuery, InfiniteQueryConfig } from "./createInfiniteQuery"
-import {
-  createSuspenseInfiniteQuery,
-  SuspenseInfiniteQueryConfig,
-} from "./createSuspenseInfiniteQuery"
-import { createMutation } from "./createMutation"
+import { useActorQuery } from "./hooks/useActorQuery"
+import { useActorSuspenseQuery } from "./hooks/useActorSuspenseQuery"
+import { useActorInfiniteQuery } from "./hooks/useActorInfiniteQuery"
+import { useActorSuspenseInfiniteQuery } from "./hooks/useActorSuspenseInfiniteQuery"
+import { useActorMutation } from "./hooks/useActorMutation"
 import {
   useActorMethod,
   UseActorMethodParameters,
 } from "./hooks/useActorMethod"
+import { InfiniteQueryConfig } from "./createInfiniteQuery"
+import { SuspenseInfiniteQueryConfig } from "./createSuspenseInfiniteQuery"
 import { QueryConfig, SuspenseQueryConfig, MutationConfig } from "./types"
 
 export type ActorHooks<A, T extends TransformKey> = {
@@ -108,33 +107,35 @@ export function createActorHooks<A, T extends TransformKey>(
   reactor: Reactor<A, T>
 ): ActorHooks<A, T> {
   return {
-    useActorQuery: ((config: any) => {
-      const { select, ...options } = config
-      return createQuery(reactor, config).useQuery(options)
-    }) as ActorHooks<A, T>["useActorQuery"],
+    useActorQuery: ((config: any) =>
+      useActorQuery({ ...config, reactor })) as ActorHooks<
+      A,
+      T
+    >["useActorQuery"],
 
-    useActorSuspenseQuery: ((config: any) => {
-      const { select, ...options } = config
-      return createSuspenseQuery(reactor, config).useSuspenseQuery(options)
-    }) as ActorHooks<A, T>["useActorSuspenseQuery"],
+    useActorSuspenseQuery: ((config: any) =>
+      useActorSuspenseQuery({ ...config, reactor })) as ActorHooks<
+      A,
+      T
+    >["useActorSuspenseQuery"],
 
-    useActorInfiniteQuery: ((config) => {
-      const { select, ...options } = config
-      return createInfiniteQuery(reactor, config).useInfiniteQuery(options)
-    }) as ActorHooks<A, T>["useActorInfiniteQuery"],
+    useActorInfiniteQuery: ((config: any) =>
+      useActorInfiniteQuery({ ...config, reactor })) as ActorHooks<
+      A,
+      T
+    >["useActorInfiniteQuery"],
 
-    useActorSuspenseInfiniteQuery: ((config) => {
-      const { select, ...options } = config
-      return createSuspenseInfiniteQuery(
-        reactor,
-        config
-      ).useSuspenseInfiniteQuery(options)
-    }) as ActorHooks<A, T>["useActorSuspenseInfiniteQuery"],
+    useActorSuspenseInfiniteQuery: ((config: any) =>
+      useActorSuspenseInfiniteQuery({ ...config, reactor })) as ActorHooks<
+      A,
+      T
+    >["useActorSuspenseInfiniteQuery"],
 
-    useActorMutation: ((config) => {
-      const { onSuccess, invalidateQueries, ...options } = config
-      return createMutation(reactor, config).useMutation(options)
-    }) as ActorHooks<A, T>["useActorMutation"],
+    useActorMutation: ((config: any) =>
+      useActorMutation({ ...config, reactor })) as ActorHooks<
+      A,
+      T
+    >["useActorMutation"],
 
     useActorMethod: (config) =>
       useActorMethod({ ...config, reactor } as UseActorMethodParameters<

package/src/createAuthHooks.ts

@@ -1,12 +1,26 @@
-import { useSyncExternalStore, useEffect, useRef, useMemo } from "react"
-import { ClientManager, AgentState, AuthState } from "@ic-reactor/core"
-import { Principal } from "@icp-sdk/core/principal"
-import { Identity } from "@icp-sdk/core/agent"
-import { AuthClientLoginOptions } from "@icp-sdk/auth/client"
+import {
+  useSyncExternalStore,
+  useEffect,
+  useRef,
+  useMemo,
+  useState,
+  useCallback,
+} from "react"
+import {
+  ClientManager,
+  AgentState,
+  AuthState,
+  ClientManagerSignInOptions,
+  IdentityAttributeResult,
+  RequestIdentityAttributesParameters,
+  RequestOpenIdIdentityAttributesParameters,
+} from "@ic-reactor/core"
+import type { Principal } from "@icp-sdk/core/principal"
+import type { Identity } from "@icp-sdk/core/agent"
 
 export interface UseAuthReturn {
   authenticate: () => Promise<Identity | undefined>
-  login: (options?: AuthClientLoginOptions) => Promise<void>
+  login: (options?: ClientManagerSignInOptions) => Promise<void>
   logout: (options?: { returnTo?: string }) => Promise<void>
   isAuthenticated: boolean
   isAuthenticating: boolean
@@ -19,6 +33,20 @@ export interface CreateAuthHooksReturn {
   useAgentState: () => AgentState
   useUserPrincipal: () => Principal | null
   useAuth: () => UseAuthReturn
+  useIdentityAttributes: () => UseIdentityAttributesReturn
+}
+
+export interface UseIdentityAttributesReturn {
+  requestAttributes: (
+    params: RequestIdentityAttributesParameters
+  ) => Promise<IdentityAttributeResult>
+  requestOpenIdAttributes: (
+    params: RequestOpenIdIdentityAttributesParameters
+  ) => Promise<IdentityAttributeResult>
+  attributes: IdentityAttributeResult | null
+  isRequestingAttributes: boolean
+  attributeError: Error | null
+  clearAttributes: () => void
 }
 
 /**
@@ -129,9 +157,68 @@ export const createAuthHooks = (
     return identity ? identity.getPrincipal() : null
   }
 
+  const useIdentityAttributes = (): UseIdentityAttributesReturn => {
+    const [attributes, setAttributes] =
+      useState<IdentityAttributeResult | null>(null)
+    const [isRequestingAttributes, setIsRequestingAttributes] = useState(false)
+    const [attributeError, setAttributeError] = useState<Error | null>(null)
+
+    const requestAttributes = useCallback(
+      async (params: RequestIdentityAttributesParameters) => {
+        setIsRequestingAttributes(true)
+        setAttributeError(null)
+        try {
+          const result = await clientManager.requestIdentityAttributes(params)
+          setAttributes(result)
+          return result
+        } catch (error) {
+          setAttributeError(error as Error)
+          throw error
+        } finally {
+          setIsRequestingAttributes(false)
+        }
+      },
+      []
+    )
+
+    const requestOpenIdAttributes = useCallback(
+      async (params: RequestOpenIdIdentityAttributesParameters) => {
+        setIsRequestingAttributes(true)
+        setAttributeError(null)
+        try {
+          const result =
+            await clientManager.requestOpenIdIdentityAttributes(params)
+          setAttributes(result)
+          return result
+        } catch (error) {
+          setAttributeError(error as Error)
+          throw error
+        } finally {
+          setIsRequestingAttributes(false)
+        }
+      },
+      []
+    )
+
+    const clearAttributes = useCallback(() => {
+      setAttributes(null)
+      setAttributeError(null)
+    }, [])
+
+    return {
+      requestAttributes,
+      requestOpenIdAttributes,
+      attributes,
+      isRequestingAttributes,
+      attributeError,
+      clearAttributes,
+    }
+  }
+
   return {
     useAuth,
     useAgentState,
     useUserPrincipal,
+    useIdentityAttributes,
   }
 }

package/src/createInfiniteQuery.ts

@@ -43,8 +43,7 @@ import {
 } from "@tanstack/react-query"
 import { CallConfig } from "@icp-sdk/core/agent"
 import { NoInfer } from "./types"
-
-const FACTORY_KEY_ARGS_QUERY_KEY = "__ic_reactor_factory_key_args"
+import { mergeFactoryQueryKey } from "./utils"
 
 type InfiniteQueryFactoryFn<
   A,
@@ -63,22 +62,6 @@ type InfiniteQueryFactoryFn<
   >
 }
 
-const mergeFactoryQueryKey = (
-  baseQueryKey?: QueryKey,
-  keyArgs?: unknown
-): QueryKey | undefined => {
-  const merged: unknown[] = []
-
-  if (baseQueryKey) {
-    merged.push(...baseQueryKey)
-  }
-  if (keyArgs !== undefined) {
-    merged.push({ [FACTORY_KEY_ARGS_QUERY_KEY]: keyArgs })
-  }
-
-  return merged.length > 0 ? merged : undefined
-}
-
 // ============================================================================
 // Type Definitions
 // ============================================================================
@@ -510,7 +493,7 @@ export function createInfiniteQueryFactory<
   ) => {
     const initialArgs = getArgs(config.initialPageParam)
     const keyArgs = config.getKeyArgs?.(initialArgs) ?? initialArgs
-    const queryKey = mergeFactoryQueryKey(config.queryKey, keyArgs)
+    const queryKey = mergeFactoryQueryKey(config.queryKey, undefined, keyArgs)
 
     return createInfiniteQueryImpl<A, M, T, TPageParam, TSelected>(reactor, {
       ...(({ getKeyArgs: _getKeyArgs, ...rest }) => rest)(

package/src/createMutation.ts

@@ -30,6 +30,22 @@ import type {
   NoInfer,
 } from "./types"
 
+// ============================================================================
+// Internal helpers
+// ============================================================================
+
+/** Invalidate a list of query keys in parallel, filtering out undefineds. */
+async function invalidateAll(
+  queryClient: Reactor<any, any>["queryClient"],
+  keys: (import("@tanstack/react-query").QueryKey | undefined)[]
+): Promise<void> {
+  await Promise.all(
+    keys.map((queryKey) =>
+      queryKey ? queryClient.invalidateQueries({ queryKey }) : Promise.resolve()
+    )
+  )
+}
+
 // ============================================================================
 // Internal Implementation
 // ============================================================================
@@ -52,113 +68,80 @@ const createMutationImpl = <
     ...factoryOptions
   } = config
 
-  // Direct execution function
+  /**
+   * Raw call without any invalidation logic.
+   * Used as mutationFn so that onSuccess handles all post-mutation work
+   * and there is no double-invalidation.
+   */
+  const callFn = (
+    args: ReactorArgs<A, M, T>
+  ): Promise<ReactorReturnOk<A, M, T>> =>
+    reactor.callMethod({ functionName, args, callConfig })
+
+  /**
+   * Imperative execution for non-React usage.
+   * Calls the canister method and invalidates factory-level queries.
+   * Use this in route loaders, scripts, or server-side code.
+   */
   const execute = async (
     args: ReactorArgs<A, M, T>
   ): Promise<ReactorReturnOk<A, M, T>> => {
-    const result = await reactor.callMethod({
-      functionName,
-      args,
-      callConfig,
-    })
-
+    const result = await callFn(args)
     if (factoryInvalidateQueries) {
-      await Promise.all(
-        factoryInvalidateQueries.map((queryKey) => {
-          return reactor.queryClient.invalidateQueries({ queryKey })
-        })
-      )
+      await invalidateAll(reactor.queryClient, factoryInvalidateQueries)
     }
-
     return result
   }
 
   // Hook implementation
   const useMutationHook = (options?: MutationHookOptions<A, M, T>) => {
-    const baseOptions = reactor.getQueryOptions({
-      functionName,
-    })
-    // Extract our custom options
+    const baseOptions = reactor.getQueryOptions({ functionName })
     const {
       invalidateQueries: hookInvalidateQueries,
       onCanisterError: hookOnCanisterError,
       ...restOptions
-    } = options || {}
+    } = options ?? {}
 
     return useMutation(
       {
         mutationKey: baseOptions.queryKey,
         ...factoryOptions,
         ...restOptions,
-        mutationFn: execute,
+        // Use callFn (not execute) to avoid double-invalidation:
+        // factoryInvalidateQueries are handled in onSuccess below.
+        mutationFn: callFn,
         onSuccess: async (...args) => {
-          // 1. Handle factory-level invalidateQueries
+          // 1. Factory-level invalidation
           if (factoryInvalidateQueries) {
-            await Promise.all(
-              factoryInvalidateQueries.map((queryKey) => {
-                return reactor.queryClient.invalidateQueries({ queryKey })
-              })
-            )
+            await invalidateAll(reactor.queryClient, factoryInvalidateQueries)
           }
-
-          // 2. Handle hook-level invalidateQueries
+          // 2. Hook-level invalidation
           if (hookInvalidateQueries) {
-            await Promise.all(
-              hookInvalidateQueries.map((queryKey) => {
-                if (queryKey) {
-                  return reactor.queryClient.invalidateQueries({ queryKey })
-                }
-                return Promise.resolve()
-              })
-            )
-          }
-
-          // 3. Call factory onSuccess
-          if (factoryOnSuccess) {
-            await factoryOnSuccess(...args)
-          }
-
-          // 4. Call hook-local onSuccess
-          if (restOptions?.onSuccess) {
-            await restOptions.onSuccess(...args)
+            await invalidateAll(reactor.queryClient, hookInvalidateQueries)
           }
+          // 3. Factory onSuccess
+          await factoryOnSuccess?.(...args)
+          // 4. Hook onSuccess
+          await restOptions.onSuccess?.(...args)
         },
         onError: (error, variables, context, mutation) => {
-          // Check if this is a CanisterError (from Result { Err: E })
           if (isCanisterError(error)) {
-            // 1. Call factory-level onCanisterError
-            if (factoryOnCanisterError) {
-              factoryOnCanisterError(error, variables)
-            }
-            // 2. Call hook-level onCanisterError
-            if (hookOnCanisterError) {
-              hookOnCanisterError(error, variables)
-            }
-          }
-
-          // 3. Call factory-level onError (for all errors)
-          if (factoryOnError) {
-            factoryOnError(error, variables, context, mutation)
-          }
-
-          // 4. Call hook-level onError (for all errors)
-          if (restOptions?.onError) {
-            restOptions.onError(error, variables, context, mutation)
+            factoryOnCanisterError?.(error, variables)
+            hookOnCanisterError?.(error, variables)
           }
+          factoryOnError?.(error, variables, context, mutation)
+          restOptions.onError?.(error, variables, context, mutation)
         },
       },
       reactor.queryClient
     )
   }
 
-  return {
-    useMutation: useMutationHook,
-    execute,
-  }
+  return { useMutation: useMutationHook, execute }
 }
 
 // ============================================================================
-// Factory Function
+// Public Factory Function
 // ============================================================================
 
 export function createMutation<