Added auth functionality, initial work with views and field types

frontend/composables/useApi.ts

@@ -1,6 +1,20 @@
 export const useApi = () => {
   const config = useRuntimeConfig()
-  const apiBaseUrl = config.public.apiBaseUrl
+  const router = useRouter()
+  const { toast } = useToast()
+  const { isLoggedIn, logout } = useAuth()
+
+  // Use current domain for API calls (same subdomain routing)
+  const getApiBaseUrl = () => {
+    if (import.meta.client) {
+      // In browser, use current hostname but with port 3000 for API
+      const currentHost = window.location.hostname
+      const protocol = window.location.protocol
+      return `${protocol}//${currentHost}:3000`
+    }
+    // Fallback for SSR
+    return config.public.apiBaseUrl
+  }
 
   const getHeaders = () => {
     const headers: Record<string, string> = {
@@ -23,42 +37,70 @@ 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(`${apiBaseUrl}/api${path}`, {
+      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) {
-      const response = await fetch(`${apiBaseUrl}/api${path}`, {
+      const response = await fetch(`${getApiBaseUrl()}/api${path}`, {
         method: 'POST',
         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) {
-      const response = await fetch(`${apiBaseUrl}/api${path}`, {
+      const response = await fetch(`${getApiBaseUrl()}/api${path}`, {
         method: 'PUT',
         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) {
-      const response = await fetch(`${apiBaseUrl}/api${path}`, {
+      const response = await fetch(`${getApiBaseUrl()}/api${path}`, {
         method: 'DELETE',
         headers: getHeaders(),
       })
-      if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`)
-      return response.json()
+      return handleResponse(response)
     },
   }