Added conditional content tags to conditionally render collate and OS…

…S only content (#357) * Added conditional content tags to conditionally render collate and oss only content * Add readme docs for the new tags
open-metadata · Feb 18, 2025 · 06379a9 · 06379a9
1 parent 5443673
commit 06379a9
Show file tree

Hide file tree

Showing 7 changed files with 91 additions and 17 deletions.
diff --git a/README.md b/README.md
@@ -39,6 +39,9 @@ Here are the custom markdoc tags to use for desired functionalities.
    - [5. connectorDetailsHeader](#5-connectorDetailsHeader)
    - [6. connectorInfoCard](#6-connectorInfoCard)
    - [7. connectorsListContainer](#7-connectorsListContainer)
+- [Conditional Content](#conditional-content)
+   - [1. collateContent](#1-collateContent)
+   - [2. ossContent](#2-ossContent)
 - [Tags for Code Preview Functionality](#tags-for-code-preview-functionality)
    - [1. codePreview](#1-codePreview)
    - [2. codeInfoContainer](#2-codeInfoContainer)
@@ -284,6 +287,37 @@ A wrapper tag to envelope the connectorInfoCard tags for a grid view.
 
 ---
 
+## Conditional Content
+
+- [1. collateContent](#1-collateContent)
+- [2. ossContent](#2-ossContent)
+
+### 1. collateContent
+
+A tag to conditionally render content only on collate documentation.
+
+### 2. ossContent
+
+A tag to conditionally render content only on open source documentation.
+
+Example:
+
+This is {% collateContent %}Collate{% /collateContent %}{% ossContent %}OSS{% /ossContent %} documentation.
+
+**The above content will be shown on collate documentation as:**
+
+```
+This is Collate documentation.
+```
+
+**And will be shown on open source documentation as:**
+
+```
+This is OSS documentation.
+```
+
+---
+
 ## Tags for Code Preview Functionality
 
 For showing code or commands with the explanations by side use following tags:-

diff --git a/components/ConditionalContent/CollateContent.tsx b/components/ConditionalContent/CollateContent.tsx
@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+import { useDocVersionContext } from "../../context/DocVersionContext";
+
+function CollateContent({ children }: { children: ReactNode }) {
+  const { enableVersion } = useDocVersionContext();
+
+  if (enableVersion) {
+    return null;
+  }
+
+  return <>{children}</>;
+}
+
+export default CollateContent;
diff --git a/components/ConditionalContent/OSSContent.tsx b/components/ConditionalContent/OSSContent.tsx
@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+import { useDocVersionContext } from "../../context/DocVersionContext";
+
+function OSSContent({ children }: { children: ReactNode }) {
+  const { enableVersion } = useDocVersionContext();
+
+  if (!enableVersion) {
+    return null;
+  }
+
+  return <>{children}</>;
+}
+
+export default OSSContent;
diff --git a/lib/markdoc.ts b/lib/markdoc.ts
@@ -8,16 +8,6 @@ import CodeInfo from "../components/CodePreview/CodeInfo/CodeInfo";
 import CodeInfoContainer from "../components/CodePreview/CodeInfoContainer/CodeInfoContainer";
 import CodePreview from "../components/CodePreview/CodePreview";
 import CodeWithLanguageSelector from "../components/CodeWithLanguageSelector/CodeWithLanguageSelector";
-import ConnectorDetailsHeader from "../components/ConnectorDetailsHeader/ConnectorDetailsHeader";
-import ConnectorInfoCard from "../components/ConnectorInfoCard/ConnectorInfoCard";
-import ConnectorsListContainer from "../components/ConnectorsListContainer/ConnectorsListContainer";
-import ExtraContent from "../components/ExtraContent/ExtraContent";
-import { Heading } from "../components/Heading/Heading";
-import Roadmap from "../components/Roadmap/Roadmap";
-import Step from "../components/Steps/Step/Step";
-import StepDescription from "../components/Steps/Step/StepDescription/StepDescription";
-import StepVisualInfo from "../components/Steps/Step/StepVisualInfo/StepVisualInfo";
-import StepsContainer from "../components/Steps/StepsContainer/StepsContainer";
 import Code from "../components/common/Code/Code";
 import InlineCode from "../components/common/Code/InlineCode";
 import CustomAnchorNode from "../components/common/CustomAnchorNode/CustomAnchorNode";
@@ -32,6 +22,18 @@ import Table from "../components/common/Table/Table";
 import Tile from "../components/common/Tiles/Tile/Tile";
 import TilesContainer from "../components/common/Tiles/TilesContainer/TilesContainer";
 import YouTube from "../components/common/Youtube/Youtube";
+import CollateContent from "../components/ConditionalContent/CollateContent";
+import OSSContent from "../components/ConditionalContent/OSSContent";
+import ConnectorDetailsHeader from "../components/ConnectorDetailsHeader/ConnectorDetailsHeader";
+import ConnectorInfoCard from "../components/ConnectorInfoCard/ConnectorInfoCard";
+import ConnectorsListContainer from "../components/ConnectorsListContainer/ConnectorsListContainer";
+import ExtraContent from "../components/ExtraContent/ExtraContent";
+import { Heading } from "../components/Heading/Heading";
+import Roadmap from "../components/Roadmap/Roadmap";
+import Step from "../components/Steps/Step/Step";
+import StepDescription from "../components/Steps/Step/StepDescription/StepDescription";
+import StepVisualInfo from "../components/Steps/Step/StepVisualInfo/StepVisualInfo";
+import StepsContainer from "../components/Steps/StepsContainer/StepsContainer";
 import * as allFunctions from "../markdoc/functions";
 import * as allNodes from "../markdoc/nodes";
 import * as allTags from "../markdoc/tags";
@@ -74,6 +76,8 @@ export const components = {
   ConnectorsListContainer,
   ConnectorDetailsHeader,
   Roadmap,
+  CollateContent,
+  OSSContent,
 };
 
 export const configs: Config = {

diff --git a/markdoc/tags/ConditionalContent/collateContent.markdoc.ts b/markdoc/tags/ConditionalContent/collateContent.markdoc.ts
@@ -0,0 +1,3 @@
+export const collateContent = {
+  render: "CollateContent",
+};
diff --git a/markdoc/tags/ConditionalContent/ossContent.markdoc.ts b/markdoc/tags/ConditionalContent/ossContent.markdoc.ts
@@ -0,0 +1,3 @@
+export const ossContent = {
+  render: "OSSContent",
+};
diff --git a/markdoc/tags/index.ts b/markdoc/tags/index.ts
@@ -3,18 +3,13 @@ export * from "./APIInfoContainer/apiDescription/apiDescription.markdoc";
 export * from "./APIInfoContainer/apiInfoContainer.markdoc";
 export * from "./APIInfoContainer/apiPageContainer.markdoc";
 export * from "./APIInfoContainer/apiVisualInfo/apiVisualInfo.markdoc";
-export * from "./Steps/ExtraContent/extraContent.markdoc";
-export * from "./Steps/Step/StepDescription/stepDescription.markdoc";
-export * from "./Steps/Step/StepVisualInfo/stepVisualInfo.markdoc";
-export * from "./Steps/Step/step.markdoc";
-export * from "./Steps/StepsContainer/stepsContainer.markdoc";
-export * from "./Tiles/Tile/tile.markdoc";
-export * from "./Tiles/TilesContainer/tilesContainer.markdoc";
 export * from "./codePreview/codeBlock.markdoc";
 export * from "./codePreview/codeInfo.markdoc";
 export * from "./codePreview/codeInfoContainer.markdoc";
 export * from "./codePreview/codePreview.markdoc";
 export * from "./codeWithLanguageSelector/codeWithLanguageSelector.markdoc";
+export * from "./ConditionalContent/collateContent.markdoc";
+export * from "./ConditionalContent/ossContent.markdoc";
 export * from "./connectorDetailsHeader.markdoc";
 export * from "./connectorInfoCard.markdoc";
 export * from "./connectorsListContainer.markdoc";
@@ -26,5 +21,12 @@ export * from "./inlineCalloutContainer.markdoc";
 export * from "./multiTablesWrapper.markdoc";
 export * from "./note.markdoc";
 export * from "./roadmap.markdoc";
+export * from "./Steps/ExtraContent/extraContent.markdoc";
+export * from "./Steps/Step/step.markdoc";
+export * from "./Steps/Step/StepDescription/stepDescription.markdoc";
+export * from "./Steps/Step/StepVisualInfo/stepVisualInfo.markdoc";
+export * from "./Steps/StepsContainer/stepsContainer.markdoc";
+export * from "./Tiles/Tile/tile.markdoc";
+export * from "./Tiles/TilesContainer/tilesContainer.markdoc";
 export * from "./youtube.markdoc";