tasklist link on summary and history (#690)

Author: Assem-Hafez

src/utils/data-formatters/__tests__/format-workflow-history-event-type.test.ts

@@ -24,6 +24,7 @@ describe('formatWorkflowHistoryEventType', () => {
   it('should handle null input correctly', () => {
     const input = null;
     const expectedOutput = null;
+    // @ts-expect-error Testing with wrong attribute null
     expect(formatWorkflowHistoryEventType(input)).toEqual(expectedOutput);
   });
 

src/utils/data-formatters/__tests__/format-workflow-history.test.ts

@@ -34,8 +34,8 @@ describe('formatWorkflowHistory', () => {
       history: {
         events: [completeActivityTaskEvent],
       },
-      rawHistory: ['raw event data'],
-      otherData: 'some other data',
+      rawHistory: [],
+      nextPageToken: '',
     };
 
     const expectedOutput = {
@@ -47,8 +47,8 @@ describe('formatWorkflowHistory', () => {
           },
         ],
       },
-      rawHistory: ['raw event data'],
-      otherData: 'some other data',
+      rawHistory: null,
+      nextPageToken: '',
     };
 
     expect(formatWorkflowHistory(input)).toEqual(expectedOutput);
@@ -60,6 +60,7 @@ describe('formatWorkflowHistory', () => {
         events: [],
       },
       rawHistory: [],
+      nextPageToken: '',
     };
 
     const expectedOutput = {
@@ -68,8 +69,9 @@ describe('formatWorkflowHistory', () => {
         events: [],
       },
       rawHistory: null,
+      nextPageToken: '',
     };
-
+    //@ts-expect-error testing missing archived field
     expect(formatWorkflowHistory(input)).toEqual(expectedOutput);
   });
 
@@ -79,6 +81,8 @@ describe('formatWorkflowHistory', () => {
         events: [],
       },
       rawHistory: [],
+      nextPageToken: '',
+      archived: false,
     };
 
     const expectedOutput = {
@@ -87,6 +91,7 @@ describe('formatWorkflowHistory', () => {
         events: [],
       },
       rawHistory: null,
+      nextPageToken: '',
     };
 
     expect(formatWorkflowHistory(input)).toEqual(expectedOutput);
@@ -98,15 +103,17 @@ describe('formatWorkflowHistory', () => {
       history: {
         events: [],
       },
-      rawHistory: ['raw event data'],
+      rawHistory: [],
+      nextPageToken: '',
     };
 
     const expectedOutput = {
       archived: true,
       history: {
         events: [],
       },
-      rawHistory: ['raw event data'],
+      rawHistory: null,
+      nextPageToken: '',
     };
 
     expect(formatWorkflowHistory(input)).toEqual(expectedOutput);
@@ -119,6 +126,7 @@ describe('formatWorkflowHistory', () => {
         events: [],
       },
       rawHistory: null,
+      nextPageToken: '',
     };
 
     const expectedOutput = {
@@ -127,8 +135,9 @@ describe('formatWorkflowHistory', () => {
         events: [],
       },
       rawHistory: null,
+      nextPageToken: '',
     };
-
+    //@ts-expect-error testing null raw history
     expect(formatWorkflowHistory(input)).toEqual(expectedOutput);
   });
 });

src/utils/data-formatters/format-workflow-history-event-type.ts

@@ -35,7 +35,7 @@ type TransformEventType<T extends string> = CapitalizeFirstLetter<
 >;
 
 const formatWorkflowHistoryEventType = <T extends HistoryEvent['attributes']>(
-  attributes: T | null
+  attributes: T
 ) => {
   if (!attributes) return attributes;
 

src/utils/data-formatters/format-workflow-history-event/format-workflow-execution-started-event.ts

@@ -60,7 +60,9 @@ const formatWorkflowExecutionStartedEvent = ({
   ...eventFields
 }: WorkflowExecutionStartedEvent) => {
   return {
-    ...formatWorkflowCommonEventFields(eventFields),
+    ...formatWorkflowCommonEventFields<'workflowExecutionStartedEventAttributes'>(
+      eventFields
+    ),
     ...eventAttributes,
     taskList: {
       kind: formatEnum(taskList?.kind, 'TASK_LIST_KIND'),

src/utils/data-formatters/format-workflow-history.ts

@@ -19,18 +19,20 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
+import { type GetWorkflowHistoryResponse } from '@/route-handlers/get-workflow-history/get-workflow-history.types';
+
 import formatWorkflowHistoryEvent from './format-workflow-history-event';
 
 const formatWorkflowHistory = ({
   archived,
-  history: { events },
+  history,
   rawHistory,
   ...response
-}: any) => ({
+}: GetWorkflowHistoryResponse) => ({
   ...response,
   archived: archived || null,
   history: {
-    events: events.map(formatWorkflowHistoryEvent),
+    events: (history?.events || []).map(formatWorkflowHistoryEvent),
   },
   rawHistory: rawHistory?.length ? rawHistory : null,
 });

src/utils/data-formatters/schema/format-history-event-schema.ts

@@ -551,3 +551,7 @@ export type FormattedHistoryEvent =
   | FormattedStartChildWorkflowExecutionFailedEvent
   | FormattedStartChildWorkflowExecutionInitiatedEvent
   | FormattedUpsertWorkflowSearchAttributesEvent;
+
+export type FormattedHistoryEventForType<
+  T extends FormattedHistoryEvent['eventType'],
+> = Extract<FormattedHistoryEvent, { eventType: T }>;

src/views/shared/workflow-history-event-details-task-list-link/__tests__/workflow-history-event-details-task-list-link.test.tsx

@@ -0,0 +1,61 @@
+import React from 'react';
+
+import { render } from '@/test-utils/rtl';
+
+import WorkflowHistoryEventDetailsTaskListLink from '../workflow-history-event-details-task-list-link';
+import { type Props } from '../workflow-history-event-details-task-list-link.types';
+
+describe('WorkflowHistoryEventDetailsTaskListLink', () => {
+  const props = {
+    cluster: 'testCluster',
+    domain: 'testDomain',
+    taskList: {
+      name: 'testTaskListName',
+      kind: 'NORMAL',
+    },
+  } as const satisfies Props;
+
+  it('should render the link with correct href', () => {
+    const { getByText } = render(
+      <WorkflowHistoryEventDetailsTaskListLink {...props} />
+    );
+
+    const linkElement = getByText(props.taskList.name).closest('a');
+    expect(linkElement).toHaveAttribute(
+      'href',
+      `/domains/${props.domain}/${props.cluster}/task-lists/${props.taskList.name}`
+    );
+  });
+
+  it('should render sticky task list as text', () => {
+    const stickyTasklistProps = {
+      ...props,
+      taskList: {
+        name: 'testTaskListName',
+        kind: 'STICKY',
+      },
+    } as const satisfies Props;
+    const { getByText, queryByText } = render(
+      <WorkflowHistoryEventDetailsTaskListLink {...stickyTasklistProps} />
+    );
+    expect(getByText(props.taskList.name)).toBeInTheDocument();
+
+    expect(
+      queryByText(props.taskList.name)?.closest('a')
+    ).not.toBeInTheDocument();
+  });
+
+  it('should not render link if taskList name is empty', () => {
+    const emptyTasklistProps = {
+      ...props,
+      taskList: {
+        name: '',
+        kind: 'STICKY',
+      },
+    } as const satisfies Props;
+    const { queryByRole } = render(
+      <WorkflowHistoryEventDetailsTaskListLink {...emptyTasklistProps} />
+    );
+    expect(queryByRole('link')).not.toBeInTheDocument();
+  });
+});

…history-event-details-task-list-link.tsx …history-event-details-task-list-link.tsxsrc/views/workflow-history/workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link.tsx renamed to src/views/shared/workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link.tsx src/views/workflow-history/workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link.tsx renamed to src/views/shared/workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link.tsx

@@ -9,15 +9,17 @@ import { type Props } from './workflow-history-event-details-task-list-link.type
 export default function WorkflowHistoryEventDetailsTaskListLink({
   cluster,
   domain,
-  entryValue,
+  taskList,
 }: Props) {
+  if (!taskList?.name) return null;
+  if (taskList.kind === 'STICKY' || !cluster || !domain) return taskList.name;
   return (
     <StyledLink
       $as={Link}
-      href={`/domains/${encodeURIComponent(domain)}/${encodeURIComponent(cluster)}/task-lists/${encodeURIComponent(entryValue.name)}`}
+      href={`/domains/${encodeURIComponent(domain)}/${encodeURIComponent(cluster)}/task-lists/${encodeURIComponent(taskList.name)}`}
       style={{ fontWeight: 'inherit' }}
     >
-      {entryValue.name}
+      {taskList?.name}
     </StyledLink>
   );
 }

src/views/shared/workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link.types.ts

@@ -0,0 +1,5 @@
+export type Props = {
+  cluster: string;
+  domain: string;
+  taskList: { name: string | null; kind: 'NORMAL' | 'STICKY' | null } | null;
+};

src/views/workflow-history/config/workflow-history-event-details.config.ts

@@ -1,8 +1,10 @@
+import { createElement } from 'react';
+
 import formatDate from '@/utils/data-formatters/format-date';
 
+import WorkflowHistoryEventDetailsTaskListLink from '../../shared/workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link';
 import { type WorkflowHistoryEventDetailsConfig } from '../workflow-history-event-details/workflow-history-event-details.types';
 import WorkflowHistoryEventDetailsJson from '../workflow-history-event-details-json/workflow-history-event-details-json';
-import WorkflowHistoryEventDetailsTaskListLink from '../workflow-history-event-details-task-list-link/workflow-history-event-details-task-list-link';
 
 const workflowHistoryEventDetailsConfig = [
   {
@@ -18,7 +20,13 @@ const workflowHistoryEventDetailsConfig = [
   {
     name: 'Tasklists as links',
     key: 'taskList',
-    valueComponent: WorkflowHistoryEventDetailsTaskListLink,
+    valueComponent: ({ entryValue, domain, cluster }) => {
+      return createElement(WorkflowHistoryEventDetailsTaskListLink, {
+        domain: domain,
+        cluster: cluster,
+        taskList: entryValue,
+      });
+    },
   },
   {
     name: 'Json as PrettyJson',