@eventcatalog/core 3.41.4 → 3.43.0

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

@@ -6,10 +6,12 @@ import {
   getFacetedUniqueValues,
   getFilteredRowModel,
   getPaginationRowModel,
+  getSortedRowModel,
   useReactTable,
   type ColumnFiltersState,
+  type SortingState,
 } from '@tanstack/react-table';
-import { ChevronLeft, ChevronRight, SearchX, X, Search, Users } from 'lucide-react';
+import { ArrowDown, ArrowUp, ArrowUpDown, ChevronLeft, ChevronRight, SearchX, X, Search, Users } from 'lucide-react';
 import { UserIcon } from '@heroicons/react/24/outline';
 import { useEffect, useMemo, useState } from 'react';
 import type { TableConfiguration } from '@types';
@@ -17,12 +19,14 @@ import { isSameVersion } from '@utils/collections/version-compare';
 import { resolveIconUrl } from '@utils/icon';
 import { FilterDropdown, CheckboxItem } from './FilterComponents';
 import { getDiscoverColumns } from './columns';
+import { formatAdrStatus, type AdrStatus } from '@utils/collections/adr-constants';
 
 export type CollectionType =
   | 'agents'
   | 'events'
   | 'commands'
   | 'queries'
+  | 'adrs'
   | 'services'
   | 'external-systems'
   | 'domains'
@@ -41,6 +45,8 @@ export interface DiscoverTableData {
   hasDataDependencies?: boolean;
   hasTools?: boolean;
   hasModel?: boolean;
+  hasAppliesTo?: boolean;
+  hasDecisionMakers?: boolean;
   hasInputs?: boolean;
   hasOutputs?: boolean;
   data: {
@@ -58,6 +64,13 @@ export interface DiscoverTableData {
       textColor?: string;
       url?: string;
     }>;
+    status?: string;
+    date?: string | Date;
+    statusBadge?: {
+      content: string;
+      backgroundColor?: string;
+      textColor?: string;
+    };
     producers?: Array<any>;
     consumers?: Array<any>;
     receives?: Array<any>;
@@ -159,6 +172,7 @@ export function DiscoverTable<T extends DiscoverTableData>({
     [collectionType, tableConfiguration]
   );
   const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
+  const [sorting, setSorting] = useState<SortingState>([]);
   const [tableFilter, setTableFilter] = useState('');
   const PAGE_SIZE_OPTIONS = [10, 25, 50, 100];
   const PAGE_SIZE_STORAGE_KEY = 'eventcatalog-discover-page-size';
@@ -182,6 +196,7 @@ export function DiscoverTable<T extends DiscoverTableData>({
   const [selectedAgentModels, setSelectedAgentModels] = useState<string[]>([]);
   const [selectedBadges, setSelectedBadges] = useState<string[]>([]);
   const [selectedProperties, setSelectedProperties] = useState<string[]>([]);
+  const [selectedStatuses, setSelectedStatuses] = useState<string[]>([]);
 
   // Collect unique badges from all items
   const allBadges = useMemo(() => {
@@ -286,6 +301,14 @@ export function DiscoverTable<T extends DiscoverTableData>({
         }
       }
 
+      // ADR status filter
+      if (selectedStatuses.length > 0) {
+        const status = row.data.status;
+        if (!status || !selectedStatuses.includes(status)) {
+          return false;
+        }
+      }
+
       // Property filters
       if (selectedProperties.length > 0) {
         for (const prop of selectedProperties) {
@@ -364,6 +387,7 @@ export function DiscoverTable<T extends DiscoverTableData>({
     selectedAgentProviders,
     selectedAgentModels,
     selectedBadges,
+    selectedStatuses,
     selectedProperties,
     tableFilter,
   ]);
@@ -378,14 +402,17 @@ export function DiscoverTable<T extends DiscoverTableData>({
     data: filteredData,
     columns,
     onColumnFiltersChange: setColumnFilters,
+    onSortingChange: setSorting,
     getCoreRowModel: getCoreRowModel(),
     getFilteredRowModel: getFilteredRowModel(),
+    getSortedRowModel: getSortedRowModel(),
     getFacetedRowModel: getFacetedRowModel(),
     getFacetedUniqueValues: getFacetedUniqueValues(),
     getFacetedMinMaxValues: getFacetedMinMaxValues(),
     getPaginationRowModel: getPaginationRowModel(),
     state: {
       columnFilters,
+      sorting,
       columnVisibility,
     },
     initialState: {
@@ -468,6 +495,27 @@ export function DiscoverTable<T extends DiscoverTableData>({
     return counts;
   }, [initialData]);
 
+  const statusCounts = useMemo(() => {
+    const counts: Record<string, number> = {};
+    initialData.forEach((item) => {
+      const status = item.data.status;
+      if (status) counts[status] = (counts[status] || 0) + 1;
+    });
+    return counts;
+  }, [initialData]);
+
+  const statusOptions = useMemo(
+    () =>
+      Object.keys(statusCounts)
+        .map((status) => ({
+          id: status,
+          name: formatAdrStatus(status as AdrStatus),
+          count: statusCounts[status],
+        }))
+        .sort((a, b) => a.name.localeCompare(b.name)),
+    [statusCounts]
+  );
+
   const toggleDomain = (domainId: string) => {
     setSelectedDomains((prev) => (prev.includes(domainId) ? prev.filter((id) => id !== domainId) : [...prev, domainId]));
   };
@@ -498,6 +546,10 @@ export function DiscoverTable<T extends DiscoverTableData>({
     setSelectedBadges((prev) => (prev.includes(badgeContent) ? prev.filter((b) => b !== badgeContent) : [...prev, badgeContent]));
   };
 
+  const toggleStatus = (status: string) => {
+    setSelectedStatuses((prev) => (prev.includes(status) ? prev.filter((item) => item !== status) : [...prev, status]));
+  };
+
   const toggleProperty = (propertyId: string) => {
     setSelectedProperties((prev) => (prev.includes(propertyId) ? prev.filter((p) => p !== propertyId) : [...prev, propertyId]));
   };
@@ -510,6 +562,7 @@ export function DiscoverTable<T extends DiscoverTableData>({
     setSelectedAgentProviders([]);
     setSelectedAgentModels([]);
     setSelectedBadges([]);
+    setSelectedStatuses([]);
     setSelectedProperties([]);
     setShowOnlyLatest(true);
     setOnlyShowDrafts(false);
@@ -525,6 +578,7 @@ export function DiscoverTable<T extends DiscoverTableData>({
     selectedAgentProviders.length +
     selectedAgentModels.length +
     selectedBadges.length +
+    selectedStatuses.length +
     selectedProperties.length +
     (!showOnlyLatest ? 1 : 0) +
     (onlyShowDrafts ? 1 : 0);
@@ -545,6 +599,7 @@ export function DiscoverTable<T extends DiscoverTableData>({
     (id) => agentProviders.find((provider) => provider.id === id)?.name || id
   );
   const selectedAgentModelNames = selectedAgentModels.map((id) => agentModels.find((model) => model.id === id)?.name || id);
+  const selectedStatusNames = selectedStatuses.map((id) => statusOptions.find((status) => status.id === id)?.name || id);
 
   // Filter producers/consumers to only show those with count > 0
   const filteredProducers = producers.filter((p) => (producerCounts[p.id] || 0) > 0);
@@ -767,6 +822,32 @@ export function DiscoverTable<T extends DiscoverTableData>({
               </div>
             )}
 
+            {/* ADR Status Filter */}
+            {collectionType === 'adrs' && statusOptions.length > 0 && (
+              <div>
+                <label className="block text-xs font-medium text-[rgb(var(--ec-page-text)/0.8)] mb-1.5">Status</label>
+                <FilterDropdown
+                  label="Select statuses..."
+                  selectedItems={selectedStatusNames}
+                  onClear={() => setSelectedStatuses([])}
+                  onRemoveItem={(name) => {
+                    const status = statusOptions.find((item) => item.name === name);
+                    if (status) toggleStatus(status.id);
+                  }}
+                >
+                  {statusOptions.map((status) => (
+                    <CheckboxItem
+                      key={status.id}
+                      label={status.name}
+                      checked={selectedStatuses.includes(status.id)}
+                      onChange={() => toggleStatus(status.id)}
+                      count={status.count}
+                    />
+                  ))}
+                </FilterDropdown>
+              </div>
+            )}
+
             {/* Badges Filter */}
             {allBadges.length > 0 && (
               <div>
@@ -899,7 +980,24 @@ export function DiscoverTable<T extends DiscoverTableData>({
                         key={`${header.id}`}
                         className="px-4 py-2.5 text-left text-[11px] font-medium text-[rgb(var(--ec-page-text-muted))] uppercase tracking-wider"
                       >
-                        {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}
+                        {header.isPlaceholder ? null : header.column.id === 'date' && header.column.getCanSort() ? (
+                          <button
+                            type="button"
+                            onClick={header.column.getToggleSortingHandler()}
+                            className="flex items-center gap-1.5 rounded-sm text-left uppercase tracking-wider hover:text-[rgb(var(--ec-page-text))] focus:outline-none focus:ring-2 focus:ring-[rgb(var(--ec-accent))]"
+                          >
+                            {flexRender(header.column.columnDef.header, header.getContext())}
+                            {header.column.getIsSorted() === 'asc' ? (
+                              <ArrowUp className="h-3.5 w-3.5" />
+                            ) : header.column.getIsSorted() === 'desc' ? (
+                              <ArrowDown className="h-3.5 w-3.5" />
+                            ) : (
+                              <ArrowUpDown className="h-3.5 w-3.5 opacity-40" />
+                            )}
+                          </button>
+                        ) : (
+                          flexRender(header.column.columnDef.header, header.getContext())
+                        )}
                       </th>
                     ))}
                   </tr>

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

@@ -17,6 +17,7 @@ import { useStore } from '@nanostores/react';
 import { favoritesStore, toggleFavorite, type FavoriteItem } from '../../../stores/favorites-store';
 import type { DiscoverTableData, CollectionType } from './DiscoverTable';
 import type { TableConfiguration } from '@types';
+import { formatAdrDate, isAdrCollection } from '@utils/collections/adr-constants';
 
 const columnHelper = createColumnHelper<DiscoverTableData>();
 
@@ -107,6 +108,7 @@ const createBadgesColumn = (tableConfiguration: TableConfiguration) =>
   columnHelper.accessor((row) => row.data.badges, {
     id: 'badges',
     header: () => <span>{tableConfiguration?.columns?.badges?.label || 'Badges'}</span>,
+    enableSorting: false,
     cell: (info) => <BadgesCell badges={info.getValue() || []} />,
     meta: {
       showFilter: false,
@@ -143,7 +145,7 @@ const RowActionsMenu = ({ item, collectionType }: { item: DiscoverTableData; col
   const favorites = useStore(favoritesStore);
   const href = buildUrl(`/docs/${item.collection}/${item.data.id}/${item.data.version}`);
   const visualiserHref = buildUrl(`/visualiser/${item.collection}/${item.data.id}/${item.data.version}`);
-  const hasVisualiser = true;
+  const hasVisualiser = !isAdrCollection(item.collection);
   const nodeKey = `${item.collection}-${item.data.id}-${item.data.version}`;
   const badgeLabel =
     collectionType === 'external-systems'
@@ -234,6 +236,7 @@ const createActionsColumn = (collectionType: CollectionType, tableConfiguration:
   columnHelper.accessor('data.name', {
     id: 'actions',
     header: () => <span></span>,
+    enableSorting: false,
     cell: (info) => {
       const item = info.row.original;
       return <RowActionsMenu item={item} collectionType={collectionType} />;
@@ -392,6 +395,53 @@ export const getAgentColumns = (tableConfiguration: TableConfiguration) => [
   createActionsColumn('agents', tableConfiguration),
 ];
 
+// ============================================================================
+// ADR COLUMNS
+// ============================================================================
+export const getAdrColumns = (tableConfiguration: TableConfiguration) => [
+  columnHelper.accessor('data.name', {
+    id: 'name',
+    header: () => <span>{tableConfiguration?.columns?.name?.label || 'Decision record'}</span>,
+    cell: (info) => <ResourceNameCell item={info.row.original} />,
+    meta: {
+      filterVariant: 'name',
+    },
+  }),
+  createSummaryColumn(tableConfiguration),
+  columnHelper.accessor('data.statusBadge', {
+    id: 'status',
+    header: () => <span>{tableConfiguration?.columns?.status?.label || 'Status'}</span>,
+    enableSorting: false,
+    cell: (info) => {
+      const badge = info.getValue();
+      if (!badge) return <span className="text-xs text-[rgb(var(--ec-icon-color))]">-</span>;
+      return <BadgesCell badges={[badge]} />;
+    },
+    meta: {
+      showFilter: false,
+    },
+  }),
+  columnHelper.accessor('data.date', {
+    id: 'date',
+    header: () => <span>{tableConfiguration?.columns?.date?.label || 'Date'}</span>,
+    sortingFn: (rowA, rowB) => {
+      const left = rowA.original.data.date ? new Date(rowA.original.data.date).getTime() : 0;
+      const right = rowB.original.data.date ? new Date(rowB.original.data.date).getTime() : 0;
+      return left - right;
+    },
+    cell: (info) => {
+      const date = info.getValue();
+      if (!date) return <span className="text-xs text-[rgb(var(--ec-icon-color))]">-</span>;
+      return <span className="text-[0.8rem] text-[rgb(var(--ec-page-text))]">{formatAdrDate(new Date(date))}</span>;
+    },
+    meta: {
+      showFilter: false,
+    },
+  }),
+  createBadgesColumn(tableConfiguration),
+  createActionsColumn('adrs', tableConfiguration),
+];
+
 // ============================================================================
 // EVENT COLUMNS
 // ============================================================================
@@ -677,6 +727,8 @@ export const getDiscoverColumns = (collectionType: CollectionType, tableConfigur
   switch (collectionType) {
     case 'agents':
       return getAgentColumns(tableConfiguration);
+    case 'adrs':
+      return getAdrColumns(tableConfiguration);
     case 'events':
       return getEventColumns(tableConfiguration);
     case 'commands':

package/eventcatalog/src/content.config.ts

@@ -4,6 +4,7 @@ import { glob } from 'astro/loaders';
 import { glob as globPackage } from 'glob';
 import { v4 as uuidv4 } from 'uuid';
 import { badge, ownerReference } from './content.config-shared-collections';
+import { ADR_STATUS_VALUES } from './utils/collections/adr-constants';
 import fs from 'fs';
 import path from 'path';
 
@@ -550,6 +551,65 @@ const agents = defineCollection({
     .extend(baseSchema.shape),
 });
 
+const adrStatus = z.enum(ADR_STATUS_VALUES);
+
+const adrPointer = z.object({
+  id: z.string(),
+  version: z.string().optional().default('latest'),
+});
+
+const adrResourcePointer = adrPointer.extend({
+  type: z.enum([
+    'agent',
+    'service',
+    'event',
+    'command',
+    'query',
+    'flow',
+    'channel',
+    'domain',
+    'user',
+    'team',
+    'container',
+    'entity',
+    'diagram',
+    'data-product',
+  ]),
+});
+
+const adrs = defineCollection({
+  loader: glob({
+    pattern: withIgnoredBuildArtifacts(['**/adrs/*/index.(md|mdx)', '**/adrs/*/versioned/*/index.(md|mdx)']),
+    base: projectDirBase,
+    generateId: ({ data }) => `${data.id}-${data.version}`,
+  }),
+  schema: z
+    .object({
+      status: adrStatus,
+      date: z.coerce.date(),
+      decisionMakers: z.array(ownerReference).optional(),
+      appliesTo: z.array(adrResourcePointer).optional(),
+      supersedes: z.array(adrPointer).optional(),
+      supersededBy: z.array(adrPointer).optional(),
+      amends: z.array(adrPointer).optional(),
+      amendedBy: z.array(adrPointer).optional(),
+      related: z.array(adrPointer).optional(),
+      detailsPanel: z
+        .object({
+          status: detailPanelPropertySchema.optional(),
+          date: detailPanelPropertySchema.optional(),
+          decisionMakers: detailPanelPropertySchema.optional(),
+          appliesTo: detailPanelPropertySchema.optional(),
+          relationships: detailPanelPropertySchema.optional(),
+          owners: detailPanelPropertySchema.optional(),
+          repository: detailPanelPropertySchema.optional(),
+          changelog: detailPanelPropertySchema.optional(),
+        })
+        .optional(),
+    })
+    .extend(baseSchema.shape),
+});
+
 // 1) Put this near your other enums/utilities
 const containerTypeEnum = z.enum([
   // Core
@@ -915,6 +975,7 @@ export const collections = {
   queries,
   services,
   agents,
+  adrs,
   channels,
   users,
   teams,

package/eventcatalog/src/enterprise/collections/resource-docs-utils.ts

@@ -4,6 +4,7 @@
  */
 
 import { getCollection, type CollectionEntry } from 'astro:content';
+import fs from 'node:fs';
 import path from 'node:path';
 import { coerce, rcompare } from 'semver';
 import { sortVersioned } from '../../utils/collections/util';
@@ -77,6 +78,16 @@ let memoryResourceLookupPromise: Promise<Record<ResourceCollection, ResourceLook
 const normalizePath = (value: string) => value.replace(/\\/g, '/').replace(/^\.\//, '');
 const normalizeTypeName = (value: string) => value.trim().toLowerCase();
 
+const isMissingGeneratedContentFile = (filePath: string) => {
+  const normalizedPath = normalizePath(filePath);
+
+  if (!path.isAbsolute(filePath) && !normalizedPath.startsWith('../')) {
+    return false;
+  }
+
+  return !fs.existsSync(filePath);
+};
+
 const inferOrderFromFilePath = (filePath: string): number | undefined => {
   const normalizedPath = normalizePath(filePath);
   const fileName = normalizedPath.split('/').pop();
@@ -373,6 +384,10 @@ export const getResourceDocs = async (): Promise<ResourceDocEntry[]> => {
         return null;
       }
 
+      if (isMissingGeneratedContentFile(doc.filePath)) {
+        return null;
+      }
+
       const resolvedResource = resolveResourceFromPath(doc.filePath, lookups);
       if (!resolvedResource) {
         return null;
@@ -483,6 +498,10 @@ export const getResourceDocCategories = async (): Promise<ResourceDocCategoryEnt
       continue;
     }
 
+    if (isMissingGeneratedContentFile(category.filePath)) {
+      continue;
+    }
+
     const resolvedResource = resolveResourceFromPath(category.filePath, lookups);
     if (!resolvedResource) {
       continue;

package/eventcatalog/src/layouts/DiscoverLayout.astro

@@ -10,7 +10,8 @@ import { getServices } from '@utils/collections/services';
 import { buildUrl } from '@utils/url-builder';
 import { getQueries } from '@utils/collections/queries';
 import { getContainers } from '@utils/collections/containers';
-import { DatabaseIcon } from 'lucide-react';
+import { BookText, DatabaseIcon } from 'lucide-react';
+import { getAdrs } from '@utils/collections/adrs';
 import { MagnifyingGlassIcon } from '@heroicons/react/20/solid';
 import VerticalSideBarLayout from './VerticalSideBarLayout.astro';
 import Checkbox from '@components/Checkbox.astro';
@@ -23,6 +24,7 @@ const services = await getServices();
 const domains = await getDomains();
 const flows = await getFlows();
 const containers = await getContainers();
+const adrs = await getAdrs();
 export interface Props<T extends TCollectionTypes> {
   title: string;
   subtitle: string;
@@ -85,6 +87,15 @@ const tabs = [
     enabled: domains.length > 0,
     visible: domains.length > 0,
   },
+  {
+    label: `Decision Records (${adrs.length})`,
+    href: buildUrl('/discover/adrs'),
+    isActive: currentPath === '/discover/adrs',
+    icon: BookText,
+    activeColor: 'purple',
+    enabled: adrs.length > 0,
+    visible: adrs.length > 0,
+  },
   {
     label: `Data (${containers.length})`,
     href: buildUrl('/discover/containers'),