diff --git a/airbyte-webapp/src/components/DocumentationPanel/DocumentationPanel.tsx b/airbyte-webapp/src/components/DocumentationPanel/DocumentationPanel.tsx index 5bbb9e1ae8e7b8..d818fe5c51c83c 100644 --- a/airbyte-webapp/src/components/DocumentationPanel/DocumentationPanel.tsx +++ b/airbyte-webapp/src/components/DocumentationPanel/DocumentationPanel.tsx @@ -21,7 +21,7 @@ export const DocumentationPanel: React.FC = () => { const { formatMessage } = useIntl(); const config = useConfig(); const { setDocumentationPanelOpen, documentationUrl } = useDocumentationPanelContext(); - const { data: docs, isLoading } = useDocumentation(documentationUrl); + const { data: docs, isLoading, error } = useDocumentation(documentationUrl); // @ts-expect-error rehype-slug currently has type conflicts due to duplicate vfile dependencies const urlReplacerPlugin: PluggableList = useMemo(() => { @@ -55,7 +55,7 @@ export const DocumentationPanel: React.FC = () => { } /> ") ? docs : formatMessage({ id: "connector.setupGuide.notFound" })} + content={docs && !error ? docs : formatMessage({ id: "connector.setupGuide.notFound" })} rehypePlugins={urlReplacerPlugin} /> diff --git a/airbyte-webapp/src/core/domain/Documentation.test.ts b/airbyte-webapp/src/core/domain/Documentation.test.ts new file mode 100644 index 00000000000000..26a21f0ad8b9dd --- /dev/null +++ b/airbyte-webapp/src/core/domain/Documentation.test.ts @@ -0,0 +1,14 @@ +import { fetchDocumentation } from "./Documentation"; + +describe("fetchDocumentation", () => { + afterEach(() => { + jest.resetAllMocks(); + }); + + it("should throw on non markdown content-type", async () => { + global.fetch = jest.fn().mockResolvedValue({ + Headers: new Headers([["Content-Type", "text/html; charset=utf-8"]]), + }); + await expect(fetchDocumentation("/docs/integrations/destinations/firestore.md")).rejects.toThrow(); + }); +}); diff --git a/airbyte-webapp/src/core/domain/Documentation.ts b/airbyte-webapp/src/core/domain/Documentation.ts index cad9d970f5987f..00ce3c964576c7 100644 --- a/airbyte-webapp/src/core/domain/Documentation.ts +++ b/airbyte-webapp/src/core/domain/Documentation.ts @@ -3,5 +3,11 @@ export const fetchDocumentation = async (url: string): Promise => { method: "GET", }); + const contentType = response.headers.get("content-type"); + + if (contentType?.toLowerCase().includes("text/html")) { + throw new Error(`Documentation was text/html and such ignored since markdown couldn't be found.`); + } + return await response.text(); };