diff --git a/src/components/result-page/result-page.tsx b/src/components/result-page/result-page.tsx index 7190a83f74..69b5cc440b 100644 --- a/src/components/result-page/result-page.tsx +++ b/src/components/result-page/result-page.tsx @@ -39,7 +39,7 @@ export type ResultPageProps = { title: ReactNode description?: ReactNode icon?: ReactNode - details?: ResultPageDetails + details?: ResultPageDetails | null children?: ReactNode primaryButtonText?: ReactNode secondaryButtonText?: ReactNode @@ -81,7 +81,7 @@ export const ResultPage: FC = p => { {isNodeWithContent(description) ? (
{description}
) : null} - {details.length ? ( + {details?.length ? (
{(collapse ? details.slice(0, 3) : details).map((detail, index) => { return ( @@ -116,35 +116,37 @@ export const ResultPage: FC = p => {
{props.children}
-
- {showSecondaryButton && ( - - )} - {showPrimaryButton && showSecondaryButton && ( -
- )} - {showPrimaryButton && ( - - )} -
+ {(showPrimaryButton || showSecondaryButton) && ( +
+ {showSecondaryButton && ( + + )} + {showPrimaryButton && showSecondaryButton && ( +
+ )} + {showPrimaryButton && ( + + )} +
+ )}
) } diff --git a/src/components/result-page/tests/result-page.test.tsx b/src/components/result-page/tests/result-page.test.tsx new file mode 100644 index 0000000000..d34b804a88 --- /dev/null +++ b/src/components/result-page/tests/result-page.test.tsx @@ -0,0 +1,44 @@ +import React from 'react' +import { render, screen } from 'testing' +import ResultPage from '..' + +const classPrefix = 'adm-result-page' + +describe('ResultPage', () => { + test('renders with success status', () => { + render( + + ) + expect(screen.getByText('title')).toBeInTheDocument() + expect(screen.getByText('desc')).toBeInTheDocument() + expect(screen.getByText('primary')).toBeInTheDocument() + expect(screen.getByText('secondary')).toBeInTheDocument() + }) + + test('renders with details: null', () => { + render( + + ) + expect(screen.getByText('title')).toBeInTheDocument() + expect(screen.getByText('desc')).toBeInTheDocument() + expect(document.querySelector(`.${classPrefix}-detail`)).not.toBeInTheDocument() + }) + + test('renders with no footer', () => { + render() + expect(screen.getByText('title')).toBeInTheDocument() + expect(screen.getByText('desc')).toBeInTheDocument() + expect(document.querySelector(`.${classPrefix}-footer`)).not.toBeInTheDocument() + }) +})