<script>
    import Register from "./account/Register.svelte";
    import Login from "./account/Login.svelte";
    import Verify from "./account/Verify.svelte";
    import Profile from "./account/Profile.svelte";
    import {setContext} from "svelte";

    const components = {
        register: Register,
        login: Login,
        verify: Verify,
        profile: Profile,
    };

    export let title;
    export let view;
    export let user;
    export let data;
    export let channel;

    setContext("channel", channel);
    setContext("user", user);
</script>
<div style="text-align: center;background: var(--p20);padding: 20px;color: var(--p90)">
    <h1><a class="text-decoration-none" href="{channel.lucentUrl}">{channel.name ?? "Lucent Setup"}</a></h1>
</div>
<div>
    <svelte:component this={components[view]} {title} {...data}/>
</div>

