Merge pull request #316 from fractal-analytics-platform/309-add-show-history-to-dataset-page

Add show-history button in dataset page (ref #309)

Author: tcompa

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 # Unreleased
 
+* Added dataset history modal (\#316).
 * Fixed bug with save/discard changes in workflow task (\#315).
 * Fixed first-run redirects issue (\#315).
 

src/lib/types.d.ts

@@ -32,12 +32,19 @@ export type Resource = {
   dataset_id: number
 }
 
+export type DatasetHistoryItem = {
+  workflowtask: WorkflowTask
+  status: string
+  parallelization: object
+}
+
 export type Dataset = {
   name: string
   type?: string
   meta: object
+  history: Array<DatasetHistoryItem>
   read_only: boolean
   id: number
-  resource_list: Resource[]
+  resource_list: Array<Resource>
   project_id: number
-}
+}

src/routes/projects/[projectId]/datasets/[datasetId]/+page.svelte

@@ -13,6 +13,31 @@
 	onMount(async () => {
 		dataset = await $page.data.dataset;
 	});
+
+	/**
+	 * Returns the dataset history formatted in JSON hiding some values.
+	 *
+	 * @param {import('$lib/types').DatasetHistoryItem} historyItem
+	 * @returns {string}
+	 */
+	function formatDatasetHistory(historyItem) {
+		return JSON.stringify(
+			{
+				...historyItem,
+				workflowtask: {
+					...historyItem.workflowtask,
+					task: {
+						...historyItem.workflowtask.task,
+						args_schema: historyItem.workflowtask.task.args_schema ? '[HIDDEN]' : undefined,
+						docs_info: historyItem.workflowtask.task.docs_info ? '[HIDDEN]' : undefined,
+						docs_link: historyItem.workflowtask.task.docs_link ? '[HIDDEN]' : undefined
+					}
+				}
+			},
+			null,
+			2
+		);
+	}
 </script>
 
 <div class="d-flex justify-content-between align-items-center">
@@ -34,7 +59,11 @@
 		{#if dataset}
 			<button class="btn btn-light" data-bs-target="#datasetMetaModal" data-bs-toggle="modal">
 				<i class="bi-arrow-up-right-square" />
-				Show meta properties
+				Show dataset metadata
+			</button>
+			<button class="btn btn-light" data-bs-target="#datasetHistoryModal" data-bs-toggle="modal">
+				<i class="bi-arrow-up-right-square" />
+				Show dataset history
 			</button>
 		{/if}
 	</div>
@@ -135,10 +164,34 @@
 			</ul>
 		</svelte:fragment>
 	</Modal>
+	<Modal id="datasetHistoryModal" size="xl" centered={true} scrollable={true}>
+		<svelte:fragment slot="header">
+			<h5 class="modal-title">Dataset history</h5>
+		</svelte:fragment>
+		<svelte:fragment slot="body">
+			<ul class="list-group">
+				{#if dataset.history && Object.keys(dataset.history).length > 0}
+					{#each Object.entries(dataset.history) as [key, value]}
+						<li class="list-group-item text-bg-light">
+							<span>
+								Task "{value.workflowtask.task.name}", status "{value.status}"
+							</span>
+						</li>
+						<li class="list-group-item text-break">
+							<code><pre>{formatDatasetHistory(value)}</pre></code>
+						</li>
+					{/each}
+				{:else}
+					<p>No history</p>
+				{/if}
+			</ul>
+		</svelte:fragment>
+	</Modal>
 {/if}
 
 <style type="text/css">
 	pre {
+		white-space: pre-wrap;
 		display: inline;
 	}
 </style>