WIP - added front end auth

frontend/composables/useApi.ts

@@ -1,5 +1,8 @@
 export const useApi = () => {
   const config = useRuntimeConfig()
+  const router = useRouter()
+  const { toast } = useToast()
+  const { isLoggedIn, logout } = useAuth()
 
   // Use current domain for API calls (same subdomain routing)
   const getApiBaseUrl = () => {
@@ -34,13 +37,44 @@ export const useApi = () => {
     return headers
   }
 
+  const handleResponse = async (response: Response) => {
+    if (response.status === 401) {
+      // Unauthorized - not authenticated
+      if (import.meta.client) {
+        logout()
+        toast.error('Your session has expired. Please login again.')
+        router.push('/login')
+      }
+      throw new Error('Unauthorized')
+    }
+
+    if (response.status === 403) {
+      // Forbidden - not authorized
+      if (import.meta.client) {
+        toast.error('You do not have permission to perform this action.')
+        // Redirect to home if logged in, otherwise to login
+        if (isLoggedIn()) {
+          router.push('/')
+        } else {
+          router.push('/login')
+        }
+      }
+      throw new Error('Forbidden')
+    }
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`)
+    }
+
+    return response.json()
+  }
+
   const api = {
     async get(path: string) {
       const response = await fetch(`${getApiBaseUrl()}/api${path}`, {
         headers: getHeaders(),
       })
-      if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`)
-      return response.json()
+      return handleResponse(response)
     },
 
     async post(path: string, data: any) {
@@ -49,8 +83,7 @@ export const useApi = () => {
         headers: getHeaders(),
         body: JSON.stringify(data),
       })
-      if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`)
-      return response.json()
+      return handleResponse(response)
     },
 
     async put(path: string, data: any) {
@@ -59,8 +92,7 @@ export const useApi = () => {
         headers: getHeaders(),
         body: JSON.stringify(data),
       })
-      if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`)
-      return response.json()
+      return handleResponse(response)
     },
 
     async delete(path: string) {
@@ -68,8 +100,7 @@ export const useApi = () => {
         method: 'DELETE',
         headers: getHeaders(),
       })
-      if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`)
-      return response.json()
+      return handleResponse(response)
     },
   }