How to throw a 404 inside an element?

[ivands]

Describe the problem

We have our own api client. Not using remote functions.
The reason is caching, and calling our API inside a remote function would just add an extra network call to every api request.

But it's unclear how to throw a 404 inside our own client when a resource is not found.
So that SvelteKit knows to render the 404 page.
I did find a way to do this with remote functions.
But how can we do this using only "async svelte" and our own API client?

Describe the proposed solution

I can't find any docs on how to do this.
Would be nice if we had some docs on how to solve this problem.

Alternatives considered

No response

Importance

i cannot use SvelteKit without it

Additional Information

No response

[sacrosanctic]

But how can we do this using only "async svelte" and our own API client?

redirect to /404

Or you want to handle the error gracefully, then consider https://svelte.dev/docs/svelte/svelte-boundary

[ivands]

@sacrosanctic I'm still confused.
How can we redirect during rendering inside a component?
Cause the problem is that rendering happens client & server side.
Also, I don't really wanna redirect.
I wanna stop the rendering and show the 404 error page.
Just like when you throw a 404 error inside a remote function.

[ivands]

Example:

<script>
const post = await getPost() // not a remote function
if(!post) {
 // What now?
}
</script>
<h1>{post.title}</h1>

[teemingc]

In SvelteKit 3 you should be able to throw your own Error object and handle that in a client-side handleError https://next.svelte.dev/docs/kit/errors#Unknown-errors
SvelteKit 3 also uses +error.svelte pages for errors thrown during async rendering https://next.svelte.dev/docs/kit/errors#Error-boundaries

[sacrosanctic]

<script>
	const getName = async () => {
		throw new Error('bleh')
		return 'hi'
	}
</script>

<svelte:boundary>
	{#snippet failed(error)}
		{error}
	{/snippet}

	{await getName()}
</svelte:boundary>

REPL

Alongside what teemingc said, you'll get better hooks in sk3. It the pattern is more or less the same now.