Hornwitser
c7b4f5fa92
The push logic is only available on the client and causes hydration mismatch when rendered on the server.
67 lines
1.3 KiB
Vue
67 lines
1.3 KiB
Vue
<template>
|
|
<main>
|
|
<h1>Account Settings</h1>
|
|
<p v-if="session?.account.type !== 'anonymous'">
|
|
Name: {{ session?.account.name }}
|
|
</p>
|
|
<p>Access: {{ session?.account.type }}</p>
|
|
<form @submit.prevent="changeSettings">
|
|
<label>
|
|
Timezone
|
|
<input type="text" v-model="timezone">
|
|
</label>
|
|
<button type="submit">
|
|
Save
|
|
</button>
|
|
</form>
|
|
<p>
|
|
<ClientOnly>
|
|
<PushNotification />
|
|
</ClientOnly>
|
|
</p>
|
|
<fieldset>
|
|
<legend>Danger Zone</legend>
|
|
Delete my account and all data associated with it
|
|
<button @click="deleteAccount">
|
|
Delete
|
|
</button>
|
|
</fieldset>
|
|
</main>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
definePageMeta({
|
|
middleware: ["authenticated"],
|
|
});
|
|
|
|
const { data: session, refresh: sessionRefresh } = await useAccountSession();
|
|
|
|
const timezone = ref(session.value?.account.timezone ?? "");
|
|
|
|
async function changeSettings() {
|
|
try {
|
|
await $fetch("/api/account", {
|
|
method: "patch",
|
|
body: {
|
|
timezone: timezone.value,
|
|
}
|
|
});
|
|
await sessionRefresh();
|
|
} catch (err: any) {
|
|
alert(err.data.message);
|
|
}
|
|
}
|
|
|
|
async function deleteAccount() {
|
|
try {
|
|
await $fetch.raw("/api/account", {
|
|
method: "DELETE",
|
|
});
|
|
await sessionRefresh();
|
|
await navigateTo("/");
|
|
|
|
} catch (err: any) {
|
|
alert(`Delete account failed: ${err.statusCode} ${err.statusMessage}`);
|
|
}
|
|
}
|
|
</script>
|