From 6810c77726adf47b5e4203ce44cdd4ecee27ac8d Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Tue, 16 Apr 2024 09:39:18 +0300
Subject: [PATCH 1/4] Add additional columns to data dialog, properly format
 update time

---
 .../src/components/DataDialog/DataDialog.vue  | 17 +++++++++++++++++
 .../SelectionDialog/SelectionDialog.vue       | 19 +++++++++++++++++++
 2 files changed, 36 insertions(+)

diff --git a/client/src/components/DataDialog/DataDialog.vue b/client/src/components/DataDialog/DataDialog.vue
index ca12a0a66168..8302589752e3 100644
--- a/client/src/components/DataDialog/DataDialog.vue
+++ b/client/src/components/DataDialog/DataDialog.vue
@@ -61,6 +61,22 @@ const services = new Services();
 const model = new Model({ multiple: props.multiple, format: props.format });
 let urlTracker = new UrlTracker(getHistoryUrl());
 
+/** Specifies data columns to be shown in the dialog's table */
+const fields = [
+    {
+        key: "label",
+    },
+    {
+        key: "extension",
+    },
+    {
+        key: "tags",
+    },
+    {
+        key: "update_time",
+    },
+];
+
 /** Add highlighting for record variations, i.e. datasets vs. libraries/collections **/
 function formatRows() {
     for (const item of items.value) {
@@ -168,6 +184,7 @@ watch(
     <SelectionDialog
         :error-message="errorMessage"
         :disable-ok="!hasValue"
+        :fields="fields"
         :items="items"
         :modal-show="modalShow"
         :multiple="multiple"
diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index 1f275ddcd357..b8193213a99a 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -100,6 +100,22 @@ function filtered(items: Array<SelectionItem>) {
     currentPage.value = 1;
 }
 
+/** Format time stamp */
+function formatTime(value: string) {
+    if (value) {
+        const date = new Date(value);
+        return date.toLocaleString("default", {
+            day: "numeric",
+            month: "short",
+            year: "numeric",
+            minute: "numeric",
+            hour: "numeric",
+        });
+    } else {
+        return "-";
+    }
+}
+
 watch(
     () => props.items,
     () => {
@@ -170,6 +186,9 @@ watch(
                     <template v-slot:cell(time)="data">
                         {{ data.value ? data.value : "-" }}
                     </template>
+                    <template v-slot:cell(update_time)="data">
+                        {{ formatTime(data.value) }}
+                    </template>
                 </BTable>
                 <div v-if="isBusy" class="text-center">
                     <BSpinner small type="grow" />

From d2b718ed72881977595039272316fa1c08b63fa3 Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Tue, 16 Apr 2024 09:44:06 +0300
Subject: [PATCH 2/4] Add tags to data dialog component

---
 client/src/components/SelectionDialog/SelectionDialog.vue | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index b8193213a99a..69d4072f4e6b 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -11,6 +11,7 @@ import { SELECTION_STATES } from "@/components/SelectionDialog/selectionTypes";
 import { type FieldEntry, type SelectionItem } from "./selectionTypes";
 
 import DataDialogSearch from "@/components/SelectionDialog/DataDialogSearch.vue";
+import StatelessTags from "@/components/TagsMultiselect/StatelessTags.vue";
 
 library.add(faCaretLeft, faCheck, faCheckSquare, faFolder, faMinusSquare, faSpinner, faSquare, faTimes);
 
@@ -183,6 +184,10 @@ watch(
                     <template v-slot:cell(details)="data">
                         <span :title="`details-${data.item.url}`">{{ data.value ? data.value : "-" }}</span>
                     </template>
+                    <template v-slot:cell(tags)="data">
+                        <StatelessTags v-if="data.value?.length > 0" :value="data.value" :disabled="true" />
+                        <span v-else>-</span>
+                    </template>
                     <template v-slot:cell(time)="data">
                         {{ data.value ? data.value : "-" }}
                     </template>

From ea57bbabb6870023feac6ff75c7ac12f8c88cd0a Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Tue, 16 Apr 2024 10:23:30 +0300
Subject: [PATCH 3/4] Handle time stamp formatting in selection dialog

---
 .../SelectionDialog/BasicSelectionDialog.vue           | 10 ----------
 .../src/components/SelectionDialog/SelectionDialog.vue |  2 +-
 2 files changed, 1 insertion(+), 11 deletions(-)

diff --git a/client/src/components/SelectionDialog/BasicSelectionDialog.vue b/client/src/components/SelectionDialog/BasicSelectionDialog.vue
index 2366bb9b1230..013de4be0e9e 100644
--- a/client/src/components/SelectionDialog/BasicSelectionDialog.vue
+++ b/client/src/components/SelectionDialog/BasicSelectionDialog.vue
@@ -56,16 +56,6 @@ async function load() {
         items.value = incoming.map((item: any) => {
             let timeStamp = item[props.timeKey];
             showTime.value = !!timeStamp;
-            if (timeStamp) {
-                const date = new Date(timeStamp);
-                timeStamp = date.toLocaleString("default", {
-                    day: "numeric",
-                    month: "short",
-                    year: "numeric",
-                    minute: "numeric",
-                    hour: "numeric",
-                });
-            }
             return {
                 id: item.id,
                 label: item[props.labelKey] || null,
diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index 69d4072f4e6b..6800e3f07b2d 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -189,7 +189,7 @@ watch(
                         <span v-else>-</span>
                     </template>
                     <template v-slot:cell(time)="data">
-                        {{ data.value ? data.value : "-" }}
+                        {{ formatTime(data.value) }}
                     </template>
                     <template v-slot:cell(update_time)="data">
                         {{ formatTime(data.value) }}

From 25e680908b6afeac1840f3994662e8e3aeea6c8d Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Tue, 16 Apr 2024 10:38:03 +0300
Subject: [PATCH 4/4] Use const for timestamp attribute

---
 client/src/components/SelectionDialog/BasicSelectionDialog.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/SelectionDialog/BasicSelectionDialog.vue b/client/src/components/SelectionDialog/BasicSelectionDialog.vue
index 013de4be0e9e..d80167ca3f7e 100644
--- a/client/src/components/SelectionDialog/BasicSelectionDialog.vue
+++ b/client/src/components/SelectionDialog/BasicSelectionDialog.vue
@@ -54,7 +54,7 @@ async function load() {
         const response = await props.getData();
         const incoming = response.data;
         items.value = incoming.map((item: any) => {
-            let timeStamp = item[props.timeKey];
+            const timeStamp = item[props.timeKey];
             showTime.value = !!timeStamp;
             return {
                 id: item.id,