<script lang="ts">
 import { goto } from '$app/navigation';

 import { user } from '../stores/user';
 import DateFormat from '../components/DateFormat.svelte';
 import SurveyBadge from '../components/SurveyBadge.svelte';
 import SubmissionStatus from '../components/SubmissionStatus.svelte';
 import { getSurveys } from '../lib/surveys';
 import { getScore } from '../lib/users';

 export let allworks = false;

 let req_surveys = getSurveys(allworks);
 export let direct = null;

 req_surveys.then((surveys) => {
     for (const survey of surveys) {
         if (survey.direct != null) {
             direct = survey;
         }
     }
 });

 function gotoSurvey(survey) {
     if (survey.kind === "w") {
         goto(`works/${survey.id}`);
     } else if (survey.direct != null) {
         goto(`surveys/${survey.id}/live`);
     } else if ($user.is_admin) {
         goto(`surveys/${survey.id}/responses`);
     } else {
         goto(`surveys/${survey.id}`);
     }
 }
</script>

<table class="table table-striped table-hover mb-0">
  <thead>
    <tr>
      <th>Intitulé</th>
      <th>Date</th>
      {#if $user}
          <th>Score</th>
      {/if}
    </tr>
  </thead>
  {#await req_surveys}
      <tr>
          <td colspan="5" class="text-center py-3">
              <div class="spinner-border mx-3" role="status"></div>
              <span>Chargement des questionnaires &hellip;</span>
          </td>
      </tr>
  {:then surveys}
      <tbody style="cursor: pointer;">
          {#each surveys as survey, sid (survey.kind + survey.id)}
              {#if (survey.shown || survey.direct == null || ($user && $user.is_admin)) && (!$user || (!$user.was_admin || $user.promo == survey.promo) || $user.is_admin)}
                  {#if $user && $user.is_admin && (sid == 0 || surveys[sid-1].promo != survey.promo)}
                      <tr class="bg-info text-light">
                          <th colspan="5" class="fw-bold">
                              {survey.promo}
                          </th>
                      </tr>
                  {/if}
                  <tr on:click={e => gotoSurvey(survey)}>
                      <td>
                          {#if !survey.shown}<i class="bi bi-eye-slash-fill" title="Ce questionnaire n'est pas affiché aux étudiants"></i>{/if}
                          {survey.title}
                          {#if survey.group}<span class="badge bg-secondary">{survey.group}</span>{/if}
                          {#if $user && survey.kind === "w" && survey.startAvailability() < Date.now()}
                              <SubmissionStatus work={survey} />
                          {/if}
                          <SurveyBadge {survey} class="float-end" />
                      </td>
                      {#if survey.startAvailability() > Date.now()}
                          <td title="Disponible à partir du {survey.start_availability}">
                              <DateFormat date={survey.start_availability} dateStyle="medium" timeStyle="medium" />
                              <i class="bi bi-arrow-bar-right"></i>
                          </td>
                      {:else}
                          <td title="Sera fermé le {survey.start_availability}">
                              <i class="bi bi-arrow-bar-left"></i>
                              <DateFormat date={survey.end_availability} dateStyle="medium" timeStyle="medium" />
                          </td>
                      {/if}
                      {#if $user}
                          {#if !survey.corrected}
                              <td>N/A</td>
                          {:else}
                              <td>
                                  {#await getScore(survey)}
                                      <div class="spinner-border spinner-border-sm" role="status"></div>
                                  {:then score}
                                      {score.score}
                                  {:catch error}
                                      <i class="bi text-warning bi-exclamation-triangle-fill" title={error}></i>
                                  {/await}
                              </td>
                          {/if}
                      {/if}
                  </tr>
              {/if}
          {/each}
      </tbody>
  {/await}
  {#if $user && $user.is_admin}
      <tfoot>
          <tr>
              <td colspan="4">
	          <a href="surveys/new" class="btn btn-sm btn-primary">Ajouter un questionnaire</a>
              </td>
          </tr>
      </tfoot>
  {/if}
</table>
