feat: complete Week 1 frontend setup (#9 #10 #11 #12)
Some checks failed
Deploy to Coolify / Code Quality (pull_request) Has been cancelled
Deploy to Coolify / Run Tests (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Development (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Production (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Test (pull_request) Has been cancelled
Pull Request Checks / Validate PR (pull_request) Has been cancelled
Some checks failed
Deploy to Coolify / Code Quality (pull_request) Has been cancelled
Deploy to Coolify / Run Tests (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Development (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Production (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Test (pull_request) Has been cancelled
Pull Request Checks / Validate PR (pull_request) Has been cancelled
- Install and configure Tailwind CSS (#9) - Install Nuxt UI component library (#10) - Create app layout with header/footer components (#11) - Implement Supabase client composable (#12) - Add TypeScript database types - Create placeholder pages (index, scan, settings) - Setup responsive navigation with mobile menu - Configure auth state management All Week 1 frontend foundation tasks complete.
This commit is contained in:
81
app/composables/useSupabase.ts
Normal file
81
app/composables/useSupabase.ts
Normal file
@@ -0,0 +1,81 @@
|
||||
import { createClient, SupabaseClient } from '@supabase/supabase-js'
|
||||
import type { Database } from '~/types/database.types'
|
||||
|
||||
let supabaseInstance: SupabaseClient<Database> | null = null
|
||||
|
||||
export const useSupabase = () => {
|
||||
const config = useRuntimeConfig()
|
||||
|
||||
if (!supabaseInstance) {
|
||||
supabaseInstance = createClient<Database>(
|
||||
config.public.supabaseUrl,
|
||||
config.public.supabaseAnonKey,
|
||||
{
|
||||
auth: {
|
||||
persistSession: true,
|
||||
autoRefreshToken: true,
|
||||
detectSessionInUrl: true,
|
||||
storage: process.client ? window.localStorage : undefined
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
return supabaseInstance
|
||||
}
|
||||
|
||||
/**
|
||||
* Composable for Supabase authentication
|
||||
*/
|
||||
export const useSupabaseAuth = () => {
|
||||
const supabase = useSupabase()
|
||||
const user = useState('supabase_user', () => null as any)
|
||||
const session = useState('supabase_session', () => null as any)
|
||||
|
||||
// Initialize auth state
|
||||
const initAuth = async () => {
|
||||
const { data: { session: currentSession } } = await supabase.auth.getSession()
|
||||
session.value = currentSession
|
||||
user.value = currentSession?.user || null
|
||||
|
||||
// Listen for auth changes
|
||||
supabase.auth.onAuthStateChange((_event, newSession) => {
|
||||
session.value = newSession
|
||||
user.value = newSession?.user || null
|
||||
})
|
||||
}
|
||||
|
||||
// Call initAuth on composable mount
|
||||
if (process.client) {
|
||||
initAuth()
|
||||
}
|
||||
|
||||
const signIn = async (email: string, password: string) => {
|
||||
const { data, error } = await supabase.auth.signInWithPassword({
|
||||
email,
|
||||
password
|
||||
})
|
||||
return { data, error }
|
||||
}
|
||||
|
||||
const signUp = async (email: string, password: string) => {
|
||||
const { data, error } = await supabase.auth.signUp({
|
||||
email,
|
||||
password
|
||||
})
|
||||
return { data, error }
|
||||
}
|
||||
|
||||
const signOut = async () => {
|
||||
const { error } = await supabase.auth.signOut()
|
||||
return { error }
|
||||
}
|
||||
|
||||
return {
|
||||
user: readonly(user),
|
||||
session: readonly(session),
|
||||
signIn,
|
||||
signUp,
|
||||
signOut
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user