@ic-reactor/react 1.1.5 → 1.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/context/actor.d.ts +1 -1
- package/dist/context/actor.js +3 -3
- package/dist/helpers/actorHooks.js +12 -38
- package/dist/helpers/authHooks.js +6 -8
- package/dist/helpers/types.d.ts +9 -21
- package/dist/hooks/types.d.ts +0 -1
- package/dist/hooks/useActor.d.ts +1 -1
- package/dist/hooks/useActor.js +28 -25
- package/package.json +3 -3
package/dist/context/actor.d.ts
CHANGED
|
@@ -61,4 +61,4 @@ import { CreateActorContextParameters, CreateActorContextReturnType } from "./ty
|
|
|
61
61
|
* to manage actor state and perform actions such as queries or updates. It abstracts away the complexities involved in directly
|
|
62
62
|
* managing IC agents and actors, providing a simple, declarative API for developers.
|
|
63
63
|
*/
|
|
64
|
-
export declare function createActorContext<A = BaseActor>(
|
|
64
|
+
export declare function createActorContext<A = BaseActor>(contextConfig?: CreateActorContextParameters): CreateActorContextReturnType<A>;
|
package/dist/context/actor.js
CHANGED
|
@@ -79,8 +79,8 @@ const extractActorContext_1 = require("../helpers/extractActorContext");
|
|
|
79
79
|
* to manage actor state and perform actions such as queries or updates. It abstracts away the complexities involved in directly
|
|
80
80
|
* managing IC agents and actors, providing a simple, declarative API for developers.
|
|
81
81
|
*/
|
|
82
|
-
function createActorContext(
|
|
83
|
-
const { canisterId: defaultCanisterId } =
|
|
82
|
+
function createActorContext(contextConfig = {}) {
|
|
83
|
+
const { canisterId: defaultCanisterId } = contextConfig, defaultConfig = __rest(contextConfig, ["canisterId"]);
|
|
84
84
|
const ActorContext = react_1.default.createContext(null);
|
|
85
85
|
const ActorProvider = (_a) => {
|
|
86
86
|
var { children, canisterId = defaultCanisterId, loadingComponent = react_1.default.createElement("div", null, "Fetching canister..."), authenticatingComponent = react_1.default.createElement("div", null, "Authenticating...") } = _a, restConfig = __rest(_a, ["children", "canisterId", "loadingComponent", "authenticatingComponent"]);
|
|
@@ -88,7 +88,7 @@ function createActorContext(config = {}) {
|
|
|
88
88
|
throw new Error("canisterId is required");
|
|
89
89
|
}
|
|
90
90
|
const config = react_1.default.useMemo(() => (Object.assign(Object.assign({}, defaultConfig), restConfig)), [defaultConfig, restConfig]);
|
|
91
|
-
const { fetchError, authenticating, hooks } = (0, useActor_1.useActor)(Object.assign({ canisterId
|
|
91
|
+
const { fetchError, authenticating, hooks } = (0, useActor_1.useActor)(Object.assign({ canisterId }, config));
|
|
92
92
|
return (react_1.default.createElement(ActorContext.Provider, { value: hooks }, hooks === null
|
|
93
93
|
? (fetchError !== null && fetchError !== void 0 ? fetchError : authenticating)
|
|
94
94
|
? authenticatingComponent
|
|
@@ -1,27 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
2
|
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
26
3
|
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
27
4
|
return new (P || (P = Promise))(function (resolve, reject) {
|
|
@@ -42,9 +19,12 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
42
19
|
}
|
|
43
20
|
return t;
|
|
44
21
|
};
|
|
22
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
23
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
24
|
+
};
|
|
45
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
46
26
|
exports.actorHooks = void 0;
|
|
47
|
-
const react_1 =
|
|
27
|
+
const react_1 = __importDefault(require("react"));
|
|
48
28
|
const zustand_1 = require("zustand");
|
|
49
29
|
const DEFAULT_STATE = {
|
|
50
30
|
data: undefined,
|
|
@@ -76,7 +56,12 @@ const actorHooks = (actorManager) => {
|
|
|
76
56
|
return visitFunction;
|
|
77
57
|
};
|
|
78
58
|
const useVisitMethod = (functionName) => {
|
|
79
|
-
return react_1.default.useMemo(() =>
|
|
59
|
+
return react_1.default.useMemo(() => {
|
|
60
|
+
if (!visitFunction[functionName]) {
|
|
61
|
+
throw new Error(`Method ${functionName} not found`);
|
|
62
|
+
}
|
|
63
|
+
return visitFunction[functionName];
|
|
64
|
+
}, [functionName]);
|
|
80
65
|
};
|
|
81
66
|
const useSharedCall = (_a) => {
|
|
82
67
|
var { args = [], functionName, throwOnError = false } = _a, events = __rest(_a, ["args", "functionName", "throwOnError"]);
|
|
@@ -123,21 +108,10 @@ const actorHooks = (actorManager) => {
|
|
|
123
108
|
};
|
|
124
109
|
const useUpdateCall = useSharedCall;
|
|
125
110
|
const useMethod = (args) => {
|
|
126
|
-
const _a = useSharedCall(args), { call
|
|
111
|
+
const _a = useSharedCall(args), { call } = _a, state = __rest(_a, ["call"]);
|
|
127
112
|
const visit = useVisitMethod(args.functionName);
|
|
128
|
-
const transformedData = (0, react_1.useMemo)(() => {
|
|
129
|
-
if (data === undefined)
|
|
130
|
-
return data;
|
|
131
|
-
if (args.transform) {
|
|
132
|
-
return visit(args.transform, {
|
|
133
|
-
value: data,
|
|
134
|
-
label: args.functionName,
|
|
135
|
-
});
|
|
136
|
-
}
|
|
137
|
-
return data;
|
|
138
|
-
}, [data, args.transform, visit]);
|
|
139
113
|
return Object.assign({ call,
|
|
140
|
-
visit
|
|
114
|
+
visit }, state);
|
|
141
115
|
};
|
|
142
116
|
return {
|
|
143
117
|
initialize,
|
|
@@ -23,7 +23,7 @@ const authHooks = (agentManager) => {
|
|
|
23
23
|
const useAuth = ({ onAuthentication, onAuthenticationSuccess, onAuthenticationFailure, onLogin, onLoginSuccess, onLoginError, onLoggedOut, } = {}) => {
|
|
24
24
|
const [loginState, setLoginState] = react_1.default.useState({
|
|
25
25
|
loading: false,
|
|
26
|
-
error:
|
|
26
|
+
error: undefined,
|
|
27
27
|
});
|
|
28
28
|
const { authenticated, authenticating, error, identity } = useAuthState();
|
|
29
29
|
const authenticate = react_1.default.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -47,7 +47,7 @@ const authHooks = (agentManager) => {
|
|
|
47
47
|
onAuthenticationFailure,
|
|
48
48
|
]);
|
|
49
49
|
const login = react_1.default.useCallback((options) => __awaiter(void 0, void 0, void 0, function* () {
|
|
50
|
-
setLoginState({ loading: true, error:
|
|
50
|
+
setLoginState({ loading: true, error: undefined });
|
|
51
51
|
const loginPromise = new Promise((resolve, reject) => {
|
|
52
52
|
try {
|
|
53
53
|
const authClient = getAuth();
|
|
@@ -64,18 +64,16 @@ const authHooks = (agentManager) => {
|
|
|
64
64
|
(_a = options === null || options === void 0 ? void 0 : options.onSuccess) === null || _a === void 0 ? void 0 : _a.call(options);
|
|
65
65
|
onLoginSuccess === null || onLoginSuccess === void 0 ? void 0 : onLoginSuccess(principal);
|
|
66
66
|
resolve(principal);
|
|
67
|
-
setLoginState({ loading: false, error:
|
|
67
|
+
setLoginState({ loading: false, error: undefined });
|
|
68
68
|
})
|
|
69
|
-
.catch((
|
|
70
|
-
const error = e;
|
|
69
|
+
.catch((error) => {
|
|
71
70
|
setLoginState({ loading: false, error });
|
|
72
71
|
onLoginError === null || onLoginError === void 0 ? void 0 : onLoginError(error);
|
|
73
72
|
reject(error);
|
|
74
73
|
});
|
|
75
|
-
}, onError: (
|
|
74
|
+
}, onError: (error) => {
|
|
76
75
|
var _a;
|
|
77
|
-
(_a = options === null || options === void 0 ? void 0 : options.onError) === null || _a === void 0 ? void 0 : _a.call(options,
|
|
78
|
-
const error = new Error("Login failed: " + e);
|
|
76
|
+
(_a = options === null || options === void 0 ? void 0 : options.onError) === null || _a === void 0 ? void 0 : _a.call(options, error);
|
|
79
77
|
setLoginState({ loading: false, error });
|
|
80
78
|
onLoginError === null || onLoginError === void 0 ? void 0 : onLoginError(error);
|
|
81
79
|
reject(error);
|
package/dist/helpers/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { ServiceClass
|
|
2
|
+
import type { ServiceClass } from "@dfinity/candid/lib/cjs/idl";
|
|
3
3
|
import type { ActorState, CanisterId, AuthClientLoginOptions, ActorMethodParameters, ActorMethodReturnType, Identity, Principal, FunctionName, VisitService, AuthState, HttpAgent, AgentState, BaseActor } from "@ic-reactor/core/dist/types";
|
|
4
4
|
export interface AgentHooksReturnType {
|
|
5
5
|
useAgent: () => HttpAgent | undefined;
|
|
@@ -13,9 +13,9 @@ export interface AuthHooksReturnType {
|
|
|
13
13
|
export interface UseAuthParameters {
|
|
14
14
|
onAuthentication?: (promise: () => Promise<Identity>) => void;
|
|
15
15
|
onAuthenticationSuccess?: (identity: Identity) => void;
|
|
16
|
-
onAuthenticationFailure?: (error:
|
|
16
|
+
onAuthenticationFailure?: (error: string | undefined) => void;
|
|
17
17
|
onLoginSuccess?: (principal: Principal) => void;
|
|
18
|
-
onLoginError?: (error:
|
|
18
|
+
onLoginError?: (error: string | undefined) => void;
|
|
19
19
|
onLogin?: (promise: () => Promise<Principal>) => void;
|
|
20
20
|
onLoggedOut?: () => void;
|
|
21
21
|
}
|
|
@@ -28,11 +28,11 @@ export interface UseAuthReturnType {
|
|
|
28
28
|
logout: (options?: LogoutParameters) => Promise<void>;
|
|
29
29
|
authenticate: () => Promise<Identity>;
|
|
30
30
|
loginLoading: boolean;
|
|
31
|
-
loginError:
|
|
31
|
+
loginError: string | undefined;
|
|
32
32
|
}
|
|
33
33
|
export type LoginState = {
|
|
34
34
|
loading: boolean;
|
|
35
|
-
error:
|
|
35
|
+
error: string | undefined;
|
|
36
36
|
};
|
|
37
37
|
export type LoginParameters = AuthClientLoginOptions;
|
|
38
38
|
export type LogoutParameters = {
|
|
@@ -71,29 +71,17 @@ export interface DynamicDataArgs<V = unknown> {
|
|
|
71
71
|
label: string;
|
|
72
72
|
value: V;
|
|
73
73
|
}
|
|
74
|
-
export interface UseMethodParameters<A, M extends FunctionName<A
|
|
75
|
-
transform?: Visitor<DynamicDataArgs, T>;
|
|
74
|
+
export interface UseMethodParameters<A, M extends FunctionName<A>> extends UseSharedCallParameters<A, M> {
|
|
76
75
|
}
|
|
77
|
-
export interface UseMethodReturnType<A, M extends FunctionName<A> = FunctionName<A
|
|
76
|
+
export interface UseMethodReturnType<A, M extends FunctionName<A> = FunctionName<A>> {
|
|
78
77
|
loading: boolean;
|
|
79
78
|
error: Error | undefined;
|
|
80
|
-
data:
|
|
79
|
+
data: ActorMethodReturnType<A[M]> | undefined;
|
|
81
80
|
visit: VisitService<A>[M];
|
|
82
81
|
reset: () => void;
|
|
83
82
|
call: (eventOrReplaceArgs?: React.MouseEvent | ActorMethodParameters<A[M]>) => Promise<ActorMethodReturnType<A[M]> | undefined>;
|
|
84
83
|
}
|
|
85
|
-
export type UseMethod<A> =
|
|
86
|
-
<M extends FunctionName<A>, T = unknown>({ transform, }: {
|
|
87
|
-
transform: Visitor<DynamicDataArgs, T>;
|
|
88
|
-
} & UseMethodParameters<A, M, T>): {
|
|
89
|
-
data: T | undefined;
|
|
90
|
-
} & UseMethodReturnType<A, M, T>;
|
|
91
|
-
<M extends FunctionName<A>, T = unknown>({ transform, }: {
|
|
92
|
-
transform?: undefined;
|
|
93
|
-
} & UseMethodParameters<A, M, T>): {
|
|
94
|
-
data: ActorMethodReturnType<A[M]> | undefined;
|
|
95
|
-
} & UseMethodReturnType<A, M, T>;
|
|
96
|
-
};
|
|
84
|
+
export type UseMethod<A> = <M extends FunctionName<A>>(args: UseMethodParameters<A, M>) => UseMethodReturnType<A, M>;
|
|
97
85
|
export type UseVisitMethod<A> = <M extends FunctionName<A>>(functionName: M) => VisitService<A>[M];
|
|
98
86
|
export type UseVisitService<A> = () => VisitService<A>;
|
|
99
87
|
export interface ActorHooksReturnType<A = BaseActor> {
|
package/dist/hooks/types.d.ts
CHANGED
|
@@ -6,7 +6,6 @@ export interface UseActorParameters extends Omit<ActorManagerParameters, "idlFac
|
|
|
6
6
|
canisterId: string;
|
|
7
7
|
idlFactory?: IDL.InterfaceFactory;
|
|
8
8
|
agentContext?: React.Context<AgentContext | null>;
|
|
9
|
-
fetchOnMount?: boolean;
|
|
10
9
|
didjsCanisterId?: string;
|
|
11
10
|
}
|
|
12
11
|
export interface UseActorReturn<A = BaseActor> {
|
package/dist/hooks/useActor.d.ts
CHANGED
package/dist/hooks/useActor.js
CHANGED
|
@@ -89,21 +89,25 @@ const agent_1 = require("./agent");
|
|
|
89
89
|
* ```
|
|
90
90
|
*/
|
|
91
91
|
const useActor = (config) => {
|
|
92
|
-
const { canisterId, idlFactory: maybeIdlFactory, agentContext,
|
|
93
|
-
|
|
94
|
-
|
|
92
|
+
const { canisterId, idlFactory: maybeIdlFactory, agentContext, didjsCanisterId } = config, actorConfig = __rest(config, ["canisterId", "idlFactory", "agentContext", "didjsCanisterId"]);
|
|
93
|
+
if (!canisterId) {
|
|
94
|
+
throw new Error("canisterId is required");
|
|
95
|
+
}
|
|
96
|
+
const [actorManager, setActorManager] = (0, react_1.useState)();
|
|
97
|
+
const [{ fetching, fetchError }, setState] = (0, react_1.useState)({
|
|
95
98
|
fetching: false,
|
|
96
99
|
fetchError: null,
|
|
97
100
|
});
|
|
98
101
|
const agentManager = (0, useAgentManager_1.useAgentManager)(agentContext);
|
|
99
|
-
const
|
|
100
|
-
|
|
102
|
+
const authenticating = (0, agent_1.useAuthState)().authenticating;
|
|
103
|
+
const fetchCandid = (0, react_1.useCallback)(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
104
|
+
if (fetching || authenticating)
|
|
101
105
|
return;
|
|
102
106
|
setState({
|
|
103
|
-
idlFactory: undefined,
|
|
104
107
|
fetching: true,
|
|
105
108
|
fetchError: null,
|
|
106
109
|
});
|
|
110
|
+
const agent = agentManager.getAgent();
|
|
107
111
|
try {
|
|
108
112
|
const candidManager = (0, core_1.createCandidAdapter)({
|
|
109
113
|
agent,
|
|
@@ -111,7 +115,6 @@ const useActor = (config) => {
|
|
|
111
115
|
});
|
|
112
116
|
const { idlFactory } = yield candidManager.getCandidDefinition(canisterId);
|
|
113
117
|
setState({
|
|
114
|
-
idlFactory,
|
|
115
118
|
fetching: false,
|
|
116
119
|
fetchError: null,
|
|
117
120
|
});
|
|
@@ -121,35 +124,35 @@ const useActor = (config) => {
|
|
|
121
124
|
// eslint-disable-next-line no-console
|
|
122
125
|
console.error(err);
|
|
123
126
|
setState({
|
|
124
|
-
idlFactory: undefined,
|
|
125
127
|
fetchError: `Error fetching canister ${canisterId}`,
|
|
126
128
|
fetching: false,
|
|
127
129
|
});
|
|
128
130
|
}
|
|
129
|
-
}), [canisterId, didjsCanisterId]);
|
|
131
|
+
}), [canisterId, authenticating, didjsCanisterId]);
|
|
130
132
|
(0, react_1.useEffect)(() => {
|
|
131
133
|
if (maybeIdlFactory) {
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
fetching: false,
|
|
135
|
-
fetchError: null,
|
|
136
|
-
}));
|
|
137
|
-
return;
|
|
134
|
+
const actorManager = (0, core_1.createActorManager)(Object.assign({ agentManager, idlFactory: maybeIdlFactory, canisterId }, actorConfig));
|
|
135
|
+
setActorManager(() => actorManager);
|
|
138
136
|
}
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
137
|
+
else {
|
|
138
|
+
fetchCandid().then((idlFactory) => {
|
|
139
|
+
if (!idlFactory)
|
|
140
|
+
return;
|
|
141
|
+
const actorManager = (0, core_1.createActorManager)(Object.assign({ agentManager,
|
|
142
|
+
idlFactory,
|
|
143
|
+
canisterId }, actorConfig));
|
|
144
|
+
setActorManager(() => actorManager);
|
|
145
|
+
});
|
|
146
|
+
}
|
|
147
|
+
return actorManager === null || actorManager === void 0 ? void 0 : actorManager.cleanup();
|
|
148
|
+
}, [fetchCandid, maybeIdlFactory, canisterId, agentManager]);
|
|
143
149
|
const hooks = (0, react_1.useMemo)(() => {
|
|
144
|
-
if (
|
|
150
|
+
if (fetching)
|
|
145
151
|
return null;
|
|
146
|
-
if (
|
|
152
|
+
if (!actorManager)
|
|
147
153
|
return null;
|
|
148
|
-
const actorManager = (0, core_1.createActorManager)(Object.assign({ agentManager,
|
|
149
|
-
idlFactory,
|
|
150
|
-
canisterId }, actorConfig));
|
|
151
154
|
return (0, helpers_1.actorHooks)(actorManager);
|
|
152
|
-
}, [canisterId, authenticating,
|
|
155
|
+
}, [canisterId, authenticating, actorManager, fetching]);
|
|
153
156
|
return { hooks, authenticating, fetching, fetchError };
|
|
154
157
|
};
|
|
155
158
|
exports.useActor = useActor;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ic-reactor/react",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.7",
|
|
4
4
|
"description": "A React library for interacting with Internet Computer canisters",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"node": ">=10"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@ic-reactor/core": "^1.1.
|
|
38
|
+
"@ic-reactor/core": "^1.1.3",
|
|
39
39
|
"zustand-utils": "^1.3"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"react": ">=16.8",
|
|
48
48
|
"zustand": "4.5"
|
|
49
49
|
},
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "f5b239372688a3343ef371369143b733d876158f"
|
|
51
51
|
}
|