<script>
import '$/config/i18n';
+
import { isLoading } from 'svelte-i18n';
+ import { _ } from 'svelte-i18n';
+
+ import { forums } from '$/stores/forums';
+
+ import ErrorBlock from '$/components/error_block/error_block.svelte';
import ForumList from '$/components/forum_list/forum_list.svelte';
import Header from '$/components/header/header.svelte';
import Loader from '$/components/loader/loader.svelte';
<main>
<slot />
</main>
- <ForumList />
+ <nav title={$_('forum_list.title')}>
+ {#if $forums.loading}
+ <Loader />
+ {/if}
+ {#if $forums.error}
+ <ErrorBlock message={$_('forum_list.error.unavailable')} />
+ {/if}
+ {#if $forums.data}
+ <ForumList forums={$forums.data} />
+ {/if}
+ </nav>
<Footer />
{/if}
+
+<style>
+ nav {
+ grid-column: col-start 1;
+ grid-row: 2;
+ border-right: 1px solid black;
+ }
+</style>