@eventcatalog/core 2.42.9 → 2.43.0

package/eventcatalog/src/pages/directory/[type]/_index.data.ts

@@ -0,0 +1,63 @@
+// pages/directory/[type]/index.page.ts
+import { isSSR } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+
+export class Page extends HybridPage {
+  static get prerender(): boolean {
+    return !isSSR();
+  }
+
+  static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
+    const { getUsers } = await import('@utils/users');
+    const { getTeams } = await import('@utils/teams');
+
+    const loaders = {
+      users: getUsers,
+      teams: getTeams,
+    };
+
+    const itemTypes = ['users', 'teams'] as const;
+    const allItems = await Promise.all(itemTypes.map((type) => loaders[type]()));
+
+    return allItems.flatMap((items, index) => ({
+      params: {
+        type: itemTypes[index],
+      },
+      props: {
+        data: items,
+        type: itemTypes[index],
+      },
+    }));
+  }
+
+  protected static async fetchData(params: any) {
+    const { type } = params;
+
+    if (!type) {
+      return null;
+    }
+
+    const { getUsers } = await import('@utils/users');
+    const { getTeams } = await import('@utils/teams');
+
+    const loaders = {
+      users: getUsers,
+      teams: getTeams,
+    };
+
+    // Get all items of the specified type
+    const items = await loaders[type as keyof typeof loaders]();
+
+    return {
+      type,
+      data: items,
+    };
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'Directory type not found',
+    });
+  }
+}

package/eventcatalog/src/pages/directory/[type]/index.astro

@@ -1,30 +1,13 @@
 ---
-import { getUsers } from '@utils/users';
-import { getTeams } from '@utils/teams';
+import type { CollectionEntry } from 'astro:content';
 
 import DirectoryLayout, { type Props as DirectoryLayoutProps } from '@layouts/DirectoryLayout.astro';
+import { Page } from './_index.data';
 
-export async function getStaticPaths() {
-  const loaders = {
-    users: getUsers,
-    teams: getTeams,
-  };
-
-  const itemTypes = ['users', 'teams'] as const;
-  const allItems = await Promise.all(itemTypes.map((type) => loaders[type]()));
-
-  return allItems.flatMap((items, index) => ({
-    params: {
-      type: itemTypes[index],
-    },
-    props: {
-      data: items,
-      type: itemTypes[index],
-    },
-  }));
-}
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-const { type, data } = Astro.props;
+const { type, data } = await Page.getData(Astro);
 
 function mapToItem(i: any) {
   return {
@@ -42,7 +25,7 @@ function mapToItem(i: any) {
   title={`${type} (${data.length})`}
   subtitle={`Find, filter and search for any ${type} in your system.`}
   data={data.map(
-    (d) =>
+    (d: CollectionEntry<'users' | 'teams'>) =>
       ({
         collection: d.collection,
         data: {

package/eventcatalog/src/pages/discover/[type]/_index.data.ts

@@ -0,0 +1,62 @@
+// pages/discover/[type]/index.page.ts
+import { isSSR } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
+
+export class Page extends HybridPage {
+  static get prerender(): boolean {
+    return !isSSR();
+  }
+
+  static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
+    const { getFlows } = await import('@utils/collections/flows');
+
+    const loaders = {
+      ...pageDataLoader,
+      flows: getFlows,
+    };
+
+    const itemTypes = ['events', 'commands', 'queries', 'services', 'domains', 'flows'] as const;
+    const allItems = await Promise.all(itemTypes.map((type) => loaders[type]()));
+
+    return allItems.flatMap((items, index) => ({
+      params: {
+        type: itemTypes[index],
+      },
+      props: {
+        data: items,
+        type: itemTypes[index],
+      },
+    }));
+  }
+
+  protected static async fetchData(params: any) {
+    const { type } = params;
+
+    if (!type) {
+      return null;
+    }
+
+    const { getFlows } = await import('@utils/collections/flows');
+
+    const loaders = {
+      ...pageDataLoader,
+      flows: getFlows,
+    };
+
+    // @ts-ignore
+    const items = await loaders[type]();
+
+    return {
+      type,
+      data: items,
+    };
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'Collection type not found',
+    });
+  }
+}

package/eventcatalog/src/pages/discover/[type]/index.astro

@@ -1,30 +1,13 @@
 ---
+import type { CollectionEntry } from 'astro:content';
+import type { CollectionTypes } from '@types';
 import DiscoverLayout, { type Props as DiscoverLayoutProps } from '@layouts/DiscoverLayout.astro';
-import { getFlows } from '@utils/collections/flows';
+import { Page } from './_index.data';
 
-import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-export async function getStaticPaths() {
-  const loaders = {
-    ...pageDataLoader,
-    flows: getFlows,
-  };
-
-  const itemTypes = ['events', 'commands', 'queries', 'services', 'domains', 'flows'] as const;
-  const allItems = await Promise.all(itemTypes.map((type) => loaders[type]()));
-
-  return allItems.flatMap((items, index) => ({
-    params: {
-      type: itemTypes[index],
-    },
-    props: {
-      data: items,
-      type: itemTypes[index],
-    },
-  }));
-}
-
-const { type, data } = Astro.props;
+const { type, data } = await Page.getData(Astro);
 
 function mapToItem(i: any) {
   return {
@@ -42,7 +25,7 @@ function mapToItem(i: any) {
   title={`${type} (${data.length})`}
   subtitle={`Find, filter and search for any ${type} in your system.`}
   data={data.map(
-    (d) =>
+    (d: CollectionEntry<CollectionTypes>) =>
       ({
         collection: d.collection,
         data: {

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/_index.data.ts

@@ -0,0 +1,62 @@
+import { isSSR } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+import type { PageTypes } from '@types';
+import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
+
+/**
+ * Documentation page class for all collection types with versioning
+ */
+export class Page extends HybridPage {
+  static async getStaticPaths() {
+    if (isSSR()) {
+      return [];
+    }
+
+    const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains', 'flows', 'channels', 'entities'];
+    const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
+
+    return allItems.flatMap((items, index) =>
+      items.map((item) => ({
+        params: {
+          type: itemTypes[index],
+          id: item.data.id,
+          version: item.data.version,
+        },
+        props: {
+          type: itemTypes[index],
+          ...item,
+        },
+      }))
+    );
+  }
+
+  protected static async fetchData(params: any) {
+    const { type, id, version } = params;
+
+    if (!type || !id || !version) {
+      return null;
+    }
+
+    // Get all items of the specified type
+    const items = await pageDataLoader[type as PageTypes]();
+
+    // Find the specific item by id and version
+    const item = items.find((i) => i.data.id === id && i.data.version === version);
+
+    if (!item) {
+      return null;
+    }
+
+    return {
+      type,
+      ...item,
+    };
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'Documentation not found',
+    });
+  }
+}

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/asyncapi/[filename].astro

@@ -5,53 +5,21 @@ import { renderToString } from 'react-dom/server';
 import { Parser } from '@asyncapi/parser';
 import { AvroSchemaParser } from '@asyncapi/avro-schema-parser';
 import fs from 'fs';
-import { getSpecificationsForService } from '@utils/collections/services';
-import type { CollectionTypes, PageTypes } from '@types';
 
 import '@asyncapi/react-component/styles/default.min.css';
 import js from '@asyncapi/react-component/browser/standalone/without-parser.js?url';
 import { AsyncApiComponentWP, type ConfigInterface } from '@asyncapi/react-component';
-import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
-import type { CollectionEntry } from 'astro:content';
 import VerticalSideBarLayout from '@layouts/VerticalSideBarLayout.astro';
 import Config from '@utils/eventcatalog-config/catalog';
+import { Page } from './_[filename].data';
 
-export async function getStaticPaths() {
-  const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains'];
-  const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-  const hasSpecifications = (item: CollectionEntry<CollectionTypes>) => {
-    const specifications = getSpecificationsForService(item);
-    // Ensure there is at least one 'asyncapi' specification
-    return specifications && specifications.some((spec) => spec.type === 'asyncapi');
-  };
-
-  const filteredItems = allItems.map((items) => items.filter(hasSpecifications));
-
-  return filteredItems.flatMap((items, index) =>
-    items.flatMap((item) => {
-      const asyncApiSpecifications = getSpecificationsForService(item).filter((spec) => spec.type === 'asyncapi');
-
-      return asyncApiSpecifications.map((spec) => ({
-        params: {
-          type: itemTypes[index],
-          id: item.data.id,
-          version: item.data.version,
-          filename: spec.filenameWithoutExtension || spec.type,
-        },
-        props: {
-          type: itemTypes[index],
-          filenameWithoutExtension: spec.filenameWithoutExtension || spec.type,
-          filename: spec.filename || spec.type,
-          ...item,
-        },
-      }));
-    })
-  );
-}
+// Get data
+const { collection, data, filePath, filename } = await Page.getData(Astro);
 
 // @ts-ignore
-const { collection, catalog, data, filePath, filename } = Astro.props;
 const fileName = filename || 'asyncapi.yaml';
 const directory = path.dirname(filePath || '');
 const pathToSpec = path.join(directory, fileName);

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/asyncapi/_[filename].data.ts

@@ -0,0 +1,98 @@
+// pages/docs/[type]/[id]/[version]/asyncapi/[filename]/index.page.ts
+import { isSSR, isAuthEnabled } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+import type { CollectionEntry } from 'astro:content';
+import type { CollectionTypes, PageTypes } from '@types';
+
+export class Page extends HybridPage {
+  static get prerender(): boolean {
+    return !isSSR();
+  }
+
+  static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
+    if (isSSR()) {
+      return [];
+    }
+
+    const { pageDataLoader } = await import('@utils/page-loaders/page-data-loader');
+    const { getSpecificationsForService } = await import('@utils/collections/services');
+
+    const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains'];
+    const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
+
+    const hasSpecifications = (item: CollectionEntry<CollectionTypes>) => {
+      const specifications = getSpecificationsForService(item);
+      // Ensure there is at least one 'asyncapi' specification
+      return specifications && specifications.some((spec) => spec.type === 'asyncapi');
+    };
+
+    const filteredItems = allItems.map((items) => items.filter(hasSpecifications));
+
+    return filteredItems.flatMap((items, index) =>
+      items.flatMap((item) => {
+        const asyncApiSpecifications = getSpecificationsForService(item).filter((spec) => spec.type === 'asyncapi');
+
+        return asyncApiSpecifications.map((spec) => ({
+          params: {
+            type: itemTypes[index],
+            id: item.data.id,
+            version: item.data.version,
+            filename: spec.filenameWithoutExtension || spec.type,
+          },
+          props: {
+            type: itemTypes[index],
+            filenameWithoutExtension: spec.filenameWithoutExtension || spec.type,
+            filename: spec.filename || spec.type,
+            ...item,
+          },
+        }));
+      })
+    );
+  }
+
+  protected static async fetchData(params: any) {
+    const { type, id, version, filename } = params;
+
+    if (!type || !id || !version || !filename) {
+      return null;
+    }
+
+    const { pageDataLoader } = await import('@utils/page-loaders/page-data-loader');
+    const { getSpecificationsForService } = await import('@utils/collections/services');
+
+    // Get all items of the specified type
+    const items = await pageDataLoader[type as PageTypes]();
+
+    // Find the specific item by id and version
+    const item = items.find((i) => i.data.id === id && i.data.version === version);
+
+    if (!item) {
+      return null;
+    }
+
+    // Check if this item has AsyncAPI specifications
+    const specifications = getSpecificationsForService(item);
+    const asyncApiSpecifications = specifications.filter((spec) => spec.type === 'asyncapi');
+
+    // Find the specific specification
+    const spec = asyncApiSpecifications.find((s) => (s.filenameWithoutExtension || s.type) === filename);
+
+    if (!spec) {
+      return null;
+    }
+
+    return {
+      type,
+      filenameWithoutExtension: spec.filenameWithoutExtension || spec.type,
+      filename: spec.filename || spec.type,
+      ...item,
+    };
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'AsyncAPI specification not found',
+    });
+  }
+}

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/changelog/_index.data.ts

@@ -0,0 +1,68 @@
+import { isSSR } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+import type { PageTypes } from '@types';
+
+export class Page extends HybridPage {
+  static get prerender(): boolean {
+    return !isSSR();
+  }
+
+  static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
+    if (isSSR()) {
+      return [];
+    }
+
+    const { pageDataLoader } = await import('@utils/page-loaders/page-data-loader');
+
+    const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains', 'flows'];
+    const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
+
+    return allItems.flatMap((items, index) =>
+      items.map((item) => ({
+        params: {
+          type: itemTypes[index],
+          id: item.data.id,
+          version: item.data.version,
+        },
+        props: {
+          type: itemTypes[index],
+          allCollectionItems: items,
+          ...item,
+        },
+      }))
+    );
+  }
+
+  protected static async fetchData(params: any) {
+    const { type, id, version } = params;
+
+    if (!type || !id || !version) {
+      return null;
+    }
+
+    const { pageDataLoader } = await import('@utils/page-loaders/page-data-loader');
+
+    // Get all items of the specified type
+    const items = await pageDataLoader[type as PageTypes]();
+
+    // Find the specific item by id and version
+    const item = items.find((i) => i.data.id === id && i.data.version === version);
+
+    if (!item) {
+      return null;
+    }
+
+    return {
+      type,
+      allCollectionItems: items,
+      ...item,
+    };
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'Changelog not found',
+    });
+  }
+}

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/changelog/index.astro

@@ -1,6 +1,5 @@
 ---
 import Footer from '@layouts/Footer.astro';
-import type { PageTypes } from '@types';
 import { getChangeLogs } from '@utils/collections/changelogs';
 import {
   RectangleGroupIcon,
@@ -10,7 +9,6 @@ import {
   MagnifyingGlassIcon,
   QueueListIcon,
 } from '@heroicons/react/24/outline';
-import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
 import { render, getEntry } from 'astro:content';
 import mdxComponents from '@components/MDX/components';
 import 'diff2html/bundles/css/diff2html.min.css';
@@ -20,38 +18,20 @@ import { getPreviousVersion } from '@utils/collections/util';
 import { getDiffsForCurrentAndPreviousVersion } from '@utils/collections/file-diffs';
 import VerticalSideBarLayout from '@layouts/VerticalSideBarLayout.astro';
 import { ClientRouter } from 'astro:transitions';
-
 import { isChangelogEnabled } from '@utils/feature';
 
-export async function getStaticPaths() {
-  if (!isChangelogEnabled()) {
-    return [];
-  }
+import { Page } from './_index.data';
 
-  const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains', 'flows'];
-  const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-  return allItems.flatMap((items, index) =>
-    items.map((item) => ({
-      params: {
-        type: itemTypes[index],
-        id: item.data.id,
-        version: item.data.version,
-      },
-      props: {
-        type: itemTypes[index],
-        allCollectionItems: items,
-        ...item,
-      },
-    }))
-  );
-}
+// Get data
+const props = await Page.getData(Astro);
 
 if (!isChangelogEnabled()) {
   return Astro.redirect('/docs');
 }
 
-const props = Astro.props;
 let collectionItem = props;
 const logs = await getChangeLogs(props);
 

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/index.astro

@@ -31,7 +31,6 @@ import {
 } from '@heroicons/react/24/outline';
 import { ArrowsRightLeftIcon } from '@heroicons/react/20/solid';
 import { Box, Boxes } from 'lucide-react';
-import type { PageTypes } from '@types';
 import type { CollectionTypes } from '@types';
 
 import { ClientRouter } from 'astro:transitions';
@@ -40,7 +39,6 @@ import type { CollectionEntry } from 'astro:content';
 
 import { getIcon } from '@utils/badges';
 import { getDeprecatedDetails } from '@utils/collections/util';
-import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
 import { buildUrl } from '@utils/url-builder';
 import { getSchemasFromResource } from '@utils/collections/schemas';
 import { isEventCatalogChatEnabled, isMarkdownDownloadEnabled } from '@utils/feature';
@@ -48,38 +46,21 @@ import { isEventCatalogChatEnabled, isMarkdownDownloadEnabled } from '@utils/fea
 import { getMDXComponentsByName } from '@utils/markdown';
 
 import config from '@config';
+import { Page } from './_index.data';
 
-export async function getStaticPaths() {
-  const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains', 'flows', 'channels', 'entities'];
-  const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-  return allItems.flatMap((items, index) =>
-    items.map((item) => ({
-      params: {
-        type: itemTypes[index],
-        id: item.data.id,
-        version: item.data.version,
-      },
-      props: {
-        type: itemTypes[index],
-        ...item,
-      },
-    }))
-  );
-}
-
-const props = Astro.props;
+// Get data
+const props = await Page.getData(Astro);
 
 const { Content } = await render(props);
 
-// const { Content } = await props.render();
-
-// Capitalize the first letter of a string
 const pageTitle = `${props.collection} | ${props.data.name}`.replace(/^\w/, (c) => c.toUpperCase());
 const contentBadges = props.data.badges || [];
 
 const getContentBadges = () =>
-  contentBadges.map((badge) => ({
+  contentBadges.map((badge: any) => ({
     ...badge,
     icon: badge.icon ? getIcon(badge.icon) : null,
   }));

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/spec/[filename].astro

@@ -11,45 +11,16 @@ import { pageDataLoader } from '@utils/page-loaders/page-data-loader';
 import VerticalSideBarLayout from '@layouts/VerticalSideBarLayout.astro';
 import { getSpecificationsForService } from '@utils/collections/services';
 import './_styles.css';
+import { Page } from './_[filename].data.ts';
 
-export async function getStaticPaths() {
-  const itemTypes: PageTypes[] = ['events', 'commands', 'queries', 'services', 'domains'];
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-  const allItems = await Promise.all(itemTypes.map((type) => pageDataLoader[type]()));
-
-  const hasSpecifications = (item: CollectionEntry<CollectionTypes>) => {
-    const specifications = getSpecificationsForService(item);
-    // Ensure there is at least one 'openapi' specification
-    return specifications && specifications.some((spec) => spec.type === 'openapi');
-  };
-
-  const filteredItems = allItems.map((items) => items.filter(hasSpecifications));
-
-  return filteredItems.flatMap((items, index) =>
-    items.flatMap((item) => {
-      // Filter for openapi specifications only
-      const openApiSpecifications = getSpecificationsForService(item).filter((spec) => spec.type === 'openapi');
-
-      return openApiSpecifications.map((spec) => ({
-        params: {
-          type: itemTypes[index],
-          id: item.data.id,
-          version: item.data.version,
-          filename: spec.filenameWithoutExtension || spec.type,
-        },
-        props: {
-          type: itemTypes[index],
-          filenameWithoutExtension: spec.filenameWithoutExtension || spec.type,
-          filename: spec.filename || spec.type,
-          ...item,
-        },
-      }));
-    })
-  );
-}
+// Get data
+const props = await Page.getData(Astro);
 
 // @ts-ignore
-const { collection, data, catalog, filePath, filename } = Astro.props;
+const { collection, data, catalog, filePath, filename } = props;
 const fileName = filename || 'openapi.yml';
 
 const directory = path.dirname(filePath || '');