From 0e9dd03e5651359434f684488711aa47fe686b6b Mon Sep 17 00:00:00 2001
From: FlorianSpeicher <flo200538@gmail.com>
Date: Wed, 11 Jun 2025 14:59:52 +0200
Subject: [PATCH] Edit Registier link

---
 01-frontend/src/helper/navbar/LoginDialog.tsx | 145 ++++++++++++++----
 1 file changed, 111 insertions(+), 34 deletions(-)

diff --git a/01-frontend/src/helper/navbar/LoginDialog.tsx b/01-frontend/src/helper/navbar/LoginDialog.tsx
index c0e20bb..0356ade 100644
--- a/01-frontend/src/helper/navbar/LoginDialog.tsx
+++ b/01-frontend/src/helper/navbar/LoginDialog.tsx
@@ -1,5 +1,5 @@
-import { Dialog, DialogTitle, DialogContent, DialogActions, TextField, Button } from "@mui/material";
-import React from "react";
+import { Dialog, DialogTitle, DialogContent, DialogActions, TextField, Button, Box, Link } from "@mui/material";
+import React, { useState } from "react";
 
 type LoginDialogProps = {
     open: boolean;
@@ -9,37 +9,114 @@ type LoginDialogProps = {
     setLoginData: React.Dispatch<React.SetStateAction<{ email: string; password: string }>>;
 };
 
-const LoginDialog: React.FC<LoginDialogProps> = ({ open, onClose, onSubmit, loginData, setLoginData }) => (
-    <Dialog open={open} onClose={onClose}>
-        <DialogTitle>Login</DialogTitle>
-        <DialogContent>
-            <TextField
-                margin="dense"
-                label="E-Mail"
-                type="email"
-                fullWidth
-                value={loginData.email}
-                onChange={e => setLoginData(prev => ({ ...prev, email: e.target.value }))}
-            />
-            <TextField
-                autoFocus
-                margin="dense"
-                label="Passwort"
-                type="password"
-                fullWidth
-                value={loginData.password}
-                onChange={e => setLoginData(prev => ({ ...prev, password: e.target.value }))}
-            />
-        </DialogContent>
-        <DialogActions>
-            <Button onClick={onClose} color="secondary">
-                Abbrechen
-            </Button>
-            <Button onClick={onSubmit} color="primary" variant="contained">
-                Login
-            </Button>
-        </DialogActions>
-    </Dialog>
-);
+const LoginDialog: React.FC<LoginDialogProps> = ({ open, onClose, onSubmit, loginData, setLoginData }) => {
+    const [showRegister, setShowRegister] = useState(false);
+    const [registerData, setRegisterData] = useState({ email: "", password: "", confirmPassword: "" });
+
+    const handleRegister = () => {
+        setShowRegister(false);
+        setRegisterData({ email: "", password: "", confirmPassword: "" });
+        onClose();
+    };
+
+    return (
+        <Dialog open={open} onClose={onClose}>
+            <DialogTitle>{showRegister ? "Registrieren" : "Login"}</DialogTitle>
+            <DialogContent>
+                {showRegister ? (
+                    <>
+                        <TextField
+                            margin="dense"
+                            label="E-Mail"
+                            type="email"
+                            fullWidth
+                            value={registerData.email}
+                            onChange={e => setRegisterData(prev => ({ ...prev, email: e.target.value }))}
+                        />
+                        <TextField
+                            margin="dense"
+                            label="Passwort"
+                            type="password"
+                            fullWidth
+                            value={registerData.password}
+                            onChange={e => setRegisterData(prev => ({ ...prev, password: e.target.value }))}
+                        />
+                        <TextField
+                            margin="dense"
+                            label="Passwort wiederholen"
+                            type="password"
+                            fullWidth
+                            value={registerData.confirmPassword}
+                            onChange={e => setRegisterData(prev => ({ ...prev, confirmPassword: e.target.value }))}
+                        />
+                    </>
+                ) : (
+                    <>
+                        <TextField
+                            margin="dense"
+                            label="E-Mail"
+                            type="email"
+                            fullWidth
+                            value={loginData.email}
+                            onChange={e => setLoginData(prev => ({ ...prev, email: e.target.value }))}
+                        />
+                        <TextField
+                            autoFocus
+                            margin="dense"
+                            label="Passwort"
+                            type="password"
+                            fullWidth
+                            value={loginData.password}
+                            onChange={e => setLoginData(prev => ({ ...prev, password: e.target.value }))}
+                        />
+                    </>
+                )}
+            </DialogContent>
+            <DialogActions>
+                <Button onClick={onClose} color="secondary">
+                    Abbrechen
+                </Button>
+                {showRegister ? (
+                    <>
+                        <Button onClick={handleRegister} color="primary" variant="contained">
+                            Registrieren
+                        </Button>
+                    </>
+                ) : (
+                    <>
+                        <Button onClick={onSubmit} color="primary" variant="contained">
+                            Login
+                        </Button>
+                    </>
+                )}
+            </DialogActions>
+            {showRegister ? (
+                <Box sx={{ width: '100%', textAlign: 'center', pb: 2 }}>
+                    <Link
+                        component="button"
+                        variant="body2"
+                        onClick={() => setShowRegister(false)}
+                        color="primary"
+                        underline="hover"
+                    >
+                        Zurück zum Login
+                    </Link>
+                </Box>
+            ) : (
+                <Box sx={{ width: '100%', textAlign: 'center', pb: 2 }}>
+                    <Link
+                        component="button"
+                        variant="body2"
+                        onClick={() => setShowRegister(true)}
+                        color="primary"
+                        underline="hover"
+                    >
+                        Noch kein Konto? Registrieren
+                    </Link>
+                </Box>
+            )}
+        </Dialog>
+    );
+};
 
 export default LoginDialog;
\ No newline at end of file