From db4c5bcac25597463d8078c46a8d0d45e77ab899 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Sat, 8 Mar 2025 04:44:23 +0200
Subject: [PATCH] client/options/advanced: use a table for "Existing anonymized
 databases"

---
 .../options/advanced/database_anonymization.ts       | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/public/app/widgets/type_widgets/options/advanced/database_anonymization.ts b/src/public/app/widgets/type_widgets/options/advanced/database_anonymization.ts
index 9ead621b7..42cf854e0 100644
--- a/src/public/app/widgets/type_widgets/options/advanced/database_anonymization.ts
+++ b/src/public/app/widgets/type_widgets/options/advanced/database_anonymization.ts
@@ -43,9 +43,13 @@ const TPL = `
 
     <hr />
 
-    <h5>${t("database_anonymization.existing_anonymized_databases")}</h5>
-
-    <ul class="existing-anonymized-databases"></ul>
+    <table class="existing-anonymized-databases-table table table-stripped">
+        <thead>
+            <th>${t("database_anonymization.existing_anonymized_databases")}</th>
+        </thead>
+        <tbody class="existing-anonymized-databases">
+        </tbody>
+    </table>
 </div>`;
 
 // TODO: Deduplicate with server
@@ -108,7 +112,7 @@ export default class DatabaseAnonymizationOptions extends OptionsWidget {
             }
 
             for (const { filePath } of anonymizedDatabases) {
-                this.$existingAnonymizedDatabases.append($("<li>").text(filePath));
+                this.$existingAnonymizedDatabases.append($("<tr>").append($("<td>").text(filePath)));
             }
         });
     }