Handling errors from an effect in a React Router loader function can be a bit tricky, especially ...

export async function loader() {
    const res = await RuntimeServer.runPromise(
          FooService.getFoo // Effect<number, FooError | BarError>
                            // getFoo returns an error randomly
    );

    return res; // number
}

export default function Home() {
    const res = useLoaderData<typeof loader>(); // number

    return (
        <div>
            hello world <pre>{res + 42}</pre>
        </div>
    );
}