Result Types Demo

In Motoko and Rust, it’s common to return a Result<T, E> variant. IC Reactor automatically unwraps these variants, providing a standard Ok value or throwing a typed CanisterError for Err values.

Features Demonstrated

• Automatic Unwrapping: Access data directly as the Ok value.
• Error Handling: Err values from the canister are caught and presented as error.
• Recursive Variants: Handling nested systems of results and variants.
• Type Safety: Full TypeScript support for both success and error branches.

Links

Open in StackBlitz Edit and run in your browser

View on GitHub Browse the source code

Live Preview

Implementation

When calling a method that returns a Result:

function MyComponent() {
  const { data, error, isError } = useActorQuery({
    functionName: "get_user_profile",
    args: [userId],
  })

  // data contains the 'Ok' value if successful
  // error contains the 'Err' value if the canister returned an error

  if (isError) {
    return <div>Error: {error.message}</div>
  }

  return <div>Welcome, {data.username}</div>
}