v0.1.0-pre.061

kb-app-demo-desktop/frontend/ts/demo_decode_replay.ts

@@ -1,10 +1,12 @@
 // file: kb-app-demo-desktop/frontend/ts/demo_decode_replay.ts
-// version: 6
+// version: 7
 
 import * as bootstrap from "bootstrap";
 import "simplebar";
 import ResizeObserver from "resize-observer-polyfill";
 import { invoke } from "@tauri-apps/api/core";
+import DataTable, { type Api } from "datatables.net-bs5";
+import "datatables.net-bs5/css/dataTables.bootstrap5.css";
 import { listen } from "@tauri-apps/api/event";
 import { frontendDebug, frontendError, installFrontendConsoleBridge } from "./frontend_log.ts";
 import type { DemoDecodeDiagnosticsPayload } from "./bindings/kb_app_demo_desktop/demo_decode_replay/DemoDecodeDiagnosticsPayload.ts";
@@ -224,7 +226,11 @@ function shortened(value: string, visible: number): string {
     return value.length > visible ? `${value.slice(0, visible)}…` : value;
 }
 
+let annotationJournalTable: Api<DemoTransactionAnnotationRow> | null = null;
+
 function renderAnnotations(rows: DemoTransactionAnnotationRow[]): void {
+    annotationJournalTable?.destroy();
+    annotationJournalTable = null;
     const body = element<HTMLTableSectionElement>("#annotationJournalBody");
     body.replaceChildren();
     for (const row of rows) {
@@ -241,6 +247,21 @@ function renderAnnotations(rows: DemoTransactionAnnotationRow[]): void {
         );
         body.append(tableRow);
     }
+    annotationJournalTable = new DataTable<DemoTransactionAnnotationRow>("#annotationJournalTable", {
+        autoWidth: false,
+        pageLength: 25,
+        lengthMenu: [10, 25, 50, 100],
+        order: [[0, "desc"]],
+        scrollX: true,
+        language: {
+            emptyTable: "Aucune annotation.",
+            info: "_START_ à _END_ sur _TOTAL_ annotations",
+            infoEmpty: "0 annotation",
+            lengthMenu: "Afficher _MENU_ annotations",
+            search: "Filtrer :",
+            zeroRecords: "Aucune annotation correspondante.",
+        },
+    });
     element<HTMLElement>("#annotationJournalStatus").textContent = `${rows.length} annotation(s) committed chargée(s).`;
 }