From eb08a976dd65bee7c3da9c3ac816b11c0a7af511 Mon Sep 17 00:00:00 2001
From: Panagiotis Papadopoulos <pano_90@gmx.net>
Date: Tue, 18 Feb 2025 09:00:57 +0100
Subject: [PATCH] feat: use TimeSelector for revision_snapshot_interval

added one TODO that needs to be handled in TimeSelector: minimum allowed value (!in seconds!)
---
 .../other/revisions_snapshot_interval.ts      | 32 +++++++++----------
 .../type_widgets/options/time_selector.ts     |  1 +
 2 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/public/app/widgets/type_widgets/options/other/revisions_snapshot_interval.ts b/src/public/app/widgets/type_widgets/options/other/revisions_snapshot_interval.ts
index 751f70653..db095fa81 100644
--- a/src/public/app/widgets/type_widgets/options/other/revisions_snapshot_interval.ts
+++ b/src/public/app/widgets/type_widgets/options/other/revisions_snapshot_interval.ts
@@ -1,30 +1,30 @@
-import OptionsWidget from "../options_widget.js";
 import { t } from "../../../../services/i18n.js";
-import type { OptionMap } from "../../../../../../services/options_interface.js";
+import TimeSelector from "../time_selector.js";
 
 const TPL = `
 <div class="options-section">
     <h4>${t("revisions_snapshot_interval.note_revisions_snapshot_interval_title")}</h4>
 
     <p class="use-tn-links">${t("revisions_snapshot_interval.note_revisions_snapshot_description")}</p>
-
-    <div class="form-group">
-        <label>${t("revisions_snapshot_interval.snapshot_time_interval_label")}</label>
-        <input class="revision-snapshot-time-interval-in-seconds form-control options-number-input" type="number" min="10">
-    </div>
+    <div id="time-selector-placeholder"></div>
 </div>`;
+//TriliumNextTODO: add support for setting minimum number of entered seconds -> snapshot revision should not be less than 10 seconds
+export default class RevisionsSnapshotIntervalOptions extends TimeSelector {
 
-export default class RevisionsSnapshotIntervalOptions extends OptionsWidget {
-
-    private $revisionsTimeInterval!: JQuery<HTMLElement>;
+    constructor() {
+        super({
+            widgetId: "revision-snapshot-time-interval",
+            widgetLabelId: "revisions_snapshot_interval.snapshot_time_interval_label",
+            optionValueId: "revisionSnapshotTimeInterval",
+            optionTimeScaleId: "revisionSnapshotTimeIntervalTimeScale"
+        });
+        super.doRender();
+    }
 
     doRender() {
+        const $timeSelector = this.$widget;
+        // inject TimeSelector widget template
         this.$widget = $(TPL);
-        this.$revisionsTimeInterval = this.$widget.find(".revision-snapshot-time-interval-in-seconds");
-        this.$revisionsTimeInterval.on("change", () => this.updateOption("revisionSnapshotTimeInterval", this.$revisionsTimeInterval.val()));
-    }
-
-    async optionsLoaded(options: OptionMap) {
-        this.$revisionsTimeInterval.val(options.revisionSnapshotTimeInterval);
+        this.$widget.find("#time-selector-placeholder").replaceWith($timeSelector)
     }
 }
diff --git a/src/public/app/widgets/type_widgets/options/time_selector.ts b/src/public/app/widgets/type_widgets/options/time_selector.ts
index a3ec7c9bb..74c85faa7 100644
--- a/src/public/app/widgets/type_widgets/options/time_selector.ts
+++ b/src/public/app/widgets/type_widgets/options/time_selector.ts
@@ -36,6 +36,7 @@ const TPL = (options: Omit<TimeSelectorConstructor, "optionValueId" | "optionTim
     }
 </style>`;
 
+//TriliumNextTODO: add support for setting minimum number of entered seconds
 export default class TimeSelector extends OptionsWidget {
     private $timeValueInput!: JQuery<HTMLInputElement>;
     private $timeScaleSelect!: JQuery<HTMLSelectElement>;