feat: auto generate translations (#288)

* add cloud translation api package

* feat: Script that auto generates translations for other languages

* add comments

* fix: broken translation

* improve translation

* update locck file

* clean up

* all round trasnlations check

* checkpoint

* finish up

* move to dev dependencies

* fix vercel build error

---------

Co-authored-by: Rotimi Best <best@classroomio.com>

apps/dashboard/src/routes/lms/community/[slug]/+page.svelte

@@ -24,6 +24,7 @@
   import { calDateDiff } from '$lib/utils/functions/date';
   import { browser } from '$app/environment';
   import { fetchCourses } from '$lib/components/Courses/api.js';
+  import { t } from '$lib/utils/functions/translations.js';
 
   export let data;
   const { slug } = data;
@@ -385,7 +386,8 @@
   {:else}
     <div class="py-10 px-5">
       <a class="text-gray-500 dark:text-white text-md flex items-center" href={`/lms/community`}>
-        <ArrowLeftIcon size={24} class="carbon-icon dark:text-white" /> Go Back
+        <ArrowLeftIcon size={24} class="carbon-icon dark:text-white" />
+        {$t('community.ask.go_back')}
       </a>
       <div class="my-5 flex justify-between items-center">
         {#if isEditMode}
@@ -472,7 +474,7 @@
       </div>
 
       <div class="my-8 font-bold">
-        {pluralize('answers', question.totalComments, true)}
+        {pluralize($t('community.answers'), question.totalComments, true)}
       </div>
 
       {#each question.comments as comment}

apps/dashboard/src/routes/org/[slug]/community/[slug]/+page.svelte

@@ -388,7 +388,8 @@
         class="text-gray-500 dark:text-white text-md flex items-center"
         href={`${$currentOrgPath}/community`}
       >
-        <ArrowLeftIcon size={24} class="carbon-icon dark:text-white" /> Go Back
+        <ArrowLeftIcon size={24} class="carbon-icon dark:text-white" />
+        {$t('community.ask.go_back')}
       </a>
       <div class="my-5 flex justify-between items-center">
         {#if isEditMode}
@@ -475,7 +476,7 @@
       </div>
 
       <div class="my-8 font-bold">
-        {pluralize('answers', question.totalComments, true)}
+        {pluralize($t('community.answers'), question.totalComments, true)}
       </div>
 
       {#each question.comments as comment}

apps/dashboard/src/routes/org/[slug]/quiz/[slug]/+page.svelte

@@ -18,6 +18,7 @@
   import QuizQuestion from '$lib/components/Org/Quiz/QuizQuestion.svelte';
   import { snackbar } from '$lib/components/Snackbar/store';
   import { supabase } from '$lib/utils/functions/supabase';
+  import { t } from '$lib/utils/functions/translations';
 
   export let data;
   const { quizId } = data;
@@ -250,7 +251,7 @@
           <div class="w-full flex justify-center mb-4">
             {#if currentQuestion.options.length < allOptions.length}
               <PrimaryButton
-                label="+ Add more answers"
+                label={$t('components.quiz.add_more')}
                 variant={VARIANTS.CONTAINED_WHITE}
                 onClick={addOption}
                 className="mr-5"
@@ -258,7 +259,7 @@
             {/if}
             {#if currentQuestion.options.length > 0}
               <PrimaryButton
-                label="- Remove last answer"
+                label={$t('components.quiz.remove_last')}
                 variant={VARIANTS.CONTAINED_WHITE}
                 onClick={deleteOption}
               />