Added auth functionality, initial work with views and field types

frontend/components/LoginForm.vue

@@ -5,8 +5,34 @@ import { Label } from '@/components/ui/label'
 
 const config = useRuntimeConfig()
 const router = useRouter()
+const { toast } = useToast()
 
-const tenantId = ref('123')
+// Cookie for server-side auth check
+const tokenCookie = useCookie('token')
+
+// Extract subdomain from hostname (e.g., tenant1.localhost → tenant1)
+const getSubdomain = () => {
+  if (!import.meta.client) return null
+  const hostname = window.location.hostname
+  const parts = hostname.split('.')
+  
+  console.log('Extracting subdomain from:', hostname, 'parts:', parts)
+  
+  // For localhost development: tenant1.localhost or localhost
+  if (hostname === 'localhost' || hostname === '127.0.0.1') {
+    return null // Use default tenant for plain localhost
+  }
+  
+  // For subdomains like tenant1.routebox.co or tenant1.localhost
+  if (parts.length >= 2 && parts[0] !== 'www') {
+    console.log('Using subdomain:', parts[0])
+    return parts[0] // Return subdomain
+  }
+  
+  return null
+}
+
+const subdomain = ref(getSubdomain())
 const email = ref('')
 const password = ref('')
 const loading = ref(false)
@@ -17,12 +43,18 @@ const handleLogin = async () => {
     loading.value = true
     error.value = ''
 
+    const headers: Record<string, string> = {
+      'Content-Type': 'application/json',
+    }
+
+    // Only send x-tenant-id if we have a subdomain
+    if (subdomain.value) {
+      headers['x-tenant-id'] = subdomain.value
+    }
+
     const response = await fetch(`${config.public.apiBaseUrl}/api/auth/login`, {
       method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'x-tenant-id': tenantId.value,
-      },
+      headers,
       body: JSON.stringify({
         email: email.value,
         password: password.value,
@@ -36,15 +68,23 @@ const handleLogin = async () => {
 
     const data = await response.json()
 
-    // Store credentials
-    localStorage.setItem('tenantId', tenantId.value)
+    // Store credentials in localStorage
+    // Store the tenant ID that was used for login
+    const tenantToStore = subdomain.value || data.user?.tenantId || 'tenant1'
+    localStorage.setItem('tenantId', tenantToStore)
     localStorage.setItem('token', data.access_token)
     localStorage.setItem('user', JSON.stringify(data.user))
+    
+    // Also store token in cookie for server-side auth check
+    tokenCookie.value = data.access_token
 
+    toast.success('Login successful!')
+    
     // Redirect to home
     router.push('/')
   } catch (e: any) {
     error.value = e.message || 'Login failed'
+    toast.error(e.message || 'Login failed')
   } finally {
     loading.value = false
   }
@@ -65,10 +105,6 @@ const handleLogin = async () => {
     </div>
 
     <div class="grid gap-6">
-      <div class="grid gap-2">
-        <Label for="tenantId">Tenant ID</Label>
-        <Input id="tenantId" v-model="tenantId" type="text" placeholder="123" required />
-      </div>
       <div class="grid gap-2">
         <Label for="email">Email</Label>
         <Input id="email" v-model="email" type="email" placeholder="m@example.com" required />