Webatrice: fix saved password (#4563)

* fix saved label, and fix using hashedPassword when Save is unchecked

* update host only after successful login

* cleanup

* fix ability to deselect saved password on successful login

* cleanup

* clear options after connection

* fix registration saved username

* cleanup

* change label

* fix tests

Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>
This commit is contained in:
Jeremy Letto 2022-02-27 10:12:38 -06:00 committed by GitHub
parent 9577ada171
commit 2a54e9d7d1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 170 additions and 169 deletions

View file

@ -13,7 +13,7 @@ import { APP_USER } from 'types';
import './LoginForm.css';
const PASSWORD_LABEL = 'Password';
const STORED_PASSWORD_LABEL = '* SAVED *';
const STORED_PASSWORD_LABEL = '* Saved Password *';
const LoginForm = ({ onSubmit, disableSubmitButton, onResetPassword }: LoginFormProps) => {
const [host, setHost] = useState(null);
@ -33,7 +33,7 @@ const LoginForm = ({ onSubmit, disableSubmitButton, onResetPassword }: LoginForm
return errors;
}
const useStoredPassword = (remember) => remember && host.hashedPassword;
const useStoredPassword = (remember, password) => remember && host.hashedPassword && !password;
const togglePasswordLabel = (useStoredLabel) => {
setPasswordLabel(useStoredLabel ? STORED_PASSWORD_LABEL : PASSWORD_LABEL);
};
@ -78,12 +78,12 @@ const LoginForm = ({ onSubmit, disableSubmitButton, onResetPassword }: LoginForm
onRememberChange(host.remember);
onAutoConnectChange(host.remember && autoConnect);
togglePasswordLabel(useStoredPassword(host.remember));
togglePasswordLabel(useStoredPassword(host.remember, values.password));
}, [host]);
const onUserNameChange = (userName) => {
const fieldChanged = host.userName?.toLowerCase() !== values.userName?.toLowerCase();
if (useStoredPassword(values.remember) && fieldChanged) {
if (useStoredPassword(values.remember, values.password) && fieldChanged) {
setHost(({ hashedPassword, ...s }) => ({ ...s, userName }));
}
}
@ -95,7 +95,7 @@ const LoginForm = ({ onSubmit, disableSubmitButton, onResetPassword }: LoginForm
onAutoConnectChange(false);
}
togglePasswordLabel(useStoredPassword(checked));
togglePasswordLabel(useStoredPassword(checked, values.password));
}
const onAutoConnectChange = (checked) => {
@ -119,7 +119,7 @@ const LoginForm = ({ onSubmit, disableSubmitButton, onResetPassword }: LoginForm
<Field
label={passwordLabel}
onFocus={() => setPasswordLabel(PASSWORD_LABEL)}
onBlur={() => togglePasswordLabel(useStoredPassword(values.remember))}
onBlur={() => togglePasswordLabel(useStoredPassword(values.remember, values.password))}
name='password'
type='password'
component={InputField}