fixed type errors

src/components/SettingForms/NPED/NPEDFields.tsx

@@ -3,14 +3,18 @@ import FormGroup from "../components/FormGroup";
 import type { NPEDErrorValues, NPEDFieldType } from "../../../types/types";
 import { useNPEDAuth } from "../../../hooks/useNPEDAuth";
 import { toast } from "sonner";
+import { faEyeSlash, faEye } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useState } from "react";
 
 const NPEDFields = () => {
+  const [showPwd, setShowPwd] = useState(false);
   const { signIn, user, signOut } = useNPEDAuth();
 
   const initialValues = user
     ? {
         username: user.propUsername.value,
-        password: "",
+        password: user.propPassword.value,
         clientId: user.propClientID.value,
         frontId: "NPED",
         rearId: "NPED",
@@ -49,6 +53,7 @@ const NPEDFields = () => {
       initialValues={initialValues}
       onSubmit={handleSubmit}
       validate={validateValues}
+      enableReinitialize
     >
       {({ errors, touched }) => (
         <Form className="flex flex-col space-y-5">
@@ -76,11 +81,17 @@ const NPEDFields = () => {
             )}
             <Field
               name="password"
-              type="password"
+              type={showPwd ? "text" : "password"}
               id="password"
               placeholder="NPED Password"
               className="p-1.5 border border-gray-400 rounded-lg"
             />
+            <FontAwesomeIcon
+              type="button"
+              className="absolute right-5 end-0"
+              onClick={() => setShowPwd((s) => !s)}
+              icon={showPwd ? faEyeSlash : faEye}
+            />
           </FormGroup>
           <FormGroup>
             <label htmlFor="clientId">Client ID</label>