focus password field when login page loads

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}>

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}
             />
     )
-}
+});