| @@ -94,15 +94,29 @@ const LoginForm: React.FC = () => { | |||||
| <TextField | <TextField | ||||
| label={t("Username")} | label={t("Username")} | ||||
| {...register("username", { required: t("Please enter a username") })} | {...register("username", { required: t("Please enter a username") })} | ||||
| error={Boolean(errors.username)} | error={Boolean(errors.username)} | ||||
| helperText={errors.username?.message} | helperText={errors.username?.message} | ||||
| /> | /> | ||||
| <TextField | <TextField | ||||
| label={t("Password")} | label={t("Password")} | ||||
| type="password" | |||||
| type={showPassword ? "text" : "password"} | |||||
| {...register("password", { required: t("Please enter a password") })} | {...register("password", { required: t("Please enter a password") })} | ||||
| error={Boolean(errors.password)} | error={Boolean(errors.password)} | ||||
| helperText={errors.password?.message} | helperText={errors.password?.message} | ||||
| InputProps={{ | |||||
| endAdornment: ( | |||||
| <InputAdornment position="end"> | |||||
| <IconButton | |||||
| aria-label="toggle password visibility" | |||||
| onClick={handleClickShowPassword} | |||||
| onMouseDown={handleMouseDownPassword} | |||||
| > | |||||
| {showPassword ? <Visibility /> : <VisibilityOff />} | |||||
| </IconButton> | |||||
| </InputAdornment> | |||||
| ), | |||||
| }} | |||||
| /> | /> | ||||
| {serverError && ( | {serverError && ( | ||||
| <FormHelperText error> | <FormHelperText error> | ||||