atsebay.t/ui/src/routes/+layout.svelte

<script>
 import AuthButton from '$lib/components/AuthButton.svelte';
 import Toaster from '$lib/components/Toaster.svelte';
 import { refresh_auth, user } from '$lib/stores/user';

 export let data;

 function switchAdminMode() {
     var tmp = $user.is_admin;
     $user.is_admin = $user.was_admin || false;
     $user.was_admin = tmp;
 }

 function disconnectCurrentUser() {
     fetch('api/auth/logout', {
         method: 'POST'
     }).then((response) => {
	 refresh_auth();
     });
 }

 let isSRS = false;
 $: {
     isSRS = window.location.host === 'srs.nemunai.re' || ($user && ($user.groups.includes('ing-srs') || $user.groups.includes('teachers')))
 }
</script>

<svelte:head>
    <title>ЕРІТА: MCQ and others courses related stuff</title>
</svelte:head>

{#if $user && $user.banner}
    <div class="bg-danger text-white text-center py-1 fw-bolder">
        {$user.banner}
    </div>
{/if}
{#if isSRS}
    <div style="position: fixed; bottom: 20px; right: 20px; z-index: -1; background-image: url('img/srstamps.png'); background-size: cover; width: 125px; height: 125px;"></div>
{/if}
<nav class="navbar navbar-expand-sm navbar-dark bg-primary">
    <div class="container">
        <a class="navbar-brand" href=".">
	   ЕРІТА
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#loggedMenu" aria-controls="loggedMenu" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="loggedMenu">
	    <ul class="navbar-nav mr-auto">
	        <li class="nav-item">
                    {#if $user && $user.promo != $user.current_promo}
                        <a class="nav-link" href="adlin/{$user.promo}" target="_self">AdLin</a>
                    {:else}
                        <a class="nav-link" href="adlin" target="_self">AdLin</a>
                    {/if}
                </li>
                {#if isSRS}
	            <li class="nav-item">
                        <a class="nav-link" href="fic" target="_self">FIC</a>
                    </li>
                {/if}
	        <li class="nav-item">
                    <a class="nav-link" class:active={data.rroute === 'surveys'} href="surveys">
                        Questionnaires
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" class:active={data.rroute === 'works'} href="works">
                        Travaux
                    </a>
                </li>
                {#if $user && $user.is_admin}
                    <li class="nav-item"><a class="nav-link" class:active={data.rroute === 'users'} href="users">Étudiants</a></li>
                {/if}
	        <li class="nav-item">
                    {#if $user && $user.promo != $user.current_promo}
                        <a class="nav-link" href="virli/{$user.promo}" target="_self">VIRLI</a>
                    {:else}
                        <a class="nav-link" href="virli" target="_self">VIRLI</a>
                    {/if}
                </li>
	    </ul>

	    <ul class="navbar-nav ms-auto">
                {#if $user}
                    {#if $user.was_admin}
                        <li class="nav-item">
                            <button class="btn btn-dark" on:click={switchAdminMode}>
	                        Vue admin
	                    </button>
                        </li>
                    {:else if $user.is_admin}
                        <li class="nav-item">
                            <button class="btn btn-light" on:click={switchAdminMode}>
	                        Vue étudiant
	                    </button>
                        </li>
                    {/if}
	            <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#nav" role="button" aria-expanded="false">
                            <img class="rounded-circle" src="//photos.cri.epita.fr/square/{$user.login}" alt="Menu" style="margin: -0.75em 0; max-height: 2.5em; border: 2px solid white;">
                        </a>
                        <ul class="dropdown-menu dropdown-menu-end">
	                    <li><a class="dropdown-item" class:active={data.rroute === 'keys'} href="keys">Clef PGP</a></li>
	                    <li><a class="dropdown-item" class:active={data.rroute === 'bug-bounty'} href="bug-bounty">Bug Bounty</a></li>
                            <li><hr class="dropdown-divider"></li>
                            <li>
                                <button class="dropdown-item" on:click={disconnectCurrentUser}>
	                            Se déconnecter
	                        </button>
                            </li>
                        </ul>
                    </li>
                {:else if $user === undefined}
                    <li class="nav-item">
                        <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
                    </li>
                {:else}
                    <li class="nav-item">
                        <AuthButton class="btn btn-dark">
                            Se connecter
                        </AuthButton>
                    </li>
                {/if}
	    </ul>
        </div>
    </div>
</nav>

<div class="container mt-3">
    <slot></slot>
</div>

<Toaster />