<script>
 import {
     Alert,
     Col,
     Container,
     Row,
 } from 'sveltestrap';

 import MyExercices from '$lib/components/MyExercices.svelte';
 import MyTodo from '$lib/components/MyTodo.svelte';
 import TableOverview from '$lib/components/TableOverview.svelte';
 import { auth } from '$lib/stores/auth';
 import { exercices } from '$lib/stores/exercices';
 import { themes } from '$lib/stores/themes';

 if ($exercices.length == 0) {
     exercices.refresh();
 }
 if ($themes.length == 0) {
     themes.refresh();
 }
</script>

{#if $auth && $auth.is_manager}
    <Container fluid class="d-flex flex-fill">
        <TableOverview />
    </Container>
{:else}
    <Container class="mt-2 mb-5">
        <Alert color="dark" fade={false}>
            <h4>Utilisation de la plate-forme de QA</h4>
            <p>
                Vous trouverez ci-dessous une liste d'étapes à tester.
                Répartissez-vous le travail.
                Dès que vous rencontrez une erreur ou quelque chose qui ne vous semble pas clair, remontez-le en ajoutant un commentaire à l'étape.<br>
                Lorsque vous avez terminé une étape, notez-le en ajoutant un commentaire indiquant comment vous avez trouvé l'étape.
            </p>
            <p class="mb-0">
                En parallèle, vous recevrez des commentaires des autres groupes. Suivez leurs requêtes et répondez à leurs attentes autant que possible.
            </p>
        </Alert>
        <Row>
            <Col>
            <MyTodo />
            </Col>
            <Col>
            <MyExercices />
            </Col>
        </Row>
    </Container>
{/if}
