diff --git a/package-lock.json b/package-lock.json index a80405561d5849f84ac85efacb1e7123c83efab8..0f79c0580c27ea372612dcdb41b5b0f359c5bac6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2940,9 +2940,9 @@ "dev": true }, "node_modules/acorn": { - "version": "8.12.0", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.0.tgz", - "integrity": "sha512-RTvkC4w+KNXrM39/lWCUaG0IbRkWdCv7W/IOW9oU6SawyxulvkQy5HQPVTKxEjczcUvapcrw3cFx/60VN/NRNw==", + "version": "8.12.1", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz", + "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==", "dev": true, "bin": { "acorn": "bin/acorn" @@ -6666,13 +6666,13 @@ } }, "node_modules/vite": { - "version": "5.3.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.2.tgz", - "integrity": "sha512-6lA7OBHBlXUxiJxbO5aAY2fsHHzDr1q7DvXYnyZycRs2Dz+dXBWuhpWHvmljTRTpQC2uvGmUFFkSHF2vGo90MA==", + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.3.tgz", + "integrity": "sha512-NPQdeCU0Dv2z5fu+ULotpuq5yfCS1BzKUIPhNbP3YBfAMGJXbt2nS+sbTFu+qchaqWTD+H3JK++nRwr6XIcp6A==", "dev": true, "dependencies": { "esbuild": "^0.21.3", - "postcss": "^8.4.38", + "postcss": "^8.4.39", "rollup": "^4.13.0" }, "bin": { diff --git a/src/assets/main.css b/src/assets/main.css index bdbb663e010b6c5e9b4ab67ecc0de411dbeded73..f1af97064df68db067a693fa69f9427d4ede6f16 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -36,3 +36,7 @@ pre { .hover-danger:hover { color: var(--bs-danger) !important; } + +.execution-notes p { + margin-bottom: 0; +} diff --git a/src/views/admin/AdminWorkflowExecutionView.vue b/src/views/admin/AdminWorkflowExecutionView.vue index dd187aca15a99ba3cb61f65ccff08855b4209b99..9778ed07a7bf0eea3924fd4751f99ee1c0a9ae6e 100644 --- a/src/views/admin/AdminWorkflowExecutionView.vue +++ b/src/views/admin/AdminWorkflowExecutionView.vue @@ -14,6 +14,7 @@ import FontAwesomeIcon from "@/components/FontAwesomeIcon.vue"; import { useNameStore } from "@/stores/names"; import dayjs from "dayjs"; import ParameterModal from "@/components/workflows/modals/ParameterModal.vue"; +import MarkdownRenderer from "@/components/MarkdownRenderer.vue"; const executionRepository = useWorkflowExecutionStore(); const nameRepository = useNameStore(); @@ -27,15 +28,6 @@ const statusToColorMapping = { ERROR: "bg-danger", }; -const statusToIconMapping = { - PENDING: "fa-solid fa-circle-pause", - SCHEDULED: "fa-solid fa-circle-pause", - RUNNING: "fa-solid fa-circle-play", - CANCELED: "fa-solid fa-circle-xmark", - SUCCESS: "fa-solid fa-circle-check", - ERROR: "fa-solid fa-circle-xmark", -}; - let loadingObserver: IntersectionObserver; const endOfTableElement = ref<HTMLTableCaptionElement | undefined>(undefined); @@ -359,6 +351,7 @@ onMounted(() => { <thead> <tr> <th scope="col">Workflow</th> + <th scope="col">Execution ID</th> <th scope="col">Status</th> <th scope="col">Started</th> <th scope="col">Duration</th> @@ -389,15 +382,22 @@ onMounted(() => { nameRepository.getName(execution.workflow_version_id) }} </router-link> + <markdown-renderer + class="execution-notes" + v-else-if="execution.notes" + :markdown="execution.notes" + /> + <span v-else>Deleted Workflow</span> + </td> + <td> + {{ execution.execution_id }} </td> <td> <span class="rounded-pill py-1 px-2 text-light" :class="statusToColorMapping[execution.status]" - ><font-awesome-icon - class="me-2" - :icon="statusToIconMapping[execution.status]" - />{{ execution.status }}</span + > + {{ execution.status }}</span > </td> <td> @@ -414,7 +414,9 @@ onMounted(() => { .humanize() }} </template> - <template v-else> -</template> + <template v-else> + {{ dayjs.unix(execution.start_time).toNow(true) }} + </template> </td> <td> <template v-if="execution.end_time"> @@ -470,10 +472,10 @@ onMounted(() => { </tr> </template> <tr v-else-if="!formState.loading"> - <td colspan="7" class="text-center"><i>No workflow executions</i></td> + <td colspan="8" class="text-center"><i>No workflow executions</i></td> </tr> <tr v-if="formState.loading"> - <td colspan="7" class="text-center"> + <td colspan="8" class="text-center"> <div class="spinner-border text-secondary spinner-border-sm" role="status" diff --git a/src/views/workflows/ListWorkflowExecutionsView.vue b/src/views/workflows/ListWorkflowExecutionsView.vue index 7aa6bbc953508d1fc40c9e37f75f3c5ea769c13d..fe8ec4bf4ce1fe0422c68c71ba15af944b9eb8e0 100644 --- a/src/views/workflows/ListWorkflowExecutionsView.vue +++ b/src/views/workflows/ListWorkflowExecutionsView.vue @@ -10,6 +10,7 @@ import { useWorkflowExecutionStore } from "@/stores/workflowExecutions"; import ParameterModal from "@/components/workflows/modals/ParameterModal.vue"; import { ExponentialBackoff } from "@/utils/BackoffStrategy"; import { useNameStore } from "@/stores/names"; +import MarkdownRenderer from "@/components/MarkdownRenderer.vue"; const workflowRepository = useWorkflowStore(); const nameRepository = useNameStore(); @@ -254,6 +255,12 @@ onUnmounted(() => { nameRepository.getName(execution.workflow_version_id) }} </router-link> + <markdown-renderer + class="execution-notes" + v-else-if="execution.notes" + :markdown="execution.notes" + /> + <span v-else>Deleted Workflow</span> </td> <td> <span @@ -279,7 +286,9 @@ onUnmounted(() => { .humanize() }} </template> - <template v-else> -</template> + <template v-else + >{{ dayjs.unix(execution.start_time).toNow(true) }} + </template> </td> <td> <template v-if="execution.end_time">