atsebay.t/ui/src/routes/users/[uid]/surveys/[sid].svelte

<script context="module">
 export async function load({ params }) {
     return {
         props: {
             sid: params.sid,
             uid: params.uid,
         }
     };
 }
</script>

<script lang="ts">
 import SurveyBadge from '$lib/components/SurveyBadge.svelte';
 import SurveyQuestions from '$lib/components/SurveyQuestions.svelte';
 import { getSurvey } from '$lib/surveys';
 import { getQuestions } from '$lib/questions';
 import { getUser } from '$lib/users';

 export let sid;
 export let uid;
</script>

{#await getUser(uid)}
    <h2>
        Étudiant
    </h2>

    <div class="d-flex justify-content-center">
        <div class="spinner-border me-2" role="status"></div>
        Chargement des d&eacute;tails&hellip;
    </div>
{:then student}
    {#await getSurvey(sid)}
        <div class="text-center">
            <div class="spinner-border text-primary mx-3" role="status"></div>
            <span>Chargement du questionnaire &hellip;</span>
        </div>
    {:then survey}
        <div class="d-flex align-items-center">
            <h2>
                <a href="users/{student.id}/surveys/" class="text-muted" style="text-decoration: none">{student.login}</a> /
                {survey.title}
            </h2>
            <SurveyBadge class="ms-2" {survey} />
        </div>

        {#await getQuestions(survey.id)}
            <div class="text-center">
                <div class="spinner-border text-primary mx-3" role="status"></div>
                <span>Chargement des questions &hellip;</span>
            </div>
        {:then questions}
            <SurveyQuestions {survey} {questions} id_user={uid} />
        {/await}
    {:catch error}
        <div class="text-center">
            <h2>
                <a href="surveys/" class="text-muted" style="text-decoration: none">&lt;</a>
                Questionnaire introuvable
            </h2>
            <span>{error}</span>
        </div>
    {/await}
{/await}