From 964633f426a87a3ab49785816f323425cf8c55b1 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 15:36:58 +0200
Subject: [PATCH 01/13] refactor(client/web_view): fix lint & formatting

---
 .../src/widgets/type_widgets/WebView.tsx      | 59 ++++++++++---------
 1 file changed, 31 insertions(+), 28 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/WebView.tsx b/apps/client/src/widgets/type_widgets/WebView.tsx
index 3b47a0cd15..40c5ef8655 100644
--- a/apps/client/src/widgets/type_widgets/WebView.tsx
+++ b/apps/client/src/widgets/type_widgets/WebView.tsx
@@ -1,13 +1,15 @@
+import "./WebView.css";
+
 import { useCallback, useState } from "preact/hooks";
+
 import FNote from "../../entities/fnote";
 import { t } from "../../services/i18n";
+import toast from "../../services/toast";
 import utils from "../../services/utils";
+import Button from "../react/Button";
+import FormGroup from "../react/FormGroup";
 import { useNoteLabel } from "../react/hooks";
 import { TypeWidgetProps } from "./type_widget";
-import "./WebView.css";
-import FormGroup from "../react/FormGroup";
-import toast from "../../services/toast";
-import Button from "../react/Button";
 
 const isElectron = utils.isElectron();
 
@@ -22,47 +24,48 @@ export default function WebView({ note }: TypeWidgetProps) {
 
 function WebViewContent({ src }: { src: string }) {
     if (!isElectron) {
-        return <iframe src={src} class="note-detail-web-view-content" sandbox="allow-same-origin allow-scripts allow-popups" />
-    } else {
-        return <webview src={src} class="note-detail-web-view-content" />
+        return <iframe src={src} class="note-detail-web-view-content" sandbox="allow-same-origin allow-scripts allow-popups" />;
     }
+    return <webview src={src} class="note-detail-web-view-content" />;
+
 }
 
 function SetupWebView({note}: {note: FNote}) {
-    const [srcLabel, setSrcLabel] = useNoteLabel(note, "webViewSrc");
-    const [src, setSrc] = useState("");
+    const [ , setSrcLabel] = useNoteLabel(note, "webViewSrc");
+    const [ src, setSrc ] = useState("");
 
     const submit = useCallback((url: string) => {
         try {
             // Validate URL
             new URL(url);
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
         } catch (ex) {
             toast.showErrorTitleAndMessage(t("web_view_setup.invalid_url_title"),
-                                           t("web_view_setup.invalid_url_message"));
+                t("web_view_setup.invalid_url_message"));
             return;
         }
 
         setSrcLabel(url);
-    }, [note]);
+    }, [ setSrcLabel ]);
 
     return <div class="web-view-setup-form">
-            <form class="tn-centered-form" onSubmit={() => submit(src)}>
-                <span className="bx bx-globe-alt form-icon" />
+        <form class="tn-centered-form" onSubmit={() => submit(src)}>
+            <span className="bx bx-globe-alt form-icon" />
 
-                <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
-                    <input className="form-control"
-                        type="text"
-                        value={src}
-                        placeholder={t("web_view_setup.url_placeholder")}
-                        onChange={(e) => {setSrc((e.target as HTMLInputElement)?.value)}}
-                    />
-                </FormGroup>
-
-                <Button
-                    text={t("web_view_setup.create_button")}
-                    primary
-                    keyboardShortcut="Enter"
+            <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
+                <input className="form-control"
+                    type="text"
+                    value={src}
+                    placeholder={t("web_view_setup.url_placeholder")}
+                    onChange={(e) => {setSrc((e.target as HTMLInputElement)?.value);}}
                 />
-            </form>
-    </div>
+            </FormGroup>
+
+            <Button
+                text={t("web_view_setup.create_button")}
+                primary
+                keyboardShortcut="Enter"
+            />
+        </form>
+    </div>;
 }

From 4b8d341e001c4474b700f98b6cfa638bee935263 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:02:51 +0200
Subject: [PATCH 02/13] feat(web_view): add a screen if web view is disabled

---
 apps/client/src/services/attributes.ts        | 40 ++++++++-
 .../src/translations/en/translation.json      |  4 +-
 .../widgets/layout/ActiveContentBadges.tsx    | 20 +----
 .../src/widgets/type_widgets/WebView.css      |  6 +-
 .../src/widgets/type_widgets/WebView.tsx      | 87 ++++++++++++++-----
 packages/commons/src/lib/attribute_names.ts   |  1 +
 6 files changed, 114 insertions(+), 44 deletions(-)

diff --git a/apps/client/src/services/attributes.ts b/apps/client/src/services/attributes.ts
index 2bff933244..fd8a8b0f10 100644
--- a/apps/client/src/services/attributes.ts
+++ b/apps/client/src/services/attributes.ts
@@ -168,6 +168,42 @@ function isAffecting(attrRow: AttributeRow, affectedNote: FNote | null | undefin
     return false;
 }
 
+/**
+ * Toggles whether a dangerous attribute is enabled or not. When an attribute is disabled, its name is prefixed with `disabled:`.
+ *
+ * Note that this work for non-dangerous attributes as well.
+ *
+ * @param note the note whose attribute to change.
+ * @param type the type of dangerous attribute (label or relation).
+ * @param name the name of the dangerous attribute.
+ * @param willEnable whether to enable or disable the attribute.
+ * @returns a promise that will resolve when the request to the server completes.
+ */
+async function toggleDangerousAttribute(note: FNote, type: "label" | "relation", name: string, willEnable: boolean) {
+    const attr = note.getOwnedAttribute(type, name) ?? note.getOwnedAttribute(type, `disabled:${name}`);
+    if (!attr) return;
+    const baseName = getNameWithoutDangerousPrefix(attr.name);
+    const newName = willEnable ? baseName : `disabled:${baseName}`;
+    if (newName === attr.name) return;
+
+    // We are adding and removing afterwards to avoid a flicker (because for a moment there would be no active content attribute anymore) because the operations are done in sequence and not atomically.
+    if (attr.type === "label") {
+        await setLabel(note.noteId, newName, attr.value);
+    } else {
+        await setRelation(note.noteId, newName, attr.value);
+    }
+    await removeAttributeById(note.noteId, attr.attributeId);
+}
+
+/**
+ * Returns the name of an attribute without the `disabled:` prefix, or the same name if it's not disabled.
+ * @param name the name of an attribute.
+ * @returns the name without the `disabled:` prefix.
+ */
+function getNameWithoutDangerousPrefix(name: string) {
+    return name.startsWith("disabled:") ? name.substring(9) : name;
+}
+
 export default {
     addLabel,
     setLabel,
@@ -177,5 +213,7 @@ export default {
     removeAttributeById,
     removeOwnedLabelByName,
     removeOwnedRelationByName,
-    isAffecting
+    isAffecting,
+    toggleDangerousAttribute,
+    getNameWithoutDangerousPrefix
 };
diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index 3656035497..7b38c0dd8d 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1075,7 +1075,9 @@
     "url_placeholder": "Enter or paste the website address, for example https://triliumnotes.org",
     "create_button": "Create Web View",
     "invalid_url_title": "Invalid address",
-    "invalid_url_message": "Insert a valid web address, for example https://triliumnotes.org."
+    "invalid_url_message": "Insert a valid web address, for example https://triliumnotes.org.",
+    "disabled_description": "This web view was imported from an external source. To help protect you from phishing or malicious content, it isn’t loading automatically. You can enable it if you trust the source.",
+    "disabled_button_enable": "Enable web view"
   },
   "backend_log": {
     "refresh": "Refresh"
diff --git a/apps/client/src/widgets/layout/ActiveContentBadges.tsx b/apps/client/src/widgets/layout/ActiveContentBadges.tsx
index 00099d0370..978fe7ef03 100644
--- a/apps/client/src/widgets/layout/ActiveContentBadges.tsx
+++ b/apps/client/src/widgets/layout/ActiveContentBadges.tsx
@@ -206,31 +206,15 @@ function ActiveContentToggle({ note, info }: { note: FNote, info: ActiveContentI
             const attrs = note.getOwnedAttributes()
                 .filter(attr => {
                     if (attr.isInheritable) return false;
-                    const baseName = getNameWithoutPrefix(attr.name);
+                    const baseName = attributes.getNameWithoutDangerousPrefix(attr.name);
                     return DANGEROUS_ATTRIBUTES.some(item => item.name === baseName && item.type === attr.type);
                 });
 
-            for (const attr of attrs) {
-                const baseName = getNameWithoutPrefix(attr.name);
-                const newName = willEnable ? baseName : `disabled:${baseName}`;
-                if (newName === attr.name) continue;
-
-                // We are adding and removing afterwards to avoid a flicker (because for a moment there would be no active content attribute anymore) because the operations are done in sequence and not atomically.
-                if (attr.type === "label") {
-                    await attributes.setLabel(note.noteId, newName, attr.value);
-                } else {
-                    await attributes.setRelation(note.noteId, newName, attr.value);
-                }
-                await attributes.removeAttributeById(note.noteId, attr.attributeId);
-            }
+            await Promise.all(attrs.map(a => attributes.toggleDangerousAttribute(note, a.type, a.name, willEnable)));
         }}
     />;
 }
 
-function getNameWithoutPrefix(name: string) {
-    return name.startsWith("disabled:") ? name.substring(9) : name;
-}
-
 function useActiveContentInfo(note: FNote | null | undefined) {
     const [ info, setInfo ] = useState<ActiveContentInfo | null>(null);
 
diff --git a/apps/client/src/widgets/type_widgets/WebView.css b/apps/client/src/widgets/type_widgets/WebView.css
index c158e3ceae..ceeb5ba7af 100644
--- a/apps/client/src/widgets/type_widgets/WebView.css
+++ b/apps/client/src/widgets/type_widgets/WebView.css
@@ -32,4 +32,8 @@
         width: 100%;
         max-width: 600px;
     }
-}
\ No newline at end of file
+
+    .tn-link {
+        margin-top: 1em;
+    }
+}
diff --git a/apps/client/src/widgets/type_widgets/WebView.tsx b/apps/client/src/widgets/type_widgets/WebView.tsx
index 40c5ef8655..aeb56d70b2 100644
--- a/apps/client/src/widgets/type_widgets/WebView.tsx
+++ b/apps/client/src/widgets/type_widgets/WebView.tsx
@@ -3,23 +3,32 @@ import "./WebView.css";
 import { useCallback, useState } from "preact/hooks";
 
 import FNote from "../../entities/fnote";
+import attributes from "../../services/attributes";
 import { t } from "../../services/i18n";
 import toast from "../../services/toast";
-import utils from "../../services/utils";
+import utils, { openInAppHelpFromUrl } from "../../services/utils";
 import Button from "../react/Button";
 import FormGroup from "../react/FormGroup";
+import FormTextBox from "../react/FormTextBox";
 import { useNoteLabel } from "../react/hooks";
+import LinkButton from "../react/LinkButton";
 import { TypeWidgetProps } from "./type_widget";
 
 const isElectron = utils.isElectron();
 
 export default function WebView({ note }: TypeWidgetProps) {
     const [ webViewSrc ] = useNoteLabel(note, "webViewSrc");
+    const [ disabledWebViewSrc ] = useNoteLabel(note, "disabled:webViewSrc");
 
-    return (webViewSrc
-        ? <WebViewContent src={webViewSrc} />
-        : <SetupWebView note={note} />
-    );
+    if (disabledWebViewSrc) {
+        return <DisabledWebView note={note} url={disabledWebViewSrc} />;
+    }
+
+    if (!webViewSrc) {
+        return <SetupWebView note={note} />;
+    }
+
+    return <WebViewContent src={webViewSrc} />;
 }
 
 function WebViewContent({ src }: { src: string }) {
@@ -48,24 +57,56 @@ function SetupWebView({note}: {note: FNote}) {
         setSrcLabel(url);
     }, [ setSrcLabel ]);
 
-    return <div class="web-view-setup-form">
-        <form class="tn-centered-form" onSubmit={() => submit(src)}>
-            <span className="bx bx-globe-alt form-icon" />
+    return (
+        <div class="web-view-setup-form">
+            <form class="tn-centered-form" onSubmit={() => submit(src)}>
+                <span className="bx bx-globe-alt form-icon" />
 
-            <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
-                <input className="form-control"
-                    type="text"
-                    value={src}
-                    placeholder={t("web_view_setup.url_placeholder")}
-                    onChange={(e) => {setSrc((e.target as HTMLInputElement)?.value);}}
+                <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
+                    <input className="form-control"
+                        type="text"
+                        value={src}
+                        placeholder={t("web_view_setup.url_placeholder")}
+                        onChange={(e) => {setSrc((e.target as HTMLInputElement)?.value);}}
+                    />
+                </FormGroup>
+
+                <Button
+                    text={t("web_view_setup.create_button")}
+                    primary
+                    keyboardShortcut="Enter"
                 />
-            </FormGroup>
-
-            <Button
-                text={t("web_view_setup.create_button")}
-                primary
-                keyboardShortcut="Enter"
-            />
-        </form>
-    </div>;
+            </form>
+        </div>
+    );
+}
+
+function DisabledWebView({ note, url }: { note: FNote, url: string }) {
+    return (
+        <div class="web-view-setup-form">
+            <form class="tn-centered-form">
+                <span className="bx bx-globe-alt form-icon" />
+
+                <FormGroup name="web-view-src-detail" label={t("web_view_setup.disabled_description")}>
+                    <FormTextBox
+                        type="url"
+                        currentValue={url}
+                        disabled
+                    />
+                </FormGroup>
+
+                <Button
+                    text={t("web_view_setup.disabled_button_enable")}
+                    icon="bx bx-check-shield"
+                    onClick={() => attributes.toggleDangerousAttribute(note, "label", "webViewSrc", true)}
+                    primary
+                />
+
+                <LinkButton
+                    text="Learn more"
+                    onClick={() => openInAppHelpFromUrl("1vHRoWCEjj0L")}
+                />
+            </form>
+        </div>
+    );
 }
diff --git a/packages/commons/src/lib/attribute_names.ts b/packages/commons/src/lib/attribute_names.ts
index da3b890c9c..d5a63de04a 100644
--- a/packages/commons/src/lib/attribute_names.ts
+++ b/packages/commons/src/lib/attribute_names.ts
@@ -61,6 +61,7 @@ type Labels = {
 
     // Note-type specific
     webViewSrc: string;
+    "disabled:webViewSrc": string;
     readOnly: boolean;
     mapType: string;
     mapRootNoteId: string;

From a02f3c4440f6e98a19e7857a3ef4f85cc0491ff2 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:08:58 +0200
Subject: [PATCH 03/13] refactor(client): extract setup form to dedicated
 component

---
 .../src/widgets/type_widgets/WebView.css      | 21 -----
 .../src/widgets/type_widgets/WebView.tsx      | 80 +++++++++----------
 .../type_widgets/helpers/SetupForm.css        | 20 +++++
 .../type_widgets/helpers/SetupForm.tsx        | 22 +++++
 4 files changed, 80 insertions(+), 63 deletions(-)
 create mode 100644 apps/client/src/widgets/type_widgets/helpers/SetupForm.css
 create mode 100644 apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx

diff --git a/apps/client/src/widgets/type_widgets/WebView.css b/apps/client/src/widgets/type_widgets/WebView.css
index ceeb5ba7af..42ac871cfb 100644
--- a/apps/client/src/widgets/type_widgets/WebView.css
+++ b/apps/client/src/widgets/type_widgets/WebView.css
@@ -16,24 +16,3 @@
     width: 100%;
     height: 100%;
 }
-
-.web-view-setup-form {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    padding-inline: 40px;
-
-    .form-icon {
-        margin-bottom: 12px;
-    }
-
-    .form-group {
-        width: 100%;
-        max-width: 600px;
-    }
-
-    .tn-link {
-        margin-top: 1em;
-    }
-}
diff --git a/apps/client/src/widgets/type_widgets/WebView.tsx b/apps/client/src/widgets/type_widgets/WebView.tsx
index aeb56d70b2..90db7000d2 100644
--- a/apps/client/src/widgets/type_widgets/WebView.tsx
+++ b/apps/client/src/widgets/type_widgets/WebView.tsx
@@ -12,6 +12,7 @@ import FormGroup from "../react/FormGroup";
 import FormTextBox from "../react/FormTextBox";
 import { useNoteLabel } from "../react/hooks";
 import LinkButton from "../react/LinkButton";
+import SetupForm from "./helpers/SetupForm";
 import { TypeWidgetProps } from "./type_widget";
 
 const isElectron = utils.isElectron();
@@ -58,55 +59,50 @@ function SetupWebView({note}: {note: FNote}) {
     }, [ setSrcLabel ]);
 
     return (
-        <div class="web-view-setup-form">
-            <form class="tn-centered-form" onSubmit={() => submit(src)}>
-                <span className="bx bx-globe-alt form-icon" />
-
-                <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
-                    <input className="form-control"
-                        type="text"
-                        value={src}
-                        placeholder={t("web_view_setup.url_placeholder")}
-                        onChange={(e) => {setSrc((e.target as HTMLInputElement)?.value);}}
-                    />
-                </FormGroup>
-
-                <Button
-                    text={t("web_view_setup.create_button")}
-                    primary
-                    keyboardShortcut="Enter"
+        <SetupForm
+            icon="bx bx-globe-alt"
+            onSubmit={() => submit(src)}
+        >
+            <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
+                <input className="form-control"
+                    type="text"
+                    value={src}
+                    placeholder={t("web_view_setup.url_placeholder")}
+                    onChange={(e) => {setSrc((e.target as HTMLInputElement)?.value);}}
                 />
-            </form>
-        </div>
+            </FormGroup>
+
+            <Button
+                text={t("web_view_setup.create_button")}
+                primary
+                keyboardShortcut="Enter"
+            />
+        </SetupForm>
     );
 }
 
 function DisabledWebView({ note, url }: { note: FNote, url: string }) {
     return (
-        <div class="web-view-setup-form">
-            <form class="tn-centered-form">
-                <span className="bx bx-globe-alt form-icon" />
-
-                <FormGroup name="web-view-src-detail" label={t("web_view_setup.disabled_description")}>
-                    <FormTextBox
-                        type="url"
-                        currentValue={url}
-                        disabled
-                    />
-                </FormGroup>
-
-                <Button
-                    text={t("web_view_setup.disabled_button_enable")}
-                    icon="bx bx-check-shield"
-                    onClick={() => attributes.toggleDangerousAttribute(note, "label", "webViewSrc", true)}
-                    primary
+        <SetupForm icon="bx bx-globe-alt">
+            <FormGroup name="web-view-src-detail" label={t("web_view_setup.disabled_description")}>
+                <FormTextBox
+                    type="url"
+                    currentValue={url}
+                    disabled
                 />
+            </FormGroup>
 
-                <LinkButton
-                    text="Learn more"
-                    onClick={() => openInAppHelpFromUrl("1vHRoWCEjj0L")}
-                />
-            </form>
-        </div>
+            <Button
+                text={t("web_view_setup.disabled_button_enable")}
+                icon="bx bx-check-shield"
+                onClick={() => attributes.toggleDangerousAttribute(note, "label", "webViewSrc", true)}
+                primary
+            />
+
+            <LinkButton
+                text="Learn more"
+                onClick={() => openInAppHelpFromUrl("1vHRoWCEjj0L")}
+            />
+        </SetupForm>
     );
 }
diff --git a/apps/client/src/widgets/type_widgets/helpers/SetupForm.css b/apps/client/src/widgets/type_widgets/helpers/SetupForm.css
new file mode 100644
index 0000000000..205f3a4cde
--- /dev/null
+++ b/apps/client/src/widgets/type_widgets/helpers/SetupForm.css
@@ -0,0 +1,20 @@
+.setup-form {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    padding-inline: 40px;
+
+    .form-icon {
+        margin-bottom: 12px;
+    }
+
+    .form-group {
+        width: 100%;
+        max-width: 600px;
+    }
+
+    .tn-link {
+        margin-top: 1em;
+    }
+}
diff --git a/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx b/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
new file mode 100644
index 0000000000..121b4bb692
--- /dev/null
+++ b/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
@@ -0,0 +1,22 @@
+import "./SetupForm.css";
+
+import clsx from "clsx";
+import { ComponentChildren } from "preact";
+
+interface SetupFormProps {
+    icon: string;
+    onSubmit?: () => void;
+    children: ComponentChildren;
+}
+
+export default function SetupForm({ icon, children, onSubmit }: SetupFormProps) {
+    return (
+        <div class="setup-form">
+            <form class="tn-centered-form" onSubmit={onSubmit}>
+                <span className={clsx(icon, "form-icon")} />
+
+                {children}
+            </form>
+        </div>
+    );
+}

From 2103be9d2850beeba005dac786d196cb5a7ff413 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:11:52 +0200
Subject: [PATCH 04/13] refactor(client): extract learn more into component

---
 apps/client/src/translations/en/translation.json   |  3 +++
 apps/client/src/widgets/type_widgets/WebView.tsx   | 13 ++++---------
 .../src/widgets/type_widgets/helpers/SetupForm.tsx | 14 +++++++++++++-
 3 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index 7b38c0dd8d..341e3ed579 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -2314,5 +2314,8 @@
     "menu_change_to_widget": "Change to widget",
     "menu_change_to_frontend_script": "Change to frontend script",
     "menu_theme_base": "Theme base"
+  },
+  "setup_form": {
+    "more_info": "Learn more"
   }
 }
diff --git a/apps/client/src/widgets/type_widgets/WebView.tsx b/apps/client/src/widgets/type_widgets/WebView.tsx
index 90db7000d2..d61725d064 100644
--- a/apps/client/src/widgets/type_widgets/WebView.tsx
+++ b/apps/client/src/widgets/type_widgets/WebView.tsx
@@ -6,16 +6,16 @@ import FNote from "../../entities/fnote";
 import attributes from "../../services/attributes";
 import { t } from "../../services/i18n";
 import toast from "../../services/toast";
-import utils, { openInAppHelpFromUrl } from "../../services/utils";
+import utils from "../../services/utils";
 import Button from "../react/Button";
 import FormGroup from "../react/FormGroup";
 import FormTextBox from "../react/FormTextBox";
 import { useNoteLabel } from "../react/hooks";
-import LinkButton from "../react/LinkButton";
 import SetupForm from "./helpers/SetupForm";
 import { TypeWidgetProps } from "./type_widget";
 
 const isElectron = utils.isElectron();
+const HELP_PAGE = "1vHRoWCEjj0L";
 
 export default function WebView({ note }: TypeWidgetProps) {
     const [ webViewSrc ] = useNoteLabel(note, "webViewSrc");
@@ -60,7 +60,7 @@ function SetupWebView({note}: {note: FNote}) {
 
     return (
         <SetupForm
-            icon="bx bx-globe-alt"
+            icon="bx bx-globe-alt" inAppHelpPage={HELP_PAGE}
             onSubmit={() => submit(src)}
         >
             <FormGroup name="web-view-src-detail" label={t("web_view_setup.title")}>
@@ -83,7 +83,7 @@ function SetupWebView({note}: {note: FNote}) {
 
 function DisabledWebView({ note, url }: { note: FNote, url: string }) {
     return (
-        <SetupForm icon="bx bx-globe-alt">
+        <SetupForm icon="bx bx-globe-alt" inAppHelpPage={HELP_PAGE}>
             <FormGroup name="web-view-src-detail" label={t("web_view_setup.disabled_description")}>
                 <FormTextBox
                     type="url"
@@ -98,11 +98,6 @@ function DisabledWebView({ note, url }: { note: FNote, url: string }) {
                 onClick={() => attributes.toggleDangerousAttribute(note, "label", "webViewSrc", true)}
                 primary
             />
-
-            <LinkButton
-                text="Learn more"
-                onClick={() => openInAppHelpFromUrl("1vHRoWCEjj0L")}
-            />
         </SetupForm>
     );
 }
diff --git a/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx b/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
index 121b4bb692..69e491fb6c 100644
--- a/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
+++ b/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
@@ -3,19 +3,31 @@ import "./SetupForm.css";
 import clsx from "clsx";
 import { ComponentChildren } from "preact";
 
+import { t } from "../../../services/i18n";
+import { openInAppHelpFromUrl } from "../../../services/utils";
+import LinkButton from "../../react/LinkButton";
+
 interface SetupFormProps {
     icon: string;
     onSubmit?: () => void;
     children: ComponentChildren;
+    inAppHelpPage?: string;
 }
 
-export default function SetupForm({ icon, children, onSubmit }: SetupFormProps) {
+export default function SetupForm({ icon, children, onSubmit, inAppHelpPage }: SetupFormProps) {
     return (
         <div class="setup-form">
             <form class="tn-centered-form" onSubmit={onSubmit}>
                 <span className={clsx(icon, "form-icon")} />
 
                 {children}
+
+                {inAppHelpPage && (
+                    <LinkButton
+                        text={t("setup_form.more_info")}
+                        onClick={() => openInAppHelpFromUrl("1vHRoWCEjj0L")}
+                    />
+                )}
             </form>
         </div>
     );

From 06a005aceca21e8cd5b8ff74f51d0662b41767e5 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:17:41 +0200
Subject: [PATCH 05/13] refactor(client/render_note): separate content from
 setup

---
 .../src/widgets/type_widgets/Render.tsx       | 38 +++++++++++--------
 packages/commons/src/lib/attribute_names.ts   |  3 ++
 2 files changed, 26 insertions(+), 15 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/Render.tsx b/apps/client/src/widgets/type_widgets/Render.tsx
index f47e58f2de..1f9d61d218 100644
--- a/apps/client/src/widgets/type_widgets/Render.tsx
+++ b/apps/client/src/widgets/type_widgets/Render.tsx
@@ -1,23 +1,33 @@
 import "./Render.css";
 
-import { useEffect, useRef, useState } from "preact/hooks";
+import { useEffect, useRef } from "preact/hooks";
 
 import attributes from "../../services/attributes";
 import { t } from "../../services/i18n";
 import render from "../../services/render";
 import Alert from "../react/Alert";
-import { useTriliumEvent } from "../react/hooks";
+import { useNoteRelation, useTriliumEvent } from "../react/hooks";
 import RawHtml from "../react/RawHtml";
 import { refToJQuerySelector } from "../react/react_utils";
 import { TypeWidgetProps } from "./type_widget";
 
-export default function Render({ note, noteContext, ntxId }: TypeWidgetProps) {
+export default function Render(props: TypeWidgetProps) {
+    const { note } = props;
+    const [ renderNote ] = useNoteRelation(note, "renderNote");
+
+    if (!renderNote) {
+        return <SetupRenderContent />;
+    }
+
+    return <RenderContent {...props} />;
+}
+
+function RenderContent({ note, noteContext, ntxId }: TypeWidgetProps) {
     const contentRef = useRef<HTMLDivElement>(null);
-    const [ renderNotesFound, setRenderNotesFound ] = useState(false);
 
     function refresh() {
         if (!contentRef) return;
-        render.render(note, refToJQuerySelector(contentRef)).then(setRenderNotesFound);
+        render.render(note, refToJQuerySelector(contentRef));
     }
 
     useEffect(refresh, [ note ]);
@@ -47,16 +57,14 @@ export default function Render({ note, noteContext, ntxId }: TypeWidgetProps) {
         resolve(refToJQuerySelector(contentRef));
     });
 
-    return (
-        <>
-            {!renderNotesFound && (
-                <Alert className="note-detail-render-help" type="warning">
-                    <p><strong>{t("render.note_detail_render_help_1")}</strong></p>
-                    <p><RawHtml html={t("render.note_detail_render_help_2")} /></p>
-                </Alert>
-            )}
+    return <div ref={contentRef} className="note-detail-render-content" />;
+}
 
-            <div ref={contentRef} className="note-detail-render-content" />
-        </>
+function SetupRenderContent() {
+    return (
+        <Alert className="note-detail-render-help" type="warning">
+            <p><strong>{t("render.note_detail_render_help_1")}</strong></p>
+            <p><RawHtml html={t("render.note_detail_render_help_2")} /></p>
+        </Alert>
     );
 }
diff --git a/packages/commons/src/lib/attribute_names.ts b/packages/commons/src/lib/attribute_names.ts
index d5a63de04a..7a9534a5b7 100644
--- a/packages/commons/src/lib/attribute_names.ts
+++ b/packages/commons/src/lib/attribute_names.ts
@@ -78,6 +78,9 @@ type Relations = [
     "searchScript",
     "ancestor",
 
+    // Active content
+    "renderNote",
+
     // Launcher-specific
     "target",
     "widget"

From 5550cb7b9597d95bd0a69d8140373e2c633c1a89 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:30:10 +0200
Subject: [PATCH 06/13] feat(client/render_note): basic setup for with note
 picker

---
 .../src/stylesheets/theme-next/forms.css      |  4 ++--
 .../src/translations/en/translation.json      |  3 +--
 .../src/widgets/type_widgets/Render.tsx       | 24 ++++++++++++-------
 .../type_widgets/helpers/SetupForm.tsx        |  2 +-
 4 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/apps/client/src/stylesheets/theme-next/forms.css b/apps/client/src/stylesheets/theme-next/forms.css
index bccf7ab6d4..2fc8a39dbd 100644
--- a/apps/client/src/stylesheets/theme-next/forms.css
+++ b/apps/client/src/stylesheets/theme-next/forms.css
@@ -838,7 +838,7 @@ input[type="range"] {
     text-align: center;
 }
 
-.tn-centered-form input,
+.tn-centered-form .input-group,
 .tn-centered-form button {
     margin-top: 12px;
-}
\ No newline at end of file
+}
diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index 341e3ed579..f5926aa4b1 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1067,8 +1067,7 @@
     "click_on_canvas_to_place_new_note": "Click on canvas to place new note"
   },
   "render": {
-    "note_detail_render_help_1": "This help note is shown because this note of type Render HTML doesn't have required relation to function properly.",
-    "note_detail_render_help_2": "Render HTML note type is used for <a class=\"external\" href=\"https://triliumnext.github.io/Docs/Wiki/scripts.html\">scripting</a>. In short, you have a HTML code note (optionally with some JavaScript) and this note will render it. To make it work, you need to define a <a class=\"external\" href=\"https://triliumnext.github.io/Docs/Wiki/attributes.html\">relation</a> called \"renderNote\" pointing to the HTML note to render."
+    "setup_title": "Display custom HTML or Preact JSX inside this note"
   },
   "web_view_setup": {
     "title": "Create a live view of a webpage directly into Trilium",
diff --git a/apps/client/src/widgets/type_widgets/Render.tsx b/apps/client/src/widgets/type_widgets/Render.tsx
index 1f9d61d218..1f05820008 100644
--- a/apps/client/src/widgets/type_widgets/Render.tsx
+++ b/apps/client/src/widgets/type_widgets/Render.tsx
@@ -5,10 +5,11 @@ import { useEffect, useRef } from "preact/hooks";
 import attributes from "../../services/attributes";
 import { t } from "../../services/i18n";
 import render from "../../services/render";
-import Alert from "../react/Alert";
+import FormGroup from "../react/FormGroup";
 import { useNoteRelation, useTriliumEvent } from "../react/hooks";
-import RawHtml from "../react/RawHtml";
+import NoteAutocomplete from "../react/NoteAutocomplete";
 import { refToJQuerySelector } from "../react/react_utils";
+import SetupForm from "./helpers/SetupForm";
 import { TypeWidgetProps } from "./type_widget";
 
 export default function Render(props: TypeWidgetProps) {
@@ -16,7 +17,7 @@ export default function Render(props: TypeWidgetProps) {
     const [ renderNote ] = useNoteRelation(note, "renderNote");
 
     if (!renderNote) {
-        return <SetupRenderContent />;
+        return <SetupRenderContent {...props} />;
     }
 
     return <RenderContent {...props} />;
@@ -60,11 +61,18 @@ function RenderContent({ note, noteContext, ntxId }: TypeWidgetProps) {
     return <div ref={contentRef} className="note-detail-render-content" />;
 }
 
-function SetupRenderContent() {
+function SetupRenderContent({ note }: TypeWidgetProps) {
     return (
-        <Alert className="note-detail-render-help" type="warning">
-            <p><strong>{t("render.note_detail_render_help_1")}</strong></p>
-            <p><RawHtml html={t("render.note_detail_render_help_2")} /></p>
-        </Alert>
+        <SetupForm
+            icon="bx bx-extension"
+            inAppHelpPage="HcABDtFCkbFN"
+        >
+            <FormGroup name="render-target-note" label={t("render.setup_title")}>
+                <NoteAutocomplete noteIdChanged={noteId => {
+                    if (!noteId) return;
+                    attributes.setRelation(note.noteId, "renderNote", noteId);
+                }} />
+            </FormGroup>
+        </SetupForm>
     );
 }
diff --git a/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx b/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
index 69e491fb6c..771b8de612 100644
--- a/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
+++ b/apps/client/src/widgets/type_widgets/helpers/SetupForm.tsx
@@ -25,7 +25,7 @@ export default function SetupForm({ icon, children, onSubmit, inAppHelpPage }: S
                 {inAppHelpPage && (
                     <LinkButton
                         text={t("setup_form.more_info")}
-                        onClick={() => openInAppHelpFromUrl("1vHRoWCEjj0L")}
+                        onClick={() => openInAppHelpFromUrl(inAppHelpPage)}
                     />
                 )}
             </form>

From 1ba498c0e39993ec7667f8671c35e4cc6146eca9 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:38:09 +0200
Subject: [PATCH 07/13] feat(client/render_note): create sample note with
 preact

---
 .../src/translations/en/translation.json      |  4 ++-
 .../src/widgets/type_widgets/Render.tsx       | 25 +++++++++++++++++++
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index f5926aa4b1..ac5f3256ed 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1067,7 +1067,9 @@
     "click_on_canvas_to_place_new_note": "Click on canvas to place new note"
   },
   "render": {
-    "setup_title": "Display custom HTML or Preact JSX inside this note"
+    "setup_title": "Display custom HTML or Preact JSX inside this note",
+    "setup_create_sample": "Create sample note with Preact",
+    "setup_sample_created": "A sample note was created as a child note."
   },
   "web_view_setup": {
     "title": "Create a live view of a webpage directly into Trilium",
diff --git a/apps/client/src/widgets/type_widgets/Render.tsx b/apps/client/src/widgets/type_widgets/Render.tsx
index 1f05820008..7dc524e216 100644
--- a/apps/client/src/widgets/type_widgets/Render.tsx
+++ b/apps/client/src/widgets/type_widgets/Render.tsx
@@ -4,7 +4,10 @@ import { useEffect, useRef } from "preact/hooks";
 
 import attributes from "../../services/attributes";
 import { t } from "../../services/i18n";
+import note_create from "../../services/note_create";
 import render from "../../services/render";
+import toast from "../../services/toast";
+import Button from "../react/Button";
 import FormGroup from "../react/FormGroup";
 import { useNoteRelation, useTriliumEvent } from "../react/hooks";
 import NoteAutocomplete from "../react/NoteAutocomplete";
@@ -12,6 +15,12 @@ import { refToJQuerySelector } from "../react/react_utils";
 import SetupForm from "./helpers/SetupForm";
 import { TypeWidgetProps } from "./type_widget";
 
+const PREACT_SAMPLE = /*js*/`\
+export default function() {
+    return <p>Hello world.</p>;
+}
+`;
+
 export default function Render(props: TypeWidgetProps) {
     const { note } = props;
     const [ renderNote ] = useNoteRelation(note, "renderNote");
@@ -73,6 +82,22 @@ function SetupRenderContent({ note }: TypeWidgetProps) {
                     attributes.setRelation(note.noteId, "renderNote", noteId);
                 }} />
             </FormGroup>
+
+            <Button
+                text={t("render.setup_create_sample")}
+                primary
+                onClick={async () => {
+                    const { note: codeNote } = await note_create.createNote(note.noteId, {
+                        type: "code",
+                        mime: "text/jsx",
+                        content: PREACT_SAMPLE,
+                        activate: false
+                    });
+                    if (!codeNote) return;
+                    await attributes.setRelation(note.noteId, "renderNote", codeNote.noteId);
+                    toast.showMessage(t("render.setup_sample_created"));
+                }}
+            />
         </SetupForm>
     );
 }

From 197b769838cd014249370082bc04258efa4ea915 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:46:19 +0200
Subject: [PATCH 08/13] feat(client/render_note): create sample note with HTML

---
 .../src/translations/en/translation.json      |  3 +-
 .../src/widgets/type_widgets/Render.tsx       | 51 ++++++++++++-------
 2 files changed, 36 insertions(+), 18 deletions(-)

diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index ac5f3256ed..b90f79da4b 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1068,7 +1068,8 @@
   },
   "render": {
     "setup_title": "Display custom HTML or Preact JSX inside this note",
-    "setup_create_sample": "Create sample note with Preact",
+    "setup_create_sample_preact": "Create sample note with Preact",
+    "setup_create_sample_html": "Create sample note with HTML",
     "setup_sample_created": "A sample note was created as a child note."
   },
   "web_view_setup": {
diff --git a/apps/client/src/widgets/type_widgets/Render.tsx b/apps/client/src/widgets/type_widgets/Render.tsx
index 7dc524e216..88fc75cd75 100644
--- a/apps/client/src/widgets/type_widgets/Render.tsx
+++ b/apps/client/src/widgets/type_widgets/Render.tsx
@@ -2,13 +2,15 @@ import "./Render.css";
 
 import { useEffect, useRef } from "preact/hooks";
 
+import FNote from "../../entities/fnote";
 import attributes from "../../services/attributes";
 import { t } from "../../services/i18n";
 import note_create from "../../services/note_create";
 import render from "../../services/render";
 import toast from "../../services/toast";
-import Button from "../react/Button";
+import { SplitButton } from "../react/Button";
 import FormGroup from "../react/FormGroup";
+import { FormListItem } from "../react/FormList";
 import { useNoteRelation, useTriliumEvent } from "../react/hooks";
 import NoteAutocomplete from "../react/NoteAutocomplete";
 import { refToJQuerySelector } from "../react/react_utils";
@@ -21,6 +23,10 @@ export default function() {
 }
 `;
 
+const HTML_SAMPLE = /*html*/`\
+<p>Hello world.</p>
+`;
+
 export default function Render(props: TypeWidgetProps) {
     const { note } = props;
     const [ renderNote ] = useNoteRelation(note, "renderNote");
@@ -79,25 +85,36 @@ function SetupRenderContent({ note }: TypeWidgetProps) {
             <FormGroup name="render-target-note" label={t("render.setup_title")}>
                 <NoteAutocomplete noteIdChanged={noteId => {
                     if (!noteId) return;
-                    attributes.setRelation(note.noteId, "renderNote", noteId);
+                    setRenderNote(note, noteId);
                 }} />
             </FormGroup>
 
-            <Button
-                text={t("render.setup_create_sample")}
-                primary
-                onClick={async () => {
-                    const { note: codeNote } = await note_create.createNote(note.noteId, {
-                        type: "code",
-                        mime: "text/jsx",
-                        content: PREACT_SAMPLE,
-                        activate: false
-                    });
-                    if (!codeNote) return;
-                    await attributes.setRelation(note.noteId, "renderNote", codeNote.noteId);
-                    toast.showMessage(t("render.setup_sample_created"));
-                }}
-            />
+            <SplitButton
+                text={t("render.setup_create_sample_preact")}
+                icon="bx bxl-react"
+                onClick={() => setupSampleNote(note, "text/jsx", PREACT_SAMPLE)}
+            >
+                <FormListItem
+                    icon="bx bxl-html5"
+                    onClick={() => setupSampleNote(note, "text/html", HTML_SAMPLE)}
+                >{t("render.setup_create_sample_html")}</FormListItem>
+            </SplitButton>
         </SetupForm>
     );
 }
+
+async function setRenderNote(note: FNote, targetNoteUrl: string) {
+    await attributes.setRelation(note.noteId, "renderNote", targetNoteUrl);
+}
+
+async function setupSampleNote(parentNote: FNote, mime: string, content: string) {
+    const { note: codeNote } = await note_create.createNote(parentNote.noteId, {
+        type: "code",
+        mime,
+        content,
+        activate: false
+    });
+    if (!codeNote) return;
+    await setRenderNote(parentNote, codeNote.noteId);
+    toast.showMessage(t("render.setup_sample_created"));
+}

From ec8b0a3801e00984c0b0e0c47e50c0f57d6d128d Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:54:34 +0200
Subject: [PATCH 09/13] feat(client/render_note): warning for disabled render
 note

---
 apps/client/src/services/attributes.ts        | 29 ++++++++++++-------
 .../src/translations/en/translation.json      |  4 ++-
 .../src/widgets/type_widgets/Render.tsx       | 28 ++++++++++++++++--
 .../type_widgets/helpers/SetupForm.css        |  2 ++
 packages/commons/src/lib/attribute_names.ts   |  1 +
 5 files changed, 50 insertions(+), 14 deletions(-)

diff --git a/apps/client/src/services/attributes.ts b/apps/client/src/services/attributes.ts
index fd8a8b0f10..0ead073567 100644
--- a/apps/client/src/services/attributes.ts
+++ b/apps/client/src/services/attributes.ts
@@ -173,6 +173,8 @@ function isAffecting(attrRow: AttributeRow, affectedNote: FNote | null | undefin
  *
  * Note that this work for non-dangerous attributes as well.
  *
+ * If there are multiple attributes with the same name, all of them will be toggled at the same time.
+ *
  * @param note the note whose attribute to change.
  * @param type the type of dangerous attribute (label or relation).
  * @param name the name of the dangerous attribute.
@@ -180,19 +182,24 @@ function isAffecting(attrRow: AttributeRow, affectedNote: FNote | null | undefin
  * @returns a promise that will resolve when the request to the server completes.
  */
 async function toggleDangerousAttribute(note: FNote, type: "label" | "relation", name: string, willEnable: boolean) {
-    const attr = note.getOwnedAttribute(type, name) ?? note.getOwnedAttribute(type, `disabled:${name}`);
-    if (!attr) return;
-    const baseName = getNameWithoutDangerousPrefix(attr.name);
-    const newName = willEnable ? baseName : `disabled:${baseName}`;
-    if (newName === attr.name) return;
+    const attrs = [
+        ...note.getOwnedAttributes(type, name),
+        ...note.getOwnedAttributes(type, `disabled:${name}`)
+    ];
 
-    // We are adding and removing afterwards to avoid a flicker (because for a moment there would be no active content attribute anymore) because the operations are done in sequence and not atomically.
-    if (attr.type === "label") {
-        await setLabel(note.noteId, newName, attr.value);
-    } else {
-        await setRelation(note.noteId, newName, attr.value);
+    for (const attr of attrs) {
+        const baseName = getNameWithoutDangerousPrefix(attr.name);
+        const newName = willEnable ? baseName : `disabled:${baseName}`;
+        if (newName === attr.name) return;
+
+        // We are adding and removing afterwards to avoid a flicker (because for a moment there would be no active content attribute anymore) because the operations are done in sequence and not atomically.
+        if (attr.type === "label") {
+            await setLabel(note.noteId, newName, attr.value);
+        } else {
+            await setRelation(note.noteId, newName, attr.value);
+        }
+        await removeAttributeById(note.noteId, attr.attributeId);
     }
-    await removeAttributeById(note.noteId, attr.attributeId);
 }
 
 /**
diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index b90f79da4b..d2892456de 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1070,7 +1070,9 @@
     "setup_title": "Display custom HTML or Preact JSX inside this note",
     "setup_create_sample_preact": "Create sample note with Preact",
     "setup_create_sample_html": "Create sample note with HTML",
-    "setup_sample_created": "A sample note was created as a child note."
+    "setup_sample_created": "A sample note was created as a child note.",
+    "disabled_description": "This render notes comes from an external source. To protect you from malicious content, it is not enabled by default. Make sure you trust the source before enabling it.",
+    "disabled_button_enable": "Enable render note"
   },
   "web_view_setup": {
     "title": "Create a live view of a webpage directly into Trilium",
diff --git a/apps/client/src/widgets/type_widgets/Render.tsx b/apps/client/src/widgets/type_widgets/Render.tsx
index 88fc75cd75..563a2342c6 100644
--- a/apps/client/src/widgets/type_widgets/Render.tsx
+++ b/apps/client/src/widgets/type_widgets/Render.tsx
@@ -8,7 +8,7 @@ import { t } from "../../services/i18n";
 import note_create from "../../services/note_create";
 import render from "../../services/render";
 import toast from "../../services/toast";
-import { SplitButton } from "../react/Button";
+import Button, { SplitButton } from "../react/Button";
 import FormGroup from "../react/FormGroup";
 import { FormListItem } from "../react/FormList";
 import { useNoteRelation, useTriliumEvent } from "../react/hooks";
@@ -17,6 +17,8 @@ import { refToJQuerySelector } from "../react/react_utils";
 import SetupForm from "./helpers/SetupForm";
 import { TypeWidgetProps } from "./type_widget";
 
+const HELP_PAGE = "HcABDtFCkbFN";
+
 const PREACT_SAMPLE = /*js*/`\
 export default function() {
     return <p>Hello world.</p>;
@@ -30,6 +32,11 @@ const HTML_SAMPLE = /*html*/`\
 export default function Render(props: TypeWidgetProps) {
     const { note } = props;
     const [ renderNote ] = useNoteRelation(note, "renderNote");
+    const [ disabledRenderNote ] = useNoteRelation(note, "disabled:renderNote");
+
+    if (disabledRenderNote) {
+        return <DisabledRender {...props} />;
+    }
 
     if (!renderNote) {
         return <SetupRenderContent {...props} />;
@@ -76,11 +83,28 @@ function RenderContent({ note, noteContext, ntxId }: TypeWidgetProps) {
     return <div ref={contentRef} className="note-detail-render-content" />;
 }
 
+function DisabledRender({ note }: TypeWidgetProps) {
+    return (
+        <SetupForm
+            icon="bx bx-extension"
+            inAppHelpPage={HELP_PAGE}
+        >
+            <p>{t("render.disabled_description")}</p>
+            <Button
+                text={t("render.disabled_button_enable")}
+                icon="bx bx-check-shield"
+                onClick={() => attributes.toggleDangerousAttribute(note, "relation", "renderNote", true)}
+                primary
+            />
+        </SetupForm>
+    );
+}
+
 function SetupRenderContent({ note }: TypeWidgetProps) {
     return (
         <SetupForm
             icon="bx bx-extension"
-            inAppHelpPage="HcABDtFCkbFN"
+            inAppHelpPage={HELP_PAGE}
         >
             <FormGroup name="render-target-note" label={t("render.setup_title")}>
                 <NoteAutocomplete noteIdChanged={noteId => {
diff --git a/apps/client/src/widgets/type_widgets/helpers/SetupForm.css b/apps/client/src/widgets/type_widgets/helpers/SetupForm.css
index 205f3a4cde..1bd04b30c7 100644
--- a/apps/client/src/widgets/type_widgets/helpers/SetupForm.css
+++ b/apps/client/src/widgets/type_widgets/helpers/SetupForm.css
@@ -1,6 +1,8 @@
 .setup-form {
     height: 100%;
     display: flex;
+    max-width: 600px;
+    margin: auto;
     flex-direction: column;
     justify-content: center;
     padding-inline: 40px;
diff --git a/packages/commons/src/lib/attribute_names.ts b/packages/commons/src/lib/attribute_names.ts
index 7a9534a5b7..10d7538875 100644
--- a/packages/commons/src/lib/attribute_names.ts
+++ b/packages/commons/src/lib/attribute_names.ts
@@ -80,6 +80,7 @@ type Relations = [
 
     // Active content
     "renderNote",
+    "disabled:renderNote",
 
     // Launcher-specific
     "target",

From 8b3e3c2c3a5df717a94bdbe0f36064dcc3581762 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 16:56:37 +0200
Subject: [PATCH 10/13] chore(react): not reacting properly to deleted
 relations

---
 apps/client/src/widgets/react/hooks.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/apps/client/src/widgets/react/hooks.tsx b/apps/client/src/widgets/react/hooks.tsx
index 8eb2cc0efd..c41e1e1a1c 100644
--- a/apps/client/src/widgets/react/hooks.tsx
+++ b/apps/client/src/widgets/react/hooks.tsx
@@ -551,7 +551,12 @@ export function useNoteRelation(note: FNote | undefined | null, relationName: Re
     useTriliumEvent("entitiesReloaded", ({ loadResults }) => {
         for (const attr of loadResults.getAttributeRows()) {
             if (attr.type === "relation" && attr.name === relationName && attributes.isAffecting(attr, note)) {
-                setRelationValue(attr.value ?? null);
+                if (!attr.isDeleted) {
+                    setRelationValue(attr.value ?? null);
+                } else {
+                    setRelationValue(null);
+                }
+                break;
             }
         }
     });
@@ -601,6 +606,7 @@ export function useNoteLabel(note: FNote | undefined | null, labelName: FilterLa
                 } else {
                     setLabelValue(null);
                 }
+                break;
             }
         }
     });

From a6e596a5e39c3efb08291027016c8facd92f192a Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 17:04:31 +0200
Subject: [PATCH 11/13] feat(client/render_note): display rendering errors

---
 apps/client/src/services/render.ts            | 16 +++++++++-------
 .../src/widgets/type_widgets/Render.css       |  9 ++++-----
 .../src/widgets/type_widgets/Render.tsx       | 19 ++++++++++++++++---
 3 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/apps/client/src/services/render.ts b/apps/client/src/services/render.ts
index adfd8a4949..f09d26532d 100644
--- a/apps/client/src/services/render.ts
+++ b/apps/client/src/services/render.ts
@@ -6,7 +6,7 @@ import bundleService, { type Bundle } from "./bundle.js";
 import froca from "./froca.js";
 import server from "./server.js";
 
-async function render(note: FNote, $el: JQuery<HTMLElement>) {
+async function render(note: FNote, $el: JQuery<HTMLElement>, onError?: (e: unknown) => void) {
     const relations = note.getRelations("renderNote");
     const renderNoteIds = relations.map((rel) => rel.value).filter((noteId) => noteId);
 
@@ -21,12 +21,14 @@ async function render(note: FNote, $el: JQuery<HTMLElement>) {
         $scriptContainer.append(bundle.html);
 
         // async so that scripts cannot block trilium execution
-        bundleService.executeBundle(bundle, note, $scriptContainer).then(result => {
-            // Render JSX
-            if (bundle.html === "") {
-                renderIfJsx(bundle, result, $el);
-            }
-        });
+        bundleService.executeBundle(bundle, note, $scriptContainer)
+            .catch(onError)
+            .then(result => {
+                // Render JSX
+                if (bundle.html === "") {
+                    renderIfJsx(bundle, result, $el).catch(onError);
+                }
+            });
     }
 
     return renderNoteIds.length > 0;
diff --git a/apps/client/src/widgets/type_widgets/Render.css b/apps/client/src/widgets/type_widgets/Render.css
index 2595da0d84..7597b47cd2 100644
--- a/apps/client/src/widgets/type_widgets/Render.css
+++ b/apps/client/src/widgets/type_widgets/Render.css
@@ -1,8 +1,7 @@
 .note-detail-render {
     position: relative;
-}
 
-.note-detail-render .note-detail-render-help {
-    margin: 50px;
-    padding: 20px;
-}
\ No newline at end of file
+    &>.admonition {
+        margin: 1em;
+    }
+}
diff --git a/apps/client/src/widgets/type_widgets/Render.tsx b/apps/client/src/widgets/type_widgets/Render.tsx
index 563a2342c6..4d4fd4cd8e 100644
--- a/apps/client/src/widgets/type_widgets/Render.tsx
+++ b/apps/client/src/widgets/type_widgets/Render.tsx
@@ -1,6 +1,6 @@
 import "./Render.css";
 
-import { useEffect, useRef } from "preact/hooks";
+import { useEffect, useRef, useState } from "preact/hooks";
 
 import FNote from "../../entities/fnote";
 import attributes from "../../services/attributes";
@@ -8,6 +8,8 @@ import { t } from "../../services/i18n";
 import note_create from "../../services/note_create";
 import render from "../../services/render";
 import toast from "../../services/toast";
+import { getErrorMessage } from "../../services/utils";
+import Admonition from "../react/Admonition";
 import Button, { SplitButton } from "../react/Button";
 import FormGroup from "../react/FormGroup";
 import { FormListItem } from "../react/FormList";
@@ -47,10 +49,12 @@ export default function Render(props: TypeWidgetProps) {
 
 function RenderContent({ note, noteContext, ntxId }: TypeWidgetProps) {
     const contentRef = useRef<HTMLDivElement>(null);
+    const [ error, setError ] = useState<unknown | null>(null);
 
     function refresh() {
         if (!contentRef) return;
-        render.render(note, refToJQuerySelector(contentRef));
+        setError(null);
+        render.render(note, refToJQuerySelector(contentRef), setError);
     }
 
     useEffect(refresh, [ note ]);
@@ -80,7 +84,16 @@ function RenderContent({ note, noteContext, ntxId }: TypeWidgetProps) {
         resolve(refToJQuerySelector(contentRef));
     });
 
-    return <div ref={contentRef} className="note-detail-render-content" />;
+    return (
+        <>
+            {error && (
+                <Admonition type="caution">
+                    {getErrorMessage(error)}
+                </Admonition>
+            )}
+            <div ref={contentRef} className="note-detail-render-content" />
+        </>
+    );
 }
 
 function DisabledRender({ note }: TypeWidgetProps) {

From 7a534c3ea76029998ea301738956b15e744a4440 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 17:06:23 +0200
Subject: [PATCH 12/13] chore(client/active_badges): disable toggle for web
 view & render note

---
 apps/client/src/widgets/layout/ActiveContentBadges.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/apps/client/src/widgets/layout/ActiveContentBadges.tsx b/apps/client/src/widgets/layout/ActiveContentBadges.tsx
index 978fe7ef03..0ffad6c1fe 100644
--- a/apps/client/src/widgets/layout/ActiveContentBadges.tsx
+++ b/apps/client/src/widgets/layout/ActiveContentBadges.tsx
@@ -231,11 +231,9 @@ function useActiveContentInfo(note: FNote | null | undefined) {
         if (note.type === "render") {
             type = "renderNote";
             isEnabled = note.hasRelation("renderNote");
-            canToggleEnabled = note.hasRelation("renderNote") || note.hasRelation("disabled:renderNote");
         } else if (note.type === "webView") {
             type = "webView";
             isEnabled = note.hasLabel("webViewSrc");
-            canToggleEnabled = note.hasLabelOrDisabled("webViewSrc");
         } else if (note.type === "code" && note.mime === "application/javascript;env=backend") {
             type = "backendScript";
             for (const backendLabel of [ "run", "customRequestHandler", "customResourceProvider" ]) {

From b0a3d5427654a0d70cd91a0039a21a2dc2234678 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 15 Feb 2026 17:15:51 +0200
Subject: [PATCH 13/13] chore(client): address requested changes

---
 apps/client/src/services/attributes.ts               |  2 +-
 .../src/widgets/layout/ActiveContentBadges.tsx       | 12 ++++--------
 2 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/apps/client/src/services/attributes.ts b/apps/client/src/services/attributes.ts
index 0ead073567..77558c9464 100644
--- a/apps/client/src/services/attributes.ts
+++ b/apps/client/src/services/attributes.ts
@@ -190,7 +190,7 @@ async function toggleDangerousAttribute(note: FNote, type: "label" | "relation",
     for (const attr of attrs) {
         const baseName = getNameWithoutDangerousPrefix(attr.name);
         const newName = willEnable ? baseName : `disabled:${baseName}`;
-        if (newName === attr.name) return;
+        if (newName === attr.name) continue;
 
         // We are adding and removing afterwards to avoid a flicker (because for a moment there would be no active content attribute anymore) because the operations are done in sequence and not atomically.
         if (attr.type === "label") {
diff --git a/apps/client/src/widgets/layout/ActiveContentBadges.tsx b/apps/client/src/widgets/layout/ActiveContentBadges.tsx
index 0ffad6c1fe..3049e46243 100644
--- a/apps/client/src/widgets/layout/ActiveContentBadges.tsx
+++ b/apps/client/src/widgets/layout/ActiveContentBadges.tsx
@@ -203,14 +203,10 @@ function ActiveContentToggle({ note, info }: { note: FNote, info: ActiveContentI
         switchOffTooltip={t("active_content_badges.toggle_tooltip_disable_tooltip", { type: title })}
         switchOnTooltip={t("active_content_badges.toggle_tooltip_enable_tooltip", { type: title })}
         onChange={async (willEnable) => {
-            const attrs = note.getOwnedAttributes()
-                .filter(attr => {
-                    if (attr.isInheritable) return false;
-                    const baseName = attributes.getNameWithoutDangerousPrefix(attr.name);
-                    return DANGEROUS_ATTRIBUTES.some(item => item.name === baseName && item.type === attr.type);
-                });
-
-            await Promise.all(attrs.map(a => attributes.toggleDangerousAttribute(note, a.type, a.name, willEnable)));
+            await Promise.all(note.getOwnedAttributes()
+                .map(attr => ({ name: attributes.getNameWithoutDangerousPrefix(attr.name), type: attr.type }))
+                .filter(({ name, type }) => DANGEROUS_ATTRIBUTES.some(item => item.name === name && item.type === type))
+                .map(({ name, type }) => attributes.toggleDangerousAttribute(note, type, name, willEnable)));
         }}
     />;
 }