chore(react/settings): start porting protected session timeout

apps/client/src/widgets/type_widgets/options/password.tsx

@@ -11,12 +11,12 @@ import OptionsSection from "./components/OptionsSection"
 import protected_session_holder from "../../../services/protected_session_holder"
 import { ChangePasswordResponse } from "@triliumnext/commons"
 import dialog from "../../../services/dialog"
-import { reloadFrontendApp } from "../../../services/utils"
 
 export default function PasswordSettings() {
     return (
         <>
             <ChangePassword />
+            <ProtectedSessionTimeout />
         </>
     )
 }
@@ -102,3 +102,13 @@ function ChangePassword() {
         </OptionsSection>
     )
 }
+
+function ProtectedSessionTimeout() {
+    return (
+        <OptionsSection title={t("password.protected_session_timeout")}>
+            {t("password.protected_session_timeout_description")}
+            &nbsp;
+            <a class="tn-link" href="https://triliumnext.github.io/Docs/Wiki/protected-notes.html" className="external">{t("password.wiki")}</a> {t("password.for_more_info")}
+        </OptionsSection>
+    )
+}

apps/client/src/widgets/type_widgets/options/password/protected_session_timeout.ts

@@ -1,12 +1,9 @@
-import { t } from "../../../../services/i18n.js";
 import TimeSelector from "../time_selector.js";
 
 const TPL = /*html*/`
 <div class="options-section">
-    <h4>${t("password.protected_session_timeout")}</h4>
-
     <p class="form-text">
-        ${t("password.protected_session_timeout_description")} <a class="tn-link" href="https://triliumnext.github.io/Docs/Wiki/protected-notes.html" class="external">${t("password.wiki")}</a> ${t("password.for_more_info")}
+
     </p>
     <div id="time-selector-placeholder"></div>
 </div>`;