Use a pinia store to manage session state

Replace the convoluted useAccountSession composable with a pinia store
that in addition allows for the consolidation of all session related
functions to grouped into one module.

components/Header.vue

@@ -8,18 +8,18 @@
 				<li>
 					<NuxtLink to="/schedule">Schedule</NuxtLink>
 				</li>
-				<li v-if="session?.account?.type === 'admin' || session?.account?.type === 'crew'">
+				<li v-if="sessionStore.account?.type === 'admin' || sessionStore.account?.type === 'crew'">
 					<NuxtLink to="/edit">Edit</NuxtLink>
 				</li>
 			</ul>
 		</nav>
 		<div class="account">
-			<template v-if="session?.account">
-				{{ session.account.name }}
-				(s:{{ session.id }} a:{{ session.account.id }}{{ session.push ? " push" : null }})
-				{{ session.account.type }}
+			<template v-if="sessionStore.account">
+				{{ sessionStore.account.name }}
+				(s:{{ sessionStore.id }} a:{{ sessionStore.account.id }}{{ sessionStore.push ? " push" : null }})
+				{{ sessionStore.account.type }}
 				<NuxtLink to="/account/settings">Settings</NuxtLink>
-				<LogOutButton v-if="session.account.type !== 'anonymous'"/>
+				<LogOutButton v-if="sessionStore.account.type !== 'anonymous'"/>
 			</template>
 			<template v-else>
 				<NuxtLink to="/login">Log In</NuxtLink>
@@ -29,7 +29,7 @@
 </template>
 
 <script lang="ts" setup>
-const { data: session } = await useAccountSession();
+const sessionStore = useSessionStore();
 </script>
 
 <style scoped>