@eventcatalog/core 2.37.2 → 2.37.4

package/dist/analytics/analytics.cjs

@@ -37,7 +37,7 @@ var import_axios = __toESM(require("axios"), 1);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "2.37.2";
+var version = "2.37.4";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/analytics.js

@@ -1,7 +1,7 @@
 import {
   raiseEvent
-} from "../chunk-7J7J25A5.js";
-import "../chunk-BXWTM2JX.js";
+} from "../chunk-3K3YK3GK.js";
+import "../chunk-NRW4AZMT.js";
 export {
   raiseEvent
 };

package/dist/analytics/log-build.cjs

@@ -106,7 +106,7 @@ var import_axios = __toESM(require("axios"), 1);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "2.37.2";
+var version = "2.37.4";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/log-build.js

@@ -1,8 +1,8 @@
 import {
   log_build_default
-} from "../chunk-ARZJXJW7.js";
-import "../chunk-7J7J25A5.js";
-import "../chunk-BXWTM2JX.js";
+} from "../chunk-GJX7CKPB.js";
+import "../chunk-3K3YK3GK.js";
+import "../chunk-NRW4AZMT.js";
 import "../chunk-E7TXTI7G.js";
 export {
   log_build_default as default

package/dist/{chunk-7J7J25A5.js → chunk-3K3YK3GK.js}

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-BXWTM2JX.js";
+} from "./chunk-NRW4AZMT.js";
 
 // src/analytics/analytics.js
 import axios from "axios";

package/dist/{chunk-ARZJXJW7.js → chunk-GJX7CKPB.js}

@@ -1,6 +1,6 @@
 import {
   raiseEvent
-} from "./chunk-7J7J25A5.js";
+} from "./chunk-3K3YK3GK.js";
 import {
   getEventCatalogConfigFile,
   verifyRequiredFieldsAreInCatalogConfigFile

package/dist/{chunk-BXWTM2JX.js → chunk-NRW4AZMT.js}

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

package/dist/constants.cjs

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

package/dist/constants.js

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-BXWTM2JX.js";
+} from "./chunk-NRW4AZMT.js";
 export {
   VERSION
 };

package/dist/eventcatalog.cjs

@@ -157,7 +157,7 @@ var import_axios = __toESM(require("axios"), 1);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "2.37.2";
+var version = "2.37.4";
 
 // src/constants.ts
 var VERSION = version;

package/dist/eventcatalog.js

@@ -6,15 +6,15 @@ import {
 } from "./chunk-DCLTVJDP.js";
 import {
   log_build_default
-} from "./chunk-ARZJXJW7.js";
-import "./chunk-7J7J25A5.js";
+} from "./chunk-GJX7CKPB.js";
+import "./chunk-3K3YK3GK.js";
 import {
   catalogToAstro,
   checkAndConvertMdToMdx
 } from "./chunk-SLEMYHTU.js";
 import {
   VERSION
-} from "./chunk-BXWTM2JX.js";
+} from "./chunk-NRW4AZMT.js";
 import {
   isBackstagePluginEnabled,
   isEventCatalogScaleEnabled,

package/eventcatalog/src/components/Lists/ProtocolList.tsx

@@ -1,6 +1,6 @@
 import { Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/react';
 import { ChevronDownIcon } from '@heroicons/react/20/solid';
-import * as ProtocolIcons from '@icons/protocols';
+import { getIconForProtocol } from '@utils/protocols';
 
 import './PillListFlat.styles.css';
 
@@ -21,20 +21,6 @@ interface Props {
   emptyMessage?: string;
 }
 
-const protocolIcons = Object.keys(ProtocolIcons).reduce(
-  (icons, key) => {
-    const iconKey = key as keyof typeof ProtocolIcons;
-    icons[key.toLowerCase()] = ProtocolIcons[iconKey];
-    return icons;
-  },
-  {} as { [key: string]: string }
-);
-
-const getIconForProtocol = (icon: keyof typeof protocolIcons) => {
-  const Icon = protocolIcons[icon];
-  return Icon ? (props: any) => <span {...props} dangerouslySetInnerHTML={{ __html: Icon }} /> : null;
-};
-
 const ProtocolList = ({ title, pills, emptyMessage, color = 'gray', ...props }: Props) => {
   return (
     <div>

package/eventcatalog/src/components/MDX/ChannelInformation/ChannelInformation.tsx

@@ -1,19 +1,5 @@
 import type { CollectionEntry } from 'astro:content';
-import * as ProtocolIcons from '@icons/protocols';
-
-const protocolIcons = Object.keys(ProtocolIcons).reduce(
-  (icons, key) => {
-    const iconKey = key as keyof typeof ProtocolIcons;
-    icons[key.toLowerCase()] = ProtocolIcons[iconKey];
-    return icons;
-  },
-  {} as { [key: string]: string }
-);
-
-const getIconForProtocol = (icon: keyof typeof protocolIcons) => {
-  const Icon = protocolIcons[icon];
-  return Icon ? (props: any) => <span {...props} dangerouslySetInnerHTML={{ __html: Icon }} /> : null;
-};
+import { getIconForProtocol } from '@utils/protocols';
 
 const ChannelParameters = (data: CollectionEntry<'channels'>['data']) => {
   return (
@@ -34,7 +20,7 @@ const ChannelParameters = (data: CollectionEntry<'channels'>['data']) => {
               <span className="font-semibold">{data.protocols.length > 1 ? 'Protocols:' : 'Protocol:'}</span>
               <ul className="space-x-2 flex">
                 {data.protocols.map((protocol) => {
-                  const IconComponent = getIconForProtocol(protocol.toLowerCase() as keyof typeof protocolIcons);
+                  const IconComponent = getIconForProtocol(protocol.toLowerCase());
                   return (
                     <li key={protocol} className=" text-sm flex items-center space-x-1  bg-gray-100 rounded-md px-1">
                       {IconComponent && <IconComponent className="w-4 h-4" />}

package/eventcatalog/src/components/MDX/NodeGraph/Nodes/Channel.tsx

@@ -1,4 +1,3 @@
-import { ArrowsRightLeftIcon } from '@heroicons/react/20/solid';
 import type { CollectionMessageTypes } from '@types';
 import type { CollectionEntry } from 'astro:content';
 import { Handle } from '@xyflow/react';
@@ -22,22 +21,8 @@ function classNames(...classes: any) {
   return classes.filter(Boolean).join(' ');
 }
 
-import * as ProtocolIcons from '@icons/protocols';
 import { LinkIcon } from '@heroicons/react/24/outline';
-
-const protocolIcons = Object.keys(ProtocolIcons).reduce(
-  (icons, key) => {
-    const iconKey = key as keyof typeof ProtocolIcons;
-    icons[key.toLowerCase()] = ProtocolIcons[iconKey];
-    return icons;
-  },
-  {} as { [key: string]: string }
-);
-
-const getIconForProtocol = (icon: keyof typeof protocolIcons) => {
-  const Icon = protocolIcons[icon];
-  return Icon ? (props: any) => <span {...props} dangerouslySetInnerHTML={{ __html: Icon }} /> : null;
-};
+import { getIconForProtocol } from '@utils/protocols';
 
 export default function ChannelNode({ data, sourcePosition, targetPosition }: any) {
   const { mode, channel, source, target } = data as Data;
@@ -50,7 +35,7 @@ export default function ChannelNode({ data, sourcePosition, targetPosition }: an
 
   const SideBarIcon = getIcon(icon);
   const nodeLabel = label || channel?.data?.sidebar?.badge || 'Channel';
-  const fontSize = nodeLabel.length > 10 ? '7px' : '9px';
+  const fontSize = nodeLabel.length > 10 ? '5px' : '9px';
 
   const getAddress = () => {
     const sourceChannel = source.data.channels?.find((channel) => channel.id === id);

package/eventcatalog/src/icons/protocols/azure-eventgrid.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="a20547e5-d6af-456b-afbc-05d22ff8cb9d" x1="4589.72" y1="-5180.02" x2="4589.72" y2="-5184.21" gradientTransform="matrix(0.5, 0, 0, -0.5, -2275.31, -2589.32)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#c69aeb" /><stop offset="1" stop-color="#6f4bb2" /></linearGradient><linearGradient id="a4745f51-5e75-4126-812d-6bb8a5130e16" x1="4587.99" y1="-5188.47" x2="4587.99" y2="-5192.65" href="#a20547e5-d6af-456b-afbc-05d22ff8cb9d" /></defs><title>Icon-integration-215</title><g><g id="b30b0bd5-e4d2-456b-8d49-c2df20200912"><path id="b51878b5-8d50-4b8b-bc48-74f5f7315a99" d="M12.7,8.15v-.6H8.18L6.06,9.66H4.5L8.12,6h2.47V5.43H7.87L3.65,9.66h-.6v.6H4.86L7,12.37H12.1v-.6H7.22L5.71,10.26H9.38v-.6H6.92l1.5-1.51Z" fill="#32bedd" /><circle id="ad0ed4eb-cd5f-4cc0-bd19-2830d27ec806" cx="9.98" cy="9.96" r="0.87" fill="#fff" /><circle id="a2746b4a-0ae4-4308-876e-5b82657e1872" cx="10.89" cy="5.74" r="0.87" fill="#fff" /><circle id="fc3316e0-7094-4ce0-99ed-43f1e6e4350c" cx="13" cy="7.85" r="0.87" fill="#fff" /><circle id="b5d18443-d50e-4590-8e8f-80b6a7f6d348" cx="12.1" cy="12.07" r="0.87" fill="#fff" /><circle cx="10.86" cy="5.74" r="1.05" fill="#50e6ff" /><circle cx="12.97" cy="7.85" r="1.05" fill="url(#a20547e5-d6af-456b-afbc-05d22ff8cb9d)" /><circle cx="12.1" cy="12.07" r="1.05" fill="url(#a4745f51-5e75-4126-812d-6bb8a5130e16)" /><circle cx="9.98" cy="9.96" r="1.05" fill="#50e6ff" /><g><path d="M1.07,1.43H2.36a0,0,0,0,1,0,0V5a.29.29,0,0,1-.29.29H.79A.29.29,0,0,1,.5,5V2A.57.57,0,0,1,1.07,1.43Z" fill="#999" /><path d="M1.07,1.43H2.36a0,0,0,0,1,0,0V5a.29.29,0,0,1-.29.29H.79A.29.29,0,0,1,.5,5V2A.57.57,0,0,1,1.07,1.43Z" fill="#999" opacity="0.5" /></g><g><path d="M15.64,1.43h1.29A.57.57,0,0,1,17.5,2V5a.29.29,0,0,1-.29.29H15.92A.29.29,0,0,1,15.64,5V1.43A0,0,0,0,1,15.64,1.43Z" fill="#999" /><path d="M15.64,1.43h1.29A.57.57,0,0,1,17.5,2V5a.29.29,0,0,1-.29.29H15.92A.29.29,0,0,1,15.64,5V1.43A0,0,0,0,1,15.64,1.43Z" fill="#999" opacity="0.5" /></g><path d="M8.66-6.16H9.91a0,0,0,0,1,0,0v17a0,0,0,0,1,0,0H8.66a.57.57,0,0,1-.57-.57V-5.6A.57.57,0,0,1,8.66-6.16Z" transform="translate(11.34 -6.66) rotate(90)" fill="#949494" /><g><path d="M.79,12.68H2.08a.29.29,0,0,1,.29.29v3.6a0,0,0,0,1,0,0H1.07A.57.57,0,0,1,.5,16V13A.29.29,0,0,1,.79,12.68Z" fill="#999" /><path d="M.79,12.68H2.08a.29.29,0,0,1,.29.29v3.6a0,0,0,0,1,0,0H1.07A.57.57,0,0,1,.5,16V13A.29.29,0,0,1,.79,12.68Z" fill="#999" opacity="0.5" /></g><g><path d="M15.92,12.68h1.29a.29.29,0,0,1,.29.29v3a.57.57,0,0,1-.57.57H15.64a0,0,0,0,1,0,0V13A.29.29,0,0,1,15.92,12.68Z" fill="#999" /><path d="M15.92,12.68h1.29a.29.29,0,0,1,.29.29v3a.57.57,0,0,1-.57.57H15.64a0,0,0,0,1,0,0V13A.29.29,0,0,1,15.92,12.68Z" fill="#999" opacity="0.5" /></g><path d="M8.66,7.16H9.91a0,0,0,0,1,0,0v17a0,0,0,0,1,0,0H8.66a.57.57,0,0,1-.57-.57V7.73A.57.57,0,0,1,8.66,7.16Z" transform="translate(-6.66 24.66) rotate(-90)" fill="#949494" /></g></g></svg>

package/eventcatalog/src/icons/protocols/azure-eventhubs.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><title>Icon-analytics-144</title><g><g id="a53a4de8-371c-49da-a662-c4631299fc03"><path d="M10.83,8.42a.26.26,0,0,1-.24.27H8.5a.26.26,0,0,1-.27-.24V6.89a.26.26,0,0,1,.24-.27h2.09a.26.26,0,0,1,.27.24V8.42Z" fill="#76bc2d" /><path d="M14.54,10a.26.26,0,0,1-.24.27H12.21a.26.26,0,0,1-.27-.24V8.48a.26.26,0,0,1,.24-.27h2.09a.26.26,0,0,1,.27.24V10Z" fill="#76bc2d" /><path d="M10.83,11.6a.26.26,0,0,1-.24.27H8.5a.26.26,0,0,1-.27-.24V10.07a.26.26,0,0,1,.24-.27h2.09a.26.26,0,0,1,.27.24V11.6Z" fill="#76bc2d" /><path d="M7.12,6.84a.25.25,0,0,1-.23.26H4.74a.26.26,0,0,1-.27-.23V5.25A.26.26,0,0,1,4.71,5H6.8c.22,0,.32.11.32.27Z" fill="#86d633" /><path d="M7.12,10a.25.25,0,0,1-.23.27H4.74A.26.26,0,0,1,4.47,10V8.42a.26.26,0,0,1,.24-.26H6.8c.22,0,.32.11.32.26Z" fill="#76bc2d" /><path d="M7.12,13.19a.25.25,0,0,1-.23.27H4.74a.26.26,0,0,1-.27-.24V11.6a.25.25,0,0,1,.24-.26H6.8c.22,0,.32.1.32.26Z" fill="#76bc2d" /><g><path d="M1.07,1.51H2.36a0,0,0,0,1,0,0v3.6a.29.29,0,0,1-.29.29H.79A.29.29,0,0,1,.5,5.11v-3A.57.57,0,0,1,1.07,1.51Z" fill="#999" /><path d="M1.07,1.51H2.36a0,0,0,0,1,0,0v3.6a.29.29,0,0,1-.29.29H.79A.29.29,0,0,1,.5,5.11v-3A.57.57,0,0,1,1.07,1.51Z" fill="#999" opacity="0.5" /></g><g><path d="M15.64,1.51h1.29a.57.57,0,0,1,.57.57v3a.29.29,0,0,1-.29.29H15.92a.29.29,0,0,1-.29-.29V1.51A0,0,0,0,1,15.64,1.51Z" fill="#999" /><path d="M15.64,1.51h1.29a.57.57,0,0,1,.57.57v3a.29.29,0,0,1-.29.29H15.92a.29.29,0,0,1-.29-.29V1.51A0,0,0,0,1,15.64,1.51Z" fill="#999" opacity="0.5" /></g><path d="M8.66-6.08H9.91a0,0,0,0,1,0,0v17a0,0,0,0,1,0,0H8.66a.57.57,0,0,1-.57-.57V-5.52A.57.57,0,0,1,8.66-6.08Z" transform="translate(11.42 -6.58) rotate(90)" fill="#949494" /><g><path d="M.79,12.76H2.08a.29.29,0,0,1,.29.29v3.6a0,0,0,0,1,0,0H1.07a.57.57,0,0,1-.57-.57V13A.29.29,0,0,1,.79,12.76Z" fill="#999" /><path d="M.79,12.76H2.08a.29.29,0,0,1,.29.29v3.6a0,0,0,0,1,0,0H1.07a.57.57,0,0,1-.57-.57V13A.29.29,0,0,1,.79,12.76Z" fill="#999" opacity="0.5" /></g><g><path d="M15.92,12.76h1.29a.29.29,0,0,1,.29.29v3a.57.57,0,0,1-.57.57H15.64a0,0,0,0,1,0,0V13A.29.29,0,0,1,15.92,12.76Z" fill="#999" /><path d="M15.92,12.76h1.29a.29.29,0,0,1,.29.29v3a.57.57,0,0,1-.57.57H15.64a0,0,0,0,1,0,0V13A.29.29,0,0,1,15.92,12.76Z" fill="#999" opacity="0.5" /></g><path d="M8.66,7.24H9.91a0,0,0,0,1,0,0v17a0,0,0,0,1,0,0H8.66a.57.57,0,0,1-.57-.57V7.81A.57.57,0,0,1,8.66,7.24Z" transform="translate(-6.74 24.74) rotate(-90)" fill="#949494" /></g></g></svg>

package/eventcatalog/src/icons/protocols/azure-servicebus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="bbd02878-309a-4490-8196-946338d0f593" x1="8.995" y1="10.299" x2="8.995" y2="13.199" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#005ba1" /><stop offset="0.258" stop-color="#00589d" /><stop offset="0.525" stop-color="#004f90" /><stop offset="0.796" stop-color="#003f7c" /><stop offset="1" stop-color="#003067" /></linearGradient></defs><g><g id="b532e600-3623-4be6-9fa6-30d05fff56b1"><polygon points="13.387 7.4 13.382 7.396 13.382 7.384 13.363 7.384 8.997 4.405 4.631 7.384 4.612 7.384 4.612 7.396 4.606 7.4 4.612 7.4 4.612 13.201 13.382 13.201 13.382 7.4 13.387 7.4" fill="#50e6ff" /><path d="M4.606,7.4c0-.1.008,5.681.008,5.8L8.995,10.3Z" fill="#32bedd" /><path d="M13.384,7.4,8.995,10.3,13.376,13.2C13.376,13.083,13.384,7.3,13.384,7.4Z" fill="#198ab3" /><polygon points="8.995 10.299 4.614 13.194 4.614 13.199 13.376 13.199 13.376 13.194 8.995 10.299" fill="url(#bbd02878-309a-4490-8196-946338d0f593)" /><g><path d="M1.072,1.43h1.29a0,0,0,0,1,0,0v3.6a.286.286,0,0,1-.286.286H.786A.286.286,0,0,1,.5,5.035V2A.572.572,0,0,1,1.072,1.43Z" fill="#999" /><path d="M1.072,1.43h1.29a0,0,0,0,1,0,0v3.6a.286.286,0,0,1-.286.286H.786A.286.286,0,0,1,.5,5.035V2A.572.572,0,0,1,1.072,1.43Z" fill="#999" opacity="0.5" /></g><g><path d="M15.638,1.43h1.29A.572.572,0,0,1,17.5,2V5.035a.286.286,0,0,1-.286.286h-1.29a.286.286,0,0,1-.286-.286V1.43A0,0,0,0,1,15.638,1.43Z" fill="#999" /><path d="M15.638,1.43h1.29A.572.572,0,0,1,17.5,2V5.035a.286.286,0,0,1-.286.286h-1.29a.286.286,0,0,1-.286-.286V1.43A0,0,0,0,1,15.638,1.43Z" fill="#999" opacity="0.5" /></g><path d="M8.66-6.163H9.907a0,0,0,0,1,0,0v17a0,0,0,0,1,0,0H8.66a.567.567,0,0,1-.567-.567V-5.6A.567.567,0,0,1,8.66-6.163Z" transform="translate(11.337 -6.663) rotate(90)" fill="#949494" /><g><path d="M.786,12.679h1.29a.286.286,0,0,1,.286.286v3.6a0,0,0,0,1,0,0H1.072A.572.572,0,0,1,.5,16V12.965A.286.286,0,0,1,.786,12.679Z" fill="#999" /><path d="M.786,12.679h1.29a.286.286,0,0,1,.286.286v3.6a0,0,0,0,1,0,0H1.072A.572.572,0,0,1,.5,16V12.965A.286.286,0,0,1,.786,12.679Z" fill="#999" opacity="0.5" /></g><g><path d="M15.924,12.679h1.29a.286.286,0,0,1,.286.286V16a.572.572,0,0,1-.572.572h-1.29a0,0,0,0,1,0,0v-3.6A.286.286,0,0,1,15.924,12.679Z" fill="#999" /><path d="M15.924,12.679h1.29a.286.286,0,0,1,.286.286V16a.572.572,0,0,1-.572.572h-1.29a0,0,0,0,1,0,0v-3.6A.286.286,0,0,1,15.924,12.679Z" fill="#999" opacity="0.5" /></g><path d="M8.66,7.163H9.907a0,0,0,0,1,0,0v17a0,0,0,0,1,0,0H8.66a.567.567,0,0,1-.567-.567V7.73A.567.567,0,0,1,8.66,7.163Z" transform="translate(-6.663 24.663) rotate(-90)" fill="#949494" /></g></g></svg>

package/eventcatalog/src/icons/protocols/index.ts

@@ -1,3 +1,6 @@
+export { default as AzureEventGrid } from '@icons/protocols/azure-eventgrid.svg?raw';
+export { default as AzureEventHubs } from '@icons/protocols/azure-eventhubs.svg?raw';
+export { default as AzureServiceBus } from '@icons/protocols/azure-servicebus.svg?raw';
 export { default as Kafka } from '@icons/protocols/kafka.svg?raw';
 export { default as Http } from '@icons/protocols/http.svg?raw';
 export { default as JMS } from '@icons/protocols/jms.svg?raw';

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

@@ -8,6 +8,8 @@ import NodeGraph from '@components/MDX/NodeGraph/NodeGraph.astro';
 import SchemaViewer from '@components/MDX/SchemaViewer/SchemaViewerRoot.astro';
 import Admonition from '@components/MDX/Admonition';
 
+import { resourceToCollectionMap, collectionToResourceMap } from '@utils/collections/util';
+
 // SideBars
 import ServiceSideBar from '@components/SideBars/ServiceSideBar.astro';
 import MessageSideBar from '@components/SideBars/MessageSideBar.astro';
@@ -41,6 +43,8 @@ import { buildUrl } from '@utils/url-builder';
 import { getSchemasFromResource } from '@utils/collections/schemas';
 import { isEventCatalogChatEnabled, isMarkdownDownloadEnabled } from '@utils/feature';
 
+import { getMDXComponentsByName } from '@utils/markdown';
+
 import config from '@config';
 
 export async function getStaticPaths() {
@@ -65,6 +69,7 @@ export async function getStaticPaths() {
 const props = Astro.props;
 
 const { Content } = await render(props);
+
 // const { Content } = await props.render();
 
 // Capitalize the first letter of a string
@@ -189,6 +194,15 @@ const generatePromptForResource = (props: any) => {
     Please tell me more about the ${props.collection.slice(0, props.collection.length - 1)} -  ${props.data.name} v${props.data.version} in this catalog.
   `;
 };
+
+// Handle node graphs in the markdown
+let nodeGraphs = getMDXComponentsByName(props.body || '', 'NodeGraph') || [];
+
+nodeGraphs.push({
+  id: props.data.id,
+  version: props.data.version,
+  type: collectionToResourceMap[props.collection as keyof typeof collectionToResourceMap],
+});
 ---
 
 <VerticalSideBarLayout title={pageTitle} description={props.data.summary}>
@@ -319,17 +333,27 @@ const generatePromptForResource = (props: any) => {
           <!-- @ts-ignore -->
           <!-- <SchemaViewer id={props.data.id} catalog={props.catalog} filePath={props.filePath} /> -->
           <SchemaViewer id={props.data.id} filePath={props.filePath} />
-          <NodeGraph
-            id={props.data.id}
-            collection={props.collection}
-            version={props.data.version}
-            mode="simple"
-            linksToVisualiser={true}
-            href={{
-              label: 'Open in Visualiser',
-              url: buildUrl(`/visualiser/${props.collection}/${props.data.id}/${props.data.version}`),
-            }}
-          />
+
+          {
+            nodeGraphs.length > 0 &&
+              nodeGraphs.map((nodeGraph: any) => {
+                const collection = resourceToCollectionMap[nodeGraph.type as keyof typeof resourceToCollectionMap];
+                return (
+                  <NodeGraph
+                    id={nodeGraph.id}
+                    version={nodeGraph.version}
+                    collection={collection}
+                    title={nodeGraph.title}
+                    mode="simple"
+                    linksToVisualiser={true}
+                    href={{
+                      label: 'Open in Visualiser',
+                      url: buildUrl(`/visualiser/${collection}/${nodeGraph.id}/${nodeGraph.version}`),
+                    }}
+                  />
+                );
+              })
+          }
         </div>
         <Footer />
       </div>

package/eventcatalog/src/utils/collections/util.ts

@@ -110,6 +110,18 @@ export const resourceToCollectionMap = {
   team: 'teams',
 } as const;
 
+export const collectionToResourceMap = {
+  services: 'service',
+  events: 'event',
+  commands: 'command',
+  queries: 'query',
+  domains: 'domain',
+  flows: 'flow',
+  channels: 'channel',
+  users: 'user',
+  teams: 'team',
+} as const;
+
 export const getDeprecatedDetails = (item: CollectionEntry<CollectionTypes>) => {
   let options = {
     isMarkedAsDeprecated: false,

package/eventcatalog/src/utils/protocols.tsx

@@ -0,0 +1,15 @@
+import * as ProtocolIcons from '@icons/protocols';
+
+const protocolIcons = Object.keys(ProtocolIcons).reduce(
+  (icons, key) => {
+    const iconKey = key as keyof typeof ProtocolIcons;
+    icons[key.toLowerCase()] = ProtocolIcons[iconKey];
+    return icons;
+  },
+  {} as { [key: string]: string }
+);
+
+export const getIconForProtocol = (icon: string) => {
+  const Icon = protocolIcons[icon.replace('-', '').toLowerCase()];
+  return Icon ? (props: any) => <span {...props} dangerouslySetInnerHTML={{ __html: Icon }} /> : null;
+};

package/eventcatalog/tailwind.config.mjs

@@ -59,6 +59,8 @@ export default {
     'bg-green-100',
     'bg-blue-100',
     'bg-indigo-100',
+    'text-[5px]',
+    'text-[9px]',
   ],
 
   plugins: [require('@tailwindcss/typography')],

package/package.json

@@ -6,7 +6,7 @@
     "url": "https://github.com/event-catalog/eventcatalog.git"
   },
   "type": "module",
-  "version": "2.37.2",
+  "version": "2.37.4",
   "publishConfig": {
     "access": "public"
   },