@plutocms/supabase 0.0.1-alpha.16 → 0.0.1-alpha.17

package/README.md

@@ -35,9 +35,7 @@ bun add @nuxtjs/supabase supabase
 ```ts
 // nuxt.config.ts
 export default defineNuxtConfig({
-  extends: [
-    ['github:plutocms/supabase', { install: true }],
-  ],
+  extends: [['github:plutocms/supabase', { install: true }]],
 })
 ```
 
@@ -55,7 +53,7 @@ The layer includes API routes for interacting with Supabase services, such as au
 
 - GET `/api/settings`
 - POST `/api/settings/update`
-- POST `/api/signup`
+- POST `/api/auth/signup`
 
 ### Types
 

package/app/composables/auth.ts

@@ -1,4 +1,7 @@
-import type { RouteLocationNormalizedGeneric } from 'vue-router'
+import type {
+  RouteLocationNormalizedGeneric,
+  RouteLocationRaw,
+} from 'vue-router'
 
 interface PlutoSupabaseAuthOptions {
   route?: RouteLocationNormalizedGeneric
@@ -16,6 +19,15 @@ export async function useAuth(authOptions?: PlutoSupabaseAuthOptions) {
   const isLoggedIn = computed<boolean>(() => !!supabaseSession.value)
   const isSubmitting = ref<boolean>(false)
 
+  const allowedUnauthenticatedPaths: RouteLocationRaw[] = [
+    '/admin/login',
+    '/admin/signup',
+    '/admin/confirm',
+    '/admin/setup',
+    '/admin/forgot-password',
+    '/admin/update-password',
+  ]
+
   interface LoginForm {
     email: string
     password: string
@@ -108,11 +120,21 @@ export async function useAuth(authOptions?: PlutoSupabaseAuthOptions) {
     isSubmitting.value = true
 
     try {
-      await $fetch('/api/auth/reset-password', {
-        method: 'POST',
-        body: { email },
+      const { error } = await supabase.auth.resetPasswordForEmail(email, {
+        redirectTo: `${window.location.origin}/admin/update-password`,
       })
 
+      if (error) {
+        toast.add({
+          title: 'Could not send reset email',
+          description: error.message,
+          icon: 'lucide:circle-x',
+          color: 'error',
+        })
+
+        return { success: false }
+      }
+
       return { success: true }
     } catch (error) {
       toast.add({
@@ -176,5 +198,6 @@ export async function useAuth(authOptions?: PlutoSupabaseAuthOptions) {
     logout,
     requestPasswordReset,
     updatePassword,
+    allowedUnauthenticatedPaths,
   }
 }

package/app/middleware/auth.ts

@@ -1,19 +1,15 @@
 import type { RouteLocationNormalizedGeneric } from 'vue-router'
 
 export default defineNuxtRouteMiddleware(async (to, from) => {
-  const { isLoggedIn, logout } = await useAuth({
+  const { isLoggedIn, logout, allowedUnauthenticatedPaths } = await useAuth({
     route: to as RouteLocationNormalizedGeneric,
   })
 
-  const allowedUnauthenticatedPaths = [
-    '/admin/login',
-    '/admin/signup',
-    '/admin/confirm',
-    '/admin/setup',
-    '/admin/forgot-password',
-  ]
-
-  if (isLoggedIn.value && allowedUnauthenticatedPaths.includes(to.path)) {
+  if (
+    isLoggedIn.value &&
+    allowedUnauthenticatedPaths.includes(to.path) &&
+    to.path !== '/admin/update-password'
+  ) {
     return navigateTo(
       to.query.redirect
         ? decodeURIComponent(to.query.redirect as string)

package/app/pages/admin/(auth)/signup.vue

@@ -33,7 +33,7 @@ async function submitForm() {
   isSubmitting.value = true
 
   try {
-    await $fetch('/api/signup', {
+    await $fetch('/api/auth/signup', {
       method: 'POST',
       body: {
         email: form.value.email,

package/app/pages/admin/(auth)/update-password.vue

@@ -7,6 +7,18 @@ useHead({
   title: 'Update Password',
 })
 
+const route = useRoute()
+const supabase = useSupabaseClient()
+
+// Exchange the PKCE code for a session when arriving from a password reset email
+onMounted(async () => {
+  const code = route.query.code as string | undefined
+
+  if (code) {
+    await supabase.auth.exchangeCodeForSession(code)
+  }
+})
+
 const { isSubmitting, updatePassword } = await useAuth()
 
 const form = ref({
@@ -29,6 +41,8 @@ async function submitForm() {
 
   if (result.success) {
     isPasswordUpdated.value = true
+
+    await supabase.auth.signOut()
   }
 }
 </script>

package/app/pages/admin.vue

@@ -5,7 +5,7 @@ definePageMeta({
 })
 
 const route = useRoute()
-const { isLoggedIn, logout } = await useAuth()
+const { isLoggedIn, logout, allowedUnauthenticatedPaths } = await useAuth()
 const toast = useToast()
 
 const visibility = useDocumentVisibility()
@@ -15,9 +15,7 @@ watch(visibility, async (current, previous) => {
     if (
       !isLoggedIn.value &&
       !route.path.startsWith('/admin/setup') &&
-      route.path.startsWith('/admin/') &&
-      route.path !== '/admin/login' &&
-      route.path !== '/admin/signup'
+      !allowedUnauthenticatedPaths.includes(route.path)
     ) {
       await logout({ redirectTo: route.path })
 

package/eslint.config.mjs

@@ -68,6 +68,7 @@ export default withNuxt(
           arrays: 'always-multiline',
           objects: 'always-multiline',
           functions: 'never',
+          imports: 'always-multiline',
         },
       ],
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@plutocms/supabase",
   "type": "module",
-  "version": "0.0.1-alpha.16",
+  "version": "0.0.1-alpha.17",
   "main": "./nuxt.config.ts",
   "scripts": {
     "build": "nuxt build",

package/server/api/auth/reset-password.post.ts

@@ -1,36 +0,0 @@
-import { serverSupabaseClient } from '#supabase/server'
-
-interface Payload {
-  email: string
-}
-
-export default defineEventHandler(async (event) => {
-  const client = await serverSupabaseClient<Database>(event)
-  const body = await readBody<Payload>(event)
-
-  if (!body.email) {
-    return {
-      success: false,
-      message: 'Email is required.',
-    }
-  }
-
-  const { origin } = getRequestURL(event)
-
-  const { error } = await client.auth.resetPasswordForEmail(body.email, {
-    redirectTo: `${origin}/admin/update-password`,
-  })
-
-  if (error) {
-    return {
-      success: false,
-      message: error.message,
-      error,
-    }
-  }
-
-  return {
-    success: true,
-    message: 'Password reset email sent.',
-  }
-})