diff --git a/airbyte-webapp/build.gradle b/airbyte-webapp/build.gradle index 74acb459db93..8d838994841f 100644 --- a/airbyte-webapp/build.gradle +++ b/airbyte-webapp/build.gradle @@ -66,6 +66,8 @@ task copyDocs(type: Copy) { from "${project.rootProject.projectDir}/docs/integrations" into "build/docker/bin/docs/integrations" + //google-ads.md is blocked by Ad Blockers + rename ('google-ads.md', 'gglad.md') duplicatesStrategy DuplicatesStrategy.INCLUDE } diff --git a/airbyte-webapp/src/setupProxy.js b/airbyte-webapp/src/setupProxy.js index 05f7280fac40..64be0ecc1968 100644 --- a/airbyte-webapp/src/setupProxy.js +++ b/airbyte-webapp/src/setupProxy.js @@ -15,5 +15,10 @@ module.exports = (app) => { }); // Serve the doc markdowns and assets that are also bundled into the docker image app.use("/docs/integrations", express.static(`${__dirname}/../../docs/integrations`)); + //workaround for adblockers to serve google ads docs in development + app.use( + "/docs/integrations/sources/gglad.md", + express.static(`${__dirname}/../../docs/integrations/sources/google-ads.md`) + ); app.use("/docs/.gitbook", express.static(`${__dirname}/../../docs/.gitbook`)); }; diff --git a/airbyte-webapp/src/views/Connector/ConnectorDocumentationLayout/DocumentationPanelContext.tsx b/airbyte-webapp/src/views/Connector/ConnectorDocumentationLayout/DocumentationPanelContext.tsx index f26872b1b0d7..489b3c9af06d 100644 --- a/airbyte-webapp/src/views/Connector/ConnectorDocumentationLayout/DocumentationPanelContext.tsx +++ b/airbyte-webapp/src/views/Connector/ConnectorDocumentationLayout/DocumentationPanelContext.tsx @@ -1,11 +1,23 @@ -import { createContext, useContext, useEffect, useState } from "react"; +import { createContext, useCallback, useContext, useEffect, useState } from "react"; // @ts-expect-error Default value provided at implementation const DocumentationPanelContext = createContext>(); export const useDocumentationPanelState = () => { const [documentationPanelOpen, setDocumentationPanelOpen] = useState(false); - const [documentationUrl, setDocumentationUrl] = useState(""); + const [documentationUrl, setDocumentationUrlState] = useState(""); + + /* Ad blockers prevent the Google Ads docs .md file from rendering. Because these URLs are + * standardized, we work around this without changing the main file URL by: + * 1. Changing the name of the .md in the Gradle build + * a. the docs we render aren't actually fetching from our website, they're compiled with our build + * b. when running on localhost, we fetch them with our proxy, so there is an additional piece in setupProxy.js for that case + * 2. Changing the URL here to match the renamed .md file + */ + + const setDocumentationUrl = useCallback((url: string) => { + setDocumentationUrlState(url.replace("google-ads", "gglad")); + }, []); return { documentationPanelOpen,