Skip to content

Commit c4ae483

Browse files
Assem-Uberadhityamamallan
Assem-Uber
and
adhityamamallan
authored
Show message for missing archival result (#992)
* Show message for missing archival result * Update src/views/workflow-summary-tab/workflow-summary-tab-json-view/__tests__/workflow-summary-tab-json-view.test.tsx Co-authored-by: Adhitya Mamallan <[email protected]> * Update src/views/workflow-summary-tab/workflow-summary-tab-json-view/workflow-summary-tab-json-view.tsx Co-authored-by: Adhitya Mamallan <[email protected]> * Reuse existing types & remove unused fragment * fix test cases --------- Co-authored-by: Adhitya Mamallan <[email protected]>
1 parent daa4104 commit c4ae483

File tree

5 files changed

+108
-43
lines changed

5 files changed

+108
-43
lines changed

‎src/views/workflow-summary-tab/workflow-summary-tab-json-view/__tests__/workflow-summary-tab-json-view.test.tsx

Lines changed: 71 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
import React from 'react';
22

3-
import { render, fireEvent, screen } from '@/test-utils/rtl';
3+
import { render, fireEvent, screen, queryByRole } from '@/test-utils/rtl';
44

55
import losslessJsonStringify from '@/utils/lossless-json-stringify';
66

77
import WorkflowSummaryTabJsonView from '../workflow-summary-tab-json-view';
8+
import { type Props } from '../workflow-summary-tab-json-view.types';
89

910
jest.mock('@/components/copy-text-button/copy-text-button', () =>
1011
jest.fn(({ textToCopy }) => <div>Copy Button: {textToCopy}</div>)
@@ -27,36 +28,15 @@ jest.mock('@/components/pretty-json-skeleton/pretty-json-skeleton', () =>
2728
);
2829

2930
describe('WorkflowSummaryTabJsonView Component', () => {
30-
const losslessInputJson = {
31-
input: 'inputJson',
32-
long: BigInt('12345678901234567890'),
33-
};
34-
const losselessResultJson = {
35-
result: 'resultJson',
36-
long: BigInt('12345678901234567891'),
37-
};
38-
3931
it('renders correctly with initial props', () => {
40-
const { getByText } = render(
41-
<WorkflowSummaryTabJsonView
42-
inputJson={losslessInputJson}
43-
resultJson={losselessResultJson}
44-
isWorkflowRunning={false}
45-
/>
46-
);
32+
const { getByText } = setup({});
4733

4834
expect(getByText('SegmentedControlRounded Mock')).toBeInTheDocument();
4935
expect(getByText('PrettyJson Mock')).toBeInTheDocument();
5036
});
5137

5238
it('handles tab change', () => {
53-
render(
54-
<WorkflowSummaryTabJsonView
55-
inputJson={losslessInputJson}
56-
resultJson={losselessResultJson}
57-
isWorkflowRunning={false}
58-
/>
59-
);
39+
setup({});
6040

6141
// Mock the onChange event for SegmentedControlRounded
6242
const segmentedControl = screen.getByText('SegmentedControlRounded Mock');
@@ -65,13 +45,7 @@ describe('WorkflowSummaryTabJsonView Component', () => {
6545
});
6646

6747
it('renders loading state correctly', () => {
68-
const { getByText } = render(
69-
<WorkflowSummaryTabJsonView
70-
inputJson={losslessInputJson}
71-
resultJson={losselessResultJson}
72-
isWorkflowRunning={true}
73-
/>
74-
);
48+
const { getByText } = setup({ isWorkflowRunning: true });
7549

7650
// Mock the onChange event for SegmentedControlRounded
7751
const segmentedControl = screen.getByText('SegmentedControlRounded Mock');
@@ -80,17 +54,76 @@ describe('WorkflowSummaryTabJsonView Component', () => {
8054
});
8155

8256
it('renders copy text button and pass the correct text', () => {
83-
const { getByText } = render(
84-
<WorkflowSummaryTabJsonView
85-
inputJson={losslessInputJson}
86-
resultJson={losselessResultJson}
87-
isWorkflowRunning={true}
88-
/>
89-
);
57+
const { getByText } = setup({ isWorkflowRunning: true });
9058
const copyButton = getByText(/Copy Button/);
9159
expect(copyButton).toBeInTheDocument();
9260
expect(copyButton.innerHTML).toMatch(
9361
losslessJsonStringify(losslessInputJson, null, '\t')
9462
);
9563
});
64+
65+
it('renders archived result correctly', () => {
66+
const { getByText, getByRole } = setup({ isArchived: true });
67+
const segmentedControl = getByText('SegmentedControlRounded Mock');
68+
fireEvent.click(segmentedControl);
69+
expect(
70+
getByText('Workflow is archived, result is only available in')
71+
).toBeInTheDocument();
72+
expect(getByRole('link', { name: 'history' })).toBeInTheDocument();
73+
});
74+
75+
it('should not render loading skeleton when isArchived is true and isWorkflowRunning is true', () => {
76+
const { queryByText, getByText } = setup({
77+
isArchived: true,
78+
isWorkflowRunning: true,
79+
});
80+
const segmentedControl = getByText('SegmentedControlRounded Mock');
81+
fireEvent.click(segmentedControl);
82+
expect(queryByText('Mock JSON skeleton')).not.toBeInTheDocument();
83+
expect(
84+
queryByText('Workflow is archived, result is only available in')
85+
).toBeInTheDocument();
86+
});
87+
88+
it('should not render result when isArchived is true and isWorkflowRunning is false', () => {
89+
const { queryByText, getByText } = setup({
90+
isArchived: true,
91+
isWorkflowRunning: false,
92+
});
93+
const segmentedControl = getByText('SegmentedControlRounded Mock');
94+
fireEvent.click(segmentedControl);
95+
expect(queryByText('PrettyJson Mock')).not.toBeInTheDocument();
96+
expect(
97+
queryByText('Workflow is archived, result is only available in')
98+
).toBeInTheDocument();
99+
});
96100
});
101+
102+
const losslessInputJson = {
103+
input: 'inputJson',
104+
long: BigInt('12345678901234567890'),
105+
};
106+
const losselessResultJson = {
107+
result: 'resultJson',
108+
long: BigInt('12345678901234567891'),
109+
};
110+
111+
const setup = ({
112+
inputJson = losslessInputJson,
113+
resultJson = losselessResultJson,
114+
isWorkflowRunning = false,
115+
isArchived = false,
116+
}: Partial<Props>) => {
117+
return render(
118+
<WorkflowSummaryTabJsonView
119+
inputJson={inputJson}
120+
resultJson={resultJson}
121+
isWorkflowRunning={isWorkflowRunning}
122+
isArchived={isArchived}
123+
domain="test-domain"
124+
cluster="test-cluster"
125+
runId="test-run-id"
126+
workflowId="test-workflow-id"
127+
/>
128+
);
129+
};

‎src/views/workflow-summary-tab/workflow-summary-tab-json-view/workflow-summary-tab-json-view.styles.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,12 @@ const cssStylesObj = {
1717
gap: theme.sizing.scale600,
1818
marginBottom: theme.sizing.scale700,
1919
}),
20+
archivedResult: (theme) => ({
21+
padding: theme.sizing.scale600,
22+
color: theme.colors.contentTertiary,
23+
textAlign: 'center',
24+
...theme.typography.ParagraphSmall,
25+
}),
2026
} satisfies StyletronCSSObject;
2127

2228
export const cssStyles: StyletronCSSObjectOf<typeof cssStylesObj> =

‎src/views/workflow-summary-tab/workflow-summary-tab-json-view/workflow-summary-tab-json-view.tsx

Lines changed: 22 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import React, { useMemo, useState } from 'react';
33

44
import CopyTextButton from '@/components/copy-text-button/copy-text-button';
5+
import Link from '@/components/link/link';
56
import PrettyJson from '@/components/pretty-json/pretty-json';
67
import { type PrettyJsonValue } from '@/components/pretty-json/pretty-json.types';
78
import PrettyJsonSkeleton from '@/components/pretty-json-skeleton/pretty-json-skeleton';
@@ -17,6 +18,11 @@ export default function WorkflowSummaryTabJsonView({
1718
inputJson,
1819
resultJson,
1920
isWorkflowRunning,
21+
isArchived,
22+
domain,
23+
cluster,
24+
runId,
25+
workflowId,
2026
}: Props) {
2127
const { cls } = useStyletronClasses(cssStyles);
2228
const jsonMap: Record<string, PrettyJsonValue> = useMemo(
@@ -47,10 +53,22 @@ export default function WorkflowSummaryTabJsonView({
4753
overrides={overrides.copyButton}
4854
/>
4955
</div>
50-
{activeTab === 'result' && isWorkflowRunning ? (
51-
<PrettyJsonSkeleton width="200px" />
52-
) : (
53-
<PrettyJson json={jsonMap[activeTab]} />
56+
{activeTab === 'input' && <PrettyJson json={jsonMap[activeTab]} />}
57+
{activeTab === 'result' && isArchived && (
58+
<div className={cls.archivedResult}>
59+
Workflow is archived, result is only available in{' '}
60+
<Link
61+
href={`/domains/${domain}/${cluster}/workflows/${workflowId}/${runId}/history`}
62+
>
63+
history
64+
</Link>
65+
</div>
66+
)}
67+
{activeTab === 'result' && !isArchived && (
68+
<>
69+
{isWorkflowRunning && <PrettyJsonSkeleton width="200px" />}
70+
{!isWorkflowRunning && <PrettyJson json={jsonMap[activeTab]} />}
71+
</>
5472
)}
5573
</div>
5674
);

‎src/views/workflow-summary-tab/workflow-summary-tab-json-view/workflow-summary-tab-json-view.types.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
import { type PrettyJsonValue } from '@/components/pretty-json/pretty-json.types';
2+
import { type WorkflowPageParams } from '@/views/workflow-page/workflow-page.types';
23

34
export type Props = {
45
inputJson: PrettyJsonValue;
56
resultJson: PrettyJsonValue;
67
isWorkflowRunning: boolean;
7-
};
8+
isArchived: boolean;
9+
} & WorkflowPageParams;

‎src/views/workflow-summary-tab/workflow-summary-tab.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ export default function WorkflowSummaryTab({
6666
const historyEvents = workflowHistory?.history?.events || [];
6767
const firstEvent = historyEvents[0];
6868
const closeEvent = workflowDetails.workflowExecutionInfo?.closeEvent || null;
69+
const isArchived = workflowDetails.workflowExecutionInfo?.isArchived || false;
6970
const formattedWorkflowHistory = formatWorkflowHistory(workflowHistory);
7071
const formattedStartEvent = formattedWorkflowHistory?.history
7172
?.events?.[0] as FormattedHistoryEventForType<'WorkflowExecutionStarted'>;
@@ -107,6 +108,11 @@ export default function WorkflowSummaryTab({
107108
}
108109
resultJson={resultJson}
109110
isWorkflowRunning={isWorkflowRunning}
111+
isArchived={isArchived}
112+
domain={params.domain}
113+
cluster={params.cluster}
114+
runId={params.runId}
115+
workflowId={params.workflowId}
110116
/>
111117
</div>
112118
</div>

0 commit comments

Comments
 (0)