Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-10-19 13:11:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 🎸 Improve TOTP setting page

Browse Source
This commit is contained in:
Jin 2025-03-26 03:22:57 +01:00
parent 979000c5c8
commit 4959dbf126
2 changed files with 8 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/public/app/widgets/type_widgets/options/multi_factor_authentication.ts
View File

@ -57,7 +57,7 @@ const TPL = `
<div class="totp-secret">${t("multi_factor_authentication.totp_secret_description")}</div> <div class="totp-secret">${t("multi_factor_authentication.totp_secret_description")}</div>
</div> </div>
<button class="regenerate-totp btn btn-primary"> ${t("multi_factor_authentication.totp_secret_generate")} </button> <button class="generate-totp btn btn-primary"> ${t("multi_factor_authentication.totp_secret_generate")} </button>
</div> </div>
<div class="options-section"> <div class="options-section">
@ -98,7 +98,7 @@ const TPL = `
<br> <br>
<button class="generate-recovery-code btn btn-primary" disabled="true"> Generate Recovery Keys </button> <button class="generate-recovery-code btn btn-primary" disabled="true"> ${t("multi_factor_authentication.recovery_keys_generate")} </button>
</div> </div>
`; `;
@ -121,10 +121,9 @@ interface RecoveryKeysResponse {
} }
export default class MultiFactorAuthenticationOptions extends OptionsWidget { export default class MultiFactorAuthenticationOptions extends OptionsWidget {
private $regenerateTotpButton!: JQuery<HTMLElement>; private $generateTotpButton!: JQuery<HTMLElement>;
private $totpEnabled!: JQuery<HTMLElement>; private $totpEnabled!: JQuery<HTMLElement>;
private $totpSecret!: JQuery<HTMLElement>; private $totpSecret!: JQuery<HTMLElement>;
private $authenticatorCode!: JQuery<HTMLElement>;
private $generateRecoveryCodeButton!: JQuery<HTMLElement>; private $generateRecoveryCodeButton!: JQuery<HTMLElement>;
private $oAuthEnabledCheckbox!: JQuery<HTMLElement>; private $oAuthEnabledCheckbox!: JQuery<HTMLElement>;
private $UserAccountName!: JQuery<HTMLElement>; private $UserAccountName!: JQuery<HTMLElement>;
@ -137,10 +136,9 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
doRender() { doRender() {
this.$widget = $(TPL); this.$widget = $(TPL);
this.$regenerateTotpButton = this.$widget.find(".regenerate-totp"); this.$generateTotpButton = this.$widget.find(".generate-totp");
this.$totpEnabled = this.$widget.find(".totp-enabled"); this.$totpEnabled = this.$widget.find(".totp-enabled");
this.$totpSecret = this.$widget.find(".totp-secret"); this.$totpSecret = this.$widget.find(".totp-secret");
this.$authenticatorCode = this.$widget.find(".authenticator-code");
this.$generateRecoveryCodeButton = this.$widget.find(".generate-recovery-code"); this.$generateRecoveryCodeButton = this.$widget.find(".generate-recovery-code");
this.$oAuthEnabledCheckbox = this.$widget.find(".oauth-enabled-checkbox"); this.$oAuthEnabledCheckbox = this.$widget.find(".oauth-enabled-checkbox");
this.$UserAccountName = this.$widget.find(".user-account-name"); this.$UserAccountName = this.$widget.find(".user-account-name");
@ -157,7 +155,7 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
await this.setRecoveryKeys(); await this.setRecoveryKeys();
}); });
this.$regenerateTotpButton.on("click", async () => { this.$generateTotpButton.on("click", async () => {
await this.generateKey(); await this.generateKey();
}); });
@ -249,14 +247,14 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
server.get<TOTPStatus>("totp/status").then((result) => { server.get<TOTPStatus>("totp/status").then((result) => {
if (result.enabled) { if (result.enabled) {
this.$totpEnabled.prop("checked", result.message); this.$totpEnabled.prop("checked", result.message);
this.$authenticatorCode.prop("disabled", !result.message); this.$generateTotpButton.prop("disabled", !result.message);
this.$generateRecoveryCodeButton.prop("disabled", !result.message); this.$generateRecoveryCodeButton.prop("disabled", !result.message);
this.$envEnabledTOTP.hide(); this.$envEnabledTOTP.hide();
} else { } else {
this.$totpEnabled.prop("checked", false); this.$totpEnabled.prop("checked", false);
this.$totpEnabled.prop("disabled", true); this.$totpEnabled.prop("disabled", true);
this.$authenticatorCode.prop("disabled", true); this.$generateTotpButton.prop("disabled", true);
this.$generateRecoveryCodeButton.prop("disabled", true); this.$generateRecoveryCodeButton.prop("disabled", true);
this.$envEnabledTOTP.text(t("multi_factor_authentication.totp_enable_description")); this.$envEnabledTOTP.text(t("multi_factor_authentication.totp_enable_description"));

2
src/public/translations/en/translation.json
View File

@ -1319,7 +1319,7 @@
"oauth_user_email": "User Email:", "oauth_user_email": "User Email:",
"oauth_user_not_logged_in": "Not logged in!", "oauth_user_not_logged_in": "Not logged in!",
"oauth_description": "OpenID is a standardized way to let you log into websites using an account from another service, like Google, to verify your identity.", "oauth_description": "OpenID is a standardized way to let you log into websites using an account from another service, like Google, to verify your identity.",
"totp_title": "Time-based One-Time Password", "totp_title": "Time-based One-Time Password (TOTP)",
"totp_enabled": "TOTP Enabled", "totp_enabled": "TOTP Enabled",
"totp_enable_description": "Set totpEnabled in config file or TRILIUM_TOTP_ENABLED environment variable to true to enable (Requires restart)", "totp_enable_description": "Set totpEnabled in config file or TRILIUM_TOTP_ENABLED environment variable to true to enable (Requires restart)",
"totp_description": "TOTP (Time-Based One-Time Password) is a security feature that generates a unique, temporary code which changes every 30 seconds. You use this code, along with your password to log into your account, making it much harder for anyone else to access it.", "totp_description": "TOTP (Time-Based One-Time Password) is a security feature that generates a unique, temporary code which changes every 30 seconds. You use this code, along with your password to log into your account, making it much harder for anyone else to access it.",