ICP JS SDK 3 support for ic-use-internet-identity and ic-use-actor

Developers
1

Hi! I just published new versions of ic-use-internet-identity and ic-use-actor. These two libraries aim to make the lives of React developers building ICP apps as pleasant as possible.

The updates bring compatibility with the newly released ICP JavaScript SDK v3. In addition, they introduce some breaking changes designed to make the hooks more flexible and easier to use.

:information_source: Note: These are **not official DFINITY libraries**, but open-source packages published under my personal account.

AI generated release notes below :backhand_index_pointing_down:

ic-use-internet-identity v0.4.0

A hook that makes it easy to integrate Internet Identity into your React application. It gives you full reactivity and access to the signed-in identity across all components of a React application.

Version 0.4.0 is a major update that improves developer experience, consistency, and error handling across the board.

Highlights

  • Renamed API surfaces for better clarity:

    • loginStatus → status, loginError → error, and others.
    • Context interface renamed to InternetIdentityContext.

  • New status value: "initializing" makes it easier to handle the startup state in your UI.

  • Simplified API:

    • login() and clear() now return void (no more await needed).
    • All AuthClientLoginOptions are supported directly.

  • Improved error handling: All errors now go through state, making it easier to react to login failures in the UI.

  • Better defaults: Uses https://identity.ic0.app as the default identity provider—no config needed to get started.

  • Modernized under the hood:

    • Updated to ICP JS SDK v3 and latest xstate/store.
    • Improved TypeScript types and reduced boilerplate.

  • New docs: Updated README with real-world examples, troubleshooting tips, and status flow explanations.

ic-use-actor v0.2.0-beta.1

Simplifies communication from a React-based frontend with an ICP-based backend. It features support for multiple canisters, fully typed canister interfaces, simple setup without provider components, etc.

Since the breaking changes are quite significant, I publish this library as a beta version to begin with, happy to hear any feedback on the new interface design before publishing without the beta tag.

This release brings a complete redesign of the library’s API to make interacting with Internet Computer canisters in React apps more streamlined and flexible.

Highlights

  • No more providers: React Context and ActorProvider are gone. Just call a hook.
  • New API: Use createActorHook() to create fully typed hooks for your canisters.
  • Anonymous-by-default: Actors initialize immediately with an anonymous agent, so unauthenticated calls “just work”.
  • Authentication support: Use .authenticate(identity) when you’re ready to sign in.
  • Interceptor support: Cleanly separate request/response logic with setInterceptors().

Quick Example

import { createActorHook } from "ic-use-actor";
import { canisterId, idlFactory } from "./declarations/my_canister";
import { _SERVICE } from "./declarations/my_canister/my_canister.did";

export const useMyCanister = createActorHook<_SERVICE>({
  canisterId,
  idlFactory,
});

:seedling:

4 Likes