Signup flow + switch to serverSupabaseUser in context (fixes token refresh issue)+ lib upgrades for nuxt/supabase and nuxt/trpc

This commit is contained in:
Michael Dausmann
2023-04-01 16:53:47 +11:00
parent f08f02851e
commit 5b2fe2f6c9
13 changed files with 604 additions and 407 deletions

42
pages/signin.vue Normal file
View File

@@ -0,0 +1,42 @@
<script setup lang="ts">
const user = useSupabaseUser()
const supabase = useSupabaseAuthClient();
const loading = ref(false)
const email = ref('')
const handleOtpLogin = async () => {
try {
loading.value = true
const { error } = await supabase.auth.signInWithOtp({ email: email.value })
if (error) throw error
alert('Check your email for the login link!')
} catch (error) {
alert(error)
} finally {
loading.value = false
}
}
watchEffect(() => {
if (user.value) {
navigateTo('/dashboard', {replace: true})
}
})
</script>
<template>
<div>
<h3>Sign In</h3>
<form @submit.prevent="handleOtpLogin">
<label for="email">Email:</label>
<input class="inputField" type="email" id="email" placeholder="Your email" v-model="email" />
<p>By signing in, I agree to the <NuxtLink to="/privacy">Privacy Statement</NuxtLink> and <NuxtLink to="/terms">Terms of Service</NuxtLink>.</p>
<button type="submit" :disabled="loading">Sign In using Magic Link</button>
</form>
<p>or sign in with</p>
<button @click="supabase.auth.signInWithOAuth({provider: 'google'})">Google</button>
</div>
</template>