Update zustand to version 5 and refactor imports in core package

packages/core/package.json

@@ -32,7 +32,7 @@
     "@dfinity/identity": ">=2.1",
     "@dfinity/principal": ">=2.1",
     "simple-cbor": "^0.4.1",
-    "zustand": "4.5.5"
+    "zustand": "5.0.2"
   },
   "peerDependencies": {
     "@dfinity/agent": ">=2.1",
@@ -48,7 +48,7 @@
     "webpack": "^5.96.1"
   },
   "scripts": {
-    "test": "NODE_OPTIONS=\"$NODE_OPTIONS --experimental-vm-modules\" jest",
+    "test": "NODE_OPTIONS=\"--experimental-vm-modules\" npx jest",
     "start": "tsc watch",
     "bundle": "yarn bundle:dev && yarn bundle:prod",
     "bundle:dev": "npx webpack-cli --mode development",

packages/core/src/classes/types.ts

@@ -2,7 +2,7 @@ export * from "./agent/types"
 export * from "./actor/types"
 export * from "./adapter/types"
 
-import { NamedSet } from "zustand/middleware"
+import type { NamedSet } from "zustand/middleware"
 import type { StoreApi } from "zustand"
 
 export interface StoreApiWithDevtools<T> extends StoreApi<T> {

packages/core/src/types.ts

@@ -141,22 +141,24 @@ export type ExtractOk<T> = T extends { Ok: infer U } ? U : never
 // Extract Err type from Result
 export type ExtractErr<T> = T extends { Err: infer E } ? E : never
 
+export type CompiledOkResult<U> = {
+  isOk: true
+  isErr: false
+  value: U
+  error: null
+}
+
+export type CompiledErrResult<E> = {
+  isOk: false
+  isErr: true
+  value: null
+  error: E
+}
+
 // Improved CompiledResult type
 export type CompiledResult<T> = ExtractOkErr<T> extends {
   OkType: infer U
   ErrType: infer E
 }
-  ?
-      | {
-          isOk: true
-          isErr: false
-          value: U
-          error: null
-        }
-      | {
-          isOk: false
-          isErr: true
-          value: null
-          error: E
-        }
+  ? CompiledOkResult<U> | CompiledErrResult<E>
   : never

packages/core/src/utils/helper.ts

@@ -1,15 +1,29 @@
 import { hash, toHex } from "@dfinity/agent"
 import { DevtoolsOptions, devtools } from "zustand/middleware"
-import { createStore } from "zustand/vanilla"
-
-import type { CompiledResult, BaseActor, CandidDefenition, IDL } from "../types"
+import { createStore, StoreApi } from "zustand"
+
+import type {
+  CompiledResult,
+  BaseActor,
+  CandidDefenition,
+  IDL,
+  StoreApiWithDevtools,
+  ExtractOk,
+} from "../types"
 import { createSimpleHash } from "./hash"
 import { LOCAL_HOSTS, REMOTE_HOSTS } from "./constants"
 
+/**
+ * Creates a Zustand store with optional DevTools middleware.
+ *
+ * @param initialState - The initial state of the store.
+ * @param config - Configuration options for DevTools.
+ * @returns A Zustand store with DevTools enabled if configured, otherwise a standard store.
+ */
 export function createStoreWithOptionalDevtools<T>(
   initialState: T,
   config: DevtoolsOptions
-) {
+): StoreApiWithDevtools<T> | StoreApi<T> {
   if (config.withDevtools) {
     return createStore(
       devtools(() => initialState, {
@@ -57,15 +71,31 @@ export const importCandidDefinition = async (
   }
 }
 
+/**
+ * Checks if the current environment is local or development.
+ *
+ * @returns `true` if running in a local or development environment, otherwise `false`.
+ */
 export const isInLocalOrDevelopment = () => {
   return typeof process !== "undefined" && process.env.DFX_NETWORK === "local"
 }
 
+/**
+ * Retrieves the network from the process environment variables.
+ *
+ * @returns The network name, defaulting to "ic" if not specified.
+ */
 export const getProcessEnvNetwork = () => {
   if (typeof process === "undefined") return "ic"
   else return process.env.DFX_NETWORK ?? "ic"
 }
 
+/**
+ * Determines the network type based on the provided hostname.
+ *
+ * @param hostname - The hostname to evaluate.
+ * @returns A string indicating the network type: "local", "remote", or "ic".
+ */
 export function getNetworkByHostname(
   hostname: string
 ): "local" | "remote" | "ic" {
@@ -78,6 +108,12 @@ export function getNetworkByHostname(
   }
 }
 
+/**
+ * Checks if a given IDL function is a query.
+ *
+ * @param func - The IDL function to check.
+ * @returns `true` if the function is a query or composite query, otherwise `false`.
+ */
 export function isQuery(func: IDL.FuncClass): boolean {
   return (
     func.annotations.includes("query") ||
@@ -118,7 +154,12 @@ function toHexString(bytes: ArrayBuffer) {
   return toHex(bytes)
 }
 
-/// Helper function for extracting the value from a compiled result { Ok: T } or { Err: E }
+/**
+ * Helper function for extracting the value from a compiled result { Ok: T } or { Err: E }
+ *
+ * @param result - The compiled result to extract from.
+ * @returns A `CompiledResult` object indicating success or failure.
+ */
 export function createCompiledResult<T>(result: T): CompiledResult<T> {
   if (result && typeof result === "object" && "Ok" in result) {
     return {
@@ -144,3 +185,19 @@ export function createCompiledResult<T>(result: T): CompiledResult<T> {
     } as never
   }
 }
+
+/**
+ * Helper function for extracting the value from a compiled result { Ok: T } or throw the error if { Err: E }
+ *
+ * @param result - The compiled result to extract from.
+ * @returns The extracted value from the compiled result.
+ * @throws The error from the compiled result.
+ */
+export function extractOkResult<T>(result: T): ExtractOk<T> {
+  const compiledResult = createCompiledResult(result)
+  if (compiledResult.isErr) {
+    throw compiledResult.error
+  }
+
+  return compiledResult.value as ExtractOk<T>
+}

packages/core/test/core.call.test.ts

@@ -9,7 +9,7 @@ const ICRC1_CANISTERS = [
   { canisterId: "yfumr-cyaaa-aaaar-qaela-cai", symbol: "ckSepoliaUSDC" },
 ]
 
-export const idlFactory = ({ IDL }) => {
+export const idlFactory = ({ IDL }: any) => {
   return IDL.Service({
     icrc1_symbol: IDL.Func([], [IDL.Text], ["query"]),
   })
@@ -47,7 +47,7 @@ describe("My IC Store and Actions", () => {
   })
 
   it("should return the Symbol for each canister", async () => {
-    for (const canister of ICRC1_CANISTERS) {
+    for await (const canister of ICRC1_CANISTERS) {
       const { dataPromise } = queryCall({
         canisterId: canister.canisterId,
         functionName: "icrc1_symbol",

packages/react/package.json

@@ -36,8 +36,8 @@
   },
   "dependencies": {
     "@ic-reactor/core": "^1.14.2",
-    "zustand": "4.5",
-    "zustand-utils": "^1.3"
+    "zustand": "5.0.2",
+    "zustand-utils": "^1.3.2"
   },
   "peerDependencies": {
     "@dfinity/agent": ">=2.1",
@@ -46,7 +46,7 @@
     "@dfinity/identity": ">=2.1",
     "@dfinity/principal": ">=2.1",
     "react": ">=16.8",
-    "zustand": "4.5"
+    "zustand": ">=5.0.0"
   },
   "gitHead": "36e43368cb0fa3bffa9aa40dfd589046c1c3b5fe",
   "devDependencies": {

yarn.lock

@@ -2024,7 +2024,7 @@ __metadata:
     simple-cbor: "npm:^0.4.1"
     ts-loader: "npm:^9.5.1"
     webpack: "npm:^5.96.1"
-    zustand: "npm:4.5.5"
+    zustand: "npm:5.0.2"
   peerDependencies:
     "@dfinity/agent": ">=2.1"
     "@dfinity/auth-client": ">=2.1"
@@ -22369,7 +22369,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"zustand@npm:4.5, zustand@npm:4.5.5":
+"zustand@npm:4.5":
   version: 4.5.5
   resolution: "zustand@npm:4.5.5"
   dependencies:
@@ -22388,3 +22388,24 @@ __metadata:
   checksum: 10c0/d04469d76b29c7e4070da269886de4efdadedd3d3824dc2a06ac4ff62e3b5877f925e927afe7382de651829872b99adec48082f1bd69fe486149be666345e626
   languageName: node
   linkType: hard
+
+"zustand@npm:5.0.2":
+  version: 5.0.2
+  resolution: "zustand@npm:5.0.2"
+  peerDependencies:
+    "@types/react": ">=18.0.0"
+    immer: ">=9.0.6"
+    react: ">=18.0.0"
+    use-sync-external-store: ">=1.2.0"
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    immer:
+      optional: true
+    react:
+      optional: true
+    use-sync-external-store:
+      optional: true
+  checksum: 10c0/d9bb048d8129fd1aaed3fda974991b15a7c9c31ef06f78e9bf5c4b3678f249850764a6dadb8c93127257d07831995cf7a048281658a37c5d1143ad6f397fe37c
+  languageName: node
+  linkType: hard