qa: Refactor gitlab use

qa/ui/src/lib/components/Header.svelte

@@ -22,7 +22,7 @@
      Row,
  } from 'sveltestrap';
 
- import { auth, version } from '$lib/stores/auth';
+ import { auth, gitlab, version } from '$lib/stores/auth';
 
  export let activemenu = "";
  $: {
@@ -33,17 +33,6 @@
          activemenu = "";
      }
  }
-
- async function rungitlab() {
-     const res = await fetch('api/gitlab/token');
-     if (res.status === 200) {
-         return res.json();
-     } else {
-         throw new Error((await res.json()).errmsg);
-     }
- }
-
- const gitlab = rungitlab();
 </script>
 
 <Navbar color="dark" dark expand="xs">
@@ -101,17 +90,17 @@
         {/if}
     </Nav>
     <Nav class="ms-auto text-light" navbar>
-        {#await gitlab then gl}
+        {#if $gitlab}
             <Icon name="gitlab" />
-        {:catch err}
+        {:else}
             <Button
                 color="warning"
                 size="sm"
-                href="auth/gitlab?next=/"
+                href={"auth/gitlab?next=" + encodeURIComponent($page.url.pathname) }
             >
                 <Icon name="gitlab" /> Connexion GitLab
             </Button>
-        {/await}
+        {/if}
         <NavItem class="ms-2 text-truncate">
 	    v{$version.version}
             {#if $auth}&ndash; Logged as {$auth.name} (team #{$auth.id_team}){/if}

qa/ui/src/lib/components/QAItem.svelte

@@ -4,6 +4,7 @@
  import {
      Alert,
      Button,
+     ButtonGroup,
      Card,
      CardBody,
      CardHeader,
@@ -16,7 +17,7 @@
  import BadgeState from '$lib/components/BadgeState.svelte';
  import DateFormat from '$lib/components/DateFormat.svelte';
  import { getQAComments, QAComment } from '$lib/qa';
- import { auth } from '$lib/stores/auth';
+ import { auth, gitlab } from '$lib/stores/auth';
  import { ToastsStore } from '$lib/stores/toasts';
  import { viewIdx } from '$lib/stores/todo';
 
@@ -150,16 +151,25 @@
      })
  }
 
- async function rungitlab() {
-     const res = await fetch('api/gitlab/token');
-     if (res.status === 200) {
-         return res.json();
-     } else {
-         throw new Error((await res.json()).errmsg);
+ let exportingToGitlab = false;
+ async function exportgitlab() {
+     exportingToGitlab = true;
+     try {
+         const data = await query.export2Gitlab();
+         query.forge_link = data.web_url;
+         query.exported = data.iid;
+         ToastsStore.addToast({
+             color: "success",
+             title: "Retour exporté vers Gitlab !",
+             msg: "Ce retour a bien été exporté vers Gitlab sous la référence #" + query.exported,
+         });
+     } catch (err) {
+         ToastsStore.addErrorToast({
+             msg: err,
+         });
      }
+     exportingToGitlab = false;
  }
-
- const gitlab = rungitlab();
 </script>
 
 {#if query}
@@ -169,14 +179,35 @@
                 <h4 class="card-title fw-bold mb-0">{query.subject}</h4>
                 <div>
                     {#if $auth && !query.solved}
-                        {#await gitlab then gl}
-                            <Button
-                                on:click={() => query.export2Gitlab()}
-                            >
-                                <Icon name="gitlab" />
-                                Exporter vers GitLab
-                            </Button>
-                        {/await}
+                        <ButtonGroup>
+                            {#if query.forge_link}
+                                <Button
+                                    color="warning"
+                                    outline
+                                    size="sm"
+                                    href="{query.forge_link}"
+                                    target="_blank"
+                                >
+                                    <Icon name="gitlab" />
+                                </Button>
+                            {/if}
+                            {#if $gitlab}
+                                <Button
+                                    color="warning"
+                                    outline
+                                    size="sm"
+                                    disabled={exportingToGitlab || query.exported}
+                                    on:click={exportgitlab}
+                                >
+                                    {#if exportingToGitlab}
+                                        <Spinner size="sm" />
+                                    {:else if !query.exported}
+                                        <Icon name="gitlab" />
+                                    {/if}
+                                    Exporter vers GitLab
+                                </Button>
+                            {/if}
+                        </ButtonGroup>
                     {/if}
                     {#if $auth && !query.solved && $viewIdx[query.id_exercice]}
                         <Button on:click={solveQA} color="success">

qa/ui/src/lib/qa.js

@@ -20,7 +20,7 @@ export class QAQuery {
     }
   }
 
-  update({ id, id_exercice, id_team, user, creation, state, subject, solved, closed, exported }) {
+  update({ id, id_exercice, id_team, user, creation, state, subject, solved, closed, exported, forge_link }) {
     this.id = id;
     this.id_team = id_team;
     this.id_exercice = id_exercice;
@@ -31,6 +31,7 @@ export class QAQuery {
     this.solved = solved;
     this.closed = closed;
     this.exported = exported;
+    this.forge_link = forge_link;
   }
 
   async delete() {

qa/ui/src/lib/stores/auth.js

@@ -27,3 +27,30 @@ export const auth = derived(
   version,
   $version => $version.auth,
 );
+
+function createGitlabStore() {
+  const { subscribe, set, update } = writable(null);
+
+  return {
+    subscribe,
+
+    set,
+
+    update,
+
+    refresh: async () => {
+      const res = await fetch('api/gitlab/token', {headers: {'Accept': 'application/json'}});
+      if (res.status === 200) {
+        const token = await res.json();
+        update((m) => token);
+        return token;
+      } else {
+        update((m) => null);
+        return null;
+      }
+    },
+  };
+
+}
+
+export const gitlab = createGitlabStore();

qa/ui/src/routes/+layout.svelte

@@ -9,13 +9,16 @@
 
  import Header from '$lib/components/Header.svelte';
  import Toaster from '$lib/components/Toaster.svelte';
- import { version } from '$lib/stores/auth';
+ import { gitlab, version } from '$lib/stores/auth';
  import { ToastsStore } from '$lib/stores/toasts';
  import { view } from '$lib/stores/todo';
 
  version.refresh();
  setInterval(version.refresh, 30000);
 
+ gitlab.refresh();
+ setInterval(gitlab.refresh, 300000);
+
  view.refresh().catch((err) => {
      ToastsStore.addErrorToast({
          msg: err,