Chore: Add Beta tag to the Chainhook Page title (#1112)

saralab · web-flow · commit 81fcf0cf09f4 · 2025-12-08T16:24:16.000-06:00
Adde Beta tag to the Chainhook Page title
diff --git a/app/[locale]/[...slug]/page.tsx b/app/[locale]/[...slug]/page.tsx
@@ -117,6 +117,7 @@ export default async function Page(props: {
     interactive: page.data.interactive,
     title: page.data.title,
     description: page.data.description,
+    isBeta: page.data.isBeta,
     interactiveFeatures: page.data.interactiveFeatures,
     interactiveLinks, // Use the processed links with React components
   };
@@ -207,6 +208,11 @@ export default async function Page(props: {
               <div className="flex justify-between items-start gap-4">
                 <div className="flex items-center gap-3">
                   <DocsPageTitle className="mt-0" />
+                  {page.data.isBeta && (
+                    <span className="font-regular text-[10px] px-1 py-0.5 rounded uppercase bg-brand-orange dark:bg-brand-orange text-neutral-950 border-none">
+                      BETA
+                    </span>
+                  )}
                   {page.data.isRpc && (
                     <Badge
                       variant="outline"
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -13,7 +13,7 @@ export default function RootLayout({ children }: { children: ReactNode }) {
       className={`${aeonik.variable} ${aeonikFono.variable} ${aeonikMono.variable} ${inter.variable}`}
       suppressHydrationWarning
     >
-      <body className="flex flex-col min-h-screen">
+      <body className="flex flex-col min-h-screen" suppressHydrationWarning>
         <QueryProvider>
           <ApiCredentialsProvider>
             <KeyboardShortcutsProvider>
diff --git a/components/layouts/docs.tsx b/components/layouts/docs.tsx
@@ -304,6 +304,9 @@ export function SidebarItem({ item, children }: { item: PageTree.Node; children:
     const sidebarTitle = (item as any).data?.sidebarTitle;
     const displayName = sidebarTitle || item.name;
     const isRootPage = (item as any).data?.root === true;
+    // Hide badges for sidebar items that are folder index pages shown as children
+    // These are duplicates - the folder itself already shows the badge
+    const isFolderIndexAsChild = sidebarTitle === 'Overview';
 
     return (
       <Link
@@ -324,7 +327,7 @@ export function SidebarItem({ item, children }: { item: PageTree.Node; children:
         <div className="!font-normal flex items-center gap-2 flex-1">
           {item.icon}
           {displayName}
-          <PageBadges item={item} />
+          {!isFolderIndexAsChild && <PageBadges item={item} />}
         </div>
       </Link>
     );
@@ -416,6 +419,7 @@ export function PageBadges({ item }: { item: PageTree.Node }) {
   const badges: React.ReactNode[] = [];
 
   const isNew = (item as any).data?.isNew;
+  const isBeta = (item as any).data?.isBeta;
 
   if (isNew) {
     badges.push(
@@ -428,6 +432,17 @@ export function PageBadges({ item }: { item: PageTree.Node }) {
     );
   }
 
+  if (isBeta) {
+    badges.push(
+      <span
+        key="beta"
+        className="font-regular text-[10px] px-1 py-0.5 rounded uppercase bg-brand-orange dark:bg-brand-orange text-neutral-950 border-none"
+      >
+        Beta
+      </span>,
+    );
+  }
+
   const openapi = (item as any).data?.openapi;
   const operations = openapi?.operations || [];
 
diff --git a/components/layouts/page.tsx b/components/layouts/page.tsx
@@ -22,6 +22,7 @@ export interface PageData {
   interactive?: boolean;
   title?: string;
   description?: string;
+  isBeta?: boolean;
   interactiveFeatures?: string[];
   interactiveLinks?: Array<{
     title: string;
diff --git a/content/docs/en/tools/chainhooks/index.mdx b/content/docs/en/tools/chainhooks/index.mdx
@@ -3,6 +3,7 @@ title: Chainhooks
 sidebarTitle: Overview
 description: Chainhooks is a webhook service for the Stacks blockchain that lets you register event streams and define precise filters to capture on-chain data as it happens.
 llm: false
+isBeta: true
 ---
 
 :::callout
diff --git a/lib/source.ts b/lib/source.ts
@@ -617,6 +617,10 @@ export const source = loader({
           dataToAdd.sidebarTitle = frontmatter.sidebarTitle;
         }
 
+        if (frontmatter?.isBeta) {
+          dataToAdd.isBeta = frontmatter.isBeta;
+        }
+
         // if (frontmatter?.root) {
         //   dataToAdd.root = frontmatter.root;
         // }
diff --git a/source.config.ts b/source.config.ts
@@ -10,6 +10,7 @@ export const docs = defineDocs({
     schema: frontmatterSchema.extend({
       llm: z.boolean().optional(),
       isNew: z.boolean().optional(),
+      isBeta: z.boolean().optional(),
       publishedAt: z.string().optional(),
       sidebarTitle: z.string().optional(),
       root: z.boolean().optional(),

Original file line number	Diff line number	Diff line change
`@@ -13,7 +13,7 @@ export default function RootLayout({ children }: { children: ReactNode }) {`
`13`	`13`	className={`${aeonik.variable} ${aeonikFono.variable} ${aeonikMono.variable} ${inter.variable}`}
`14`	`14`	`suppressHydrationWarning`
`15`	`15`	`>`
`16`		`- <body className="flex flex-col min-h-screen">`
	`16`	`+ <body className="flex flex-col min-h-screen" suppressHydrationWarning>`
`17`	`17`	`<QueryProvider>`
`18`	`18`	`<ApiCredentialsProvider>`
`19`	`19`	`<KeyboardShortcutsProvider>`