feat: setup drizzle (#594)

* chore: migration to SvelteKit 2

* stage 1: migrate to svelte 5 and fix rerendering issues

* stage 2: fix more $: reactivity across dashboard

* fix merge conflicts

* chore: migrate code in main to svelte 5

* chore: update preventDefault

* chore: simplify tsconfig and remove unused mobileMenuRef in MobileMenu.svelte

* chore: enforce .ts across dashboard

* rename from classroomio-com to website

* stage-3: Replace carbon icon svelte with lucide icon

* update lock file

* chore: finish icon replacement

* fix: settings and setup page multiple rerender

* stage 3: More icon and rerendering fixes

* feat: setup drizzle and better auth

* fix: onboarding validation error showing translation key #586 (#593)

* fix: onboarding validation error showing translation key #586

* fix: remove debug log for profile update errors

* chore: add a clean command

* fix: remove message from email verification response

apps/dashboard/src/lib/components/Question/Grade.svelte

@@ -3,14 +3,20 @@
   import { t } from '$lib/utils/functions/translations';
   import { snackbar } from '../Snackbar/store';
 
-  export let gradeMax = 0;
-  export let disableGrading = false;
-  export let grade: number | undefined = 0;
-
-  $: if (grade && grade > gradeMax) {
-    snackbar.error('grade cant be more than max value');
-    grade = gradeMax;
+  interface Props {
+    gradeMax?: number;
+    disableGrading?: boolean;
+    grade?: number | undefined;
   }
+
+  let { gradeMax = 0, disableGrading = false, grade = $bindable(0) }: Props = $props();
+
+  $effect(() => {
+    if (grade && grade > gradeMax) {
+      snackbar.error('grade cant be more than max value');
+      grade = gradeMax;
+    }
+  });
 </script>
 
 <div class="flex items-center font-semibold">
@@ -24,7 +30,7 @@
     isDisabled={disableGrading}
   />
 
-  <p class="dark:text-white ml-2 text-base flex items-center font-semibold">
+  <p class="ml-2 flex items-center text-base font-semibold dark:text-white">
     <span class="mr-1">/</span> <span>{gradeMax}</span>
   </p>
 </div>