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/Org/Settings/index.svelte

@@ -1,12 +1,11 @@
 <script lang="ts">
-  import { page } from '$app/stores';
+  import { page } from '$app/state';
   import { Tabs, Tab, TabContent } from 'carbon-components-svelte';
   import Profile from './Profile.svelte';
   import LandingpageSettings from './LandingpageSettings.svelte';
   // import Account from './Account.svelte';
   import OrgSettings from './OrgSettings.svelte';
   import Billing from './Billing.svelte';
-  import { browser } from '$app/environment';
   import { goto } from '$app/navigation';
   import { isOrgAdmin } from '$lib/utils/store/org';
   import Integrations from './Integrations.svelte';
@@ -20,11 +19,47 @@
     disabled: boolean;
   }
 
-  let selected = 0;
-  let query = new URLSearchParams($page.url.search);
-  let tabKey = query.get('tab') || '';
+  let query = $derived(new URLSearchParams(page.url.search));
+  let tabKey = $derived(query.get('tab') || '');
 
-  let tabs: TabItem[] = [];
+  let tabs: TabItem[] = $derived([
+    {
+      key: 0,
+      label: $t('settings.tabs.profile_tab'),
+      tabKey: '',
+      href: page.url.pathname,
+      disabled: false
+    },
+    {
+      key: 1,
+      label: $t('settings.tabs.organization_tab'),
+      tabKey: 'org',
+      href: `${page.url.pathname}?tab=org`,
+      disabled: !$isOrgAdmin
+    },
+    {
+      key: 2,
+      label: $t('settings.tabs.landing_page_tab'),
+      tabKey: 'landingpage',
+      href: `${page.url.pathname}?tab=landingpage`,
+      disabled: !$isOrgAdmin
+    },
+    {
+      key: 3,
+      label: $t('settings.tabs.billing_tab'),
+      tabKey: 'billing',
+      href: `${page.url.pathname}?tab=billing`,
+      disabled: !$isOrgAdmin
+    },
+    {
+      key: 4,
+      label: $t('settings.tabs.integrations_tab'),
+      tabKey: 'integrations',
+      href: `${page.url.pathname}?tab=integrations`,
+      disabled: false
+    }
+  ]);
+  let selected = $derived(getSelectedByTab(tabs, tabKey));
 
   function getSelectedByTab(_tabs: TabItem[], tabKey = '') {
     const tab = _tabs.find((t) => t.tabKey === tabKey);
@@ -38,52 +73,6 @@
       goto(tab.href);
     }
   }
-
-  $: if (browser) {
-    query = new URLSearchParams($page.url.search);
-    tabKey = query.get('tab') || '';
-    selected = getSelectedByTab(tabs, tabKey);
-  }
-
-  $: {
-    tabs = [
-      {
-        key: 0,
-        label: $t('settings.tabs.profile_tab'),
-        tabKey: '',
-        href: $page.url.pathname,
-        disabled: false
-      },
-      {
-        key: 1,
-        label: $t('settings.tabs.organization_tab'),
-        tabKey: 'org',
-        href: `${$page.url.pathname}?tab=org`,
-        disabled: !$isOrgAdmin
-      },
-      {
-        key: 2,
-        label: $t('settings.tabs.landing_page_tab'),
-        tabKey: 'landingpage',
-        href: `${$page.url.pathname}?tab=landingpage`,
-        disabled: !$isOrgAdmin
-      },
-      {
-        key: 3,
-        label: $t('settings.tabs.billing_tab'),
-        tabKey: 'billing',
-        href: `${$page.url.pathname}?tab=billing`,
-        disabled: !$isOrgAdmin
-      },
-      {
-        key: 4,
-        label: $t('settings.tabs.integrations_tab'),
-        tabKey: 'integrations',
-        href: `${$page.url.pathname}?tab=integrations`,
-        disabled: false
-      }
-    ];
-  }
 </script>
 
 <Tabs autoWidth bind:selected on:change={onTabChange}>
@@ -96,8 +85,8 @@
       <Profile />
     </TabContent>
     <!-- <TabContent>
-      <Account />
-    </TabContent> -->
+        <Account />
+      </TabContent> -->
     <TabContent class="w-full p-0">
       <OrgSettings />
     </TabContent>