& so it begins

apps/main/src/routes/(main)/notifications/+page.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+    import MaxWidthWrapper from "$lib/components/molecules/max-width-wrapper.svelte";
+    import { secondaryNavTree } from "$lib/core/constants";
+    import { notificationViewModel } from "$lib/domains/notifications/notification.vm.svelte";
+    import NotificationsTable from "$lib/domains/notifications/notifications-table.svelte";
+    import { breadcrumbs, user } from "$lib/global.stores";
+    import { onMount } from "svelte";
+    import { get } from "svelte/store";
+
+    // Set breadcrumb to notifications
+    breadcrumbs.set([secondaryNavTree[2]]);
+
+    onMount(() => {
+        // Ensure user ID is set in the view model
+        const currentUser = get(user);
+        if (currentUser?.id) {
+            notificationViewModel.filters = {
+                ...notificationViewModel.filters,
+                userId: currentUser.id,
+            };
+        }
+    });
+</script>
+
+<MaxWidthWrapper cls="space-y-8 pt-12">
+    <NotificationsTable />
+</MaxWidthWrapper>