CLASSROOMIO-T-50: Welcome modal for Educators

CLASSROOMIO-T-50: Dashboard styles Update

CLASSROOMIO-T-50: Store Update

CLASSROOMIO-T-50: Undo Changes in Files

CLASSROOMIO-T-50: Welcome Modal File Update

Merge branch 'main' into CLASSROOMIO-T-50

CLASSROOMIO-T-50: Text color update

Merge branch 'CLASSROOMIO-T-50' of https://gitlab.com/thenextgreat/classroomio into CLASSROOMIO-T-50

CLASSROOMIO-T-50: Modal Update & Banner Update

Merge branch 'CLASSROOMIO-T-50'

CLASSROOMIO-T-50: Welcome Modal Update

CLASSROOMIO-T-50: Modal Update & Banner Update

CLASSROOMIO-T-50: Added the modal

CLASSROOMIO-T-50:
- Created the modal component
- Imported it in the dashboard route


Co-authored-by: Tunji Adeyemi <[email protected]>


Merge-request: CLASSROOMIO-MR-20
Merged-by: Best Admin <[email protected]>

src/routes/dashboard.svelte

@@ -130,6 +130,7 @@
 
   // Every time the date changes
   $: selectedDateLessonData = getDataOfSelectedDate($store?.selected);
+
 </script>
 
 <svelte:head>

src/routes/onboarding.svelte

@@ -16,6 +16,7 @@
   import { onboardingValidation } from '../utils/functions/validator';
   import { supabase } from '../utils/functions/supabase';
   import { blockedSubdomain } from '../utils/constants/app';
+  import { welcomeModalStore } from '../components/WelcomeModal/store';
 
   interface OnboardingField {
     fullname?: string;
@@ -187,6 +188,7 @@
 
       console.log('data', data);
       console.log('error', error);
+      $welcomeModalStore.open = true;
       return goto(`/org/${fields.siteName}`);
     }
 

src/routes/org/[slug]/index.svelte

@@ -12,7 +12,6 @@
   import { goto } from '@sapper/app';
   import PrimaryButton from '../../../components/PrimaryButton/index.svelte';
   import Avatar from '../../../components/Avatar/index.svelte';
-  import { onMount } from 'svelte';
   import { InlineCalendar, Datepicker } from 'svelte-calendar';
   import CheckmarkFilled20 from 'carbon-icons-svelte/lib/CheckmarkFilled20';
   import {
@@ -26,6 +25,8 @@
     UserLessonDataType,
     LessonsByMonthIndexType,
   } from '../../../utils/types';
+  import WelcomeModal from '../../../components/WelcomeModal/WelcomeModal.svelte';
+  import { onMount } from 'svelte';
 
   export let orgName: string;
 
@@ -191,9 +192,9 @@
   }
 
   onMount(() => {
-    // Remove default shouldEnlargeDay=true when using <DatePicker /> on mobile
+    // Remove default shouldEnlargeDay=true when <DatePicker /> on mobile
     if ($store && $store.shouldEnlargeDay) {
-      $store.shouldEnlargeDay = false;
+      $store.shouldEnlargeDay = false
     }
   });
 
@@ -208,6 +209,8 @@
   <title>Dashboard - ClassroomIO</title>
 </svelte:head>
 
+<WelcomeModal />
+
 <div class="py-10 px-5 w-full max-w-7xl mx-auto">
   <div class="flex items-center justify-between mb-10">
     <h1 class="dark:text-white text-3xl font-bold">Dashboard</h1>
@@ -396,4 +399,4 @@
       font-size: 30px;
     }
   }
-</style>
+</style>