feat: implement public API routes and staff authentication

- Add public API endpoints for locations, services, and availability
- Implement staff login system with password authentication
- Update auth context to support password sign-in
- Protect aperture dashboard with authentication
- Update project documentation with new domains
This commit is contained in:
Marco Gallegos
2026-01-16 21:45:47 -06:00
parent 0f6fe9bf7b
commit fb60178c86
8 changed files with 273 additions and 1 deletions

115
app/aperture/login/page.tsx Normal file
View File

@@ -0,0 +1,115 @@
'use client'
import { useState } from 'react'
import { useAuth } from '@/lib/auth/context'
import { useRouter } from 'next/navigation'
import { supabase } from '@/lib/supabase/client'
export default function ApertureLogin() {
const [email, setEmail] = useState('')
const [password, setPassword] = useState('')
const [loading, setLoading] = useState(false)
const [error, setError] = useState('')
const { signInWithPassword } = useAuth()
const router = useRouter()
const handleLogin = async (e: React.FormEvent) => {
e.preventDefault()
setLoading(true)
setError('')
try {
const { error } = await signInWithPassword(email, password)
if (error) {
setError(error.message)
} else {
// Check user role from database
const { data: { user } } = await supabase.auth.getUser()
if (user) {
const { data: staff } = await supabase
.from('staff')
.select('role')
.eq('user_id', user.id)
.single()
if (staff && ['admin', 'manager', 'staff'].includes(staff.role)) {
router.push('/aperture')
} else {
setError('Unauthorized access')
await supabase.auth.signOut()
}
}
}
} catch (err) {
setError('An error occurred')
} finally {
setLoading(false)
}
}
return (
<div className="min-h-screen flex items-center justify-center bg-gray-50">
<div className="max-w-md w-full space-y-8">
<div>
<h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">
Aperture Login
</h2>
<p className="mt-2 text-center text-sm text-gray-600">
Staff, Manager, or Admin access
</p>
</div>
<form className="mt-8 space-y-6" onSubmit={handleLogin}>
<div className="rounded-md shadow-sm -space-y-px">
<div>
<label htmlFor="email" className="sr-only">
Email address
</label>
<input
id="email"
name="email"
type="email"
required
value={email}
onChange={(e) => setEmail(e.target.value)}
className="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm"
placeholder="Email address"
/>
</div>
<div>
<label htmlFor="password" className="sr-only">
Password
</label>
<input
id="password"
name="password"
type="password"
required
value={password}
onChange={(e) => setPassword(e.target.value)}
className="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm"
placeholder="Password"
/>
</div>
</div>
{error && (
<div className="text-red-600 text-sm text-center">
{error}
</div>
)}
<div>
<button
type="submit"
disabled={loading}
className="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50"
>
{loading ? 'Signing in...' : 'Sign in'}
</button>
</div>
</form>
</div>
</div>
)
}