diff --git a/packages/ui-patterns/src/UnexpectedErrorPage.tsx b/packages/ui-patterns/src/UnexpectedErrorPage.tsx index 3f1f3fd..156cd17 100644 --- a/packages/ui-patterns/src/UnexpectedErrorPage.tsx +++ b/packages/ui-patterns/src/UnexpectedErrorPage.tsx @@ -21,8 +21,11 @@ import { ErrorPage } from "./ErrorPage"; import { uiPatternsMessage } from "./messages"; export interface UnexpectedErrorPageProps { - /** Where "raising a support request" links to. */ - supportUrl: string; + /** + * Where "raising a support request" links to. Omit it and the page does + * not mention support, for deployments without a support site. + */ + supportUrl?: string; /** * Identifies the error report, typically the Sentry event id, so a support * request quoting it can be matched to the report. Omit when the error was @@ -57,18 +60,20 @@ export const UnexpectedErrorPage = ({ /> } > - - ( - - {chunks} - - ), - }} - /> - + {supportUrl && ( + + ( + + {chunks} + + ), + }} + /> + + )} {reference && } {children} diff --git a/packages/ui-patterns/stories/UnexpectedErrorPage.stories.tsx b/packages/ui-patterns/stories/UnexpectedErrorPage.stories.tsx index 742f53c..5bbd446 100644 --- a/packages/ui-patterns/stories/UnexpectedErrorPage.stories.tsx +++ b/packages/ui-patterns/stories/UnexpectedErrorPage.stories.tsx @@ -44,3 +44,11 @@ export const WithRecoveryAction: Story = { ), }, }; + +/** A deployment with no support site of its own. */ +export const WithoutSupportSite: Story = { + args: { + supportUrl: undefined, + reference: "5f1e7a2c9b3d4e6f8a0b1c2d3e4f5a6b", + }, +}; diff --git a/packages/ui-patterns/tests/ErrorPages.test.tsx b/packages/ui-patterns/tests/ErrorPages.test.tsx index 801a37b..d361f5d 100644 --- a/packages/ui-patterns/tests/ErrorPages.test.tsx +++ b/packages/ui-patterns/tests/ErrorPages.test.tsx @@ -49,6 +49,13 @@ describe("UnexpectedErrorPage", () => { expect(onReload).toHaveBeenCalledOnce(); }); + it("omits the support text when there is no support site", () => { + render(, { wrapper: Providers }); + expect(screen.queryByRole("link")).toBeNull(); + expect(screen.queryByText(/support request/)).toBeNull(); + expect(screen.getByText(/Error reference/)).toBeDefined(); + }); + it("focuses the heading on mount", () => { render(, { wrapper: Providers,