DT-3440 - add activity options to pending activity card

src/lib/components/workflow/pending-activity/pending-activity-card.svelte

@@ -6,6 +6,7 @@
   import ActivityCommands from '$lib/components/activity/activity-commands.svelte';
   import PayloadDecoder from '$lib/components/event/payload-decoder.svelte';
   import WorkflowStatus from '$lib/components/workflow-status.svelte';
+  import AccordionLight from '$lib/holocene/accordion/accordion-light.svelte';
   import Accordion from '$lib/holocene/accordion/accordion.svelte';
   import Badge from '$lib/holocene/badge.svelte';
   import CodeBlock from '$lib/holocene/code-block.svelte';
@@ -156,10 +157,61 @@
       {/if}
     </div>
   </div>
+  {#if activity.activityOptions}
+    <AccordionLight>
+      <h5 slot="title">{translate('activities.activity-options')}</h5>
+      <div class="flex max-md:flex-col md:flex-row">
+        <div class="md:w-1/2">
+          {@render detail(
+            translate('common.task-queue'),
+            activity.activityOptions.taskQueue.name,
+          )}
+          {@render detail(
+            translate('activities.start-to-close-timeout'),
+            formatDuration(activity.activityOptions.startToCloseTimeout),
+          )}
+          {@render detail(
+            translate('activities.schedule-to-close-timeout'),
+            formatDuration(activity.activityOptions.scheduleToCloseTimeout),
+          )}
+          {@render detail(
+            translate('activities.schedule-to-start-timeout'),
+            formatDuration(activity.activityOptions.scheduleToStartTimeout),
+          )}
+          {@render detail(
+            translate('activities.heartbeat-timeout'),
+            formatDuration(activity.activityOptions.heartbeatTimeout),
+          )}
+        </div>
+        <div>
+          {@render detail(
+            translate('activities.retry-policy-initial-interval'),
+            formatDuration(
+              activity.activityOptions.retryPolicy.initialInterval,
+            ),
+          )}
+          {@render detail(
+            translate('activities.retry-policy-backoff-coefficient'),
+            activity.activityOptions.retryPolicy.backoffCoefficient,
+          )}
+          {@render detail(
+            translate('activities.retry-policy-maximum-interval'),
+            formatDuration(
+              activity.activityOptions.retryPolicy.maximumInterval,
+            ),
+          )}
+          {@render detail(
+            translate('activities.retry-policy-maximum-attempts'),
+            activity.activityOptions.retryPolicy.maximumAttempts,
+          )}
+        </div>
+      </div>
+    </AccordionLight>
+  {/if}
 </div>
 
 {#snippet detail(label: string, value: string | number | Snippet)}
-  <div class="flex items-start gap-4">
+  <div class="flex items-center gap-4">
     <p class="min-w-56 text-sm text-secondary/80">
       {label}
     </p>

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

@@ -43,7 +43,7 @@
       <slot name="description" />
       <div class="flex items-center gap-4">
         <slot name="action" />
-        <Icon name={icon ? icon : open ? 'arrow-down' : 'arrow-right'} />
+        <Icon name={icon ? icon : open ? 'chevron-up' : 'chevron-down'} />
       </div>
     </div>
   </button>

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

@@ -16,4 +16,13 @@ export const Strings = {
   'unpause-all-activity-types': 'Unpause all {{type}} runs',
   'reset-heartbeat-details': 'Reset Heartbeat Details (optional)',
   'reset-success': 'Activity {{activityId}} has been reset successfully.',
+  'activity-options': 'Activity Options',
+  'start-to-close-timeout': 'Start to Close Timeout',
+  'schedule-to-start-timeout': 'Schedule to Start Timeout',
+  'schedule-to-close-timeout': 'Schedule to Close Timeout',
+  'heartbeat-timeout': 'Heartbeat Timeout',
+  'retry-policy-initial-interval': 'Retry Policy Initial Interval',
+  'retry-policy-backoff-coefficient': 'Retry Policy Backoff Coefficient',
+  'retry-policy-maximum-interval': 'Retry Policy Maximum Interval',
+  'retry-policy-maximum-attempts': 'Retry Policy Maximum Attempts',
 };

src/lib/types/events.ts

@@ -1,7 +1,24 @@
 import type { Timestamp } from '@temporalio/common';
 
 import type { EventGroup } from '$lib/models/event-groups/event-groups';
-import type { ActivityOptions, EventLink } from '$lib/types';
+import type { EventLink } from '$lib/types';
+
+type ActivityOptions = {
+  taskQueue: {
+    name: string;
+    normalName: string;
+  };
+  scheduleToCloseTimeout: string;
+  scheduleToStartTimeout: string;
+  startToCloseTimeout: string;
+  heartbeatTimeout: string;
+  retryPolicy: {
+    backoffCoefficient: number;
+    initialInterval: string;
+    maximumAttempts: number;
+    maximumInterval: string;
+  };
+};
 
 import type { Replace, Settings } from './global';