Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Consolidate 4s passphrase input fields and use stable IDs #11743

Merged
merged 5 commits into from
Oct 13, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ import Spinner from "../../../../components/views/elements/Spinner";
import InteractiveAuthDialog from "../../../../components/views/dialogs/InteractiveAuthDialog";
import { IValidationResult } from "../../../../components/views/elements/Validation";
import { Icon as CheckmarkIcon } from "../../../../../res/img/element-icons/check.svg";
import PassphraseConfirmField from "../../../../components/views/auth/PassphraseConfirmField";

// I made a mistake while converting this and it has to be fixed!
enum Phase {
Expand Down Expand Up @@ -649,6 +650,7 @@ export default class CreateSecretStorageDialog extends React.PureComponent<IProp

<div className="mx_CreateSecretStorageDialog_passPhraseContainer">
<PassphraseField
id="mx_passPhraseInput"
className="mx_CreateSecretStorageDialog_passPhraseField"
onChange={this.onPassPhraseChange}
minScore={PASSWORD_MIN_SCORE}
Expand Down Expand Up @@ -710,14 +712,16 @@ export default class CreateSecretStorageDialog extends React.PureComponent<IProp
<form onSubmit={this.onPassPhraseConfirmNextClick}>
<p>{_t("settings|key_backup|setup_secure_backup|enter_phrase_to_confirm")}</p>
<div className="mx_CreateSecretStorageDialog_passPhraseContainer">
<Field
type="password"
<PassphraseConfirmField
id="mx_passPhraseInput"
onChange={this.onPassPhraseConfirmChange}
value={this.state.passPhraseConfirm}
className="mx_CreateSecretStorageDialog_passPhraseField"
label={_t("settings|key_backup|setup_secure_backup|confirm_security_phrase")}
label={_td("settings|key_backup|setup_secure_backup|confirm_security_phrase")}
labelRequired={_td("settings|key_backup|setup_secure_backup|confirm_security_phrase")}
labelInvalid={_td("settings|key_backup|setup_secure_backup|pass_phrase_match_failed")}
autoFocus={true}
autoComplete="new-password"
password={this.state.passPhrase}
/>
<div className="mx_CreateSecretStorageDialog_passPhraseMatch">{passPhraseMatch}</div>
</div>
Expand Down
1 change: 1 addition & 0 deletions src/components/views/auth/PassphraseConfirmField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,7 @@ class PassphraseConfirmField extends PureComponent<IProps> {
value={this.props.value}
onChange={this.props.onChange}
onValidate={this.onValidate}
autoFocus={this.props.autoFocus}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we're defining IProps in terms of Omit<IInputProps, ...> then it seems like we should rather strip out the props we know we don't want to pass through, and then pass through all the rest, otherwise this sort of thing will keep happening.

Maybe a job for another day though.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Indeed, not sure why the props were defined like that without a splat pass-through but I'd argue a job for another day

/>
);
}
Expand Down
Loading