Hive Docs website: New guild/component migration (#4284)

.github/workflows/website.yaml

@@ -42,5 +42,5 @@ jobs:
           prId: ${{ github.event.pull_request.number }}
           mainBranch: main
           websiteDirectory: ./
-          buildScript: cd packages/web/docs && pnpm build && pnpm next export
+          buildScript: cd packages/web/docs && pnpm build
           artifactDir: packages/web/docs/out

package.json

@@ -126,9 +126,6 @@
       "@graphql-eslint/eslint-plugin@3.20.1": "patches/@graphql-eslint__eslint-plugin@3.20.1.patch",
       "graphiql@3.0.0-alpha.0": "patches/graphiql@3.0.0-alpha.0.patch",
       "@graphiql/react@0.18.0-alpha.0": "patches/@graphiql__react@0.18.0-alpha.0.patch",
-      "nextra-theme-docs@2.12.3": "patches/nextra-theme-docs@2.12.3.patch",
-      "@theguild/components@5.2.4": "patches/@theguild__components@5.2.4.patch",
-      "nextra@2.12.3": "patches/nextra@2.12.3.patch",
       "got@14.2.1": "patches/got@14.2.1.patch",
       "slonik@30.4.4": "patches/slonik@30.4.4.patch"
     }

packages/libraries/cli/src/base-command.ts

@@ -170,7 +170,7 @@ export default abstract class extends Command {
         if (!response.ok) {
           throw new Error(`Invalid status code for registry HTTP call: ${response.status}`);
         }
-
+        // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
         const jsonData = (await response.json()) as ExecutionResult<TResult>;
 
         if (jsonData.errors && jsonData.errors.length > 0) {

packages/web/docs/next.config.mjs

@@ -3,6 +3,7 @@
 import { withGuildDocs } from '@theguild/components/next.config';
 
 export default withGuildDocs({
+  output: 'export',
   basePath: process.env.NEXT_BASE_PATH,
   eslint: {
     ignoreDuringBuilds: true,

packages/web/docs/package.json

@@ -10,11 +10,12 @@
   "dependencies": {
     "@next/env": "13.5.6",
     "@radix-ui/react-tooltip": "1.0.7",
-    "@theguild/components": "5.2.4",
+    "@theguild/components": "6.4.0",
     "clsx": "2.1.0",
     "date-fns": "3.6.0",
     "gray-matter": "4.0.3",
-    "next": "13.5.6",
+    "next": "14.1.3",
+    "next-sitemap": "4.2.3",
     "next-themes": "*",
     "react": "18.2.0",
     "react-avatar": "5.0.3",

packages/web/docs/src/components/product-updates.tsx

@@ -1,7 +1,7 @@
 import fs from 'node:fs';
 import path from 'node:path';
 import { ReactElement } from 'react';
-import type { GetStaticProps, InferGetStaticPropsType } from 'next';
+import type { GetStaticProps } from 'next';
 import Link from 'next/link';
 import { format } from 'date-fns';
 import matter from 'gray-matter';
@@ -33,9 +33,7 @@ function ProductUpdateTeaser(props: Changelog) {
   );
 }
 
-export const ProductUpdates = ({
-  changelogs,
-}: InferGetStaticPropsType<typeof getStaticProps>): ReactElement => {
+export const ProductUpdates = (props: { changelogs: Changelog[] }): ReactElement => {
   return (
     <>
       <div className="pb-12">
@@ -43,7 +41,7 @@ export const ProductUpdates = ({
         <p>The most recent developments from GraphQL Hive.</p>
       </div>
       <ol className="relative border-l border-gray-200 dark:border-gray-700">
-        {changelogs.map(item => (
+        {props.changelogs.map(item => (
           <ProductUpdateTeaser key={item.route} {...item} />
         ))}
       </ol>
@@ -51,14 +49,13 @@ export const ProductUpdates = ({
   );
 };
 
-export const getStaticProps: GetStaticProps<{ changelogs: Changelog[] }> = async () => {
+export const getStaticProps: GetStaticProps<{ ssg: { changelogs: Changelog[] } }> = async () => {
   const productUpdatesDirectory = path.join(process.cwd(), 'src', 'pages', 'product-updates');
   const filenames = fs.readdirSync(productUpdatesDirectory);
-
   const changelogs: Changelog[] = [];
 
   for (const filename of filenames) {
-    if (filename.endsWith('.json') || filename.endsWith('index.mdx')) {
+    if (filename.endsWith('.json') || filename.endsWith('index.mdx') || filename.endsWith('.ts')) {
       continue;
     }
 
@@ -79,5 +76,9 @@ export const getStaticProps: GetStaticProps<{ changelogs: Changelog[] }> = async
 
   changelogs.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
 
-  return { props: { changelogs } };
+  return {
+    props: {
+      ssg: { changelogs },
+    },
+  };
 };

packages/web/docs/src/pages/_app.mdx

@@ -1,5 +0,0 @@
-import '@theguild/components/style.css'
-
-export default function App({ Component, pageProps }) {
-  return <Component {...pageProps} />
-}

packages/web/docs/src/pages/_app.tsx

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+import { AppProps } from 'next/app';
+import '@theguild/components/style.css';
+
+export default function App({ Component, pageProps }: AppProps): ReactElement {
+  return <Component {...pageProps} />;
+}

packages/web/docs/src/pages/_meta.json

@@ -1,39 +0,0 @@
-{
-  "index": {
-    "title": "Home",
-    "type": "page",
-    "display": "hidden",
-    "theme": {
-      "layout": "raw"
-    }
-  },
-  "hive": {
-    "title": "Dashboard",
-    "type": "page",
-    "href": "https://app.graphql-hive.com",
-    "newWindow": true
-  },
-  "status": {
-    "title": "Status",
-    "type": "page",
-    "href": "https://status.graphql-hive.com",
-    "newWindow": true
-  },
-  "docs": {
-    "title": "Documentation",
-    "type": "page",
-    "theme": {
-      "toc": true
-    }
-  },
-  "product-updates": {
-    "type": "page",
-    "title": "Product Updates",
-    "theme": {
-      "sidebar": false,
-      "toc": true,
-      "breadcrumb": false,
-      "typesetting": "article"
-    }
-  }
-}

packages/web/docs/src/pages/_meta.ts

@@ -0,0 +1,39 @@
+export default {
+  index: {
+    title: 'Home',
+    type: 'page',
+    display: 'hidden',
+    theme: {
+      layout: 'raw',
+    },
+  },
+  hive: {
+    title: 'Dashboard',
+    type: 'page',
+    href: 'https://app.graphql-hive.com',
+    newWindow: true,
+  },
+  status: {
+    title: 'Status',
+    type: 'page',
+    href: 'https://status.graphql-hive.com',
+    newWindow: true,
+  },
+  docs: {
+    title: 'Documentation',
+    type: 'page',
+    theme: {
+      toc: true,
+    },
+  },
+  'product-updates': {
+    type: 'page',
+    title: 'Product Updates',
+    theme: {
+      sidebar: false,
+      toc: true,
+      breadcrumb: false,
+      typesetting: 'article',
+    },
+  },
+};

packages/web/docs/src/pages/docs/_meta.json

@@ -1,11 +0,0 @@
-{
-  "index": "Introduction",
-  "get-started": "Get Started",
-  "features": "Features",
-  "api-reference": "CLI/API Reference",
-  "management": "Management",
-  "integrations": "Integrations and Guides",
-  "specs": "Specifications",
-  "use-cases": "Use Cases",
-  "self-hosting": "Self-Hosting"
-}

packages/web/docs/src/pages/docs/_meta.ts

@@ -0,0 +1,11 @@
+export default {
+  index: 'Introduction',
+  'get-started': 'Get Started',
+  features: 'Features',
+  'api-reference': 'CLI/API Reference',
+  management: 'Management',
+  integrations: 'Integrations and Guides',
+  specs: 'Specifications',
+  'use-cases': 'Use Cases',
+  'self-hosting': 'Self-Hosting',
+};

packages/web/docs/src/pages/docs/api-reference/_meta.json

@@ -1,4 +0,0 @@
-{
-  "cli": "Hive CLI",
-  "client": "Hive Client"
-}

packages/web/docs/src/pages/docs/api-reference/_meta.ts

@@ -0,0 +1,4 @@
+export default {
+  cli: 'Hive CLI',
+  client: 'Hive Client',
+};

packages/web/docs/src/pages/docs/api-reference/client.mdx

@@ -1,4 +1,4 @@
-import { Card, Cards } from '@theguild/components'
+import { Cards } from 'nextra/components'
 
 # Hive Client
 
@@ -17,12 +17,12 @@ You can refer to the following guides for getting started within your project, t
 page for configuring the client to your needs.
 
 <Cards>
-  <Card arrow title="GraphQL Yoga" href="/docs/integrations/graphql-yoga" />
-  <Card arrow title="Envelop" href="/docs/integrations/envelop" />
-  <Card arrow title="Schema-Stitching Gateway" href="/docs/integrations/schema-stitching" />
-  <Card arrow title="Apollo-Server" href="/docs/integrations/apollo-server" />
-  <Card arrow title="Apollo Gateway" href="/docs/integrations/apollo-gateway" />
-  <Card arrow title="GraphQL Mesh" href="/docs/integrations/graphql-mesh" />
+  <Cards.Card arrow title="GraphQL Yoga" href="/docs/integrations/graphql-yoga" />
+  <Cards.Card arrow title="Envelop" href="/docs/integrations/envelop" />
+  <Cards.Card arrow title="Schema-Stitching Gateway" href="/docs/integrations/schema-stitching" />
+  <Cards.Card arrow title="Apollo-Server" href="/docs/integrations/apollo-server" />
+  <Cards.Card arrow title="Apollo Gateway" href="/docs/integrations/apollo-gateway" />
+  <Cards.Card arrow title="GraphQL Mesh" href="/docs/integrations/graphql-mesh" />
 </Cards>
 
 #### Configuration
@@ -202,7 +202,7 @@ The [`graphql-hive` gem](https://github.com/charlypoly/graphql-ruby-hive) allows
 Refer to the following guides for integration with your project:
 
 <Cards>
-  <Card arrow title="GraphQL-Ruby" href="/docs/integrations/graphql-ruby" />
+  <Cards.Card arrow title="GraphQL-Ruby" href="/docs/integrations/graphql-ruby" />
 </Cards>
 
 ### PHP Client
@@ -211,7 +211,7 @@ The [Lighthouse Hive](https://github.com/stayallive/lighthouse-graphql-hive) is
 integration can be used to measure and collect data against all your GraphQL operations.
 
 <Cards>
-  <Card arrow title="Lighthouse (Laravel)" href="/docs/integrations/lighthouse" />
+  <Cards.Card arrow title="Lighthouse (Laravel)" href="/docs/integrations/lighthouse" />
 </Cards>
 
 ### Rust Client
@@ -219,5 +219,5 @@ integration can be used to measure and collect data against all your GraphQL ope
 Refer to the following guides for integration with your Rust project:
 
 <Cards>
-  <Card arrow title="Apollo Router" href="/docs/integrations/apollo-router" />
+  <Cards.Card arrow title="Apollo Router" href="/docs/integrations/apollo-router" />
 </Cards>

packages/web/docs/src/pages/docs/features/_meta.json

@@ -1,7 +0,0 @@
-{
-  "schema-registry": "Schema Registry",
-  "usage-reporting": "Usage Reporting and Monitoring",
-  "high-availability-cdn": "High-Availability CDN",
-  "schema-policy": "Schema Policies",
-  "laboratory": "Laboratory"
-}

packages/web/docs/src/pages/docs/features/_meta.ts

@@ -0,0 +1,7 @@
+export default {
+  'schema-registry': 'Schema Registry',
+  'usage-reporting': 'Usage Reporting and Monitoring',
+  'high-availability-cdn': 'High-Availability CDN',
+  'schema-policy': 'Schema Policies',
+  laboratory: 'Laboratory',
+};

packages/web/docs/src/pages/docs/features/schema-registry.mdx

@@ -1,5 +1,5 @@
 import NextImage from 'next/image'
-import { Callout, Card, Cards } from '@theguild/components'
+import { Callout, Cards } from '@theguild/components'
 import schemaHistoryDiffImage from '../../../../public/docs/pages/features/history-diff.png'
 import schemaExplorerImage from '../../../../public/docs/pages/features/schema-explorer.png'
 import schemaHistoryImage from '../../../../public/docs/pages/guides/history.png'
@@ -91,9 +91,9 @@ If you wish to learn more about how to use Hive with each of these project types
 the following guides:
 
 <Cards>
-  <Card arrow title="Single Schema" href="/docs/get-started/single-project" />
-  <Card arrow title="Schema-Stitching" href="/docs/get-started/schema-stitching" />
-  <Card arrow title="Apollo Federation" href="/docs/get-started/apollo-federation" />
+  <Cards.Card arrow title="Single Schema" href="/docs/get-started/single-project" />
+  <Cards.Card arrow title="Schema-Stitching" href="/docs/get-started/schema-stitching" />
+  <Cards.Card arrow title="Apollo Federation" href="/docs/get-started/apollo-federation" />
 </Cards>
 
 ## Actions on schemas

packages/web/docs/src/pages/docs/get-started/_meta.json

@@ -1,6 +0,0 @@
-{
-  "first-steps": "First Steps",
-  "single-project": "Guide: Single Schema",
-  "schema-stitching": "Guide: Schema-Stitching",
-  "apollo-federation": "Guide: Apollo Federation"
-}

packages/web/docs/src/pages/docs/get-started/_meta.ts

@@ -0,0 +1,6 @@
+export default {
+  'first-steps': 'First Steps',
+  'single-project': 'Guide: Single Schema',
+  'schema-stitching': 'Guide: Schema-Stitching',
+  'apollo-federation': 'Guide: Apollo Federation',
+};

packages/web/docs/src/pages/docs/get-started/apollo-federation.mdx

@@ -1,5 +1,5 @@
 import NextImage from 'next/image'
-import { Callout, Card, Cards, FileTree, Steps, Tab, Tabs } from '@theguild/components'
+import { Callout, Cards, FileTree, Steps, Tabs } from '@theguild/components'
 import cdnTokenImage from '../../../../public/docs/pages/guides/federation-cdn-token.png'
 import federationExplorerImage from '../../../../public/docs/pages/guides/federation-explorer.png'
 import federationHistoryImage from '../../../../public/docs/pages/guides/federation-history.png'
@@ -58,7 +58,7 @@ For this guide, we are going to use the following Subgraphs:
 Here's the GraphQL schema (SDL) for every subgraph we are going to publish to Hive:
 
 <Tabs items={['Products', 'Reviews']}>
-  <Tab>
+  <Tabs.Tab>
 
 ```graphql filename="subgraphs/products.graphql"
 enum CURRENCY_CODE {
@@ -112,8 +112,8 @@ extend type Query {
 }
 ```
 
-  </Tab>
-  <Tab>
+  </Tabs.Tab>
+  <Tabs.Tab>
 
 ```graphql filename="subgraphs/reviews.graphql"
 extend type Product @key(fields: "id") {
@@ -134,7 +134,7 @@ type ReviewSummary {
 }
 ```
 
-  </Tab>
+  </Tabs.Tab>
 </Tabs>
 
 ### Hive CLI Access Token
@@ -511,8 +511,8 @@ depending on your needs. You can use the following guides to deploy a gateway ba
 technical preference:
 
 <Cards>
-  <Card arrow title="Apollo Gateway (JS)" href="/docs/integrations/apollo-gateway" />
-  <Card arrow title="Apollo Router (Rust)" href="/docs/integrations/apollo-router" />
+  <Cards.Card arrow title="Apollo Gateway (JS)" href="/docs/integrations/apollo-gateway" />
+  <Cards.Card arrow title="Apollo Router (Rust)" href="/docs/integrations/apollo-router" />
 </Cards>
 
 ### Next Steps

packages/web/docs/src/pages/docs/get-started/first-steps.mdx

@@ -1,5 +1,5 @@
 import NextImage from 'next/image'
-import { Callout, Card, Cards, Steps } from '@theguild/components'
+import { Callout, Cards, Steps } from '@theguild/components'
 import orgImage from '../../../../public/docs/pages/first-steps/org.png'
 import projectImage from '../../../../public/docs/pages/first-steps/project.png'
 import signupImage from '../../../../public/docs/pages/first-steps/signup.png'
@@ -117,9 +117,9 @@ The following guides will help you to get started with your Hive **project**, de
 of project you selected:
 
 <Cards>
-  <Card arrow title="Single Schema" href="/docs/get-started/single-project" />
-  <Card arrow title="Schema-Stitching" href="/docs/get-started/schema-stitching" />
-  <Card arrow title="Apollo Federation" href="/docs/get-started/apollo-federation" />
+  <Cards.Card arrow title="Single Schema" href="/docs/get-started/single-project" />
+  <Cards.Card arrow title="Schema-Stitching" href="/docs/get-started/schema-stitching" />
+  <Cards.Card arrow title="Apollo Federation" href="/docs/get-started/apollo-federation" />
 </Cards>
 
 </Steps>

packages/web/docs/src/pages/docs/get-started/schema-stitching.mdx

@@ -1,5 +1,5 @@
 import NextImage from 'next/image'
-import { Callout, FileTree, Steps, Tab, Tabs } from '@theguild/components'
+import { Callout, FileTree, Steps, Tabs } from '@theguild/components'
 import cdnTokenImage from '../../../../public/docs/pages/guides/cdn_token.png'
 import historyImage from '../../../../public/docs/pages/guides/history.png'
 import stitchingExplorerImage from '../../../../public/docs/pages/guides/stitching-explorer.png'
@@ -35,7 +35,7 @@ For this guide, we are going to use the following schemas and services:
 Here's the GraphQL schema (SDL) for every service we are going to publish to Hive:
 
 <Tabs items={['Users', 'Posts']}>
-  <Tab>
+  <Tabs.Tab>
 
 <Callout type="info">
   The `@merge` directive denotes a root field used to query a merged type across services. The
@@ -71,8 +71,8 @@ type Query {
 }
 ```
 
-  </Tab>
-  <Tab>
+  </Tabs.Tab>
+  <Tabs.Tab>
 
 <Callout type="info">
   The `@merge` directive denotes a root field used to query a merged type across services. The
@@ -108,7 +108,7 @@ type Query {
 }
 ```
 
-  </Tab>
+  </Tabs.Tab>
 </Tabs>
 
 ### Hive CLI Access Token

packages/web/docs/src/pages/docs/index.mdx

@@ -1,4 +1,4 @@
-import { Callout, Card, Cards } from '@theguild/components'
+import { Callout, Cards } from '@theguild/components'
 
 # Introduction to Hive
 
@@ -33,7 +33,7 @@ managing and collaborating on your GraphQL projects:
 You can use it in our Hive Cloud service or run it as a self-hosted solution:
 
 <Cards>
-  <Card
+  <Cards.Card
     arrow
     icon={
       <svg
@@ -54,5 +54,5 @@ You can use it in our Hive Cloud service or run it as a self-hosted solution:
     title="Hive Cloud"
     href="/docs/get-started/first-steps"
   />
-  <Card arrow title="Self-Hosted" href="/docs/self-hosting/get-started" />
+  <Cards.Card arrow title="Self-Hosted" href="/docs/self-hosting/get-started" />
 </Cards>

packages/web/docs/src/pages/docs/integrations/_meta.json

@@ -1,14 +0,0 @@
-{
-  "graphql-yoga": "GraphQL Yoga",
-  "graphql-mesh": "GraphQL Mesh",
-  "envelop": "Envelop",
-  "schema-stitching": "Schema Stitching",
-  "apollo-server": "Apollo Server",
-  "apollo-router": "Apollo Router",
-  "apollo-gateway": "Apollo Gateway",
-  "graphql-ruby": "GraphQL Ruby",
-  "lighthouse": "Lighthouse (Laravel)",
-  "ci-cd": "CI/CD Guide",
-  "code-first": "Code-First Frameworks",
-  "graphql-code-generator": "GraphQL Code Generator"
-}

packages/web/docs/src/pages/docs/integrations/_meta.ts

@@ -0,0 +1,14 @@
+export default {
+  'graphql-yoga': 'GraphQL Yoga',
+  'graphql-mesh': 'GraphQL Mesh',
+  envelop: 'Envelop',
+  'schema-stitching': 'Schema Stitching',
+  'apollo-server': 'Apollo Server',
+  'apollo-router': 'Apollo Router',
+  'apollo-gateway': 'Apollo Gateway',
+  'graphql-ruby': 'GraphQL Ruby',
+  lighthouse: 'Lighthouse (Laravel)',
+  'ci-cd': 'CI/CD Guide',
+  'code-first': 'Code-First Frameworks',
+  'graphql-code-generator': 'GraphQL Code Generator',
+};

packages/web/docs/src/pages/docs/integrations/apollo-router.mdx

@@ -1,4 +1,4 @@
-import { Callout, Tab, Tabs } from 'nextra-theme-docs'
+import { Callout, Tabs } from '@theguild/components'
 
 # Apollo Router
 
@@ -47,7 +47,7 @@ You also need to
 used for authenticating the supergraph polling from the CDN.
 
 <Tabs items={['Binary', 'Docker', 'Custom']}>
-  <Tab>
+  <Tabs.Tab>
     Download Apollo Router for Linux (`x86_64`), MacOS (`x86_64`) or Windows (`x86_64`):
 
     ```bash
@@ -62,8 +62,8 @@ used for authenticating the supergraph polling from the CDN.
       ./router
     ```
 
-  </Tab>
-  <Tab>
+  </Tabs.Tab>
+  <Tabs.Tab>
       Running Apollo Router with Hive's Schema Registry:
 
       ```bash
@@ -84,9 +84,9 @@ used for authenticating the supergraph polling from the CDN.
         ghcr.io/kamilkisiela/graphql-hive/apollo-router:latest --log debug
       ```
 
-  </Tab>
+  </Tabs.Tab>
 
-  <Tab>
+  <Tabs.Tab>
     Creating a custom Apollo Router binary requires compiling it from source.
     To setup a project, please follow ["Create a new project"](https://www.apollographql.com/docs/router/customizations/custom-binary/#1-create-a-new-project) section of "Creating a custom Apollo Router binary" guide.
 
@@ -120,7 +120,7 @@ used for authenticating the supergraph polling from the CDN.
 
     In case of any issues, please refer to the [official guide](https://www.apollographql.com/docs/router/customizations/custom-binary/) or [open an issue](https://github.com/kamilkisiela/graphql-hive/issues/new) in GraphQL Hive repository.
 
-  </Tab>
+  </Tabs.Tab>
 </Tabs>
 
 ## Configuration
@@ -150,7 +150,7 @@ You can send usage reporting to Hive registry by enabling `hive.usage` plugin in
 - `HIVE_ENDPOINT` - The usage endpoint (defaults to https://app.graphql-hive.com/usage)
 
 <Tabs items={['Binary', 'Docker', 'Custom']}>
-  <Tab>
+  <Tabs.Tab>
     Start the router:
 
     ```bash
@@ -160,8 +160,8 @@ You can send usage reporting to Hive registry by enabling `hive.usage` plugin in
       ./router --config router.yaml
     ```
 
-  </Tab>
-  <Tab>
+  </Tabs.Tab>
+  <Tabs.Tab>
       Running Apollo Router with Hive's Schema Registry and Usage Reporting:
 
       ```bash
@@ -176,9 +176,9 @@ You can send usage reporting to Hive registry by enabling `hive.usage` plugin in
 
       To follow the same convention as Apollo Router's official Docker image, the config file is also located at `/dist/config/router.yaml`.
 
-  </Tab>
+  </Tabs.Tab>
 
-  <Tab>
+  <Tabs.Tab>
     Creating a custom Apollo Router binary requires compiling it from source.
     To setup a project, please follow ["Create a new project"](https://www.apollographql.com/docs/router/customizations/custom-binary/#1-create-a-new-project) section of "Creating a custom Apollo Router binary" guide.
 
@@ -215,7 +215,7 @@ You can send usage reporting to Hive registry by enabling `hive.usage` plugin in
 
     In case of any issues, please refer to the [official guide](https://www.apollographql.com/docs/router/customizations/custom-binary/) or [open an issue](https://github.com/kamilkisiela/graphql-hive/issues/new) in GraphQL Hive repository.
 
-  </Tab>
+  </Tabs.Tab>
 </Tabs>
 
 ```yaml filename="router.yaml"

packages/web/docs/src/pages/docs/management/_meta.json

@@ -1,8 +0,0 @@
-{
-  "organizations": "Organizations",
-  "sso-oidc-provider": "SSO with OIDC",
-  "projects": "Projects & Alerts",
-  "targets": "Targets & Tokens",
-  "contracts": "Schema Contracts",
-  "external-schema-composition": "External Schema Composition"
-}

packages/web/docs/src/pages/docs/management/_meta.ts

@@ -0,0 +1,8 @@
+export default {
+  organizations: 'Organizations',
+  'sso-oidc-provider': 'SSO with OIDC',
+  projects: 'Projects & Alerts',
+  targets: 'Targets & Tokens',
+  contracts: 'Schema Contracts',
+  'external-schema-composition': 'External Schema Composition',
+};

packages/web/docs/src/pages/docs/management/external-schema-composition.mdx

@@ -1,5 +1,5 @@
 import NextImage from 'next/image'
-import { Callout, Steps, Tab, Tabs } from '@theguild/components'
+import { Callout, Steps, Tabs } from '@theguild/components'
 import externalCompositionInvalid from '../../../../public/docs/pages/management/external-composition-invalid.png'
 import externalCompositionValid from '../../../../public/docs/pages/management/external-composition-valid.png'
 import externalCompositionOff from '../../../../public/docs/pages/management/external-schema-composition-disabled.png'
@@ -70,15 +70,15 @@ address must contain a valid hostname (not an IP address), and the port must be
 ### Deploy External Composition Service
 
 <Tabs items={['One-click Deployment', 'Pre-built Docker Image', 'JavaScript Library']}>
-  <Tab>
+  <Tabs.Tab>
     You can use our one-click deployment to deploy your External Composition Service to Heroku:
 
     <a target="_blank" href="https://dashboard.heroku.com/new?template=https%3A%2F%2Fgithub.com%2Fdotansimha%2Fgraphql-hive-external-composition-heroku-template">
       <img src="https://www.herokucdn.com/deploy/button.png" alt="One-click deploy to Heroku" />
     </a>
 
-  </Tab>
-  <Tab>
+  </Tabs.Tab>
+  <Tabs.Tab>
 We provide a prebuilt
 [Docker image](https://github.com/kamilkisiela/graphql-hive/pkgs/container/graphql-hive%2Fcomposition-federation-2)
 for running External Composition Service for Apollo Federation v2.
@@ -99,8 +99,8 @@ docker run -p 3069:3069 -e SECRET="MY_SECRET_HERE" \
 
 You should make this service publicly available, and then configure it in Hive platform.
 
-  </Tab>
-  <Tab>
+  </Tabs.Tab>
+  <Tabs.Tab>
 You can also build your own JavaScript/NodeJS server for the composition endpoint. The following example shows how to
 do that.
 
@@ -233,7 +233,7 @@ function verifyRequest(input) {
 }
 ```
 
-  </Tab>
+  </Tabs.Tab>
 </Tabs>
 
 ### Connect to Hive

packages/web/docs/src/pages/docs/self-hosting/_meta.json

@@ -1,9 +0,0 @@
-{
-  "get-started": "Get Started",
-  "oidc-login": "SSO with OIDC",
-  "client-and-cli-configuration": "Client & CLI Configuration",
-  "federation-2": "Apollo Federation 2",
-  "cdn-artifacts": "CDN Artifacts",
-  "s3-provider": "S3 Storage Provider",
-  "troubleshooting": "Troubleshooting"
-}

packages/web/docs/src/pages/docs/self-hosting/_meta.ts

@@ -0,0 +1,9 @@
+export default {
+  'get-started': 'Get Started',
+  'oidc-login': 'SSO with OIDC',
+  'client-and-cli-configuration': 'Client & CLI Configuration',
+  'federation-2': 'Apollo Federation 2',
+  'cdn-artifacts': 'CDN Artifacts',
+  's3-provider': 'S3 Storage Provider',
+  troubleshooting: 'Troubleshooting',
+};

packages/web/docs/src/pages/docs/specs/_meta.json

@@ -1,4 +0,0 @@
-{
-  "integrations": "Integrations",
-  "usage-reports": "Usage Reports"
-}

packages/web/docs/src/pages/docs/specs/_meta.ts

@@ -0,0 +1,4 @@
+export default {
+  integrations: 'Integrations',
+  'usage-reports': 'Usage Reports',
+};

packages/web/docs/src/pages/docs/use-cases/_meta.json

@@ -1,3 +0,0 @@
-{
-  "apollo-studio": "Apollo Studio alternative"
-}

packages/web/docs/src/pages/docs/use-cases/_meta.ts

@@ -0,0 +1,3 @@
+export default {
+  'apollo-studio': 'Apollo Studio alternative',
+};

packages/web/docs/src/pages/product-updates/2023-11-16-schema-check-breaking-change-approval-context.mdx

@@ -5,7 +5,7 @@ date: 2023-11-16
 authors: [laurin]
 ---
 
-import { Callout } from 'nextra-theme-docs'
+import { Callout } from '@theguild/components'
 
 Breaking change approvals are now retained in the context of a pull request/branch.
 

packages/web/docs/src/pages/product-updates/2023-12-05-member-roles.mdx

@@ -6,7 +6,7 @@ date: 2023-12-05
 authors: [kamil]
 ---
 
-import { Callout } from 'nextra-theme-docs'
+import { Callout } from '@theguild/components'
 
 We're thrilled to announce a significant update to our platform, bringing you more control and
 flexibility in managing your organization. Starting today, you can assign roles to members of your

packages/web/docs/src/pages/product-updates/_meta.json

@@ -1,10 +0,0 @@
-{
-  "index": {
-    "theme": {
-      "sidebar": false,
-      "toc": false,
-      "breadcrumb": false,
-      "typesetting": "article"
-    }
-  }
-}

packages/web/docs/src/pages/product-updates/_meta.ts

@@ -0,0 +1,10 @@
+export default {
+  index: {
+    theme: {
+      sidebar: false,
+      toc: false,
+      breadcrumb: false,
+      typesetting: 'article',
+    },
+  },
+};

packages/web/docs/src/pages/product-updates/index.mdx

@@ -1,11 +1,11 @@
----
-title: Product Updates
----
+import { useData } from '@theguild/components'
+import { ProductUpdates } from '../../components/product-updates'
 
-import { getStaticProps, ProductUpdates } from '../../components/product-updates'
+export { getStaticProps } from '../../components/product-updates'
 
-export { getStaticProps }
-
-export default function ProductUpdatesPage({ changelogs }) {
+export const ProductUpdatesPage = () => {
+  const { changelogs } = useData()
   return <ProductUpdates changelogs={changelogs} />
 }
+
+<ProductUpdatesPage />

packages/web/docs/theme.config.tsx

@@ -1,6 +1,12 @@
-/* eslint sort-keys: error */
 import { useRouter } from 'next/router';
-import { defineConfig, FooterExtended, Giscus, useConfig, useTheme } from '@theguild/components';
+import {
+  defineConfig,
+  FooterExtended,
+  Giscus,
+  PRODUCTS,
+  useConfig,
+  useTheme,
+} from '@theguild/components';
 import { ProductUpdateBlogPostHeader } from './src/components/product-update-blog-post-header';
 
 export default defineConfig({
@@ -58,5 +64,7 @@ export default defineConfig({
       </>
     );
   },
-  siteName: 'HIVE',
+  description: 'Schema registry for your GraphQL workflows',
+  websiteName: 'Hive',
+  logo: PRODUCTS.HIVE.logo({ className: 'w-8' }),
 });

patches/@theguild__components@5.2.4.patch

@@ -1,47 +0,0 @@
-diff --git a/dist/index.js b/dist/index.js
-index 8bc5c9d19987f1995266503a5041124c0a83108f..74dc8add706d827e188b941df6f5b4c325af805a 100644
---- a/dist/index.js
-+++ b/dist/index.js
-@@ -2907,7 +2907,7 @@ function Tabs2({
- 
- // src/define-config.tsx
- import { useRouter as useRouter3 } from "next/router";
--import { Navbar, useConfig } from "nextra-theme-docs";
-+import { Navbar, useConfig, Flexsearch } from "nextra-theme-docs";
- import { Fragment as Fragment8, jsx as jsx45, jsxs as jsxs31 } from "react/jsx-runtime";
- function defineConfig({
-   siteName: originalSiteName,
-@@ -2937,12 +2937,16 @@ function defineConfig({
-     },
-     navbar: {
-       component: (props) => /* @__PURE__ */ jsxs31(Fragment8, { children: [
--        /* @__PURE__ */ jsx45(Header, { accentColor: "#1cc8ee", searchBarProps: { version: "v2" } }),
-+        /* @__PURE__ */ jsx45(Header, { accentColor: "#1cc8ee", searchBarProps: { version: "v2" }, search: false }),
-         /* @__PURE__ */ jsx45(Navbar, { ...props })
-       ] })
-     },
-     search: {
--      component: null
-+      component: props => jsx45(Flexsearch, { ...props }),
-+      emptyResult: () => jsx45("span", { className: "nx-block nx-select-none nx-p-8 nx-text-center nx-text-sm nx-text-gray-400", children: "No results found." }),
-+      error: "Failed to load search index.",
-+      loading: () => jsxs31(Fragment8, { children: ["Loading…"] }),
-+      placeholder:() => "Search documentation…",
-     },
-     sidebar: {
-       defaultMenuCollapseLevel: 1,
-diff --git a/dist/next.config.mjs b/dist/next.config.mjs
-index 88622019e45209f9e7d07f97ab47cc5b3b3a0db1..b214f983119d770e0916c97d42ce133825a9c4c8 100644
---- a/dist/next.config.mjs
-+++ b/dist/next.config.mjs
-@@ -70,7 +70,9 @@ var withGuildDocs = ({
-     mdxOptions: {
-       remarkPlugins: defaultRemarkPlugins
-     },
--    flexsearch: false
-+    flexsearch: {
-+      codeblocks: false
-+    },
-   });
-   const siteUrl = process.env.SITE_URL || "";
-   return withBundleAnalyzer(

patches/nextra-theme-docs@2.12.3.patch

@@ -1,26 +0,0 @@
-diff --git a/dist/index.d.mts b/dist/index.d.mts
-index 7cddbae8a44f81705dd25402511e8107ed067650..4728941792e9c07afb5c3d6d80ef3f7c2e3c8157 100644
---- a/dist/index.d.mts
-+++ b/dist/index.d.mts
-@@ -1271,4 +1271,7 @@ declare function ThemeSwitch({ lite, className }: ThemeSwitchProps): ReactElemen
- 
- declare function Layout({ children, ...context }: NextraThemeLayoutProps): ReactElement;
- 
--export { Bleed, Collapse, PartialDocsThemeConfig as DocsThemeConfig, Link, LocaleSwitch, Navbar, NotFoundPage, ServerSideErrorPage, SkipNavContent, SkipNavLink, ThemeSwitch, Layout as default, useConfig };
-+// KAMIL: needed to enable search in Hive
-+declare function Flexsearch({className}: { className?: string }): ReactElement;
-+
-+export { Flexsearch, Bleed, Collapse, PartialDocsThemeConfig as DocsThemeConfig, Link, LocaleSwitch, Navbar, NotFoundPage, ServerSideErrorPage, SkipNavContent, SkipNavLink, ThemeSwitch, Layout as default, useConfig };
-diff --git a/dist/index.js b/dist/index.js
-index d72b8265f2ff61699af6135f5861270695ba6e77..900a6a033fb5aedf6b603fe9fd8766350594c7e8 100644
---- a/dist/index.js
-+++ b/dist/index.js
-@@ -3052,5 +3052,7 @@ export {
-   Layout as default,
-   useConfig,
-   useMDXComponents,
--  useTheme3 as useTheme
-+  useTheme3 as useTheme,
-+  // KAMIL: needed to enable search in Hive
-+  Flexsearch
- };

patches/nextra@2.12.3.patch

@@ -1,15 +0,0 @@
-diff --git a/dist/file-system.mjs b/dist/file-system.mjs
-index 30a12c4c6dd3f0004f639ba34b07fc2b0d89e4c5..9324e496b0e6488ab79fa731715c80700183496e 100644
---- a/dist/file-system.mjs
-+++ b/dist/file-system.mjs
-@@ -2,7 +2,9 @@
- import * as findPagesDirImport from "next/dist/lib/find-pages-dir.js";
- import { CWD } from "./constants.mjs";
- import { getDefault } from "./utils.mjs";
--var { findPagesDir, existsSync } = getDefault(findPagesDirImport);
-+// KAMIL: next v13.5 does not export existsSync (under the hood it used to use "fs" anyway)
-+import { existsSync } from 'fs'
-+var { findPagesDir } = getDefault(findPagesDirImport);
- function findPagesDirectory() {
-   const res = findPagesDir(CWD, false);
-   return res.pagesDir || // next v13