feat(react/settings): port share settings

This commit is contained in:
Elian Doran 2025-08-18 18:19:48 +03:00
parent 95af901808
commit 27cc33888a
No known key found for this signature in database
2 changed files with 45 additions and 96 deletions

View File

@ -7,8 +7,11 @@ import FormText from "../../react/FormText";
import OptionsSection from "./components/OptionsSection";
import TimeSelector from "./components/TimeSelector";
import { useMemo } from "preact/hooks";
import { useTriliumOptionJson } from "../../react/hooks";
import { useTriliumOptionBool, useTriliumOptionJson } from "../../react/hooks";
import { SANITIZER_DEFAULT_ALLOWED_TAGS } from "@triliumnext/commons";
import FormCheckbox from "../../react/FormCheckbox";
import FormGroup from "../../react/FormGroup";
import search from "../../../services/search";
export default function OtherSettings() {
return (
@ -17,6 +20,7 @@ export default function OtherSettings() {
<AttachmentErasureTimeout />
<RevisionSnapshotInterval />
<HtmlImportTags />
<ShareSettings />
</>
)
}
@ -123,4 +127,44 @@ function HtmlImportTags() {
/>
</OptionsSection>
)
}
function ShareSettings() {
const [ redirectBareDomain, setRedirectBareDomain ] = useTriliumOptionBool("redirectBareDomain");
const [ showLogInShareTheme, setShowLogInShareTheme ] = useTriliumOptionBool("showLoginInShareTheme");
return (
<OptionsSection title={t("share.title")}>
<FormGroup description={t("share.redirect_bare_domain_description")}>
<FormCheckbox
name="redirectBareDomain"
label={t(t("share.redirect_bare_domain"))}
currentValue={redirectBareDomain}
onChange={async value => {
if (value) {
const shareRootNotes = await search.searchForNotes("#shareRoot");
const sharedShareRootNote = shareRootNotes.find((note) => note.isShared());
if (sharedShareRootNote) {
toast.showMessage(t("share.share_root_found", { noteTitle: sharedShareRootNote.title }));
} else if (shareRootNotes.length > 0) {
toast.showError(t("share.share_root_not_shared", { noteTitle: shareRootNotes[0].title }));
} else {
toast.showError(t("share.share_root_not_found"));
}
}
setRedirectBareDomain(value);
}}
/>
</FormGroup>
<FormGroup description={t("share.show_login_link_description")}>
<FormCheckbox
name="showLoginInShareTheme"
label={t("share.show_login_link")}
currentValue={showLogInShareTheme} onChange={setShowLogInShareTheme}
/>
</FormGroup>
</OptionsSection>
)
}

View File

@ -1,95 +0,0 @@
import OptionsWidget from "../options_widget.js";
import options from "../../../../services/options.js";
import { t } from "../../../../services/i18n.js";
import type { OptionMap, OptionNames } from "@triliumnext/commons";
import searchService from "../../../../services/search.js";
const TPL = /*html*/`
<div class="options-section">
<h4>${t("share.title")}</h4>
<label class="tn-checkbox">
<input class="form-check-input" type="checkbox" name="redirectBareDomain" value="true">
${t("share.redirect_bare_domain")}
</label>
<p class="form-text">${t("share.redirect_bare_domain_description")}</p>
<label class="tn-checkbox">
<input class="form-check-input" type="checkbox" name="showLoginInShareTheme" value="true">
${t("share.show_login_link")}
</label>
<p class="form-text">${t("share.show_login_link_description")}</p>
</div>`;
export default class ShareSettingsOptions extends OptionsWidget {
private $shareRootCheck!: JQuery<HTMLElement>;
private $shareRootStatus!: JQuery<HTMLElement>;
doRender() {
this.$widget = $(TPL);
this.contentSized();
this.$shareRootCheck = this.$widget.find(".share-root-check");
this.$shareRootStatus = this.$widget.find(".share-root-status");
// Add change handlers for both checkboxes
this.$widget.find('input[type="checkbox"]').on("change", (e: JQuery.ChangeEvent) => {
this.save();
// Show/hide share root status section based on redirectBareDomain checkbox
const target = e.target as HTMLInputElement;
if (target.name === "redirectBareDomain") {
this.$shareRootCheck.toggle(target.checked);
if (target.checked) {
this.checkShareRoot();
}
}
});
// Add click handler for check share root button
this.$widget.find(".check-share-root").on("click", () => this.checkShareRoot());
}
async optionsLoaded(options: OptionMap) {
const redirectBareDomain = options.redirectBareDomain === "true";
this.$widget.find('input[name="redirectBareDomain"]').prop("checked", redirectBareDomain);
this.$shareRootCheck.toggle(redirectBareDomain);
if (redirectBareDomain) {
await this.checkShareRoot();
}
this.$widget.find('input[name="showLoginInShareTheme"]').prop("checked", options.showLoginInShareTheme === "true");
}
async checkShareRoot() {
const $button = this.$widget.find(".check-share-root");
$button.prop("disabled", true);
try {
const shareRootNotes = await searchService.searchForNotes("#shareRoot");
const sharedShareRootNote = shareRootNotes.find((note) => note.isShared());
if (sharedShareRootNote) {
this.$shareRootStatus
.removeClass("text-danger")
.addClass("text-success")
.text(t("share.share_root_found", { noteTitle: sharedShareRootNote.title }));
} else {
this.$shareRootStatus
.removeClass("text-success")
.addClass("text-danger")
.text(shareRootNotes.length > 0 ? t("share.share_root_not_shared", { noteTitle: shareRootNotes[0].title }) : t("share.share_root_not_found"));
}
} finally {
$button.prop("disabled", false);
}
}
async save() {
const redirectBareDomain = this.$widget.find('input[name="redirectBareDomain"]').prop("checked");
await this.updateOption<"redirectBareDomain">("redirectBareDomain", redirectBareDomain.toString());
const showLoginInShareTheme = this.$widget.find('input[name="showLoginInShareTheme"]').prop("checked");
await this.updateOption<"showLoginInShareTheme">("showLoginInShareTheme", showLoginInShareTheme.toString());
}
}