From deffc69e93aafe7e6a30a03b105dfece7a36ad24 Mon Sep 17 00:00:00 2001
From: Jerel Miller <jerelmiller@gmail.com>
Date: Fri, 26 Jan 2024 16:42:46 -0700
Subject: [PATCH] Add docs component for API members that are marked as
 alpha/beta (#11529)

---
 docs/shared/ApiDoc/DocBlock.js               | 29 ++++++++++++++++++++
 docs/shared/ApiDoc/Function.js               |  7 ++++-
 docs/shared/ApiDoc/PropertySignatureTable.js |  2 +-
 docs/shared/ApiDoc/index.js                  |  9 +++++-
 4 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/docs/shared/ApiDoc/DocBlock.js b/docs/shared/ApiDoc/DocBlock.js
index 18e29d26d19..28ee46b305a 100644
--- a/docs/shared/ApiDoc/DocBlock.js
+++ b/docs/shared/ApiDoc/DocBlock.js
@@ -11,10 +11,12 @@ export function DocBlock({
   example = false,
   remarksCollapsible = false,
   deprecated = false,
+  releaseTag = false,
 }) {
   return (
     <Stack spacing="4">
       {deprecated && <Deprecated canonicalReference={canonicalReference} />}
+      {releaseTag && <ReleaseTag canonicalReference={canonicalReference} />}
       {summary && <Summary canonicalReference={canonicalReference} />}
       {remarks && (
         <Remarks
@@ -130,3 +132,30 @@ Example.propTypes = {
   collapsible: PropTypes.bool,
   index: PropTypes.number,
 };
+
+export function ReleaseTag({ canonicalReference }) {
+  const getItem = useApiDocContext();
+  const item = getItem(canonicalReference);
+  const MDX = useMDXComponents();
+
+  if (item.releaseTag === "Public") {
+    return null;
+  }
+
+  return (
+    <MDX.ExperimentalFeature>
+      This is in{" "}
+      <MDX.PrimaryLink
+        href="https://www.apollographql.com/docs/resources/product-launch-stages/#alpha--beta"
+        target="_blank"
+      >
+        {item.releaseTag.toLowerCase()} stage
+      </MDX.PrimaryLink>{" "}
+      and is subject to breaking changes.
+    </MDX.ExperimentalFeature>
+  );
+}
+
+ReleaseTag.propTypes = {
+  canonicalReference: PropTypes.string.isRequired,
+};
diff --git a/docs/shared/ApiDoc/Function.js b/docs/shared/ApiDoc/Function.js
index 7cf0e8cbc3d..aad711fe8f7 100644
--- a/docs/shared/ApiDoc/Function.js
+++ b/docs/shared/ApiDoc/Function.js
@@ -109,7 +109,12 @@ export function FunctionDetails({
         headingLevel={headingLevel}
         since
       />
-      <DocBlock canonicalReference={canonicalReference} deprecated remarks />
+      <DocBlock
+        canonicalReference={canonicalReference}
+        deprecated
+        remarks
+        releaseTag
+      />
       {item.comment?.examples.length == 0 ? null : (
         <>
           <SubHeading
diff --git a/docs/shared/ApiDoc/PropertySignatureTable.js b/docs/shared/ApiDoc/PropertySignatureTable.js
index b25a9fd0810..40fa53b3df6 100644
--- a/docs/shared/ApiDoc/PropertySignatureTable.js
+++ b/docs/shared/ApiDoc/PropertySignatureTable.js
@@ -7,7 +7,6 @@ import {
   FunctionSignature,
   useApiDocContext,
   ApiDocHeading,
-  SectionHeading,
 } from ".";
 import { GridItem, Text } from "@chakra-ui/react";
 import { ResponsiveGrid } from "./ResponsiveGrid";
@@ -105,6 +104,7 @@ export function PropertySignatureTable({
                       summary
                       remarks
                       remarkCollapsible
+                      releaseTag
                     />
                   </GridItem>
                 </React.Fragment>
diff --git a/docs/shared/ApiDoc/index.js b/docs/shared/ApiDoc/index.js
index 4173bdebe62..06728b10116 100644
--- a/docs/shared/ApiDoc/index.js
+++ b/docs/shared/ApiDoc/index.js
@@ -1,5 +1,12 @@
 export { useApiDocContext } from "./Context";
-export { DocBlock, Deprecated, Example, Remarks, Summary } from "./DocBlock";
+export {
+  DocBlock,
+  Deprecated,
+  Example,
+  Remarks,
+  ReleaseTag,
+  Summary,
+} from "./DocBlock";
 export { PropertySignatureTable } from "./PropertySignatureTable";
 export { ApiDocHeading, SubHeading, SectionHeading } from "./Heading";
 export { InterfaceDetails } from "./InterfaceDetails";