@ic-reactor/react 1.1.3 → 1.1.5

package/dist/helpers/actorHooks.js

@@ -1,4 +1,27 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -19,12 +42,9 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.actorHooks = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const zustand_1 = require("zustand");
 const DEFAULT_STATE = {
     data: undefined,
@@ -47,23 +67,29 @@ const DEFAULT_STATE = {
  * Each hook is designed to simplify the process of interacting with actors in IC projects by abstracting away the complexity of state management, error handling, and method invocation.
  */
 const actorHooks = (actorManager) => {
-    const { actorStore, canisterId, visitFunction, callMethod, initialize } = actorManager;
+    const { actorStore, canisterId, visitFunction, extractInterface, callMethod, initialize, } = actorManager;
     const useActorState = () => (Object.assign(Object.assign({}, (0, zustand_1.useStore)(actorStore)), { canisterId }));
+    const useActorInterface = () => {
+        return extractInterface();
+    };
+    const useVisitService = () => {
+        return visitFunction;
+    };
     const useVisitMethod = (functionName) => {
         return react_1.default.useMemo(() => visitFunction[functionName], [functionName]);
     };
-    const useMethodCall = (_a) => {
+    const useSharedCall = (_a) => {
         var { args = [], functionName, throwOnError = false } = _a, events = __rest(_a, ["args", "functionName", "throwOnError"]);
-        const [state, setState] = react_1.default.useState(DEFAULT_STATE);
-        const reset = react_1.default.useCallback(() => setState(DEFAULT_STATE), []);
+        const [sharedState, setSharedState] = react_1.default.useState(DEFAULT_STATE);
+        const reset = react_1.default.useCallback(() => setSharedState(DEFAULT_STATE), []);
         const call = react_1.default.useCallback((eventOrReplaceArgs) => __awaiter(void 0, void 0, void 0, function* () {
             var _b, _c, _d, _e, _f;
-            setState((prev) => (Object.assign(Object.assign({}, prev), { error: undefined, loading: true })));
+            setSharedState((prev) => (Object.assign(Object.assign({}, prev), { error: undefined, loading: true })));
             (_b = events === null || events === void 0 ? void 0 : events.onLoading) === null || _b === void 0 ? void 0 : _b.call(events, true);
             try {
                 const replaceArgs = eventOrReplaceArgs instanceof Array ? eventOrReplaceArgs : args;
                 const data = yield callMethod(functionName, ...replaceArgs);
-                setState({ data, error: undefined, loading: false });
+                setSharedState({ data, error: undefined, loading: false });
                 (_c = events === null || events === void 0 ? void 0 : events.onSuccess) === null || _c === void 0 ? void 0 : _c.call(events, data);
                 (_d = events === null || events === void 0 ? void 0 : events.onLoading) === null || _d === void 0 ? void 0 : _d.call(events, false);
                 return data;
@@ -71,18 +97,18 @@ const actorHooks = (actorManager) => {
             catch (error) {
                 // eslint-disable-next-line no-console
                 console.error("Error in call:", error);
-                setState((prevState) => (Object.assign(Object.assign({}, prevState), { error: error, loading: false })));
+                setSharedState((prevState) => (Object.assign(Object.assign({}, prevState), { error: error, loading: false })));
                 (_e = events === null || events === void 0 ? void 0 : events.onError) === null || _e === void 0 ? void 0 : _e.call(events, error);
                 (_f = events === null || events === void 0 ? void 0 : events.onLoading) === null || _f === void 0 ? void 0 : _f.call(events, false);
                 if (throwOnError)
                     throw error;
             }
         }), [args, functionName, events]);
-        return Object.assign({ call, reset }, state);
+        return Object.assign({ call, reset }, sharedState);
     };
     const useQueryCall = (_a) => {
         var { refetchOnMount = true, refetchInterval = false } = _a, rest = __rest(_a, ["refetchOnMount", "refetchInterval"]);
-        const _b = useMethodCall(rest), { call } = _b, state = __rest(_b, ["call"]);
+        const _b = useSharedCall(rest), { call } = _b, state = __rest(_b, ["call"]);
         const intervalId = react_1.default.useRef();
         react_1.default.useEffect(() => {
             if (refetchInterval) {
@@ -95,13 +121,33 @@ const actorHooks = (actorManager) => {
         }, [refetchInterval, refetchOnMount]);
         return Object.assign({ call }, state);
     };
-    const useUpdateCall = useMethodCall;
+    const useUpdateCall = useSharedCall;
+    const useMethod = (args) => {
+        const _a = useSharedCall(args), { call, data } = _a, state = __rest(_a, ["call", "data"]);
+        const visit = useVisitMethod(args.functionName);
+        const transformedData = (0, react_1.useMemo)(() => {
+            if (data === undefined)
+                return data;
+            if (args.transform) {
+                return visit(args.transform, {
+                    value: data,
+                    label: args.functionName,
+                });
+            }
+            return data;
+        }, [data, args.transform, visit]);
+        return Object.assign({ call,
+            visit, data: transformedData }, state);
+    };
     return {
         initialize,
+        useMethod,
         useQueryCall,
         useUpdateCall,
         useActorState,
         useVisitMethod,
+        useVisitService,
+        useActorInterface,
     };
 };
 exports.actorHooks = actorHooks;

package/dist/helpers/extractActorContext.js

@@ -40,14 +40,20 @@ function extractActorContext(actorContext) {
     };
     const initialize = () => useActorContext().initialize();
     const useActorState = () => useActorContext().useActorState();
+    const useMethod = (args) => useActorContext().useMethod(args);
     const useQueryCall = (args) => useActorContext().useQueryCall(args);
     const useUpdateCall = (args) => useActorContext().useUpdateCall(args);
     const useVisitMethod = (functionName) => useActorContext().useVisitMethod(functionName);
+    const useVisitService = () => useActorContext().useVisitService();
+    const useActorInterface = () => useActorContext().useActorInterface();
     return {
         useActorState,
+        useMethod,
         useQueryCall,
         useUpdateCall,
         useVisitMethod,
+        useVisitService,
+        useActorInterface,
         initialize,
     };
 }

package/dist/helpers/types.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import type { ServiceClass, Visitor } from "@dfinity/candid/lib/cjs/idl";
 import type { ActorState, CanisterId, AuthClientLoginOptions, ActorMethodParameters, ActorMethodReturnType, Identity, Principal, FunctionName, VisitService, AuthState, HttpAgent, AgentState, BaseActor } from "@ic-reactor/core/dist/types";
 export interface AgentHooksReturnType {
     useAgent: () => HttpAgent | undefined;
@@ -40,7 +41,7 @@ export type LogoutParameters = {
 export interface UseActorState extends Omit<ActorState, "methodState"> {
     canisterId: CanisterId;
 }
-export type UseMethodCallParameters<A, M extends FunctionName<A>> = {
+export type UseSharedCallParameters<A, M extends FunctionName<A>> = {
     functionName: M;
     args?: ActorMethodParameters<A[M]>;
     onLoading?: (loading: boolean) => void;
@@ -48,29 +49,60 @@ export type UseMethodCallParameters<A, M extends FunctionName<A>> = {
     onSuccess?: (data: ActorMethodReturnType<A[M]> | undefined) => void;
     throwOnError?: boolean;
 };
-export type ActorCallState<A, M extends FunctionName<A>> = {
+export type UseSharedCallState<A, M extends FunctionName<A>> = {
     data: ActorMethodReturnType<A[M]> | undefined;
     error: Error | undefined;
     loading: boolean;
 };
-export interface UseQueryCallParameters<A, M extends FunctionName<A>> extends UseMethodCallParameters<A, M> {
+export interface UseSharedCallReturnType<A, M extends FunctionName<A> = FunctionName<A>> extends UseSharedCallState<A, M> {
+    reset: () => void;
+    call: (eventOrReplaceArgs?: React.MouseEvent | ActorMethodParameters<A[M]>) => Promise<ActorMethodReturnType<A[M]> | undefined>;
+}
+export type UseSharedCall<A> = <M extends FunctionName<A>>(args: UseSharedCallParameters<A, M>) => UseSharedCallReturnType<A, M>;
+export interface UseQueryCallParameters<A, M extends FunctionName<A>> extends UseSharedCallParameters<A, M> {
     refetchOnMount?: boolean;
     refetchInterval?: number | false;
 }
-export interface UseUpdateCallParameters<A, M extends FunctionName<A>> extends UseMethodCallParameters<A, M> {
+export type UseQueryCall<A> = <M extends FunctionName<A>>(args: UseQueryCallParameters<A, M>) => UseSharedCallReturnType<A, M>;
+export interface UseUpdateCallParameters<A, M extends FunctionName<A>> extends UseSharedCallParameters<A, M> {
+}
+export type UseUpdateCall<A> = <M extends FunctionName<A>>(args: UseUpdateCallParameters<A, M>) => UseSharedCallReturnType<A, M>;
+export interface DynamicDataArgs<V = unknown> {
+    label: string;
+    value: V;
 }
-export interface UseMethodCallReturnType<A, M extends FunctionName<A> = FunctionName<A>> extends ActorCallState<A, M> {
+export interface UseMethodParameters<A, M extends FunctionName<A>, T = unknown> extends UseSharedCallParameters<A, M> {
+    transform?: Visitor<DynamicDataArgs, T>;
+}
+export interface UseMethodReturnType<A, M extends FunctionName<A> = FunctionName<A>, T = unknown> {
+    loading: boolean;
+    error: Error | undefined;
+    data: T | ActorMethodReturnType<A[M]> | undefined;
+    visit: VisitService<A>[M];
     reset: () => void;
     call: (eventOrReplaceArgs?: React.MouseEvent | ActorMethodParameters<A[M]>) => Promise<ActorMethodReturnType<A[M]> | undefined>;
 }
-export type UseMethodCall<A> = <M extends FunctionName<A>>(args: UseMethodCallParameters<A, M>) => UseMethodCallReturnType<A, M>;
-export type UseQueryCall<A> = <M extends FunctionName<A>>(args: UseQueryCallParameters<A, M>) => UseMethodCallReturnType<A, M>;
-export type UseUpdateCall<A> = <M extends FunctionName<A>>(args: UseUpdateCallParameters<A, M>) => UseMethodCallReturnType<A, M>;
+export type UseMethod<A> = {
+    <M extends FunctionName<A>, T = unknown>({ transform, }: {
+        transform: Visitor<DynamicDataArgs, T>;
+    } & UseMethodParameters<A, M, T>): {
+        data: T | undefined;
+    } & UseMethodReturnType<A, M, T>;
+    <M extends FunctionName<A>, T = unknown>({ transform, }: {
+        transform?: undefined;
+    } & UseMethodParameters<A, M, T>): {
+        data: ActorMethodReturnType<A[M]> | undefined;
+    } & UseMethodReturnType<A, M, T>;
+};
 export type UseVisitMethod<A> = <M extends FunctionName<A>>(functionName: M) => VisitService<A>[M];
+export type UseVisitService<A> = () => VisitService<A>;
 export interface ActorHooksReturnType<A = BaseActor> {
     initialize: () => Promise<void>;
     useActorState: () => UseActorState;
+    useActorInterface: () => ServiceClass;
+    useMethod: UseMethod<A>;
     useQueryCall: UseQueryCall<A>;
     useUpdateCall: UseUpdateCall<A>;
     useVisitMethod: UseVisitMethod<A>;
+    useVisitService: UseVisitService<A>;
 }

package/dist/hooks/actor/index.d.ts

@@ -1,4 +1,7 @@
+export * from "./useMethod";
 export * from "./useActorState";
 export * from "./useQueryCall";
 export * from "./useUpdateCall";
 export * from "./useVisitMethod";
+export * from "./useVisitService";
+export * from "./useActorInterface";

package/dist/hooks/actor/index.js

@@ -14,7 +14,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useMethod"), exports);
 __exportStar(require("./useActorState"), exports);
 __exportStar(require("./useQueryCall"), exports);
 __exportStar(require("./useUpdateCall"), exports);
 __exportStar(require("./useVisitMethod"), exports);
+__exportStar(require("./useVisitService"), exports);
+__exportStar(require("./useActorInterface"), exports);

package/dist/hooks/actor/useActorInterface.d.ts

@@ -0,0 +1,4 @@
+/**
+ *
+ */
+export declare function useActorInterface(): import("@dfinity/candid/lib/cjs/idl").ServiceClass;

package/dist/hooks/actor/useActorInterface.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useActorInterface = void 0;
+const hooks_1 = require("./hooks");
+/**
+ *
+ */
+function useActorInterface() {
+    return hooks_1.ActorHooks.useActorInterface();
+}
+exports.useActorInterface = useActorInterface;

package/dist/hooks/actor/useMethod.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Hook for making update calls to actors, handling loading states, and managing errors. It supports custom event handlers for loading, success, and error events.
+ *
+ * @param options Configuration object for the actor method call, including the method name, arguments, and event handlers.
+ * @returns An object containing the method call function, a reset function to reset the call state to its default, and the current call state (data, error, loading, call, reset).
+ * @example
+ * ```tsx
+ * function UpdateCallComponent() {
+ *   const { call, data, loading } = useUpdateCall({
+ *      functionName: 'updateUserProfile',
+ *      args: ['123', { name: 'John Doe' }],
+ *      onLoading: (loading) => console.log('Loading:', loading),
+ *      onError: (error) => console.error('Error:', error),
+ *      onSuccess: (data) => console.log('Success:', data),
+ *   });
+ *
+ *  if (loading) return <p>Updating profile...</p>;
+ *
+ *  return (
+ *    <div>
+ *      <p>Updated Profile: {JSON.stringify(data)}</p>
+ *      <button onClick={call}>Update</button>
+ *    </div>
+ *  );
+ * }
+ * ```
+ */
+export declare const useMethod: import("../../types").UseMethod<import("@ic-reactor/core/dist/types").BaseActor>;

package/dist/hooks/actor/useMethod.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMethod = void 0;
+const hooks_1 = require("./hooks");
+/**
+ * Hook for making update calls to actors, handling loading states, and managing errors. It supports custom event handlers for loading, success, and error events.
+ *
+ * @param options Configuration object for the actor method call, including the method name, arguments, and event handlers.
+ * @returns An object containing the method call function, a reset function to reset the call state to its default, and the current call state (data, error, loading, call, reset).
+ * @example
+ * ```tsx
+ * function UpdateCallComponent() {
+ *   const { call, data, loading } = useUpdateCall({
+ *      functionName: 'updateUserProfile',
+ *      args: ['123', { name: 'John Doe' }],
+ *      onLoading: (loading) => console.log('Loading:', loading),
+ *      onError: (error) => console.error('Error:', error),
+ *      onSuccess: (data) => console.log('Success:', data),
+ *   });
+ *
+ *  if (loading) return <p>Updating profile...</p>;
+ *
+ *  return (
+ *    <div>
+ *      <p>Updated Profile: {JSON.stringify(data)}</p>
+ *      <button onClick={call}>Update</button>
+ *    </div>
+ *  );
+ * }
+ * ```
+ */
+exports.useMethod = hooks_1.ActorHooks.useMethod;

package/dist/hooks/actor/useQueryCall.d.ts

@@ -25,4 +25,4 @@ import { BaseActor, FunctionName, UseQueryCallParameters } from "../../types";
  * }
  * ```
  */
-export declare function useQueryCall<A = BaseActor, M extends FunctionName<A> = FunctionName<A>>(args: UseQueryCallParameters<A, M>): import("../../types").UseMethodCallReturnType<A, M>;
+export declare function useQueryCall<A = BaseActor, M extends FunctionName<A> = FunctionName<A>>(args: UseQueryCallParameters<A, M>): import("../../types").UseSharedCallReturnType<A, M>;

package/dist/hooks/actor/useUpdateCall.d.ts

@@ -26,4 +26,4 @@ import { BaseActor, FunctionName, UseUpdateCallParameters } from "../../types";
  * }
  * ```
  */
-export declare function useUpdateCall<A = BaseActor, M extends FunctionName<A> = FunctionName<A>>(args: UseUpdateCallParameters<A, M>): import("../../types").UseMethodCallReturnType<A, M>;
+export declare function useUpdateCall<A = BaseActor, M extends FunctionName<A> = FunctionName<A>>(args: UseUpdateCallParameters<A, M>): import("../../types").UseSharedCallReturnType<A, M>;

package/dist/hooks/actor/useVisitService.d.ts

@@ -0,0 +1,8 @@
+import { BaseActor } from "../../types";
+/**
+ * Memoizes and returns a visit service function for a specific actor method.
+ *
+ * @param functionName The name of the actor method to visit.
+ * @returns The visit service function for the specified method.
+ */
+export declare function useVisitService<A = BaseActor>(): import("@ic-reactor/core/dist/classes/actor/types").VisitService<A>;

package/dist/hooks/actor/useVisitService.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useVisitService = void 0;
+const hooks_1 = require("./hooks");
+/**
+ * Memoizes and returns a visit service function for a specific actor method.
+ *
+ * @param functionName The name of the actor method to visit.
+ * @returns The visit service function for the specified method.
+ */
+function useVisitService() {
+    return hooks_1.ActorHooks.useVisitService();
+}
+exports.useVisitService = useVisitService;

package/dist/index.d.ts

@@ -7,4 +7,4 @@ export * from "./hooks";
 export * as helpers from "./helpers";
 export * as types from "./types";
 export * as core from "./core";
-export * as utils from "@ic-reactor/core/dist/utils";
+export * as utils from "./utils";

package/dist/index.js

@@ -36,4 +36,4 @@ __exportStar(require("./hooks"), exports);
 exports.helpers = __importStar(require("./helpers"));
 exports.types = __importStar(require("./types"));
 exports.core = __importStar(require("./core"));
-exports.utils = __importStar(require("@ic-reactor/core/dist/utils"));
+exports.utils = __importStar(require("./utils"));

package/dist/utils.d.ts

@@ -0,0 +1 @@
+export * from "@ic-reactor/core/dist/utils";

package/dist/utils.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("@ic-reactor/core/dist/utils"), exports);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ic-reactor/react",
-  "version": "1.1.3",
+  "version": "1.1.5",
   "description": "A React library for interacting with Internet Computer canisters",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -35,7 +35,7 @@
     "node": ">=10"
   },
   "dependencies": {
-    "@ic-reactor/core": "^1.1.1",
+    "@ic-reactor/core": "^1.1.2",
     "zustand-utils": "^1.3"
   },
   "peerDependencies": {
@@ -47,5 +47,5 @@
     "react": ">=16.8",
     "zustand": "4.5"
   },
-  "gitHead": "5420fba37e2721dd9c4a41ba885151eb420c5332"
+  "gitHead": "5203d7142eda0153581cb3b6de00e12fc128eb33"
 }