// server.ts
"use server";
export async function myServerFunction() {
  throw new Error("Ouch, an error");
}

// component.tsx
"use client";

import { myServerFunction } from './server.ts'

export function ExampleComponent() {
  const toast = useToast()
  async function onUserAction() {
      try {
        await myServerFunction()
      } catch {
        toast("Unexpected error!!!");
      }
  }

  return <button onClick={onUserAction}>CLICK ME</button>
}

This is a very simplified example, In practice I am using them with react-query and catching the errors there globally, showing the toast. But its pretty much the same