owltide/pages/index.vue

<template>
	<main>
		<h1>Schedule Demo</h1>
		<ul>
			<li>
				<NuxtLink to="/schedule">View Schedule</NuxtLink>
			</li>
			<li v-if="sessionStore.account?.type === 'admin' || sessionStore.account?.type === 'crew'">
				<NuxtLink to="/edit">Edit Schedule</NuxtLink>
			</li>
			<li v-if="sessionStore.account">
				<NuxtLink to="/account/settings">Account Settings</NuxtLink>
			</li>
			<li v-if="!sessionStore.account">
				<NuxtLink to="/login">Log In / Create Account</NuxtLink>
			</li>
		</ul>
	</main>
</template>

<script lang="ts" setup>
const sessionStore = useSessionStore();
</script>
Port application from Next.js to Nuxt Nuxt is based on Vue.js and I find their building blocks to be much neater compared to the React based Next.js. 2025-03-05 15:36:50 +01:00			`<template>`
			`<main>`
			`<h1>Schedule Demo</h1>`
			`<ul>`
			`<li>`
Implement account type restricted page Add allowedAccountTypes page metadata which the authenticated middleware uses to further restrict the types of accounts that can access the page. If the account type is insufficent to access the page it will return an HTTP 403 Forbidden status, which is rendered using the error page. 2025-03-09 22:21:13 +01:00			`<NuxtLink to="/schedule">View Schedule</NuxtLink>`
			`</li>`
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. 2025-05-24 17:53:33 +02:00			`<li v-if="sessionStore.account?.type === 'admin' \|\| sessionStore.account?.type === 'crew'">`
Implement account type restricted page Add allowedAccountTypes page metadata which the authenticated middleware uses to further restrict the types of accounts that can access the page. If the account type is insufficent to access the page it will return an HTTP 403 Forbidden status, which is rendered using the error page. 2025-03-09 22:21:13 +01:00			`<NuxtLink to="/edit">Edit Schedule</NuxtLink>`
			`</li>`
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. 2025-05-24 17:53:33 +02:00			`<li v-if="sessionStore.account">`
Implement account type restricted page Add allowedAccountTypes page metadata which the authenticated middleware uses to further restrict the types of accounts that can access the page. If the account type is insufficent to access the page it will return an HTTP 403 Forbidden status, which is rendered using the error page. 2025-03-09 22:21:13 +01:00			`<NuxtLink to="/account/settings">Account Settings</NuxtLink>`
			`</li>`
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. 2025-05-24 17:53:33 +02:00			`<li v-if="!sessionStore.account">`
Implement account type restricted page Add allowedAccountTypes page metadata which the authenticated middleware uses to further restrict the types of accounts that can access the page. If the account type is insufficent to access the page it will return an HTTP 403 Forbidden status, which is rendered using the error page. 2025-03-09 22:21:13 +01:00			`<NuxtLink to="/login">Log In / Create Account</NuxtLink>`
Port application from Next.js to Nuxt Nuxt is based on Vue.js and I find their building blocks to be much neater compared to the React based Next.js. 2025-03-05 15:36:50 +01:00			`</li>`
			`</ul>`
			`</main>`
			`</template>`
Implement account type restricted page Add allowedAccountTypes page metadata which the authenticated middleware uses to further restrict the types of accounts that can access the page. If the account type is insufficent to access the page it will return an HTTP 403 Forbidden status, which is rendered using the error page. 2025-03-09 22:21:13 +01:00
			`<script lang="ts" setup>`
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. 2025-05-24 17:53:33 +02:00			`const sessionStore = useSessionStore();`
Implement account type restricted page Add allowedAccountTypes page metadata which the authenticated middleware uses to further restrict the types of accounts that can access the page. If the account type is insufficent to access the page it will return an HTTP 403 Forbidden status, which is rendered using the error page. 2025-03-09 22:21:13 +01:00			`</script>`