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/Buttons/Close/index.svelte

@@ -1,18 +1,23 @@
-<script>
-  import CloseIcon from 'carbon-icons-svelte/lib/Close.svelte';
-  import IconButton from '$lib/components/IconButton/index.svelte';
+<script lang="ts">
+  import XIcon from '@lucide/svelte/icons/x';
+  import IconButton, { type Props as IconButtonProps } from '$lib/components/IconButton/index.svelte';
 
-  export let onClick = () => {};
-  export let contained = false;
-  export let color = 'text-primary-700 bg-primary-200 dark:bg-neutral-500';
-  export let size = 'small';
+  interface Props {
+    onClick?: IconButtonProps['onClick'];
+    contained?: boolean;
+    color?: string;
+    size?: IconButtonProps['size'];
+    toolTipProps?: IconButtonProps['toolTipProps'];
+  }
+
+  let {
+    onClick = () => {},
+    contained = false,
+    color = 'text-primary-700 bg-primary-200 dark:bg-neutral-500',
+    size = 'small'
+  }: Props = $props();
 </script>
 
 <IconButton {onClick} {color} {contained} {size}>
-  {#if size === 'large'}
-    <CloseIcon size={24} class="carbon-icon dark:text-black" title="Delete" />
-  {:else}
-    <CloseIcon size={20} class="carbon-icon dark:text-black" title="Delete" />
-  {/if}
+  <XIcon size={size === 'large' ? 24 : 16} class="carbon-icon dark:text-black" />
 </IconButton>
-<!-- color="text-primary-700 bg-primary-200 dark:bg-gray-200 dark:text-black" -->

apps/dashboard/src/lib/components/Buttons/Close/index.ts

@@ -0,0 +1 @@
+export { default as CloseButton } from './index.svelte';

apps/dashboard/src/lib/components/Buttons/Delete/index.svelte

@@ -1,10 +1,10 @@
-<script>
-  import Close from 'carbon-icons-svelte/lib/Close.svelte';
-  import IconButton from '$lib/components/IconButton/index.svelte';
+<script lang="ts">
+  import XIcon from '@lucide/svelte/icons/x';
+  import { IconButton } from '$lib/components/IconButton';
 
-  export let onClick = () => {};
+  let { onClick = () => {} } = $props();
 </script>
 
 <IconButton {onClick}>
-  <Close size={24} class="carbon-icon dark:text-white" title="Close" />
+  <XIcon size={16} class="carbon-icon dark:text-white" />
 </IconButton>

apps/dashboard/src/lib/components/Buttons/Send/index.svelte

@@ -1,10 +1,10 @@
-<script>
-  import SendFilled from 'carbon-icons-svelte/lib/SendFilled.svelte';
-  import IconButton from '$lib/components/IconButton/index.svelte';
+<script lang="ts">
+  import SendHorizontalIcon from '@lucide/svelte/icons/send-horizontal';
+  import { IconButton } from '$lib/components/IconButton';
 
-  export let onClick;
+  let { onClick } = $props();
 </script>
 
 <IconButton {onClick}>
-  <SendFilled size={24} class="carbon-icon dark:text-white" />
+  <SendHorizontalIcon size={16} class="filled" />
 </IconButton>

apps/dashboard/src/lib/components/Buttons/VisitOrgSite.svelte

@@ -7,10 +7,14 @@
   import { t } from '$lib/utils/functions/translations';
   import { user } from '$lib/utils/store/user';
 
-  export let className = '';
-  export let isLMS = false;
+  interface Props {
+    className?: string;
+    isLMS?: boolean;
+  }
 
-  $: href = isLMS && $user.isLoggedIn ? `${$currentOrgDomain}/home` : $currentOrgDomain;
+  let { className = '', isLMS = false }: Props = $props();
+
+  let href = $derived(isLMS && $user.isLoggedIn ? `${$currentOrgDomain}/home` : $currentOrgDomain);
 </script>
 
 <a {href} target="_blank" class="{className} ml-2 hover:no-underline">