feat: course types - self paced and live class (#309)

* working on the course type

* trying to mark it persist

* almost done here

* fixed sendig emtpy options bug

* created migration file

* created migration file

* made updates based on PR review

* merge

* update course type card

* add redirect logic with classroomio.com/new

* make new course modal only open/close with url

* feat: page active state (#315)

* finished the active link state

* updated the active link state based on review

* simplify code

---------

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

* add type to course card

---------

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

apps/dashboard/src/lib/components/LMS/components/Learning.svelte

@@ -3,13 +3,15 @@
   import { goto } from '$app/navigation';
   import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
   import CoursesEmptyIcon from '$lib/components/Icons/CoursesEmptyIcon.svelte';
-  import { coursesInProgress } from '$lib/components/Courses/store';
+  import { courses } from '$lib/components/Courses/store';
   import { t } from '$lib/utils/functions/translations';
 
   const gotoCourse = (id: string | undefined) => {
     if (!id) return;
     goto(`/courses/${id}/lessons?next=true`);
   };
+
+  $: last3Courses = $courses.length > 0 ? $courses.slice(0, 3) : [];
 </script>
 
 <section class="h-full">
@@ -19,9 +21,9 @@
   <div
     class="flex items-center flex-col border border-[#EAEAEA] dark:bg-neutral-800 gap-2 rounded w-full lg:h-[40vh] p-3"
   >
-    {#if $coursesInProgress.length > 0}
+    {#if last3Courses.length > 0}
       <div class="w-full h-full flex flex-col justify-start overflow-y-auto">
-        {#each $coursesInProgress as course}
+        {#each last3Courses as course}
           <div class="p-5">
             <span class="flex flex-col lg:flex-row gap-3 items-start pb-5">
               <img