From 8b9328b41c3eeabfd9cf6f3e98d74738e0f0722c Mon Sep 17 00:00:00 2001
From: Anton Tranelis <mail@antontranelis.de>
Date: Thu, 2 May 2024 22:53:03 +0200
Subject: [PATCH] login with enter

---
 src/Components/Auth/LoginPage.tsx  | 20 +++++++++++++++++++-
 src/Components/Auth/SignupPage.tsx | 15 ++++++++++++++-
 2 files changed, 33 insertions(+), 2 deletions(-)

diff --git a/src/Components/Auth/LoginPage.tsx b/src/Components/Auth/LoginPage.tsx
index 83d499f5..f900387c 100644
--- a/src/Components/Auth/LoginPage.tsx
+++ b/src/Components/Auth/LoginPage.tsx
@@ -1,4 +1,4 @@
-import { useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { Link, useNavigate } from 'react-router-dom'
 import ErrorText from '../Typography/ErrorText'
 import { TextInput } from '../Input/TextInput'
@@ -17,6 +17,8 @@ export function LoginPage() {
     const navigate = useNavigate();
 
     const onLogin = async () => {
+        console.log(email);
+        console.log(password);
         await toast.promise(
             login({ email: email, password: password }),
             {
@@ -37,6 +39,22 @@ export function LoginPage() {
             });
     }
 
+
+    
+
+    useEffect(() => {
+        const keyDownHandler = event => {   
+          if (event.key === 'Enter') {
+            event.preventDefault();
+            onLogin();
+          }
+        };
+        document.addEventListener('keydown', keyDownHandler);
+        return () => {
+          document.removeEventListener('keydown', keyDownHandler);
+        };
+      }, [onLogin]);
+
     return (
         <MapOverlayPage backdrop className='tw-max-w-xs tw-h-fit'>
             <h2 className='tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center'>Login</h2>
diff --git a/src/Components/Auth/SignupPage.tsx b/src/Components/Auth/SignupPage.tsx
index 5f062467..9569032b 100644
--- a/src/Components/Auth/SignupPage.tsx
+++ b/src/Components/Auth/SignupPage.tsx
@@ -1,4 +1,4 @@
-import { useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { Link, useNavigate } from 'react-router-dom'
 import ErrorText from '../Typography/ErrorText'
 import { TextInput } from '../Input/TextInput'
@@ -39,6 +39,19 @@ export function SignupPage() {
             });
     }
 
+    useEffect(() => {
+        const keyDownHandler = event => {   
+          if (event.key === 'Enter') {
+            event.preventDefault();
+            onRegister();
+          }
+        };
+        document.addEventListener('keydown', keyDownHandler);
+        return () => {
+          document.removeEventListener('keydown', keyDownHandler);
+        };
+      }, [onRegister]);
+
 
     return (
         <MapOverlayPage backdrop className='tw-max-w-xs  tw-h-fit'>