feat: multi language support (#254)

* feat: multitranslational support

* - completion of settings page
- completion of sidebar

* sidebar rerendering bug fix

* completion of the lesson navigation & materials page

* completion of the course navigation

* completion of requested languages

* - Implementation of Language Picker
- Rename Bug Fixes

* checkpoint save

* - addition of the language picker to the onboarding.
- addition of the language switcher for the lesson notes.

* merge completion

* initialization of the new branch

* add transition.svelte file

* lesson note bug fix

* feat: add translation migration

* completion of translation

* fix height issue of dropdown

* refactoring

* fix: improve code with LOCALE from db

* finally get it fully functional

* connect with AI

* backward compatibility for lesson note

* preserve old content, when generating AI content

* undo translations in upgrade modal

* fix duplicate key issue from codacy trigger

---------

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

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

@@ -1,6 +1,7 @@
 <script>
   import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
   import Audience from '$lib/components/Org/Audience/index.svelte';
+  import { t } from '$lib/utils/functions/translations';
   import { orgAudience, currentOrgPlan, currentOrgMaxAudience } from '$lib/utils/store/org';
   import { PLAN } from 'shared-constants/src/plans/constants';
   import UpgradeBanner from '$lib/components/Upgrade/Banner.svelte';
@@ -22,14 +23,19 @@
   <div class="py-10 px-5">
     <div class="flex items-center justify-between mb-10">
       <div class="flex items-end">
-        <h1 class="dark:text-white text-2xl md:text-3xl font-bold m-0">Audience</h1>
+        <h1 class="dark:text-white text-2xl md:text-3xl font-bold m-0">{$t('audience.title')}</h1>
         {#if $currentOrgPlan?.plan_name !== PLAN.ENTERPRISE}
           <span class="ml-2">
             ({$orgAudience.length} / {$currentOrgMaxAudience})
           </span>
         {/if}
       </div>
-      <PrimaryButton label="Export" onClick={exportAudience} isDisabled={isLoading} {isLoading} />
+      <PrimaryButton
+        label={$t('audience.export')}
+        onClick={exportAudience}
+        isDisabled={isLoading}
+        {isLoading}
+      />
     </div>
 
     {#if $orgAudience.length >= $currentOrgMaxAudience}