webapp/simple/DISCOllaborative: add plural

webapp/src/components/home/GetStarted.vue

@@ -20,9 +20,9 @@
     >
       <template #title>
         Train a model and contribute to existing
-        <span title="Click Explore to learn more on DISCOllaboratives"
-          ><DISCOllaborative />s</span
-        >
+        <span title="Click Explore to learn more on DISCOllaboratives">
+          <DISCOllaboratives />
+        </span>
       </template>
     </ButtonsCard>
 
@@ -32,7 +32,7 @@
       :buttons="List.of(['create', goToNewTaskCreationForm])"
     >
       <template #title>
-        Add your own ML problem to the list of <DISCOllaborative />s
+        Add your own ML problem to the list of <DISCOllaboratives />
       </template>
     </ButtonsCard>
   </div>
@@ -43,7 +43,7 @@ import { useRouter } from "vue-router";
 import { List } from "immutable";
 
 import DISCO from "@/components/simple/DISCO.vue";
-import DISCOllaborative from "@/components/simple/DISCOllaborative.vue";
+import DISCOllaboratives from "@/components/simple/DISCOllaboratives.vue";
 import ButtonsCard from "@/components/containers/ButtonsCard.vue";
 
 const router = useRouter();

webapp/src/components/information/Tutorial.vue

@@ -27,7 +27,7 @@
         </div>
       <div class="flex flex-wrap items-center justify-center space-x-8">
         <CustomButton @click="router.push('/list')" class="mb-2">
-          explore <DISCOllaborative />
+          explore <DISCOllaboratives />
         </CustomButton>
         <CustomButton @click="router.push('/create')" class="mb-2">
           create your own task
@@ -46,6 +46,7 @@ import { useInformationStore } from '@/store/information'
 import IconCard from '@/components/containers/IconCard.vue'
 import CustomButton from '@/components/simple/CustomButton.vue'
 import DISCOllaborative from '@/components/simple/DISCOllaborative.vue'
+import DISCOllaboratives from '@/components/simple/DISCOllaboratives.vue'
 
 const router = useRouter()
 const informationStore = useInformationStore()

webapp/src/components/pages/TaskList.vue

@@ -21,19 +21,19 @@
       >
         <IconCard class="justify-self-center w-full">
         <template #title>
-          What are <DISCOllaborative/>s?
+          What are <DISCOllaboratives />?
         </template>
           <template #icon>
             <Tasks/>
           </template>
           <template #content>
-            <DISCOllaborative/> are machine learning tasks, such as diagnosing COVID from ultrasounds or classifying hand written digits, that users can join to train and contribute to with their own data. To give you a sense of <DISCO />, we pre-defined some tasks
-          along with some example datasets. The end goal is for users to create their own custom <DISCOllaborative/> and collaboratively train machine learning models.
+            <DISCOllaboratives /> are machine learning tasks, such as diagnosing COVID from ultrasounds or classifying hand written digits, that users can join to train and contribute to with their own data. To give you a sense of <DISCO />, we pre-defined some tasks
+          along with some example datasets. The end goal is for users to create their own custom <DISCOllaborative /> and collaboratively train machine learning models.
           <br>By participating to a task, you can either choose to train a model with your own data only or join a collaborative training session with other users.
           If you want to bring your own collaborative task into <DISCO />, you can do so by <button
             class="text-blue-400"
             @click="goToCreateTask()"
-          >creating a new <DISCOllaborative/></button>.
+          >creating a new <DISCOllaborative /></button>.
           <br/><br/> <b>The data you connect is only used locally and is never uploaded or shared with anyone. Data always stays on your device.</b>
           </template>
         </IconCard>
@@ -84,6 +84,7 @@ import IconCard from '@/components/containers/IconCard.vue'
 import DISCO from '@/components/simple/DISCO.vue'
 import Tasks from '@/assets/svg/Tasks.vue'
 import DISCOllaborative from '@/components/simple/DISCOllaborative.vue'
+import DISCOllaboratives from '@/components/simple/DISCOllaboratives.vue'
 
 const router = useRouter()
 const trainingStore = useTrainingStore()

webapp/src/components/simple/DISCOllaboratives.vue

@@ -0,0 +1,5 @@
+<template><DISCOllaborative />s</template>
+
+<script setup lang="ts">
+import DISCOllaborative from "./DISCOllaborative.vue";
+</script>