feat(react/settings): port integrity check

apps/client/src/widgets/type_widgets/content_widget.tsx

@@ -21,8 +21,6 @@ import RevisionsSnapshotIntervalOptions from "./options/other/revisions_snapshot
 import RevisionSnapshotsLimitOptions from "./options/other/revision_snapshots_limit.js";
 import NetworkConnectionsOptions from "./options/other/network_connections.js";
 import HtmlImportTagsOptions from "./options/other/html_import_tags.js";
-import AdvancedSyncOptions from "./options/advanced/sync.js";
-import DatabaseIntegrityCheckOptions from "./options/advanced/database_integrity_check.js";
 import VacuumDatabaseOptions from "./options/advanced/vacuum_database.js";
 import DatabaseAnonymizationOptions from "./options/advanced/database_anonymization.js";
 import BackendLogWidget from "./content/backend_log.js";

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

@@ -1,12 +1,15 @@
+import { DatabaseCheckIntegrityResponse } from "@triliumnext/commons";
 import { t } from "../../../services/i18n";
 import server from "../../../services/server";
 import toast from "../../../services/toast";
 import Button from "../../react/Button";
+import FormText from "../../react/FormText";
 import OptionsSection from "./components/OptionsSection"
 
 export default function AdvancedSettings() {
     return <>
         <AdvancedSyncOptions />
+        <DatabaseIntegrityOptions />
     </>;
 }
 
@@ -32,3 +35,35 @@ function AdvancedSyncOptions() {
         </OptionsSection>
     );
 }
+
+function DatabaseIntegrityOptions() {
+    return (
+        <OptionsSection title={t("database_integrity_check.title")}>
+            <FormText>{t("database_integrity_check.description")}</FormText>
+            
+            <Button
+                text={t("database_integrity_check.check_button")}
+                onClick={async () => {
+                    toast.showMessage(t("database_integrity_check.checking_integrity"));
+                    
+                    const { results } = await server.get<DatabaseCheckIntegrityResponse>("database/check-integrity");
+        
+                    if (results.length === 1 && results[0].integrity_check === "ok") {
+                        toast.showMessage(t("database_integrity_check.integrity_check_succeeded"));
+                    } else {
+                        toast.showMessage(t("database_integrity_check.integrity_check_failed", { results: JSON.stringify(results, null, 2) }), 15000);
+                    }
+                }}
+            />
+
+            <Button
+                text={t("consistency_checks.find_and_fix_button")}
+                onClick={async () => {
+                    toast.showMessage(t("consistency_checks.finding_and_fixing_message"));
+                    await server.post("database/find-and-fix-consistency-issues");
+                    toast.showMessage(t("consistency_checks.issues_fixed_message"));
+                }}
+            />
+        </OptionsSection>
+    )
+}

apps/client/src/widgets/type_widgets/options/advanced/database_integrity_check.ts

@@ -1,53 +0,0 @@
-import OptionsWidget from "../options_widget.js";
-import toastService from "../../../../services/toast.js";
-import server from "../../../../services/server.js";
-import { t } from "../../../../services/i18n.js";
-
-const TPL = /*html*/`
-<div class="options-section">
-    <h4>${t("database_integrity_check.title")}</h4>
-
-    <p class="form-text">${t("database_integrity_check.description")}</p>
-
-    <button class="check-integrity-button btn btn-secondary">${t("database_integrity_check.check_button")}</button>
-    <button class="find-and-fix-consistency-issues-button btn btn-secondary">${t("consistency_checks.find_and_fix_button")}</button>
-</div>
-`;
-
-// TODO: Deduplicate with server
-interface Response {
-    results: {
-        integrity_check: string;
-    }[];
-}
-
-export default class DatabaseIntegrityCheckOptions extends OptionsWidget {
-
-    private $checkIntegrityButton!: JQuery<HTMLElement>;
-    private $findAndFixConsistencyIssuesButton!: JQuery<HTMLElement>;
-
-    doRender() {
-        this.$widget = $(TPL);
-        this.$checkIntegrityButton = this.$widget.find(".check-integrity-button");
-        this.$checkIntegrityButton.on("click", async () => {
-            toastService.showMessage(t("database_integrity_check.checking_integrity"));
-
-            const { results } = await server.get<Response>("database/check-integrity");
-
-            if (results.length === 1 && results[0].integrity_check === "ok") {
-                toastService.showMessage(t("database_integrity_check.integrity_check_succeeded"));
-            } else {
-                toastService.showMessage(t("database_integrity_check.integrity_check_failed", { results: JSON.stringify(results, null, 2) }), 15000);
-            }
-        });
-
-        this.$findAndFixConsistencyIssuesButton = this.$widget.find(".find-and-fix-consistency-issues-button");
-        this.$findAndFixConsistencyIssuesButton.on("click", async () => {
-            toastService.showMessage(t("consistency_checks.finding_and_fixing_message"));
-
-            await server.post("database/find-and-fix-consistency-issues");
-
-            toastService.showMessage(t("consistency_checks.issues_fixed_message"));
-        });
-    }
-}

apps/server/src/routes/api/database.ts

@@ -9,6 +9,7 @@ import type { Request } from "express";
 import ValidationError from "../../errors/validation_error.js";
 import sql_init from "../../services/sql_init.js";
 import becca_loader from "../../becca/becca_loader.js";
+import { DatabaseCheckIntegrityResponse } from "@triliumnext/commons";
 
 function getExistingBackups() {
     return backupService.getExistingBackups();
@@ -48,13 +49,13 @@ async function anonymize(req: Request) {
 }
 
 function checkIntegrity() {
-    const results = sql.getRows("PRAGMA integrity_check");
+    const results = sql.getRows<{ integrity_check: string }>("PRAGMA integrity_check");
 
     log.info(`Integrity check result: ${JSON.stringify(results)}`);
 
     return {
         results
-    };
+    } satisfies DatabaseCheckIntegrityResponse;
 }
 
 export default {

packages/commons/src/lib/server_api.ts

@@ -61,3 +61,9 @@ export interface RecentChangeRow {
 export interface BulkActionAffectedNotes {
     affectedNoteCount: number;
 }
+
+export interface DatabaseCheckIntegrityResponse {
+    results: {
+        integrity_check: string;
+    }[];
+}