Improve Error Handling (incl. toast notifications)

[mxkaske]

Currently, we provide very little information to the user whenever something goes wrong. Mostly, some generic phrase keys that can be found in @lib/toast.

The goal is to have concrete informations and possibly links to the Docs that we can forward to (see Nextjs example).

We should create a package (@openstatus/error) that can be used on all JS topics, like the API, web, and trpc or react-form-hook (ZodSchema).

The BaseError could be:

type BaseError {
  id: string // unique identify for logging e.g.
  code: ErrorCode, // enum of e.g. "UNAUTHORIZED" | "USAGE_EXCEEDED" ... 
  message: string, // description, can be used for toast notifications or logger
  metadata: Record<string, unknown> // e.g. cause,...
}

We could use the error code to forward the user within the docs like https://docs.openstatus.dev/error-handling#USAGE_EXCEEDED.

API server

In our server api hono application, we can use app.onError(handleError) (see docs) to handle thrown exceptions.

AND we can use defaultHook: handleZodError for the zod-openapi plugin (see docs).

TRPC

Could be either in the @openstatus/api (bad naming as it is about trpc) or within the trpc/edge/[trpc]/route.ts file via:

• All error, before getting send to the client will go through onError method (see docs)