feat(about): adds info per corpus

src/components/AppHeader.vue

@@ -3,6 +3,7 @@
     <router-link to="/">
       <img alt="logo" class="logo" src="@/assets/logo.png" />
     </router-link>
+    <span class="is-title has-text-weight-semibold is-size-4 has-text-success ml-1">Beta</span>
   </div>
 </template>
 
@@ -29,6 +30,7 @@
 
 @media screen and (min-width: 992px) {
   .app-header {
+    display: flex;
     margin-left: 2rem;
     margin-bottom: 0rem;
   }

src/components/__tests__/__snapshots__/AppHeader.test.ts.snap

@@ -12,5 +12,11 @@ exports[`AppHeader > renders properly 1`] = `
     replace="false"
     to="/"
   />
+  <span
+    class="is-title has-text-weight-semibold is-size-4 has-text-success ml-1"
+    data-v-48a13218=""
+  >
+    Beta
+  </span>
 </div>
 `;

src/localisation/en.ts

@@ -170,6 +170,16 @@ export const en = {
     en: 'English'
   },
   landing: {
+    sourceNameTitle: 'Resource Name',
+    sourceUrlTitle: 'Resource Link',
+    sourceNumberTitle: 'Number of Documents',
+    sourcesTitle: 'About Our Resources',
+    sourcesDescription_1:
+      'WeLearn brings together open, reliable, and high-quality resources, all related to the Sustainable Development Goals (SDGs), drawn from the analysis of over 16 million online documents.',
+    sourcesDescription_2:
+      'Resources are selected based on three criteria: openness (open-access documents), reliability (recognized collections), and relevance, using a classification model that retains only content linked to one of the 17 SDGs.',
+    sourcesDescription_3: 'The table below shows the distribution of documents by source:',
+
     slogan: 'Sustainability Education Made Easy',
     description:
       'Explore resources, learn, and boost sustainability integration in your courses with AI.',
@@ -182,7 +192,7 @@ export const en = {
       section_one: {
         title: 'Curated Knowledge on Sustainability',
         content:
-          'Carefully selected from over 10 million resources, WeLearn features open and reliable content related to the Sustainable Development Goals (SDGs).'
+          'Carefully selected from over 16 million resources, WeLearn features open and reliable content related to the Sustainable Development Goals (SDGs).'
       },
       section_two: {
         title: 'Find What Matters, Fast',

src/localisation/fr.ts

@@ -174,6 +174,16 @@ export const fr = {
     en: 'Anglais'
   },
   landing: {
+    sourceNameTitle: 'Nom de la resource',
+    sourceUrlTitle: 'Lien vers la resource',
+    sourceNumberTitle: 'Nombre de documents',
+    sourcesTitle: 'A propos de nos resources',
+    sourcesDescription_1:
+      'WeLearn rassemble des ressources ouvertes, fiables et de haute qualité, toutes liées aux Objectifs de développement durable (ODD), issues de l’analyse de plus de 16 millions de documents en ligne.',
+    sourcesDescription_2:
+      'Les ressources sont sélectionnées selon trois critères : l’ouverture (documents en libre accès), la fiabilité (collections reconnues) et la pertinence, grâce à un modèle de classification qui ne retient que les contenus liés à l’un des 17 ODD.',
+    sourcesDescription_3:
+      'Le tableau ci-dessous présente la répartition des documents par source :',
     slogan: 'L’éducation à la durabilité, facilitée',
     description:
       'Explorez des ressources, apprenez et renforcez l’intégration de la durabilité dans vos cours avec l’IA.',
@@ -186,7 +196,7 @@ export const fr = {
       section_one: {
         title: 'Connaissances sur la durabilité',
         content:
-          'Sélectionnés avec soin parmi plus de 10 millions de ressources, WeLearn propose des contenus ouverts et fiables liés aux Objectifs de développement durable (ODD).'
+          'Sélectionnés avec soin parmi plus de 16 millions de ressources, WeLearn propose des contenus ouverts et fiables liés aux Objectifs de développement durable (ODD).'
       },
       section_two: {
         title: 'Trouver ce qui compte, rapidement',

src/stores/sources.ts

@@ -6,6 +6,8 @@ import i18n from '@/localisation/i18n';
 
 export const useSourcesStore = defineStore('sources', () => {
   const sourcesList = ref<ReducedCorpus[]>([]);
+  const infoPerCorpus: Ref<[]> = ref([]);
+  const totalInQdrant: Ref<number> = ref(0);
   async function getSourcesList() {
     if (sourcesList.value.length > 0) {
       return;
@@ -35,6 +37,24 @@ export const useSourcesStore = defineStore('sources', () => {
 
   const totalDocs: Ref<number> = ref(0);
 
+  const getInfoPerCorpus = async () => {
+    if (infoPerCorpus.value.length > 0) {
+      return;
+    }
+    try {
+      const response = await getAxios('/metric/nb_docs_info_per_corpus');
+      infoPerCorpus.value = response;
+      const totalDocsInQdrant = response.reduce((acc, curr) => {
+        acc = acc + curr.qty_in_qdrant;
+        return acc;
+      }, 0);
+      totalInQdrant.value = totalDocsInQdrant;
+    } catch {
+      console.error('unable to get info per corpus');
+      infoPerCorpus.value = [];
+    }
+  };
+
   const getNbDocsInBase = async () => {
     if (totalDocs.value > 0) {
       return;
@@ -43,5 +63,13 @@ export const useSourcesStore = defineStore('sources', () => {
     const flooredNb = Math.floor(response.nb_docs / 100) * 100;
     totalDocs.value = new Intl.NumberFormat(i18n.global.locale.value).format(flooredNb);
   };
-  return { totalDocs, getNbDocsInBase, getSourcesList, sourcesList };
+  return {
+    totalInQdrant,
+    infoPerCorpus,
+    getInfoPerCorpus,
+    totalDocs,
+    getNbDocsInBase,
+    getSourcesList,
+    sourcesList
+  };
 });

src/stores/tutor.ts

@@ -111,7 +111,6 @@ export const useTutorStore = defineStore('tutor', () => {
       const resp = await postAxios('/tutor/files/content', formData, {
         headers: { 'content-type': 'multipart/form-data' }
       });
-      console.log(resp);
       if (resp.status === 204) {
         shouldRetryAction.value = true;
         throw new Error('retry getFilesContent');
@@ -125,6 +124,7 @@ export const useTutorStore = defineStore('tutor', () => {
         isLoading.value = false;
       }
     } catch (error: any) {
+      shouldRetryAction.value = true;
       throw new Error(error);
     }
   };

src/views/AboutPage.vue

@@ -1,3 +1,14 @@
+<script setup lang="ts">
+import { useSourcesStore } from '@/stores/sources';
+import { onBeforeMount } from 'vue';
+import i18n from '@/localisation/i18n';
+
+const sourcesStore = useSourcesStore();
+
+onBeforeMount(() => {
+  sourcesStore.getInfoPerCorpus();
+});
+</script>
 <template>
   <div class="wrapper py-6">
     <div class="presentation is-flex is-fullwidth is-justify-content-center is-align-items-center">
@@ -8,14 +19,6 @@
         <p class="subtitle has-text-centered mt-4 mb-6">
           {{ $t('landing.description') }}
         </p>
-
-        <!-- <div class="is-flex mb-6 is-justify-content-space-around is-align-items-center"> -->
-        <!--   <p class="is-size-5 has-text-weight-semibold">+ 5 000 000 documents traités</p> -->
-        <!--   <p class="is-size-5 has-text-weight-semibold">+ {{ totalDocs }} documents retenus</p> -->
-        <!--   <p class="is-size-5 has-text-weight-semibold"> -->
-        <!--     À partir de{{ sourcesList.length }} corpus -->
-        <!--   </p> -->
-        <!-- </div> -->
       </div>
     </div>
 
@@ -36,6 +39,54 @@
       </p>
     </div>
 
+    <div class="section mt-6" v-if="sourcesStore?.infoPerCorpus?.length > 0">
+      <div class="description mx-auto">
+        <h1 class="subtitle has-text-weight-bold mb-2">{{ $t('landing.sourcesTitle') }} ></h1>
+        <p class="subtitle is-size-6">
+          {{ $t('landing.sourcesDescription_1') }}
+        </p>
+        <p class="subtitle is-size-6">
+          {{ $t('landing.sourcesDescription_2') }}
+        </p>
+        <p class="subtitle is-size-6 pb-2">
+          {{ $t('landing.sourcesDescription_3') }}
+        </p>
+        <div class="table-wrapper">
+          <table class="sources-table">
+            <thead>
+              <tr>
+                <th>{{ $t('landing.sourceNameTitle') }}</th>
+                <th>{{ $t('landing.sourceUrlTitle') }}</th>
+                <th class="qty-sources">{{ $t('landing.sourceNumberTitle') }}</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr v-for="source in sourcesStore.infoPerCorpus" :key="source.corpus">
+                <td>{{ $t(`corpus.${source.corpus}`, source.corpus) }}</td>
+                <td>
+                  <a target="_blanc" :href="source.url">{{ source.url }}</a>
+                </td>
+                <td class="qty-sources">
+                  {{ new Intl.NumberFormat(i18n.global.locale.value).format(source.qty_in_qdrant) }}
+                </td>
+              </tr>
+            </tbody>
+            <tfoot>
+              <tr>
+                <th colspan="2" scope="row">Total</th>
+                <th>
+                  {{
+                    new Intl.NumberFormat(i18n.global.locale.value).format(
+                      sourcesStore.totalInQdrant
+                    )
+                  }}
+                </th>
+              </tr>
+            </tfoot>
+          </table>
+        </div>
+      </div>
+    </div>
     <div class="section mt-6">
       <div class="is-flex is-fullwidth is-justify-content-space-evenly">
         <div class="description">
@@ -101,6 +152,32 @@
 </template>
 
 <style scoped>
+.sources-table th {
+  text-align: left;
+  padding-left: 0;
+}
+
+.sources-table td {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.sources-table .qty-sources {
+  text-align: right;
+}
+
+.sources-table tfoot th {
+  padding-top: 1rem;
+  border-top: 1px solid black;
+  padding-left: 0;
+  padding-right: 0;
+  text-align: right;
+}
+
+.sources-table {
+  width: 100%;
+}
+
 .wrapper {
   width: 100%;
 }