Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-07-31 20:22:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 🎸 set option status

Browse Source
This commit is contained in:
Jin 2025-03-28 01:00:58 +01:00
parent d42b839c32
commit d92fa82ad0
3 changed files with 42 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -13,39 +13,26 @@ const TPL_WEB = `
<div class="form-group row"> <div class="form-group row">
<div class="col-md-6 side-checkbox"> <div class="col-md-6 side-checkbox">
<label class="form-check tn-checkbox"> <label class="form-check tn-checkbox">
<input type="checkbox" class="mfa-enabled-checkbox form-check-input" checked/> <input type="checkbox" class="mfa-enabled-checkbox form-check-input" />
${t("multi_factor_authentication.mfa_enabled")} ${t("multi_factor_authentication.mfa_enabled")}
</label> </label>
</div> </div>
</div> </div>
<div class="mfa-options" style="display: none;"> <div class="mfa-options" style="display: none;">
<div class="form-group row">
<div class="col-md-6">
<label class="form-label"><b>${t("multi_factor_authentication.mfa_method")}</b></label> <label class="form-label"><b>${t("multi_factor_authentication.mfa_method")}</b></label>
<div class="form-check"> <div role="group">
<input type="radio" class="form-check-input auth-method-radio" name="mfaMethod" value="totp" checked /> <label class="tn-radio">
<label class="form-check-label">${t("multi_factor_authentication.totp_title")}</label> <input class="mfa-method-radio" type="radio" name="mfaMethod" value="totp" />
</div> <b>${t("multi_factor_authentication.totp_title")}</b>
<div class="form-check"> </label>
<input type="radio" class="form-check-input auth-method-radio" name="mfaMethod" value="oauth" /> <label class="tn-radio">
<label class="form-check-label">${t("multi_factor_authentication.oauth_title")}</label> <input class="mfa-method-radio" type="radio" name="mfaMethod" value="oauth" />
</div> <b>${t("multi_factor_authentication.oauth_title")}</b>
</div> </label>
</div> </div>
<div class="totp-options" style="display: none;"> <div class="totp-options" style="display: none;">
<div class="form-group row">
<div class="col-md-6 side-checkbox">
<label class="form-check tn-checkbox">
<input type="checkbox" class="totp-enabled form-check-input" disabled />
<b>${t("multi_factor_authentication.totp_enabled")}</b>
</label>
</div>
</div>
<div class="alert alert-warning env-totp-enabled" role="alert" style="font-weight: bold; color: red !important;"></div>
<p class="form-text">${t("multi_factor_authentication.totp_description")}</p> <p class="form-text">${t("multi_factor_authentication.totp_description")}</p>
<div class="form-group"> <div class="form-group">
@ -107,17 +94,6 @@ const TPL_WEB = `
</div> </div>
<div class="oauth-options" style="display: none;"> <div class="oauth-options" style="display: none;">
<div class="form-group row">
<div class="col-md-6 side-checkbox">
<label class="form-check tn-checkbox">
<input type="checkbox" class="oauth-enabled-checkbox form-check-input" disabled />
<b>${t("multi_factor_authentication.oauth_enabled")}</b>
</label>
</div>
</div>
<div class="alert alert-warning env-oauth-enabled" role="alert" style="font-weight: bold; color: red !important;"></div>
<div class="col-md-6"> <div class="col-md-6">
<span><b>${t("multi_factor_authentication.oauth_user_account")}</b></span><span class="user-account-name"> ${t("multi_factor_authentication.oauth_user_not_logged_in")}</span> <span><b>${t("multi_factor_authentication.oauth_user_account")}</b></span><span class="user-account-name"> ${t("multi_factor_authentication.oauth_user_not_logged_in")}</span>
<br> <br>
@ -157,10 +133,8 @@ interface RecoveryKeysResponse {
export default class MultiFactorAuthenticationOptions extends OptionsWidget { export default class MultiFactorAuthenticationOptions extends OptionsWidget {
private $generateTotpButton!: JQuery<HTMLElement>; private $generateTotpButton!: JQuery<HTMLElement>;
private $totpEnabled!: JQuery<HTMLElement>;
private $totpSecret!: JQuery<HTMLElement>; private $totpSecret!: JQuery<HTMLElement>;
private $generateRecoveryCodeButton!: JQuery<HTMLElement>; private $generateRecoveryCodeButton!: JQuery<HTMLElement>;
private $oAuthEnabledCheckbox!: JQuery<HTMLElement>;
private $UserAccountName!: JQuery<HTMLElement>; private $UserAccountName!: JQuery<HTMLElement>;
private $UserAccountEmail!: JQuery<HTMLElement>; private $UserAccountEmail!: JQuery<HTMLElement>;
private $envEnabledTOTP!: JQuery<HTMLElement>; private $envEnabledTOTP!: JQuery<HTMLElement>;
@ -169,7 +143,7 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
private $protectedSessionTimeout!: JQuery<HTMLElement>; private $protectedSessionTimeout!: JQuery<HTMLElement>;
private $mfaEnabledCheckbox!: JQuery<HTMLElement>; private $mfaEnabledCheckbox!: JQuery<HTMLElement>;
private $mfaOptions!: JQuery<HTMLElement>; private $mfaOptions!: JQuery<HTMLElement>;
private $authMethodRadios!: JQuery<HTMLElement>; private $mfaMethodRadios!: JQuery<HTMLElement>;
private $totpOptions!: JQuery<HTMLElement>; private $totpOptions!: JQuery<HTMLElement>;
private $oauthOptions!: JQuery<HTMLElement>; private $oauthOptions!: JQuery<HTMLElement>;
@ -180,15 +154,13 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
if (!utils.isElectron()) { if (!utils.isElectron()) {
this.$mfaEnabledCheckbox = this.$widget.find(".mfa-enabled-checkbox"); this.$mfaEnabledCheckbox = this.$widget.find(".mfa-enabled-checkbox");
this.$mfaOptions = this.$widget.find(".mfa-options"); this.$mfaOptions = this.$widget.find(".mfa-options");
this.$authMethodRadios = this.$widget.find(".auth-method-radio"); this.$mfaMethodRadios = this.$widget.find(".mfa-method-radio");
this.$totpOptions = this.$widget.find(".totp-options"); this.$totpOptions = this.$widget.find(".totp-options");
this.$oauthOptions = this.$widget.find(".oauth-options"); this.$oauthOptions = this.$widget.find(".oauth-options");
this.$generateTotpButton = this.$widget.find(".generate-totp"); this.$generateTotpButton = this.$widget.find(".generate-totp");
this.$totpEnabled = this.$widget.find(".totp-enabled");
this.$totpSecret = this.$widget.find(".totp-secret"); this.$totpSecret = this.$widget.find(".totp-secret");
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.$UserAccountName = this.$widget.find(".user-account-name"); this.$UserAccountName = this.$widget.find(".user-account-name");
this.$UserAccountEmail = this.$widget.find(".user-account-email"); this.$UserAccountEmail = this.$widget.find(".user-account-email");
this.$envEnabledTOTP = this.$widget.find(".env-totp-enabled"); this.$envEnabledTOTP = this.$widget.find(".env-totp-enabled");
@ -215,17 +187,24 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
this.displayRecoveryKeys(); this.displayRecoveryKeys();
this.$mfaEnabledCheckbox.on("change", () => { this.$mfaEnabledCheckbox.on("change", () => {
this.$mfaOptions.toggle(this.$mfaEnabledCheckbox.is(":checked")); const isChecked = this.$mfaEnabledCheckbox.is(":checked");
if (!this.$mfaEnabledCheckbox.is(":checked")) { this.$mfaOptions.toggle(isChecked);
if (!isChecked) {
this.$totpOptions.hide(); this.$totpOptions.hide();
this.$oauthOptions.hide(); this.$oauthOptions.hide();
} else {
this.$mfaMethodRadios.filter('[value="totp"]').prop("checked", true);
this.$totpOptions.show();
this.$oauthOptions.hide();
} }
this.updateCheckboxOption("mfaEnabled", this.$mfaEnabledCheckbox);
}); });
this.$authMethodRadios.on("change", () => { this.$mfaMethodRadios.on("change", () => {
const selectedMethod = this.$authMethodRadios.filter(":checked").val(); const selectedMethod = this.$mfaMethodRadios.filter(":checked").val();
this.$totpOptions.toggle(selectedMethod === "totp"); this.$totpOptions.toggle(selectedMethod === "totp");
this.$oauthOptions.toggle(selectedMethod === "oauth"); this.$oauthOptions.toggle(selectedMethod === "oauth");
this.updateOption("mfaMethod", selectedMethod);
}); });
} }
} }
@ -295,9 +274,21 @@ export default class MultiFactorAuthenticationOptions extends OptionsWidget {
optionsLoaded(options: OptionMap) { optionsLoaded(options: OptionMap) {
if (!utils.isElectron()) { if (!utils.isElectron()) {
this.$mfaEnabledCheckbox.prop("checked", options.mfaEnabled === "true");
this.$mfaOptions.toggle(options.mfaEnabled === "true");
if (options.mfaEnabled === "true") {
const savedMethod = options.mfaMethod || "totp";
this.$mfaMethodRadios.filter(`[value="${savedMethod}"]`).prop("checked", true);
this.$totpOptions.toggle(savedMethod === "totp");
this.$oauthOptions.toggle(savedMethod === "oauth");
} else {
this.$totpOptions.hide();
this.$oauthOptions.hide();
}
server.get<OAuthStatus>("oauth/status").then((result) => { server.get<OAuthStatus>("oauth/status").then((result) => {
if (result.enabled) { if (result.enabled) {
this.$oAuthEnabledCheckbox.prop("checked", result.enabled);
if (result.name) this.$UserAccountName.text(result.name); if (result.name) this.$UserAccountName.text(result.name);
if (result.email) this.$UserAccountEmail.text(result.email); if (result.email) this.$UserAccountEmail.text(result.email);
@ -310,14 +301,11 @@ 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.$generateTotpButton.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("disabled", true);
this.$generateTotpButton.prop("disabled", true); this.$generateTotpButton.prop("disabled", true);
this.$generateRecoveryCodeButton.prop("disabled", true); this.$generateRecoveryCodeButton.prop("disabled", true);

4
src/routes/api/options.ts
View File

@ -80,7 +80,9 @@ const ALLOWED_OPTIONS = new Set<OptionNames>([
"allowedHtmlTags", "allowedHtmlTags",
"redirectBareDomain", "redirectBareDomain",
"showLoginInShareTheme", "showLoginInShareTheme",
"splitEditorOrientation" "splitEditorOrientation",
"mfaEnabled",
"mfaMethod"
]); ]);
function getOptions() { function getOptions() {

4
src/services/options_interface.ts
View File

@ -49,10 +49,10 @@ export interface OptionDefinitions extends KeyboardShortcutsOptions<KeyboardActi
hoistedNoteId: string; hoistedNoteId: string;
// Multi-Factor Authentication // Multi-Factor Authentication
totpEnabled: boolean; mfaEnabled: boolean;
mfaMethod: string;
encryptedRecoveryCodes: boolean; encryptedRecoveryCodes: boolean;
userSubjectIdentifierSaved: boolean; userSubjectIdentifierSaved: boolean;
oAuthEnabled: boolean;
recoveryCodeInitialVector: string; recoveryCodeInitialVector: string;
recoveryCodeSecurityKey: string; recoveryCodeSecurityKey: string;
recoveryCodesEncrypted: string; recoveryCodesEncrypted: string;