From 6ec6e8f2d34357c899c3fc1d3d5f9d51bae3592d Mon Sep 17 00:00:00 2001
From: QuickMythril <quickmythril@protonmail.com>
Date: Tue, 3 Dec 2024 04:40:43 -0500
Subject: [PATCH 1/2] focus password field when login page loads

---
 src/App.tsx                                    | 7 +++++++
 src/components/PasswordField/PasswordField.tsx | 7 ++++---
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index bae0609..77d2585 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -395,6 +395,12 @@ function App() {
     const seedPhrase = generatorRef.current.parsedString
     saveSeedPhraseToDisk(seedPhrase)
   }
+  const passwordRef = useRef<HTMLInputElement>(null);
+  useEffect(() => {
+    if (extState === "wallet-dropped" && passwordRef.current) {
+      passwordRef.current.focus();
+    }
+  }, [extState]);
   useEffect(() => {
     const isDevModeFromStorage = localStorage.getItem("isEnabledDevMode");
     if (isDevModeFromStorage) {
@@ -2318,6 +2324,7 @@ function App() {
                   authenticateWallet();
                 }
               }}
+              ref={passwordRef}
             />
             <Spacer height="20px" />
             <CustomButton onClick={authenticateWallet}>
diff --git a/src/components/PasswordField/PasswordField.tsx b/src/components/PasswordField/PasswordField.tsx
index 12002d6..25741b6 100644
--- a/src/components/PasswordField/PasswordField.tsx
+++ b/src/components/PasswordField/PasswordField.tsx
@@ -1,5 +1,5 @@
 import { Button, InputAdornment, TextField, TextFieldProps, styled } from "@mui/material";
-import { useState } from 'react'
+import React, { forwardRef, useState } from 'react'
 
 export const CustomInput = styled(TextField)({
     width: "183px", // Adjust the width as needed
@@ -41,7 +41,7 @@ export const CustomInput = styled(TextField)({
 });
 
 
-export const PasswordField: React.FunctionComponent<TextFieldProps> = ({ ...props }) => {
+export const PasswordField = forwardRef<HTMLInputElement, TextFieldProps>( ({ ...props }, ref) => {
     const [canViewPassword, setCanViewPassword] = useState(false);
     return (
             <CustomInput
@@ -55,7 +55,8 @@ export const PasswordField: React.FunctionComponent<TextFieldProps> = ({ ...prop
                         </InputAdornment>
                     )
                 }}
+                inputRef={ref}
                 {...props}
             />
     )
-}
\ No newline at end of file
+});
\ No newline at end of file

From 51c16e43d7b09ab51bd284d99bb5efdf7e0ea31e Mon Sep 17 00:00:00 2001
From: QuickMythril <quickmythril@protonmail.com>
Date: Tue, 3 Dec 2024 04:45:21 -0500
Subject: [PATCH 2/2] remove unnecessary import

---
 src/components/PasswordField/PasswordField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/PasswordField/PasswordField.tsx b/src/components/PasswordField/PasswordField.tsx
index 25741b6..4ff4a80 100644
--- a/src/components/PasswordField/PasswordField.tsx
+++ b/src/components/PasswordField/PasswordField.tsx
@@ -1,5 +1,5 @@
 import { Button, InputAdornment, TextField, TextFieldProps, styled } from "@mui/material";
-import React, { forwardRef, useState } from 'react'
+import { forwardRef, useState } from 'react'
 
 export const CustomInput = styled(TextField)({
     width: "183px", // Adjust the width as needed