From 0b65dc55507ef74c555a1a5d769063c15d86969a Mon Sep 17 00:00:00 2001
From: eddy <eddyutikal@gmail.com>
Date: Mon, 20 Apr 2026 11:18:38 +0200
Subject: [PATCH] autocomplete und login fehlermeldung fix

---
 src/pages/Auth/LoginPage.jsx                |  2 +-
 src/pages/Company/CompanyPage.jsx           | 61 +++++++++++++++++---
 src/pages/Organization/OrganizationPage.jsx | 62 ++++++++++++++++++---
 3 files changed, 108 insertions(+), 17 deletions(-)

diff --git a/src/pages/Auth/LoginPage.jsx b/src/pages/Auth/LoginPage.jsx
index 5568853..fad58f9 100644
--- a/src/pages/Auth/LoginPage.jsx
+++ b/src/pages/Auth/LoginPage.jsx
@@ -25,7 +25,7 @@ export default function LoginPage() {
       await login(email, password);
       navigate('/');
     } catch (err) {
-      setError(err.response?.data?.message ?? 'Login fehlgeschlagen');
+      setError(err.response?.data?.error ?? 'Login fehlgeschlagen');
     } finally {
       setLoading(false);
     }
diff --git a/src/pages/Company/CompanyPage.jsx b/src/pages/Company/CompanyPage.jsx
index 83a1251..6327e31 100644
--- a/src/pages/Company/CompanyPage.jsx
+++ b/src/pages/Company/CompanyPage.jsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import {
     Box, Typography, Alert, IconButton, Tooltip,
     Dialog, DialogTitle, DialogContent, DialogActions,
-    Button, Stack, TextField, CircularProgress
+    Button, Stack, TextField, CircularProgress, Autocomplete
 } from '@mui/material';
 import { DataGrid } from '@mui/x-data-grid';
 import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
@@ -17,6 +17,9 @@ export default function CompanyPage() {
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState('');
 
+    const [userOptions, setUserOptions] = useState([]);
+    const [usersLoading, setUsersLoading] = useState(false);
+
     const [open, setOpen] = useState(false);
     const [creating, setCreating] = useState(false);
     const [creatingError, setCreatingError] = useState('');
@@ -47,6 +50,23 @@ export default function CompanyPage() {
         setCreateForm((prev) => ({ ...prev, [name]: value }));
     };
 
+    const loadUsers = async () => {
+        setUsersLoading(true);
+        try {
+            const { data } = await axiosInstance.get('/users');
+            setUserOptions(data.map(u => u.email));
+        } catch {
+            setUserOptions([]);
+        } finally {
+             setUsersLoading(false);
+        }
+    }
+
+    const handleOpen = () => {
+        setOpen(true);
+        loadUsers();
+    }
+
     const handleCreate = async () => {
         setCreating(true);
         setCreatingError('');
@@ -142,7 +162,7 @@ export default function CompanyPage() {
                 <Button
                     variant="contained"
                     startIcon={<AddIcon />}
-                    onClick={() => setOpen(true)}
+                    onClick={() => handleOpen()}
                 >
                     Unternehmen erstellen
                 </Button>
@@ -180,13 +200,38 @@ export default function CompanyPage() {
                             fullWidth
                         />
 
-                        <TextField
-                            label="Verwalter Email"
-                            name="email"
-                            type="email"
+                        <Autocomplete
+                            options={userOptions}
+                            loading={usersLoading}
                             value={createForm.email}
-                            onChange={handleFormChange}
-                            fullWidth
+                            onChange={(_, newValue) => {
+                                setCreateForm(prev => ({ ...prev, email: newValue ?? '' }));
+                            }}
+                            onInputChange={(_, newInputValue) => {
+                                setCreateForm(prev => ({ ...prev, email: newInputValue }));
+                            }}
+                            freeSolo
+                            filterOptions={(options, { inputValue }) =>
+                                options.filter(o => o.toLowerCase().includes(inputValue.toLowerCase()))
+                            }
+                            renderInput={(params) => (
+                                <TextField
+                                    {...params}
+                                    label="Verwalter Email"
+                                    name="email"
+                                    type="email"
+                                    fullWidth
+                                    InputProps={{
+                                        ...params.InputProps,
+                                        endAdornment: (
+                                            <>
+                                                {usersLoading ? <CircularProgress size={16} /> : null}
+                                                {params.InputProps.endAdornment}
+                                            </>
+                                        ),
+                                    }}
+                                />
+                            )}
                         />
                     </Stack>
                 </DialogContent>
diff --git a/src/pages/Organization/OrganizationPage.jsx b/src/pages/Organization/OrganizationPage.jsx
index 1bd4902..78da244 100644
--- a/src/pages/Organization/OrganizationPage.jsx
+++ b/src/pages/Organization/OrganizationPage.jsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import {
     Box, Typography, Alert, IconButton, Tooltip,
     Dialog, DialogTitle, DialogContent, DialogActions,
-    Button, Stack, TextField, CircularProgress
+    Button, Stack, TextField, CircularProgress, Autocomplete
 } from '@mui/material';
 import { DataGrid } from '@mui/x-data-grid';
 import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
@@ -17,6 +17,9 @@ export default function OrganizationPage() {
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState('');
 
+    const [userOptions, setUserOptions] = useState([]);
+    const [usersLoading, setUsersLoading] = useState(false);
+
     const [open, setOpen] = useState(false);
     const [creating, setCreating] = useState(false);
     const [creatingError, setCreatingError] = useState('');
@@ -38,10 +41,28 @@ export default function OrganizationPage() {
         }
     };
 
+    const handleOpen = () => {
+        setOpen(true);
+        loadUsers();
+    }
+
     useEffect(() => {
         loadOrganizations();
     }, []);
 
+    const loadUsers = async () => {
+        setUsersLoading(true);
+
+        try {
+            const { data } = await axiosInstance.get('/users');
+            setUserOptions(data.map(u => u.email));
+        } catch {
+            setUserOptions([]);
+        } finally {
+            setUsersLoading(false);
+        }
+    }
+
     const handleFormChange = (e) => {
         const { name, value } = e.target;
         setCreateForm((prev) => ({ ...prev, [name]: value }));
@@ -142,7 +163,7 @@ export default function OrganizationPage() {
                 <Button
                     variant="contained"
                     startIcon={<AddIcon />}
-                    onClick={() => setOpen(true)}
+                    onClick={() => handleOpen()}
                 >
                     Organisation erstellen
                 </Button>
@@ -180,13 +201,38 @@ export default function OrganizationPage() {
                             fullWidth
                         />
 
-                        <TextField
-                            label="Verwalter Email"
-                            name="email"
-                            type="email"
+                        <Autocomplete
+                            options={userOptions}
+                            loading={usersLoading}
                             value={createForm.email}
-                            onChange={handleFormChange}
-                            fullWidth
+                            onChange={(_, newValue) => {
+                                setCreateForm(prev => ({ ...prev, email: newValue ?? '' }));
+                            }}
+                            onInputChange={(_, newInputValue) => {
+                                setCreateForm(prev => ({ ...prev, email: newInputValue }));
+                            }}
+                            freeSolo
+                            filterOptions={(options, { inputValue }) =>
+                                options.filter(o => o.toLowerCase().includes(inputValue.toLowerCase()))
+                            }
+                            renderInput={(params) => (
+                                <TextField
+                                    {...params}
+                                    label="Verwalter Email"
+                                    name="email"
+                                    type="email"
+                                    fullWidth
+                                    InputProps={{
+                                        ...params.InputProps,
+                                        endAdornment: (
+                                            <>
+                                                {usersLoading ? <CircularProgress size={16} /> : null}
+                                                {params.InputProps.endAdornment}
+                                            </>
+                                        ),
+                                    }}
+                                />
+                            )}
                         />
                     </Stack>
                 </DialogContent>