chaos/VaultUI
1
0
Fork 0
Code Issues Activity

make TOTPNew page hide input boxes in QR mode

Browse source
This commit is contained in:
ChaotiCryptidz 2022-01-22 11:56:00 +00:00
parent 222512af05
commit 8132de764d
1 changed files with 30 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
src/ui/pages/Secrets/TOTP/TOTPNew.tsx
View file

@ -32,7 +32,7 @@ export class TOTPNewForm extends Component<
} }
errorMessageRef = createRef<ErrorMessage>(); errorMessageRef = createRef<ErrorMessage>();
uriInputRef = createRef<HTMLInputElement>(); nameInputRef = createRef<HTMLInputElement>();
async onSubmit(data: FormData): Promise<void> { async onSubmit(data: FormData): Promise<void> {
const parms = { const parms = {
@ -56,6 +56,7 @@ export class TOTPNewForm extends Component<
<Form onSubmit={(data) => this.onSubmit(data)}> <Form onSubmit={(data) => this.onSubmit(data)}>
<Margin> <Margin>
<input <input
ref={this.nameInputRef}
class="uk-input uk-form-width-medium" class="uk-input uk-form-width-medium"
name="name" name="name"
type="text" type="text"
@ -64,35 +65,40 @@ export class TOTPNewForm extends Component<
/> />
</Margin> </Margin>
<p hidden={this.state.qrMode}>{i18next.t("totp_new_info")}</p> {!this.state.qrMode && <p>{i18next.t("totp_new_info")}</p>}
<Margin> {!this.state.qrMode && (
<input <>
class="uk-input uk-form-width-medium" <Margin>
name="key" <input
type="text" class="uk-input uk-form-width-medium"
hidden={this.state.qrMode} name="key"
placeholder={i18next.t("totp_new_key_input")} type="text"
/> hidden={this.state.qrMode}
</Margin> placeholder={i18next.t("totp_new_key_input")}
/>
</Margin>
<Margin> <Margin>
<input <input
class="uk-input uk-form-width-medium" class="uk-input uk-form-width-medium"
ref={this.uriInputRef} name="uri"
name="uri" type="text"
type="text" hidden={this.state.qrMode}
hidden={this.state.qrMode} placeholder={i18next.t("totp_new_uri_input")}
placeholder={i18next.t("totp_new_uri_input")} />
/> </Margin>
</Margin> </>
)}
{/* TODO: please redo this to be more like Unseal page qr mode */}
{this.state.qrMode && ( {this.state.qrMode && (
<QRScanner <QRScanner
onScan={(uri) => { onScan={(uri) => {
this.uriInputRef.current.value = uri; let formData = new FormData();
formData.set("key", "");
formData.set("name", this.nameInputRef.current.value)
formData.set("uri", uri);
this.onSubmit(formData);
this.setState({ qrMode: !this.state.qrMode }); this.setState({ qrMode: !this.state.qrMode });
}} }}
/> />