<script lang="ts">
    import TextBlock from "layout/TextBlock.svelte";
import { type FSNavigator } from "./FSNavigator";
import { onMount } from "svelte";
import { breadcrumbs_store } from "wrap/BreadcrumbStore";

let {
	nav
}: {
	nav: FSNavigator;
} = $props();

onMount(() => {
	return nav.subscribe(nav => {
		breadcrumbs_store.set(breadcrumbs)
	})


})
</script>

{#snippet breadcrumbs()}
	{$nav.navigation_error}
{/snippet}

<TextBlock>
	{#if $nav.navigation_error === "not_found" || $nav.navigation_error === "path_not_found"}
		<h1>Page not found</h1>
		<p>
			This page could not be found.
		</p>
	{:else if $nav.navigation_error === "permission_denied" || $nav.navigation_error === "forbidden"}
		<h1>Permission denied</h1>
		<p>
			You are not allowed to access this resource.
		</p>
	{:else if $nav.navigation_error === "unavailable_for_legal_reasons"}
		<h1>Unavailable for legal reasons</h1>
		<p>
			This content has been removed for breaking the law.
		</p>
	{:else if $nav.navigation_error === "out_of_transfer"}
		<h1>Traffic limit exceeded</h1>
		<p>
			The host user has exceeded the traffic limit of their subscription.
			They need to upgrade to a higher subscription tier.
		</p>
	{:else}
		<h1>Unknown error code</h1>
		<p>
			{$nav.navigation_error}
		</p>
	{/if}
</TextBlock>
