From ca51c07065735ded79280776f6730b1342605a7e Mon Sep 17 00:00:00 2001
From: Hornwitser <github@hornwitser.no>
Date: Fri, 7 Mar 2025 18:43:24 +0100
Subject: [PATCH] Move push notification setting to separate page

Set up a dedicated Account Setttings page to hold account specific
settings such as the push notifications.
---
 components/Header.vue       |  1 +
 middleware/authenticated.ts |  8 ++++++++
 pages/account/settings.vue  | 22 ++++++++++++++++++++++
 pages/schedule.vue          | 11 +++++++----
 4 files changed, 38 insertions(+), 4 deletions(-)
 create mode 100644 middleware/authenticated.ts
 create mode 100644 pages/account/settings.vue

diff --git a/components/Header.vue b/components/Header.vue
index 0f87157..9416909 100644
--- a/components/Header.vue
+++ b/components/Header.vue
@@ -11,6 +11,7 @@
 				{{ session.account.name || "anonymous" }}
 				(s:{{ session.id }} a:{{ session.account.id }}{{ session.push ? " push" : null }})
 				{{ session.account.type }}
+				<NuxtLink to="/account/settings">Settings</NuxtLink>
 				<button type="button" @click="logOut">Log out</button>
 			</template>
 			<template v-else>
diff --git a/middleware/authenticated.ts b/middleware/authenticated.ts
new file mode 100644
index 0000000..1d67894
--- /dev/null
+++ b/middleware/authenticated.ts
@@ -0,0 +1,8 @@
+export default defineNuxtRouteMiddleware((to, from) => {
+	const { data: session } = useAccountSession();
+
+	if (!session.value) {
+		console.log("Not logged in, redirecting to /login");
+		return navigateTo("/login");
+	}
+})
diff --git a/pages/account/settings.vue b/pages/account/settings.vue
new file mode 100644
index 0000000..9fcbf3c
--- /dev/null
+++ b/pages/account/settings.vue
@@ -0,0 +1,22 @@
+<template>
+	<main>
+		<h1>Account Settings</h1>
+		<p>Name: {{ session?.account.name }}</p>
+		<p>Access: {{ session?.account.type }}</p>
+		<p>
+			<PushNotification />
+		</p>
+	</main>
+</template>
+
+<script lang="ts" setup>
+definePageMeta({
+	middleware: ["authenticated"],
+});
+
+const { data: session } = useAccountSession();
+</script>
+
+<style>
+
+</style>
diff --git a/pages/schedule.vue b/pages/schedule.vue
index 34acc1f..5911103 100644
--- a/pages/schedule.vue
+++ b/pages/schedule.vue
@@ -4,10 +4,12 @@
 		<p>
 			Study carefully, we only hold these events once a year.
 		</p>
-		<p>
-			Get notified about updates
+		<p v-if="!session">
+			<NuxtLink to="/login">Login</NuxtLink> to get notified about updates to the schedule.
+		</p>
+		<p>
+			Check out your <NuxtLink to="/account/settings">Account Setting</NuxtLink> to set up notifications for changes to schedule.
 		</p>
-		<PushNotification />
 		<h2>Schedule</h2>
 		<Timetable />
 		<EventsEdit />
@@ -25,11 +27,12 @@
 
 <script setup lang="ts">
 import type { Schedule } from '~/shared/types/schedule';
+const { data: session } = useAccountSession();
 
 const schedule = useSchedule();
 
 await callOnce(async () => {
-	schedule.value = await $fetch("/api/schedule")
+	schedule.value = await $fetch("/api/schedule");
 })
 
 const source = ref<EventSource | null>(null);