@eventcatalog/core 3.7.2 → 3.8.1

package/eventcatalog/src/components/SchemaExplorer/SchemaExplorer.tsx

@@ -5,6 +5,7 @@ import {
   ChatBubbleLeftIcon,
   MagnifyingGlassIcon as MagnifyingGlassSolidIcon,
   CodeBracketIcon,
+  DocumentCheckIcon,
 } from '@heroicons/react/24/solid';
 import type { CollectionMessageTypes } from '@types';
 
@@ -30,7 +31,7 @@ export default function SchemaExplorer({ schemas, apiAccessEnabled = false }: Sc
     }
     return '';
   });
-  const [selectedTypes, setSelectedTypes] = useState<Set<CollectionMessageTypes | 'specifications'>>(() => {
+  const [selectedTypes, setSelectedTypes] = useState<Set<CollectionMessageTypes | 'specifications' | 'data-contracts'>>(() => {
     // Load from localStorage
     if (typeof window !== 'undefined') {
       const stored = localStorage.getItem('schemaRegistrySelectedTypes');
@@ -151,6 +152,10 @@ export default function SchemaExplorer({ schemas, apiAccessEnabled = false }: Sc
         if (selectedTypes.has('specifications') && SPEC_TYPES.includes(msg.schemaExtension?.toLowerCase() || '')) {
           return true;
         }
+        // Check if 'data-contracts' is selected and this is a data product contract
+        if (selectedTypes.has('data-contracts') && msg.collection === 'data-products') {
+          return true;
+        }
         return false;
       });
     }
@@ -325,11 +330,12 @@ export default function SchemaExplorer({ schemas, apiAccessEnabled = false }: Sc
       commands: latestMessages.filter((m) => m.collection === 'commands').length,
       queries: latestMessages.filter((m) => m.collection === 'queries').length,
       specifications: latestMessages.filter((m) => SPEC_TYPES.includes(m.schemaExtension?.toLowerCase() || '')).length,
+      dataContracts: latestMessages.filter((m) => m.collection === 'data-products').length,
     };
   }, [latestMessages]);
 
   // Toggle type selection (multi-select)
-  const toggleType = (type: CollectionMessageTypes | 'specifications') => {
+  const toggleType = (type: CollectionMessageTypes | 'specifications' | 'data-contracts') => {
     setSelectedTypes((prev) => {
       const next = new Set(prev);
       if (next.has(type)) {
@@ -485,6 +491,27 @@ export default function SchemaExplorer({ schemas, apiAccessEnabled = false }: Sc
                   </span>
                 </button>
               )}
+              {stats.dataContracts > 0 && (
+                <button
+                  onClick={() => toggleType('data-contracts')}
+                  className={`inline-flex items-center gap-1.5 px-2 py-1 rounded-md text-xs font-medium transition-all border ${
+                    selectedTypes.has('data-contracts')
+                      ? 'bg-purple-50 dark:bg-purple-500/10 text-purple-700 dark:text-purple-300 border-purple-200 dark:border-purple-500/30'
+                      : 'text-[rgb(var(--ec-page-text-muted))] border-[rgb(var(--ec-page-border))] hover:bg-[rgb(var(--ec-content-hover))]'
+                  }`}
+                  title="Data Contracts from Data Products"
+                >
+                  <DocumentCheckIcon
+                    className={`h-3.5 w-3.5 ${selectedTypes.has('data-contracts') ? 'text-purple-500' : 'text-purple-400'}`}
+                  />
+                  <span>Data Contracts</span>
+                  <span
+                    className={`tabular-nums ${selectedTypes.has('data-contracts') ? 'text-purple-500' : 'text-[rgb(var(--ec-icon-color))]'}`}
+                  >
+                    {stats.dataContracts}
+                  </span>
+                </button>
+              )}
             </div>
           </div>
 

package/eventcatalog/src/components/SchemaExplorer/types.ts

@@ -18,7 +18,7 @@ export interface Owner {
 }
 
 export interface SchemaItem {
-  collection: CollectionMessageTypes | 'services';
+  collection: CollectionMessageTypes | 'services' | 'data-products';
   data: {
     id: string;
     name: string;
@@ -34,6 +34,10 @@ export interface SchemaItem {
   specType?: string;
   specName?: string;
   specFilenameWithoutExtension?: string;
+  // For data contracts
+  contractType?: string;
+  dataProductId?: string;
+  dataProductVersion?: string;
 }
 
 export interface VersionDiff {

package/eventcatalog/src/components/SideNav/NestedSideBar/index.tsx

@@ -222,6 +222,9 @@ export default function NestedSideBar() {
         // Flows
         { pattern: /^\/docs\/flows\/([^/]+)\/([^/]+)/, type: 'flow' },
         { pattern: /^\/visualiser\/flows\/([^/]+)\/([^/]+)/, type: 'flow' },
+        // Data Products
+        { pattern: /^\/docs\/data-products\/([^/]+)\/([^/]+)/, type: 'data-product' },
+        { pattern: /^\/visualiser\/data-products\/([^/]+)\/([^/]+)/, type: 'data-product' },
       ];
 
       // URL patterns without version (language pages, etc)

package/eventcatalog/src/components/SideNav/NestedSideBar/utils.ts

@@ -14,6 +14,7 @@ export const getBadgeClasses = (badge: string): string => {
     message: 'bg-[rgb(var(--ec-badge-message-bg))] text-[rgb(var(--ec-badge-message-text))]',
     design: 'bg-[rgb(var(--ec-badge-design-bg))] text-[rgb(var(--ec-badge-design-text))]',
     channel: 'bg-[rgb(var(--ec-badge-channel-bg))] text-[rgb(var(--ec-badge-channel-text))]',
+    'data product': 'bg-[rgb(var(--ec-badge-data-product-bg))] text-[rgb(var(--ec-badge-data-product-text))]',
   };
   return badgeColors[badge.toLowerCase()] || 'bg-[rgb(var(--ec-badge-default-bg))] text-[rgb(var(--ec-badge-default-text))]';
 };

package/eventcatalog/src/components/Tables/Discover/DiscoverTable.tsx

@@ -18,7 +18,15 @@ import { FilterDropdown, CheckboxItem } from './FilterComponents';
 import DebouncedInput from '../DebouncedInput';
 import { getDiscoverColumns } from './columns';
 
-export type CollectionType = 'events' | 'commands' | 'queries' | 'services' | 'domains' | 'flows' | 'containers';
+export type CollectionType =
+  | 'events'
+  | 'commands'
+  | 'queries'
+  | 'services'
+  | 'domains'
+  | 'flows'
+  | 'containers'
+  | 'data-products';
 
 export interface DiscoverTableData {
   collection: string;
@@ -29,6 +37,8 @@ export interface DiscoverTableData {
   hasRepository?: boolean;
   isDeprecated?: boolean;
   hasDataDependencies?: boolean;
+  hasInputs?: boolean;
+  hasOutputs?: boolean;
   data: {
     id: string;
     name: string;
@@ -49,6 +59,8 @@ export interface DiscoverTableData {
     services?: Array<any>;
     servicesThatWriteToContainer?: Array<any>;
     servicesThatReadFromContainer?: Array<any>;
+    inputs?: Array<any>;
+    outputs?: Array<any>;
   };
 }
 
@@ -232,6 +244,16 @@ export function DiscoverTable<T extends DiscoverTableData>({
             const readers = row.data.servicesThatReadFromContainer || [];
             if (readers.length === 0) return false;
           }
+
+          // Data-product-specific checks
+          if (prop === 'hasInputs') {
+            const inputs = row.data.inputs || [];
+            if (inputs.length === 0) return false;
+          }
+          if (prop === 'hasOutputs') {
+            const outputs = row.data.outputs || [];
+            if (outputs.length === 0) return false;
+          }
         }
       }
 

package/eventcatalog/src/components/Tables/Discover/columns.tsx

@@ -9,6 +9,7 @@ import {
   QueueListIcon,
   DocumentTextIcon,
   MapIcon,
+  CubeIcon,
 } from '@heroicons/react/24/solid';
 import { ArrowDownIcon, ArrowUpIcon } from '@heroicons/react/24/outline';
 import { DatabaseIcon } from 'lucide-react';
@@ -30,6 +31,7 @@ const colorClasses: Record<string, string> = {
   purple: 'text-purple-500',
   red: 'text-red-500',
   gray: 'text-gray-500',
+  cyan: 'text-cyan-500',
 };
 
 // Reusable tooltip wrapper component
@@ -540,6 +542,64 @@ export const getContainerColumns = (tableConfiguration: TableConfiguration) => [
   createActionsColumn('containers', tableConfiguration),
 ];
 
+// ============================================================================
+// DATA PRODUCT COLUMNS
+// ============================================================================
+export const getDataProductColumns = (tableConfiguration: TableConfiguration) => [
+  columnHelper.accessor('data.name', {
+    id: 'name',
+    header: () => <span>{tableConfiguration?.columns?.name?.label || 'Data Product'}</span>,
+    cell: (info) => {
+      const item = info.row.original;
+      const isLatestVersion = item.data.version === item.data.latestVersion;
+      return (
+        <a
+          href={buildUrl(`/docs/${item.collection}/${item.data.id}/${item.data.version}`)}
+          className="group inline-flex items-center gap-2 hover:text-[rgb(var(--ec-accent))] transition-colors"
+        >
+          <CubeIcon className="h-4 w-4 text-cyan-500 flex-shrink-0" />
+          <span className="text-sm font-semibold text-[rgb(var(--ec-page-text))] group-hover:text-[rgb(var(--ec-accent))]">
+            {item.data.name}
+          </span>
+          {!isLatestVersion && <span className="text-xs text-[rgb(var(--ec-icon-color))]">v{item.data.version}</span>}
+        </a>
+      );
+    },
+    meta: {
+      filterVariant: 'name',
+    },
+  }),
+  createSummaryColumn(tableConfiguration),
+  columnHelper.accessor('data.inputs', {
+    id: 'inputs',
+    header: () => (
+      <span className="flex items-center gap-1">
+        <ArrowDownIcon className="w-3.5 h-3.5" />
+        Inputs
+      </span>
+    ),
+    cell: (info) => <CollectionListCell items={info.getValue()} />,
+    meta: {
+      showFilter: false,
+    },
+  }),
+  columnHelper.accessor('data.outputs', {
+    id: 'outputs',
+    header: () => (
+      <span className="flex items-center gap-1">
+        <ArrowUpIcon className="w-3.5 h-3.5" />
+        Outputs
+      </span>
+    ),
+    cell: (info) => <CollectionListCell items={info.getValue()} />,
+    meta: {
+      showFilter: false,
+    },
+  }),
+  createBadgesColumn(tableConfiguration),
+  createActionsColumn('data-products', tableConfiguration),
+];
+
 // ============================================================================
 // COLUMN GETTER BY COLLECTION TYPE
 // ============================================================================
@@ -559,6 +619,8 @@ export const getDiscoverColumns = (collectionType: CollectionType, tableConfigur
       return getFlowColumns(tableConfiguration);
     case 'containers':
       return getContainerColumns(tableConfiguration);
+    case 'data-products':
+      return getDataProductColumns(tableConfiguration);
     default:
       return [];
   }

package/eventcatalog/src/content.config.ts

@@ -362,6 +362,34 @@ const queries = defineCollection({
     .merge(baseSchema),
 });
 
+const dataProductOutputPointer = z.object({
+  id: z.string(),
+  version: z.string().optional().default('latest'),
+  contract: z
+    .object({
+      path: z.string(),
+      name: z.string(),
+      type: z.string().optional(),
+    })
+    .optional(),
+});
+
+const dataProducts = defineCollection({
+  loader: glob({
+    pattern: ['**/data-products/*/index.(md|mdx)', '**/data-products/*/versioned/*/index.(md|mdx)'],
+    base: projectDirBase,
+    generateId: ({ data }) => {
+      return `${data.id}-${data.version}`;
+    },
+  }),
+  schema: z
+    .object({
+      inputs: z.array(pointer).optional(),
+      outputs: z.array(dataProductOutputPointer).optional(),
+    })
+    .merge(baseSchema),
+});
+
 const services = defineCollection({
   loader: glob({
     pattern: [
@@ -455,6 +483,8 @@ const containers = defineCollection({
 
       servicesThatWriteToContainer: z.array(reference('services')).optional(),
       servicesThatReadFromContainer: z.array(reference('services')).optional(),
+      dataProductsThatWriteToContainer: z.array(reference('data-products')).optional(),
+      dataProductsThatReadFromContainer: z.array(reference('data-products')).optional(),
     })
     .merge(baseSchema),
 });
@@ -489,6 +519,7 @@ const domains = defineCollection({
       services: z.array(pointer).optional(),
       domains: z.array(pointer).optional(),
       entities: z.array(pointer).optional(),
+      'data-products': z.array(pointer).optional(),
       flows: z.array(pointer).optional(),
       sends: z.array(sendsPointer).optional(),
       receives: z.array(receivesPointer).optional(),
@@ -725,6 +756,9 @@ export const collections = {
   changelogs,
   containers,
 
+  // Data Product Collections
+  'data-products': dataProducts,
+
   // DDD Collections
   ubiquitousLanguages,
   entities,

package/eventcatalog/src/enterprise/ai/chat-api.ts

@@ -9,6 +9,8 @@ import {
   getResource as getResourceImpl,
   getMessagesProducedOrConsumedByResource as getMessagesImpl,
   getSchemaForResource as getSchemaImpl,
+  getDataProductInputs as getDataProductInputsImpl,
+  getDataProductOutputs as getDataProductOutputsImpl,
   collectionSchema,
   resourceCollectionSchema,
   messageCollectionSchema,
@@ -57,6 +59,8 @@ const builtInToolsMetadata = [
   { name: 'getProducerAndConsumerForMessage', description: 'Get the producers and consumers for a message' },
   { name: 'getConsumersOfMessage', description: 'Get the consumers for a message' },
   { name: 'getSchemaForResource', description: 'Get the schema or specifications (OpenAPI, AsyncAPI, GraphQL) for a resource' },
+  { name: 'getDataProductInputs', description: 'Get the inputs (resources consumed) for a data product' },
+  { name: 'getDataProductOutputs', description: 'Get the outputs (resources produced) for a data product with data contracts' },
 ];
 
 // Get extended tools metadata from user configuration
@@ -94,6 +98,8 @@ There are many different resource types in EventCatalog, including:
   - example docs url: /docs/entities/MyEntity/1.0.0
 - Containers (collection name 'containers') (at the moment these are data stores (databases))
   - example docs url: /docs/containers/MyContainer/1.0.0
+- Data Products (collection name 'data-products') (data products that have inputs and outputs, and may have data contracts)
+  - example docs url: /docs/data-products/MyDataProduct/1.0.0
 
 The user will ask you some questions about the software architecture catalog, you should use the tools provided to you to get the information they need.
 
@@ -291,6 +297,26 @@ export const POST = async ({ request }: APIContext<{ question: string; messages:
             return await getSchemaImpl({ resourceId, resourceVersion, resourceCollection });
           },
         }),
+        getDataProductInputs: tool({
+          description: toolDescriptions.getDataProductInputs,
+          inputSchema: z.object({
+            dataProductId: z.string().describe('The id of the data product to get the inputs for'),
+            dataProductVersion: z.string().describe('The version of the data product to get the inputs for'),
+          }),
+          execute: async ({ dataProductId, dataProductVersion }) => {
+            return await getDataProductInputsImpl({ dataProductId, dataProductVersion });
+          },
+        }),
+        getDataProductOutputs: tool({
+          description: toolDescriptions.getDataProductOutputs,
+          inputSchema: z.object({
+            dataProductId: z.string().describe('The id of the data product to get the outputs for'),
+            dataProductVersion: z.string().describe('The version of the data product to get the outputs for'),
+          }),
+          execute: async ({ dataProductId, dataProductVersion }) => {
+            return await getDataProductOutputsImpl({ dataProductId, dataProductVersion });
+          },
+        }),
         suggestFollowUpQuestions: tool({
           description:
             'Use this tool after answering a question to suggest 2-3 relevant follow-up questions the user might want to ask. These will be displayed as clickable suggestions.',

package/eventcatalog/src/enterprise/custom-documentation/utils/custom-docs.ts

@@ -210,6 +210,6 @@ export const getAdjacentPages = async (slug: string): Promise<AdjacentPages> =>
 };
 
 export const getNavigationItems = async (): Promise<SidebarItem[]> => {
-  const configuredSidebar = config.customDocs.sidebar;
+  const configuredSidebar = config.customDocs?.sidebar || [];
   return processSidebarItems(configuredSidebar as SideBarConfigurationItem[]);
 };

package/eventcatalog/src/enterprise/tools/catalog-tools.ts

@@ -4,9 +4,10 @@
  */
 import { getCollection, getEntry } from 'astro:content';
 import { z } from 'zod';
-import { getSchemasFromResource } from '@utils/collections/schemas';
+import { getSchemasFromResource, getSchemaFormatFromURL } from '@utils/collections/schemas';
 import { getItemsFromCollectionByIdAndSemverOrLatest } from '@utils/collections/util';
 import { getUbiquitousLanguageWithSubdomains } from '@utils/collections/domains';
+import { getAbsoluteFilePathForAstroFile } from '@utils/files';
 import fs from 'node:fs';
 
 // ============================================
@@ -92,6 +93,7 @@ export const collectionSchema = z.enum([
   'entities',
   'containers',
   'diagrams',
+  'data-products',
 ]);
 
 export const messageCollectionSchema = z.enum(['events', 'commands', 'queries']);
@@ -105,6 +107,7 @@ export const resourceCollectionSchema = z.enum([
   'domains',
   'channels',
   'entities',
+  'data-products',
 ]);
 
 // ============================================
@@ -208,7 +211,17 @@ export async function getSchemaForResource(params: { resourceId: string; resourc
  * Find all resources owned by a specific team or user
  */
 export async function findResourcesByOwner(params: { ownerId: string }) {
-  const collectionsToSearch = ['events', 'commands', 'queries', 'services', 'domains', 'flows', 'channels', 'entities'] as const;
+  const collectionsToSearch = [
+    'events',
+    'commands',
+    'queries',
+    'services',
+    'domains',
+    'flows',
+    'channels',
+    'entities',
+    'data-products',
+  ] as const;
 
   const results: Array<{ collection: string; id: string; version?: string; name: string }> = [];
 
@@ -658,6 +671,156 @@ export async function explainUbiquitousLanguageTerms(params: { domainId: string;
   };
 }
 
+// ============================================
+// Data Product tools
+// ============================================
+
+/**
+ * Get the inputs (resources consumed) for a data product
+ * Returns fully hydrated input resources
+ */
+export async function getDataProductInputs(params: { dataProductId: string; dataProductVersion: string }) {
+  const dataProduct = await getEntry('data-products', `${params.dataProductId}-${params.dataProductVersion}`);
+
+  if (!dataProduct) {
+    return {
+      error: `Data product not found: ${params.dataProductId}-${params.dataProductVersion}`,
+    };
+  }
+
+  const inputPointers = (dataProduct.data as any).inputs || [];
+
+  if (inputPointers.length === 0) {
+    return {
+      dataProductId: params.dataProductId,
+      dataProductVersion: params.dataProductVersion,
+      message: 'No inputs found for this data product',
+      inputs: [],
+    };
+  }
+
+  // Fetch all collections that can be inputs (messages, channels, containers, services)
+  const [allEvents, allCommands, allQueries, allChannels, allContainers, allServices] = await Promise.all([
+    getCollection('events'),
+    getCollection('commands'),
+    getCollection('queries'),
+    getCollection('channels'),
+    getCollection('containers'),
+    getCollection('services'),
+  ]);
+
+  const allResources = [...allEvents, ...allCommands, ...allQueries, ...allChannels, ...allContainers, ...allServices];
+
+  // Hydrate inputs by finding matching resources
+  const hydratedInputs = inputPointers
+    .map((pointer: { id: string; version?: string }) => {
+      const matches = getItemsFromCollectionByIdAndSemverOrLatest(allResources, pointer.id, pointer.version);
+      const resource = matches[0];
+      if (!resource) return null;
+
+      return {
+        id: (resource.data as any).id,
+        version: (resource.data as any).version,
+        name: (resource.data as any).name || (resource.data as any).id,
+        summary: (resource.data as any).summary,
+        collection: resource.collection,
+      };
+    })
+    .filter(Boolean);
+
+  return {
+    dataProductId: params.dataProductId,
+    dataProductVersion: params.dataProductVersion,
+    dataProductName: (dataProduct.data as any).name || params.dataProductId,
+    inputs: hydratedInputs,
+    totalCount: hydratedInputs.length,
+  };
+}
+
+/**
+ * Get the outputs (resources produced) for a data product
+ * Returns fully hydrated output resources with their contracts
+ */
+export async function getDataProductOutputs(params: { dataProductId: string; dataProductVersion: string }) {
+  const dataProduct = await getEntry('data-products', `${params.dataProductId}-${params.dataProductVersion}`);
+
+  if (!dataProduct) {
+    return {
+      error: `Data product not found: ${params.dataProductId}-${params.dataProductVersion}`,
+    };
+  }
+
+  const outputPointers = (dataProduct.data as any).outputs || [];
+
+  if (outputPointers.length === 0) {
+    return {
+      dataProductId: params.dataProductId,
+      dataProductVersion: params.dataProductVersion,
+      message: 'No outputs found for this data product',
+      outputs: [],
+    };
+  }
+
+  // Fetch all collections that can be outputs (messages, channels, containers, services)
+  const [allEvents, allCommands, allQueries, allChannels, allContainers, allServices] = await Promise.all([
+    getCollection('events'),
+    getCollection('commands'),
+    getCollection('queries'),
+    getCollection('channels'),
+    getCollection('containers'),
+    getCollection('services'),
+  ]);
+
+  const allResources = [...allEvents, ...allCommands, ...allQueries, ...allChannels, ...allContainers, ...allServices];
+
+  // Hydrate outputs by finding matching resources and including contract info
+  const hydratedOutputs = outputPointers
+    .map((pointer: { id: string; version?: string; contract?: { path: string; name: string; type?: string } }) => {
+      const matches = getItemsFromCollectionByIdAndSemverOrLatest(allResources, pointer.id, pointer.version);
+      const resource = matches[0];
+      if (!resource) return null;
+
+      const result: any = {
+        id: (resource.data as any).id,
+        version: (resource.data as any).version,
+        name: (resource.data as any).name || (resource.data as any).id,
+        summary: (resource.data as any).summary,
+        collection: resource.collection,
+      };
+
+      // Include contract information if present
+      if (pointer.contract) {
+        const absoluteContractPath = getAbsoluteFilePathForAstroFile(dataProduct.filePath ?? '', pointer.contract.path);
+        let contractContent: string | null = null;
+
+        try {
+          contractContent = fs.readFileSync(absoluteContractPath, 'utf-8');
+        } catch {
+          // File may not be accessible
+        }
+
+        result.contract = {
+          name: pointer.contract.name,
+          path: pointer.contract.path,
+          format: getSchemaFormatFromURL(pointer.contract.path),
+          type: pointer.contract.type,
+          content: contractContent,
+        };
+      }
+
+      return result;
+    })
+    .filter(Boolean);
+
+  return {
+    dataProductId: params.dataProductId,
+    dataProductVersion: params.dataProductVersion,
+    dataProductName: (dataProduct.data as any).name || params.dataProductId,
+    outputs: hydratedOutputs,
+    totalCount: hydratedOutputs.length,
+  };
+}
+
 // ============================================
 // Tool metadata (descriptions)
 // ============================================
@@ -687,4 +850,8 @@ export const toolDescriptions = {
     'Use this tool when a user shares a schema file (Avro, JSON Schema, Protobuf) and wants to find it in EventCatalog. Look for "x-eventcatalog-id" and "x-eventcatalog-version" in the schema - these may be properties in the schema OR in comments (e.g. // x-eventcatalog-id: OrderCreated). Pass the id as messageId. If version exists, pass it as messageVersion, otherwise omit it to get the latest version. Returns the message resource along with its producers and consumers.',
   explainUbiquitousLanguageTerms:
     'Use this tool to explain ubiquitous language terms from Domain-Driven Design for a specific domain. Returns the glossary of terms defined for the domain and its subdomains, including duplicate term detection.',
+  getDataProductInputs:
+    'Use this tool to get the inputs (resources consumed) for a data product. Returns fully hydrated input resources with their id, version, name, summary, and collection type.',
+  getDataProductOutputs:
+    'Use this tool to get the outputs (resources produced) for a data product. Returns fully hydrated output resources with their id, version, name, summary, collection type, and data contracts (if defined). Data contracts include the contract name, path, format, type, and content.',
 };

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

@@ -11,14 +11,16 @@ export class Page extends HybridPage {
   static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
     const { getFlows } = await import('@utils/collections/flows');
     const { getServices } = await import('@utils/collections/services');
+    const { getDataProducts } = await import('@utils/collections/data-products');
 
     const loaders = {
       ...pageDataLoader,
       flows: getFlows,
       services: getServices,
+      'data-products': getDataProducts,
     };
 
-    const itemTypes = ['events', 'commands', 'queries', 'domains', 'services', 'flows', 'containers'] as const;
+    const itemTypes = ['events', 'commands', 'queries', 'domains', 'services', 'flows', 'containers', 'data-products'] as const;
     const allItems = await Promise.all(itemTypes.map((type) => loaders[type]()));
 
     return allItems.flatMap((items, index) => ({
@@ -41,11 +43,13 @@ export class Page extends HybridPage {
 
     const { getFlows } = await import('@utils/collections/flows');
     const { getServices } = await import('@utils/collections/services');
+    const { getDataProducts } = await import('@utils/collections/data-products');
 
     const loaders = {
       ...pageDataLoader,
       flows: getFlows,
       services: getServices,
+      'data-products': getDataProducts,
     };
 
     // @ts-ignore