Current Details (#2466)

* Add Current Details

* Get rid of unnecessary var check

* Remove unneeded classes

Author: Alex-Tideman

src/lib/holocene/accordion/accordion-light.svelte

@@ -33,7 +33,7 @@
     id="{id}-trigger"
     aria-expanded={open}
     aria-controls="{id}-content"
-    class="w-full cursor-pointer hover:bg-interactive-secondary-hover focus-visible:bg-interactive focus-visible:outline-none"
+    class="focus-visible:outline-interactive w-full cursor-pointer hover:bg-interactive-secondary-hover"
     type="button"
     on:click={toggleAccordion}
   >

src/lib/i18n/locales/en/workflows.ts

@@ -185,6 +185,7 @@ export const Strings = {
   summary: 'Summary',
   details: 'Details',
   'summary-and-details': 'Summary & Details',
+  'current-details': 'Current Details',
   'maximum-attempts': 'Maximum Attempts',
   'retry-expiration': 'Retry Expiration',
   state: 'State',

src/lib/layouts/workflow-header.svelte

@@ -38,15 +38,13 @@
     routeForWorkflows,
   } from '$lib/utilities/route-for';
 
-  export let namespace: string;
-
+  $: ({ namespace, workflow: workflowId, run: runId, id } = $page.params);
   $: ({ workflow, workers } = $workflowRun);
-  $: id = $page.params.id;
 
   $: routeParameters = {
     namespace,
-    workflow: workflow?.id,
-    run: workflow?.runId,
+    workflow: workflowId,
+    run: runId,
   };
 
   $: isRunning = $workflowRun?.workflow?.isRunning;
@@ -57,7 +55,7 @@
     $workflowRun?.workflow?.status,
     $fullEventHistory,
   );
-  $: workflowHasBeenReset = has($resetWorkflows, $workflowRun?.workflow?.runId);
+  $: workflowHasBeenReset = has($resetWorkflows, runId);
   $: workflowUsesVersioning =
     workflow?.assignedBuildId ??
     workflow?.mostRecentWorkerVersionStamp?.useVersioning;
@@ -70,6 +68,7 @@
   $: summary = $workflowRun?.userMetadata?.summary;
   $: details = $workflowRun?.userMetadata?.details;
   $: hasUserMetadata = summary || details;
+  $: currentDetails = $workflowRun?.metadata?.currentDetails;
 </script>
 
 <div class="flex items-center justify-between pb-4">
@@ -124,13 +123,10 @@
   </div>
   {#if hasUserMetadata}
     <AccordionLight let:open>
-      <div
-        slot="title"
-        class="flex w-full items-center gap-2 rounded p-2 text-xl"
-      >
+      <div slot="title" class="flex w-full items-center gap-2 p-2 text-xl">
         <Icon
-          name="flag"
-          class="text-indigo-600/80"
+          name="info"
+          class="text-brand"
           width={32}
           height={32}
         />{translate('workflows.summary-and-details')}
@@ -145,6 +141,24 @@
       {/if}
     </AccordionLight>
   {/if}
+  {#if currentDetails}
+    <AccordionLight let:open>
+      <div
+        slot="title"
+        class="flex w-full items-center gap-2 rounded p-2 text-xl"
+      >
+        <Icon
+          name="flag"
+          class="text-indigo-600/80"
+          width={32}
+          height={32}
+        />{translate('workflows.current-details')}
+      </div>
+      {#if open}
+        <Markdown content={currentDetails} />
+      {/if}
+    </AccordionLight>
+  {/if}
   <WorkflowDetails />
   {#if cancelInProgress}
     <div in:fly={{ duration: 200, delay: 100 }}>

src/lib/layouts/workflow-run-layout.svelte

@@ -227,7 +227,7 @@
       <Loading class="pt-24" />
     {:else}
       <div class="border-b border-subtle px-4 pt-8 md:pt-20 xl:px-8">
-        <WorkflowHeader namespace={$page.params.namespace} />
+        <WorkflowHeader />
       </div>
       <slot />
     {/if}

src/lib/pages/workflow-query.svelte

@@ -35,11 +35,10 @@
   $: edited = initialQueryType !== queryType || input !== initialInput;
 
   $: metadataError = $workflowRun.metadata?.error?.message;
-  $: queryTypes = $workflowRun?.metadata?.definition?.queryDefinitions?.filter(
-    (query) => {
+  $: queryTypes =
+    $workflowRun?.metadata?.definition?.queryDefinitions?.filter((query) => {
       return query?.name !== '__stack_trace';
-    },
-  );
+    }) || [];
 
   $: queryType = queryType || queryTypes?.[0]?.name;