Merge pull request #21314 from ahmedhamidawan/change_invocation_default_to_create_time

[25.1] Set `create_time` as the default time for sorting/display for invocations

Author: itisAliRH

client/src/components/Workflow/Invocation/InvocationScrollList.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { faClock } from "@fortawesome/free-regular-svg-icons";
 import { faHdd, faSitemap } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { storeToRefs } from "pinia";
@@ -123,7 +124,9 @@ function getInvocationBadges(invocation: WorkflowInvocation) {
                 :title-icon="{ icon: faSitemap }"
                 :title-n-lines="2"
                 title-size="text"
-                :update-time="invocation.update_time"
+                :update-time="invocation.create_time"
+                update-time-title="Invoked"
+                :update-time-icon="faClock"
                 @title-click="workflowName(invocation.workflow_id)"
                 @click="() => cardClicked(invocation)">
                 <template v-slot:description>

client/src/components/Workflow/WorkflowAnnotation.test.ts

@@ -92,7 +92,7 @@ async function mountWorkflowAnnotation(version: "run_form" | "invocation", ownsW
         propsData: {
             workflowId: ownsWorkflow ? SAMPLE_WORKFLOW.id : OTHER_USER_WORKFLOW_ID,
             historyId: TEST_HISTORY_ID,
-            invocationUpdateTime: version === "invocation" ? INVOCATION_TIME : undefined,
+            invocationCreateTime: version === "invocation" ? INVOCATION_TIME : undefined,
             showDetails: version === "run_form",
         },
         localVue,
@@ -164,7 +164,7 @@ describe("WorkflowAnnotation renders", () => {
         const { wrapper } = await mountWorkflowAnnotation("invocation");
 
         const timeInfo = wrapper.find(SELECTORS.TIME_INFO);
-        expect(timeInfo.text()).toContain("updated");
+        expect(timeInfo.text()).toContain("invoked");
         expect(timeInfo.find(SELECTORS.DATE).attributes("title")).toBe(INVOCATION_TIME);
     });
 });

client/src/components/Workflow/WorkflowAnnotation.vue

@@ -17,14 +17,14 @@ import WorkflowIndicators from "@/components/Workflow/List/WorkflowIndicators.vu
 
 interface Props {
     workflowId: string;
-    invocationUpdateTime?: string;
+    invocationCreateTime?: string;
     historyId: string;
     showDetails?: boolean;
     hideHr?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
-    invocationUpdateTime: undefined,
+    invocationCreateTime: undefined,
 });
 
 const { workflow, owned } = useWorkflowInstance(props.workflowId);
@@ -34,7 +34,7 @@ const description = computed(() => {
 });
 
 const timeElapsed = computed(() => {
-    return props.invocationUpdateTime || workflow.value?.update_time;
+    return props.invocationCreateTime || workflow.value?.update_time;
 });
 
 const workflowTags = computed(() => {
@@ -49,11 +49,11 @@ const workflowTags = computed(() => {
                 <i v-if="timeElapsed" data-description="workflow annotation time info">
                     <FontAwesomeIcon :icon="faClock" class="mr-1" />
                     <span v-localize>
-                        {{ props.invocationUpdateTime ? "updated" : "edited" }}
+                        {{ props.invocationCreateTime ? "invoked" : "edited" }}
                     </span>
                     <UtcDate :date="timeElapsed" mode="elapsed" data-description="workflow annotation date" />
                 </i>
-                <span v-if="invocationUpdateTime" class="d-flex flex-gapx-1 align-items-center">
+                <span v-if="invocationCreateTime" class="d-flex flex-gapx-1 align-items-center">
                     <FontAwesomeIcon :icon="faHdd" />History:
 
                     <span class="history-link-wrapper">

client/src/components/WorkflowInvocationState/WorkflowInvocationState.vue

@@ -304,7 +304,7 @@ async function onCancel() {
         <WorkflowAnnotation
             v-if="props.isFullPage"
             :workflow-id="invocation.workflow_id"
-            :invocation-update-time="invocation.update_time"
+            :invocation-create-time="invocation.create_time"
             :history-id="invocation.history_id">
             <template v-slot:middle-content>
                 <div class="progress-bars mx-1">