@eventcatalog/core 4.1.4 → 4.2.0

package/dist/analytics/analytics.cjs

@@ -36,7 +36,7 @@ module.exports = __toCommonJS(analytics_exports);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/analytics.js

@@ -1,7 +1,7 @@
 import {
   raiseEvent
-} from "../chunk-CAYWT7E4.js";
-import "../chunk-TCK7WEEE.js";
+} from "../chunk-J7T5HUHY.js";
+import "../chunk-4FWALA6J.js";
 export {
   raiseEvent
 };

package/dist/analytics/log-build.cjs

@@ -140,7 +140,7 @@ var verifyRequiredFieldsAreInCatalogConfigFile = async (projectDirectory) => {
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/log-build.js

@@ -1,9 +1,9 @@
 import {
   log_build_default
-} from "../chunk-RAB6LGHN.js";
-import "../chunk-CAYWT7E4.js";
+} from "../chunk-47LY7DY2.js";
+import "../chunk-J7T5HUHY.js";
 import "../chunk-K2XIENVT.js";
-import "../chunk-TCK7WEEE.js";
+import "../chunk-4FWALA6J.js";
 import "../chunk-6QENHZZP.js";
 export {
   log_build_default as default

package/dist/{chunk-RAB6LGHN.js → chunk-47LY7DY2.js}

@@ -1,6 +1,6 @@
 import {
   raiseEvent
-} from "./chunk-CAYWT7E4.js";
+} from "./chunk-J7T5HUHY.js";
 import {
   countResources,
   serializeCounts

package/dist/{chunk-TCK7WEEE.js → chunk-4FWALA6J.js}

@@ -1,5 +1,5 @@
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/{chunk-CAYWT7E4.js → chunk-J7T5HUHY.js}

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-TCK7WEEE.js";
+} from "./chunk-4FWALA6J.js";
 
 // src/analytics/analytics.js
 import os from "os";

package/dist/{chunk-B3HQOT3D.js → chunk-KPDU47YJ.js}

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-TCK7WEEE.js";
+} from "./chunk-4FWALA6J.js";
 
 // src/utils/cli-logger.ts
 import pc from "picocolors";

package/dist/{chunk-ZLQUICJD.js → chunk-QKPPJU43.js}

@@ -1,6 +1,6 @@
 import {
   logger
-} from "./chunk-B3HQOT3D.js";
+} from "./chunk-KPDU47YJ.js";
 import {
   cleanup,
   getEventCatalogConfigFile

package/dist/constants.cjs

@@ -25,7 +25,7 @@ __export(constants_exports, {
 module.exports = __toCommonJS(constants_exports);
 
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/constants.js

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-TCK7WEEE.js";
+} from "./chunk-4FWALA6J.js";
 export {
   VERSION
 };

package/dist/eventcatalog.cjs

@@ -144,7 +144,7 @@ var verifyRequiredFieldsAreInCatalogConfigFile = async (projectDirectory) => {
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/eventcatalog.js

@@ -1,16 +1,16 @@
 import {
   log_build_default
-} from "./chunk-RAB6LGHN.js";
+} from "./chunk-47LY7DY2.js";
 import {
   runMigrations
 } from "./chunk-XUAF2H54.js";
 import "./chunk-CA4U2JP7.js";
 import {
   generate
-} from "./chunk-ZLQUICJD.js";
+} from "./chunk-QKPPJU43.js";
 import {
   logger
-} from "./chunk-B3HQOT3D.js";
+} from "./chunk-KPDU47YJ.js";
 import {
   resolve_catalog_dependencies_default
 } from "./chunk-LHR4G2UO.js";
@@ -20,7 +20,7 @@ import {
 import {
   watch
 } from "./chunk-CAJUIMDJ.js";
-import "./chunk-CAYWT7E4.js";
+import "./chunk-J7T5HUHY.js";
 import "./chunk-K2XIENVT.js";
 import {
   catalogToAstro
@@ -28,7 +28,7 @@ import {
 import "./chunk-W5JQON7Z.js";
 import {
   VERSION
-} from "./chunk-TCK7WEEE.js";
+} from "./chunk-4FWALA6J.js";
 import {
   linkCoreNodeModules,
   resolveInstalledCoreNodeModules

package/dist/generate.cjs

@@ -108,7 +108,7 @@ var getEventCatalogConfigFile = async (projectDirectory) => {
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/generate.js

@@ -1,8 +1,8 @@
 import {
   generate
-} from "./chunk-ZLQUICJD.js";
-import "./chunk-B3HQOT3D.js";
-import "./chunk-TCK7WEEE.js";
+} from "./chunk-QKPPJU43.js";
+import "./chunk-KPDU47YJ.js";
+import "./chunk-4FWALA6J.js";
 import "./chunk-6QENHZZP.js";
 export {
   generate

package/dist/utils/cli-logger.cjs

@@ -36,7 +36,7 @@ module.exports = __toCommonJS(cli_logger_exports);
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "4.1.4";
+var version = "4.2.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/utils/cli-logger.js

@@ -1,7 +1,7 @@
 import {
   logger
-} from "../chunk-B3HQOT3D.js";
-import "../chunk-TCK7WEEE.js";
+} from "../chunk-KPDU47YJ.js";
+import "../chunk-4FWALA6J.js";
 export {
   logger
 };

package/eventcatalog/public/favicon.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="58 54 1133 1133" role="img" aria-labelledby="t">
+<title id="t">Reading cat logo</title>
+<style>
+  path { fill: #000; }
+  @media (prefers-color-scheme: dark) { path { fill: #fff; } }
+</style>
+<path fill-rule="evenodd" d="M 445 55 c -174.6 0.5 -188.1 0.7 -196.5 2.3 -20.7 4.1 -35.3 8.5 -51 15.3 -66.7 28.8 -114.7 86.9 -130.3 157.9 l -2.6 12 -0.4 371 c -0.2 261 0 373.8 0.8 380.5 4.6 40.7 21.8 79.6 49.8 113 36.8 43.9 89.5 72.4 144.2 77.9 5.9 0.6 148.2 1.1 372.5 1.3 345.2 0.3 363.5 0.2 373 -1.5 32.1 -5.7 58.7 -16.4 85.5 -34.2 53.2 -35.3 89.1 -93.6 96 -156 0.8 -7.2 1 -114.8 0.8 -381.5 l -0.3 -371.5 -2.2 -10.4 c -7.7 -35.9 -18.8 -61.1 -38.9 -88.2 -9.5 -12.8 -30.7 -34.1 -43.4 -43.5 -34.4 -25.6 -73.7 -40.9 -113.5 -44.3 -12.5 -1.1 -182.7 -1.1 -543.5 -0.1 z m -26.3 152.5 c 30.7 11.6 86.7 67 122.9 121.6 l 8.4 12.6 9.7 -2.3 c 13.3 -3.3 30.3 -6.1 44.8 -7.5 15.1 -1.5 51.8 -0.6 67.5 1.6 10.1 1.4 37.1 6.8 40.5 8.1 0.7 0.3 3.6 -3.4 7.1 -8.8 18.3 -29.1 37.9 -53.5 64.7 -80.7 31.8 -32.2 53.3 -47 68.5 -47.1 10.5 -0 16.2 4.1 22.3 16.1 11.6 23 17.3 80.8 15 153.1 l -1 33.7 6 14.7 c 3.2 8 7.8 20.4 10 27.5 2.3 7.1 4.5 12.9 4.9 12.9 0.4 -0 5 -1.5 10.1 -3.4 29.8 -10.8 61.4 -20.5 89.6 -27.5 20 -5.1 21.5 -5.1 25.9 -0.7 2.9 2.9 3.4 4.1 3.4 7.9 0 3.4 -0.6 5.3 -2.5 7.5 -2.9 3.5 -4.7 4.3 -18 7.7 -23.9 6.3 -83.7 25.2 -103 32.5 -2 0.8 -2 1.2 -1 10.6 0.5 5.3 1.5 9.9 2 10 0.6 0.2 16.8 2.4 36 4.9 69.6 9.1 85.9 11.5 89.4 13.3 10.1 5.1 7.6 20.4 -3.6 21.9 -3.7 0.5 -26.4 -2.1 -63.3 -7.2 -18.4 -2.6 -56.7 -7.5 -58 -7.5 -0.4 -0 -1 0.8 -1.2 1.8 -0.4 1.4 -2.9 2.3 -11.4 4.1 -50.2 10.3 -130.1 33.1 -167.9 47.8 -35.1 13.6 -69.4 33.4 -96.1 55.6 -6.6 5.4 -10.1 7.7 -10.9 7.1 -0.7 -0.5 -5.8 -4.6 -11.5 -9.2 -25 -20.2 -55.1 -37.5 -88.5 -50.7 -39.3 -15.6 -111.9 -36.5 -170.7 -49.1 -15.1 -3.2 -17.8 -4.1 -17.8 -5.6 0 -2.4 0.4 -2.4 -35 2.2 -16.8 2.2 -42.6 5.7 -57.5 7.6 -14.8 2 -28.8 3.3 -31 3 -5.9 -0.7 -9.5 -5.1 -9.5 -11.5 0 -5.7 2.4 -9.4 7.3 -11 3.2 -1.1 62.2 -9.4 103.2 -14.6 11.6 -1.5 21.3 -3 21.7 -3.3 0.3 -0.4 0.9 -5 1.3 -10.3 l 0.7 -9.6 -30.3 -10.1 c -24.9 -8.3 -73.2 -22.8 -85.2 -25.6 -1.5 -0.4 -4.1 -1.9 -5.8 -3.4 -2.6 -2.3 -3.3 -3.8 -3.7 -8 -0.4 -4.7 -0.2 -5.4 2.5 -8.1 1.7 -1.6 4.3 -3.3 5.8 -3.7 5.8 -1.4 46 9.3 88.5 23.7 16.2 5.5 30.3 10.3 31.2 10.6 1 0.3 2 -0.1 2.2 -0.8 4.6 -14.9 9 -27.2 14 -39.4 l 6.2 -15 -1 -32.5 c -1.5 -48.5 0.9 -93.8 6.4 -122.4 5 -25.8 12 -40.4 21.9 -45.6 5.4 -2.9 15.3 -2.6 23.8 0.5 z m -67.6 364.4 c 81.9 16.7 161.5 40.4 199.3 59.3 11.7 5.9 29.8 16.7 34.1 20.3 l 3 2.6 -9.5 -0.4 c -8.7 -0.4 -15.5 -2.1 -78.5 -19.7 -37.9 -10.6 -76 -21.2 -84.5 -23.5 -56.6 -15.7 -123.4 -34.6 -123.8 -35 -0.6 -0.6 13.5 -2.8 37.3 -5.8 6.4 -0.8 8.6 -0.6 22.6 2.2 z m 589.5 -0.4 c 10.4 1.4 20.4 2.8 22.3 3.2 3.4 0.6 -40.5 13.5 -170.9 50.2 -20.1 5.7 -42.6 12 -50 14.1 -50.1 14.2 -53.5 15 -60.8 15 -4 -0 -7.2 -0.3 -7.2 -0.8 0 -2.1 28.9 -19.2 45.8 -27.1 36.1 -16.7 110.6 -38.3 193.2 -55.9 6.6 -1.4 7.1 -1.4 27.6 1.3 z m -672.2 33.1 c 13.2 3.6 31.1 8.5 39.6 10.9 8.5 2.4 35.3 9.8 59.5 16.4 52.5 14.3 120.5 33 167.5 46.1 22.9 6.3 23.5 6.6 24.9 9.6 0.8 1.8 1.1 45.6 1.1 162.2 0 175.7 0.4 164.2 -5.9 164.2 -1.5 -0 -12.4 -2.7 -24.2 -6.1 -20.6 -5.8 -66.3 -18.6 -188.9 -52.7 -31.6 -8.8 -63.1 -17.5 -70 -19.2 -13 -3.3 -16.3 -4.8 -17.9 -7.8 -1.1 -2.1 -7.2 -104.7 -15.6 -262.7 -1.3 -25.9 -2.7 -50.5 -3.1 -54.7 -0.6 -7.3 -0.5 -7.8 2 -10.2 1.4 -1.5 3.5 -2.6 4.7 -2.6 1.2 -0 13 3 26.3 6.6 z m 748.1 -5.6 c 3.9 1.5 4.4 4.2 3.4 19.5 -0.8 12.4 -4.2 70.9 -15 256 -2.6 46 -3.3 53.3 -4.8 55.5 -1.9 2.6 1.3 1.6 -78.6 23.9 -9.9 2.8 -34.2 9.6 -54 15.1 -19.8 5.6 -50.4 14.1 -68 19 -17.6 4.9 -45.7 12.8 -62.5 17.5 -16.7 4.7 -31.7 8.5 -33.2 8.5 -6.3 -0 -5.9 11.3 -5.6 -165.1 0.2 -88.2 0.7 -161.2 1.2 -162.1 0.9 -1.9 4.6 -3.1 32.6 -10.7 10.2 -2.8 25.9 -7.1 35 -9.6 9.1 -2.5 32 -8.9 51 -14.1 47.4 -13.1 124.2 -34.5 168.5 -46.9 14.3 -4 26.3 -7.4 26.7 -7.4 0.4 -0.1 1.8 0.3 3.3 0.9 z m -351.7 95.3 c 0.9 0.7 1.2 35.1 1.2 166.7 l 0 165.9 -2.2 1.3 c -1.8 1 -10.2 1.3 -35.1 1.3 -31.4 -0 -32.9 -0.1 -34.3 -1.9 -2.1 -2.9 -2.1 -330.7 0 -332.8 1.1 -1.2 7.6 -1.4 35.2 -1.4 18.7 0.1 34.5 0.5 35.2 0.9 z"/>
+</svg>

package/eventcatalog/src/components/Lineage/LineageScenarioSwitcher.tsx

@@ -0,0 +1,65 @@
+import { CheckIcon, ChevronDownIcon } from '@heroicons/react/20/solid';
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { useState } from 'react';
+
+interface Props {
+  conditions: string[];
+}
+
+export default function LineageScenarioSwitcher({ conditions }: Props) {
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  const selectedCondition = conditions[selectedIndex];
+
+  return (
+    <DropdownMenu.Root>
+      <DropdownMenu.Trigger asChild>
+        <button
+          type="button"
+          className="group inline-flex max-w-full items-center gap-1.5 rounded-md border border-[rgb(var(--ec-dropdown-border)/0.8)] bg-[rgb(var(--ec-dropdown-bg))] px-2 py-1 align-middle text-sm font-semibold text-[rgb(var(--ec-page-text))] shadow-sm transition-colors hover:border-[rgb(var(--ec-accent)/0.5)] hover:bg-[rgb(var(--ec-dropdown-hover))] focus:outline-hidden focus:ring-2 focus:ring-[rgb(var(--ec-accent)/0.3)]"
+          aria-label={`Select scenario. Scenario ${selectedIndex + 1} of ${conditions.length}: ${selectedCondition}`}
+        >
+          <span className="min-w-0 max-w-xl truncate">{selectedCondition}</span>
+          <span className="shrink-0 rounded bg-[rgb(var(--ec-accent-subtle))] px-1.5 py-0.5 text-[10px] font-semibold tabular-nums text-[rgb(var(--ec-accent-text))]">
+            {selectedIndex + 1}/{conditions.length}
+          </span>
+          <ChevronDownIcon className="h-3.5 w-3.5 shrink-0 text-[rgb(var(--ec-page-text-muted))] transition-transform group-data-[state=open]:rotate-180" />
+        </button>
+      </DropdownMenu.Trigger>
+
+      <DropdownMenu.Portal>
+        <DropdownMenu.Content
+          align="start"
+          sideOffset={6}
+          collisionPadding={12}
+          className="z-[1000] max-h-80 w-[min(36rem,calc(100vw-1.5rem))] overflow-y-auto rounded-xl border border-[rgb(var(--ec-dropdown-border)/0.8)] bg-[rgb(var(--ec-dropdown-bg))] p-1.5 shadow-[0_20px_56px_rgb(0_0_0/0.22)]"
+        >
+          <div className="px-2.5 pb-2 pt-1.5">
+            <p className="text-xs font-semibold text-[rgb(var(--ec-dropdown-text))]">Choose a scenario</p>
+            <p className="pt-0.5 text-[11px] font-normal text-[rgb(var(--ec-page-text-muted))]">
+              This message path is shared by {conditions.length} conditions.
+            </p>
+          </div>
+          <DropdownMenu.Separator className="mb-1 h-px bg-[rgb(var(--ec-dropdown-border)/0.7)]" />
+          <DropdownMenu.RadioGroup value={String(selectedIndex)} onValueChange={(value) => setSelectedIndex(Number(value))}>
+            {conditions.map((condition, index) => (
+              <DropdownMenu.RadioItem
+                key={`${condition}-${index}`}
+                value={String(index)}
+                className="relative flex cursor-pointer select-none items-start gap-2.5 rounded-lg px-2.5 py-2 pr-9 text-sm font-normal leading-5 text-[rgb(var(--ec-dropdown-text))] outline-hidden transition-colors data-[highlighted]:bg-[rgb(var(--ec-dropdown-hover))]"
+              >
+                <span className="mt-0.5 flex h-5 min-w-5 items-center justify-center rounded-md bg-[rgb(var(--ec-accent-subtle))] px-1 text-[10px] font-semibold tabular-nums text-[rgb(var(--ec-accent-text))]">
+                  {index + 1}
+                </span>
+                <span>{condition}</span>
+                <DropdownMenu.ItemIndicator className="absolute right-2.5 top-2.5 text-[rgb(var(--ec-accent))]">
+                  <CheckIcon className="h-4 w-4" />
+                </DropdownMenu.ItemIndicator>
+              </DropdownMenu.RadioItem>
+            ))}
+          </DropdownMenu.RadioGroup>
+          <DropdownMenu.Arrow className="fill-[rgb(var(--ec-dropdown-bg))]" />
+        </DropdownMenu.Content>
+      </DropdownMenu.Portal>
+    </DropdownMenu.Root>
+  );
+}

package/eventcatalog/src/components/Seo.astro

@@ -25,7 +25,11 @@ if (typeof _image === 'string') {
 <meta charset="UTF-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <meta name="viewport" content="width=device-width" />
-<link rel="icon" type="image/png" href={buildUrl('/logo.png', true)} />
+<link rel="icon" href={buildUrl('/favicon.ico', true)} sizes="any" />
+<link rel="icon" type="image/svg+xml" href={buildUrl('/favicon.svg', true)} />
+<link rel="icon" type="image/png" sizes="32x32" href={buildUrl('/favicon-32x32.png', true)} />
+<link rel="icon" type="image/png" sizes="16x16" href={buildUrl('/favicon-16x16.png', true)} />
+<link rel="apple-touch-icon" href={buildUrl('/apple-touch-icon.png', true)} />
 
 <SEO
   title={title}

package/eventcatalog/src/content.config.ts

@@ -87,11 +87,18 @@ const sendsPointer = z.object({
     .optional(),
 });
 
+const triggersPointer = z.object({
+  id: z.string(),
+  version: z.string().optional().default('latest'),
+  condition: z.string().optional(),
+});
+
 const receivesPointer = z.object({
   id: z.string(),
   version: z.string().optional().default('latest'),
   fields: z.array(z.string()).optional(),
   group: z.string().optional(),
+  triggers: z.array(triggersPointer).optional(),
   from: z
     .array(
       z.object({
@@ -355,6 +362,8 @@ const operationSchema = z
 const messageDetailsPanelPropertySchema = z.object({
   producers: detailPanelPropertySchema.optional(),
   consumers: detailPanelPropertySchema.optional(),
+  triggers: detailPanelPropertySchema.optional(),
+  triggeredBy: detailPanelPropertySchema.optional(),
   channels: detailPanelPropertySchema.optional(),
   versions: detailPanelPropertySchema.optional(),
   repository: detailPanelPropertySchema.optional(),

package/eventcatalog/src/enterprise/auth/error.astro

@@ -21,7 +21,9 @@ const errorMessage = errorMessages[error] || errorMessages.Default;
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width" />
-    <link rel="icon" type="image/png" href="/logo.png" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
     <meta name="generator" content={Astro.generator} />
     <title>Authentication Error - EventCatalog</title>
   </head>

package/eventcatalog/src/enterprise/auth/login.astro

@@ -102,7 +102,9 @@ const providerConfig = {
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width" />
-    <link rel="icon" type="image/png" href="/logo.png" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
     <meta name="generator" content={Astro.generator} />
     <title>Sign In | {title}</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />

package/eventcatalog/src/pages/studio.astro

@@ -42,7 +42,9 @@ const hasResources = resourcesToShow.length > 0;
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width" />
-    <link rel="icon" type="image/png" href="/logo.png" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
     <meta name="generator" content={Astro.generator} />
     <title>EventCatalog Studio</title>
   </head>

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

@@ -0,0 +1,66 @@
+import { getCollection, type CollectionEntry } from 'astro:content';
+import { getMessagesWithTriggerPaths, type MessageReceiver } from '@utils/collections/message-triggers';
+import { isSSR } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+import type { CollectionMessageTypes } from '@types';
+
+const MESSAGE_TYPES: CollectionMessageTypes[] = ['events', 'commands', 'queries'];
+
+const loadTriggerPathResources = async () => {
+  const { pageDataLoader } = await import('@utils/page-loaders/page-data-loader');
+  const [messageCollections, services, agents, domains] = await Promise.all([
+    Promise.all(MESSAGE_TYPES.map((type) => pageDataLoader[type]())),
+    getCollection('services'),
+    getCollection('agents'),
+    getCollection('domains'),
+  ]);
+
+  return {
+    allMessages: messageCollections.flat() as CollectionEntry<CollectionMessageTypes>[],
+    receivers: [...services, ...agents, ...domains] as MessageReceiver[],
+  };
+};
+
+export class Page extends HybridPage {
+  static get prerender(): boolean {
+    return !isSSR();
+  }
+
+  static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
+    if (isSSR()) return [];
+
+    const { allMessages, receivers } = await loadTriggerPathResources();
+    const messagesWithTriggerPaths = getMessagesWithTriggerPaths(receivers, allMessages);
+
+    return messagesWithTriggerPaths.map((item) => ({
+      params: {
+        type: item.collection,
+        id: item.data.id,
+        version: item.data.version,
+      },
+      props: {
+        type: item.collection,
+        ...item,
+      },
+    }));
+  }
+
+  protected static async fetchData(params: any) {
+    const { type, id, version } = params;
+    if (!type || !id || !version || !MESSAGE_TYPES.includes(type)) return null;
+
+    const { allMessages, receivers } = await loadTriggerPathResources();
+    const item = allMessages.find((entry) => entry.collection === type && entry.data.id === id && entry.data.version === version);
+    if (!item) return null;
+
+    const hasTriggerPaths = getMessagesWithTriggerPaths(receivers, allMessages).includes(item);
+    return hasTriggerPaths ? { type, ...item } : null;
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'Message trigger paths not found',
+    });
+  }
+}

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

@@ -0,0 +1,201 @@
+---
+import { getCollection, type CollectionEntry } from 'astro:content';
+
+import LineageScenarioSwitcher from '@components/Lineage/LineageScenarioSwitcher';
+import AstroNodeGraph from '@components/MDX/NodeGraph/AstroNodeGraph';
+import ResourceRef from '@components/MDX/ResourceRef/ResourceRef.astro';
+import Footer from '@layouts/Footer.astro';
+import VerticalSideBarLayout from '@layouts/VerticalSideBarLayout.astro';
+import { getTriggeredByOfMessage, getTriggersOfMessage, type MessageReceiver } from '@utils/collections/message-triggers';
+import { buildMessageLineageGraph, groupMessageLineageGraphs } from '@utils/node-graphs/message-lineage';
+import type { CollectionMessageTypes } from '@types';
+
+import { Page } from './_index.data';
+
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
+
+const props = await Page.getData(Astro);
+const { data } = props as CollectionEntry<CollectionMessageTypes>;
+const currentMessage = props as CollectionEntry<CollectionMessageTypes>;
+
+const [events, commands, queries, services, agents, domains] = await Promise.all([
+  getCollection('events'),
+  getCollection('commands'),
+  getCollection('queries'),
+  getCollection('services'),
+  getCollection('agents'),
+  getCollection('domains'),
+]);
+
+const allMessages = [...events, ...commands, ...queries] as CollectionEntry<CollectionMessageTypes>[];
+const receivers = [...services, ...agents, ...domains] as MessageReceiver[];
+
+const triggeredByRows = groupMessageLineageGraphs(
+  getTriggeredByOfMessage(receivers, currentMessage, allMessages).map((relation) =>
+    buildMessageLineageGraph({ currentMessage, relation, direction: 'triggeredBy' })
+  )
+);
+const triggerRows = groupMessageLineageGraphs(
+  getTriggersOfMessage(receivers, currentMessage, allMessages).map((relation) =>
+    buildMessageLineageGraph({ currentMessage, relation, direction: 'triggers' })
+  )
+);
+
+const resourceTypeByCollection = {
+  events: 'event',
+  commands: 'command',
+  queries: 'query',
+  services: 'service',
+  domains: 'domain',
+  agents: 'agent',
+} as const;
+const resourceType = (resource: CollectionEntry<CollectionMessageTypes> | MessageReceiver) =>
+  resourceTypeByCollection[resource.collection];
+const conditionText = (condition: string) => condition.replace(/^when\s+/i, '');
+const scenarioConditions = (row: (typeof triggeredByRows)[number]) =>
+  row.scenarios.map(({ condition }) => (condition ? conditionText(condition) : 'No condition specified'));
+---
+
+<VerticalSideBarLayout title={`Trigger paths | ${data.name}`} description={`Message trigger paths for ${data.name}`}>
+  <main class="w-full min-h-full bg-[rgb(var(--ec-page-bg))] py-8">
+    <header class="border-b border-[rgb(var(--ec-page-border))] py-5">
+      <div class="text-sm font-semibold text-[rgb(var(--ec-accent))]">Trigger paths</div>
+      <h1 class="pt-3 text-2xl md:text-4xl font-bold text-[rgb(var(--ec-page-text))]">{data.name}</h1>
+      <p class="pt-3 text-base text-[rgb(var(--ec-page-text-muted))] font-light">
+        Explore the direct messages that trigger this message and the messages it can trigger.
+      </p>
+    </header>
+
+    <div class="space-y-10 py-8">
+      {
+        triggeredByRows.length > 0 && (
+          <section aria-labelledby="triggered-by-heading">
+            <div class="space-y-5">
+              {triggeredByRows.map((row, index) => (
+                <article class="lineage-row overflow-hidden rounded-xl border border-[rgb(var(--ec-page-border))] bg-[rgb(var(--ec-card-bg))] shadow-sm">
+                  <div class="border-b border-[rgb(var(--ec-page-border))] px-5 py-4">
+                    <h3 class="text-sm md:text-base font-medium text-[rgb(var(--ec-page-text))]">
+                      <ResourceRef type={resourceType(row.target)} version={row.target.data.version}>
+                        {row.target.data.id}
+                      </ResourceRef>{' '}
+                      is triggered by{' '}
+                      <ResourceRef type={resourceType(row.source)} version={row.source.data.version}>
+                        {row.source.data.id}
+                      </ResourceRef>
+                      {row.scenarios.length === 1 && row.scenarios[0].condition && (
+                        <>
+                          {' '}
+                          when <span class="font-semibold">{conditionText(row.scenarios[0].condition)}</span>
+                        </>
+                      )}
+                      {row.scenarios.length > 1 && (
+                        <>
+                          {' '}
+                          when <LineageScenarioSwitcher client:visible conditions={scenarioConditions(row)} />
+                        </>
+                      )}{' '}
+                      via{' '}
+                      <ResourceRef type={resourceType(row.receiver)} version={row.receiver.data.version}>
+                        {row.receiver.data.id}
+                      </ResourceRef>
+                    </h3>
+                  </div>
+                  <div
+                    id={`${data.id}-triggered-by-${index}-portal`}
+                    class="lineage-graph h-[250px] w-full bg-[rgb(var(--ec-page-bg))]"
+                  />
+                  <AstroNodeGraph
+                    client:only="react"
+                    id={`${data.id}-triggered-by-${index}`}
+                    portalId={`${data.id}-triggered-by-${index}-portal`}
+                    nodes={row.nodes}
+                    edges={row.edges}
+                    mode="simple"
+                    linkTo="docs"
+                    includeKey={false}
+                    showSearch={false}
+                    zoomOnScroll={false}
+                    disableMessageAnimation={true}
+                  />
+                </article>
+              ))}
+            </div>
+          </section>
+        )
+      }
+
+      {
+        triggerRows.length > 0 && (
+          <section aria-label="Messages triggered by this message">
+            <div class="space-y-5">
+              {triggerRows.map((row, index) => (
+                <article class="lineage-row overflow-hidden rounded-xl border border-[rgb(var(--ec-page-border))] bg-[rgb(var(--ec-card-bg))] shadow-sm">
+                  <div class="border-b border-[rgb(var(--ec-page-border))] px-5 py-4">
+                    <h3 class="text-sm md:text-base font-medium text-[rgb(var(--ec-page-text))]">
+                      <ResourceRef type={resourceType(row.target)} version={row.target.data.version}>
+                        {row.target.data.id}
+                      </ResourceRef>{' '}
+                      is triggered by{' '}
+                      <ResourceRef type={resourceType(row.source)} version={row.source.data.version}>
+                        {row.source.data.id}
+                      </ResourceRef>
+                      {row.scenarios.length === 1 && row.scenarios[0].condition && (
+                        <>
+                          {' '}
+                          when <span class="font-semibold">{conditionText(row.scenarios[0].condition)}</span>
+                        </>
+                      )}
+                      {row.scenarios.length > 1 && (
+                        <>
+                          {' '}
+                          when <LineageScenarioSwitcher client:visible conditions={scenarioConditions(row)} />
+                        </>
+                      )}{' '}
+                      via{' '}
+                      <ResourceRef type={resourceType(row.receiver)} version={row.receiver.data.version}>
+                        {row.receiver.data.id}
+                      </ResourceRef>
+                    </h3>
+                  </div>
+                  <div
+                    id={`${data.id}-triggers-${index}-portal`}
+                    class="lineage-graph h-[250px] w-full bg-[rgb(var(--ec-page-bg))]"
+                  />
+                  <AstroNodeGraph
+                    client:only="react"
+                    id={`${data.id}-triggers-${index}`}
+                    portalId={`${data.id}-triggers-${index}-portal`}
+                    nodes={row.nodes}
+                    edges={row.edges}
+                    mode="simple"
+                    linkTo="docs"
+                    includeKey={false}
+                    showSearch={false}
+                    zoomOnScroll={false}
+                    disableMessageAnimation={true}
+                  />
+                </article>
+              ))}
+            </div>
+          </section>
+        )
+      }
+    </div>
+
+    <Footer />
+  </main>
+</VerticalSideBarLayout>
+
+<style is:global>
+  .lineage-row {
+    content-visibility: auto;
+    contain-intrinsic-size: 330px;
+  }
+
+  .lineage-graph .react-flow__panel.top,
+  .lineage-graph .react-flow__controls,
+  .lineage-graph .react-flow__attribution {
+    display: none;
+  }
+</style>