npm - @eventcatalog/core - Versions diffs - 2.48.1 → 2.48.3 - Mend

@eventcatalog/core 2.48.1 → 2.48.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (28) hide show

package/dist/analytics/analytics.cjs CHANGED Viewed

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

package/dist/analytics/analytics.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import {
   raiseEvent
-} from "../chunk-M35UFAGG.js";
-import "../chunk-WAVFA46U.js";
+} from "../chunk-BPCESQRH.js";
+import "../chunk-6GN2GDPD.js";
 export {
   raiseEvent
 };

package/dist/analytics/log-build.cjs CHANGED Viewed

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

package/dist/analytics/log-build.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import {
   log_build_default
-} from "../chunk-ZI5ZP7I2.js";
-import "../chunk-M35UFAGG.js";
-import "../chunk-WAVFA46U.js";
+} from "../chunk-UFBO6R65.js";
+import "../chunk-BPCESQRH.js";
+import "../chunk-6GN2GDPD.js";
 import "../chunk-E7TXTI7G.js";
 export {
   log_build_default as default

package/dist/{chunk-WAVFA46U.js → chunk-6GN2GDPD.js} RENAMED Viewed

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

package/dist/{chunk-M35UFAGG.js → chunk-BPCESQRH.js} RENAMED Viewed

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

package/dist/{chunk-ZI5ZP7I2.js → chunk-UFBO6R65.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import {
   raiseEvent
-} from "./chunk-M35UFAGG.js";
+} from "./chunk-BPCESQRH.js";
 import {
   getEventCatalogConfigFile,
   verifyRequiredFieldsAreInCatalogConfigFile

package/dist/constants.cjs CHANGED Viewed

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

package/dist/constants.js CHANGED Viewed

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

package/dist/eventcatalog.cjs CHANGED Viewed

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

package/dist/eventcatalog.config.d.cts CHANGED Viewed

@@ -101,6 +101,12 @@ interface Config {
             renderMode?: 'flat' | 'single';
         };
     };
+    environments?: {
+        name: string;
+        url: string;
+        description?: string;
+        shortName?: string;
+    }[];
 }
 export type { Config, SideBarConfig };

package/dist/eventcatalog.config.d.ts CHANGED Viewed

@@ -101,6 +101,12 @@ interface Config {
             renderMode?: 'flat' | 'single';
         };
     };
+    environments?: {
+        name: string;
+        url: string;
+        description?: string;
+        shortName?: string;
+    }[];
 }
 export type { Config, SideBarConfig };

package/dist/eventcatalog.js CHANGED Viewed

@@ -6,8 +6,8 @@ import {
 } from "./chunk-XE6PFSH5.js";
 import {
   log_build_default
-} from "./chunk-ZI5ZP7I2.js";
-import "./chunk-M35UFAGG.js";
+} from "./chunk-UFBO6R65.js";
+import "./chunk-BPCESQRH.js";
 import {
   catalogToAstro,
   checkAndConvertMdToMdx
@@ -15,7 +15,7 @@ import {
 import "./chunk-LDBRNJIL.js";
 import {
   VERSION
-} from "./chunk-WAVFA46U.js";
+} from "./chunk-6GN2GDPD.js";
 import {
   isAuthEnabled,
   isBackstagePluginEnabled,

package/eventcatalog/src/components/EnvironmentDropdown.tsx ADDED Viewed

@@ -0,0 +1,135 @@
+import React, { useState, useEffect, useRef } from 'react';
+interface Environment {
+  name: string;
+  url: string;
+  description?: string;
+  shortName?: string;
+}
+interface EnvironmentDropdownProps {
+  environments: Environment[];
+}
+export const EnvironmentDropdown: React.FC<EnvironmentDropdownProps> = ({ environments }) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const [currentEnvironment, setCurrentEnvironment] = useState<Environment | null>(null);
+  const dropdownRef = useRef<HTMLDivElement>(null);
+  useEffect(() => {
+    // Check if current URL matches any environment
+    const currentUrl = window.location.origin;
+    const matchedEnv = environments.find((env) => {
+      // Normalize URLs for comparison
+      const envUrl = new URL(env.url).origin;
+      return envUrl === currentUrl;
+    });
+    setCurrentEnvironment(matchedEnv || null);
+  }, [environments]);
+  useEffect(() => {
+    // Handle click outside
+    const handleClickOutside = (event: MouseEvent) => {
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) {
+        setIsOpen(false);
+      }
+    };
+    // Handle escape key
+    const handleEscape = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        setIsOpen(false);
+      }
+    };
+    if (isOpen) {
+      document.addEventListener('click', handleClickOutside);
+      document.addEventListener('keydown', handleEscape);
+    }
+    return () => {
+      document.removeEventListener('click', handleClickOutside);
+      document.removeEventListener('keydown', handleEscape);
+    };
+  }, [isOpen]);
+  const toggleDropdown = (e: React.MouseEvent) => {
+    e.stopPropagation();
+    setIsOpen(!isOpen);
+  };
+  return (
+    <div className="relative" ref={dropdownRef}>
+      <button
+        type="button"
+        onClick={toggleDropdown}
+        className="flex items-center space-x-1 text-sm font-medium text-gray-700 hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-purple-500 rounded-md px-3 py-2"
+        aria-expanded={isOpen}
+        aria-haspopup="true"
+      >
+        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+          <path
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            strokeWidth="2"
+            d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"
+          />
+        </svg>
+        <span>
+          Environments
+          {currentEnvironment && (
+            <span className="font-normal"> ({currentEnvironment.shortName || currentEnvironment.name})</span>
+          )}
+        </span>
+        <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M19 9l-7 7-7-7" />
+        </svg>
+      </button>
+      <div
+        className={`${isOpen ? '' : 'hidden'} absolute right-0 mt-2 w-64 bg-white rounded-md shadow-lg py-1 z-50 border border-gray-100 overflow-hidden z-20`}
+      >
+        {environments.map((env) => {
+          const isCurrentEnv = currentEnvironment?.name === env.name;
+          return (
+            <a
+              key={env.name}
+              href={env.url}
+              onClick={(e) => {
+                e.preventDefault();
+                // Construct the full URL with the current path when clicked
+                const currentPath = window.location.pathname + window.location.search + window.location.hash;
+                const targetUrl = new URL(env.url);
+                targetUrl.pathname = currentPath;
+                window.location.href = targetUrl.toString();
+              }}
+              className={`block px-4 py-3 text-sm transition-colors border-b border-gray-50 last:border-b-0 ${
+                isCurrentEnv ? 'bg-purple-50 text-purple-700 hover:bg-purple-100' : 'text-gray-700 hover:bg-gray-50'
+              }`}
+            >
+              <div className="flex items-center justify-between">
+                <div>
+                  <div className={`font-medium ${isCurrentEnv ? 'text-purple-700' : ''}`}>{env.name}</div>
+                  {env.description && (
+                    <div className={`text-xs font-light mt-1 ${isCurrentEnv ? 'text-purple-600' : 'text-gray-500'}`}>
+                      {env.description}
+                    </div>
+                  )}
+                </div>
+                {isCurrentEnv && (
+                  <svg className="w-4 h-4 text-purple-600 flex-shrink-0 ml-2" fill="currentColor" viewBox="0 0 20 20">
+                    <path
+                      fillRule="evenodd"
+                      d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
+                      clipRule="evenodd"
+                    />
+                  </svg>
+                )}
+              </div>
+            </a>
+          );
+        })}
+      </div>
+    </div>
+  );
+};

package/eventcatalog/src/components/Header.astro CHANGED Viewed

@@ -5,6 +5,7 @@ import { buildUrl } from '@utils/url-builder';
 import { showEventCatalogBranding, showCustomBranding } from '@utils/feature';
 import { getSession } from 'auth-astro/server';
 import { isAuthEnabled, isSSR } from '@utils/feature';
+import { EnvironmentDropdown } from './EnvironmentDropdown';
 let session = null;
 if (isAuthEnabled()) {
@@ -41,7 +42,10 @@ const repositoryUrl = catalog?.repositoryUrl || 'https://github.com/event-catalo
       <div class="hidden md:block w-3/12">
         {
           session ? (
-            <div class="flex justify-end pr-2">
+            <div class="flex items-center space-x-4 justify-end pr-2">
+              {catalog.environments && catalog.environments.length > 0 && (
+                <EnvironmentDropdown environments={catalog.environments} client:load />
+              )}
               <div class="relative">
                 <button
                   id="profile-menu-button"
@@ -89,6 +93,9 @@ const repositoryUrl = catalog?.repositoryUrl || 'https://github.com/event-catalo
           ) : (
             <>
               <div class="flex items-center space-x-4 justify-end pr-2">
+                {catalog.environments && catalog.environments.length > 0 && (
+                  <EnvironmentDropdown environments={catalog.environments} client:load />
+                )}
                 {isAuthEnabled() && (
                   <button
                     id="okta-signin-btn"

package/eventcatalog/src/components/SideNav/ListViewSideBar/components/MessageList.tsx CHANGED Viewed

@@ -61,6 +61,7 @@ const MessageList: React.FC<MessageListProps> = ({ messages, decodedCurrentPath,
         >
           <span className="truncate">
             <HighlightedText text={message.data?.sidebar?.label || message.data.name} searchTerm={searchTerm} />
+            <span className="text-xs text-gray-400">{message.data.draft ? ' (DRAFT)' : ''}</span>
           </span>
           <span
             className={`ml-2 text-[10px]  flex items-center gap-1 font-medium px-2 uppercase py-0.5 rounded ${getMessageColorByLabelOrCollection(message.collection, message.data?.sidebar?.badge)}`}

package/eventcatalog/src/components/SideNav/ListViewSideBar/index.tsx CHANGED Viewed

@@ -91,6 +91,7 @@ const ServiceItem = React.memo(
           >
             <span className="truncate text-xs font-bold">
               <HighlightedText text={item.label} searchTerm={searchTerm} />
+              <span className="text-xs text-gray-400">{item.draft ? ' (DRAFT)' : ''}</span>
             </span>
             <span className="text-purple-600 ml-2 text-[10px] font-medium bg-purple-50 px-2 py-0.5 rounded">SERVICE</span>
           </button>

package/eventcatalog/src/components/SideNav/ListViewSideBar/types.ts CHANGED Viewed

@@ -24,6 +24,7 @@ export interface ServiceItem {
   name: string;
   id: string;
   version: string;
+  draft: boolean | { title?: string; message: string };
   sends: MessageItem[];
   receives: MessageItem[];
   entities: EntityItem[];

package/eventcatalog/src/components/SideNav/ListViewSideBar/utils.ts CHANGED Viewed

@@ -59,6 +59,7 @@ export async function getResourcesForNavigation({ currentPath }: { currentPath:
         name: send.data.name,
         sidebar: send.data.sidebar,
         aggregateRoot: send?.data?.aggregateRoot,
+        draft: send.data.draft,
       },
       collection: send.collection,
       href: buildUrl(`/${route}/${send.collection}/${send.data.id}/${send.data.version}`),
@@ -69,6 +70,7 @@ export async function getResourcesForNavigation({ currentPath }: { currentPath:
         name: receive.data.name,
         sidebar: receive.data.sidebar,
         aggregateRoot: receive?.data?.aggregateRoot,
+        draft: receive.data.draft,
       },
       collection: receive.collection,
       href: buildUrl(`/${route}/${receive.collection}/${receive.data.id}/${receive.data.version}`),
@@ -79,6 +81,7 @@ export async function getResourcesForNavigation({ currentPath }: { currentPath:
         name: entity.data.name,
         sidebar: entity.data.sidebar,
         aggregateRoot: entity?.data?.aggregateRoot,
+        draft: entity.data.draft,
       },
       collection: entity.collection,
       href: buildUrl(`/${route}/${entity.collection}/${entity.data.id}/${entity.data.version}`),
@@ -103,6 +106,7 @@ export async function getResourcesForNavigation({ currentPath }: { currentPath:
       servicesCount,
       id: item.data.id,
       name: item.data.name,
+      draft: item.data.draft,
       services: isCollectionDomain ? stripCollection(item.data.services) : null,
       domains: isCollectionDomain ? stripCollection(item.data.domains) : null,
       sends: sendsWithHref,
@@ -127,6 +131,7 @@ export async function getResourcesForNavigation({ currentPath }: { currentPath:
     version: item.data.version,
     id: item.data.id,
     name: item.data.name,
+    draft: item.data.draft,
     href: buildUrl(`/${route}/${item.collection}/${item.data.id}/${item.data.version}`),
     collection: item.collection,
   }));

package/eventcatalog/src/components/Tables/Table.tsx CHANGED Viewed

@@ -48,6 +48,7 @@ export type TData<T extends TCollectionTypes> = {
     summary: string;
     version: string;
     latestVersion?: string; // Defined on getter collection utility
+    draft?: boolean | { title?: string; message: string }; // Draft property from base schema
     badges?: Array<{
       id: string; // Where is it defined?
       content: string;
@@ -124,13 +125,14 @@ export const Table = <T extends TCollectionTypes>({
   collection,
   mode = 'simple',
   checkboxLatestId,
+  checkboxDraftsId,
 }: {
   data: TData<T>[];
   collection: T;
   checkboxLatestId: string;
+  checkboxDraftsId: string;
   mode?: 'simple' | 'full';
 }) => {
-  const [data, _setData] = useState(initialData);
   const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
   useEffect(() => {
@@ -142,11 +144,13 @@ export const Table = <T extends TCollectionTypes>({
   }, []);
   const [showOnlyLatest, setShowOnlyLatest] = useState(true);
+  const [onlyShowDrafts, setOnlyShowDrafts] = useState(false);
   useEffect(() => {
     const checkbox = document.getElementById(checkboxLatestId);
     function handleChange(evt: Event) {
-      setShowOnlyLatest((evt.target as HTMLInputElement).checked);
+      const checked = (evt.target as HTMLInputElement).checked;
+      setShowOnlyLatest(checked);
     }
     checkbox?.addEventListener('change', handleChange);
@@ -154,10 +158,47 @@ export const Table = <T extends TCollectionTypes>({
     return () => checkbox?.removeEventListener('change', handleChange);
   }, [checkboxLatestId]);
+  useEffect(() => {
+    const checkbox = document.getElementById(checkboxDraftsId);
+    function handleChange(evt: Event) {
+      const checked = (evt.target as HTMLInputElement).checked;
+      setOnlyShowDrafts(checked);
+    }
+    checkbox?.addEventListener('change', handleChange);
+    return () => checkbox?.removeEventListener('change', handleChange);
+  }, [checkboxDraftsId]);
+  // Filter data based on checkbox states
+  const filteredData = useMemo(() => {
+    return initialData.filter((row) => {
+      // Check if item is a draft
+      const isDraft = row.data.draft === true || (typeof row.data.draft === 'object' && row.data.draft !== null);
+      // If "Only show drafts" is enabled, show only drafts
+      if (onlyShowDrafts && !isDraft) {
+        return false;
+      }
+      // If "Only show drafts" is enabled, don't apply other filters
+      if (onlyShowDrafts) {
+        return true;
+      }
+      // Check latest version filter (only when not showing only drafts)
+      if (showOnlyLatest) {
+        return isSameVersion(row.data.version, row.data.latestVersion);
+      }
+      return true;
+    });
+  }, [initialData, showOnlyLatest, onlyShowDrafts]);
   const columns = useMemo(() => getColumnsByCollection(collection), [collection]);
   const table = useReactTable({
-    data,
+    data: filteredData,
     columns,
     onColumnFiltersChange: setColumnFilters,
     getCoreRowModel: getCoreRowModel(),
@@ -168,15 +209,6 @@ export const Table = <T extends TCollectionTypes>({
     getPaginationRowModel: getPaginationRowModel(),
     state: {
       columnFilters,
-      globalFilter: showOnlyLatest,
-    },
-    onGlobalFilterChange: setShowOnlyLatest,
-    globalFilterFn: (row, _columnId, showOnlyLatest: boolean) => {
-      if (showOnlyLatest) {
-        return isSameVersion(row.original.data.version, row.original.data.latestVersion);
-      }
-      return true;
     },
   });

package/eventcatalog/src/components/Tables/columns/DomainTableColumns.tsx CHANGED Viewed

@@ -43,7 +43,11 @@ export const columns = () => [
   columnHelper.accessor('data.summary', {
     id: 'summary',
     header: () => 'Summary',
-    cell: (info) => <span className="font-light ">{info.renderValue()}</span>,
+    cell: (info) => (
+      <span className="font-light ">
+        {info.renderValue()} {info.row.original.data.draft ? ' (Draft)' : ''}
+      </span>
+    ),
     footer: (info) => info.column.id,
     meta: {
       showFilter: false,

package/eventcatalog/src/components/Tables/columns/MessageTableColumns.tsx CHANGED Viewed

@@ -60,7 +60,11 @@ export const columns = () => [
   columnHelper.accessor('data.summary', {
     id: 'summary',
     header: () => 'Summary',
-    cell: (info) => <span className="font-light ">{info.renderValue()}</span>,
+    cell: (info) => (
+      <span className="font-light ">
+        {info.renderValue()} {info.row.original.data.draft ? ' (Draft)' : ''}
+      </span>
+    ),
     footer: (info) => info.column.id,
     meta: {
       showFilter: false,

package/eventcatalog/src/components/Tables/columns/ServiceTableColumns.tsx CHANGED Viewed

@@ -44,7 +44,11 @@ export const columns = () => [
   columnHelper.accessor('data.summary', {
     id: 'summary',
     header: () => 'Summary',
-    cell: (info) => <span className="font-light ">{info.renderValue()}</span>,
+    cell: (info) => (
+      <span className="font-light ">
+        {info.renderValue()} {info.row.original.data.draft ? ' (Draft)' : ''}
+      </span>
+    ),
     footer: (info) => info.column.id,
     meta: {
       showFilter: false,

package/eventcatalog/src/content.config.ts CHANGED Viewed

@@ -73,6 +73,7 @@ const baseSchema = z.object({
   name: z.string(),
   summary: z.string().optional(),
   version: z.string(),
+  draft: z.union([z.boolean(), z.object({ title: z.string().optional(), message: z.string() })]).optional(),
   badges: z.array(badge).optional(),
   owners: z.array(ownerReference).optional(),
   schemaPath: z.string().optional(),

package/eventcatalog/src/layouts/DiscoverLayout.astro CHANGED Viewed

@@ -31,6 +31,7 @@ const { title, subtitle, data, type } = Astro.props;
 const currentPath = Astro.url.pathname;
 const checkboxLatestId = 'latest-only';
+const checkboxDraftsId = 'show-drafts';
 const tabs = [
   {
@@ -117,14 +118,25 @@ const tabs = [
             <h1 class="text-4xl font-semibold text-gray-900 capitalize">{title}</h1>
             <p class="text-md text-gray-700">{subtitle}</p>
           </div>
-          <div class="p-4 border border-gray-200 rounded-md">
-            <Checkbox id={checkboxLatestId} name={checkboxLatestId} label="Show latest version only" checked />
+          <div class="flex gap-4">
+            <div class="p-4 border border-gray-200 rounded-md">
+              <Checkbox id={checkboxLatestId} name={checkboxLatestId} label="Show latest version only" checked />
+            </div>
+            <div class="p-4 border border-gray-200 rounded-md">
+              <Checkbox id={checkboxDraftsId} name={checkboxDraftsId} label="Show drafts only" />
+            </div>
           </div>
         </div>
         <div class="mt-4 flow-root">
           <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
             <div class="inline-block min-w-full align-middle sm:px-6 lg:px-8">
-              <Table checkboxLatestId={checkboxLatestId} data={data} collection={type} client:load />
+              <Table
+                checkboxLatestId={checkboxLatestId}
+                checkboxDraftsId={checkboxDraftsId}
+                data={data}
+                collection={type}
+                client:load
+              />
             </div>
           </div>
         </div>

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

@@ -34,6 +34,7 @@ function mapToItem(i: any) {
           summary: d.data?.summary,
           version: d.data.version,
           latestVersion: d.data?.latestVersion,
+          draft: d.data?.draft,
           badges: d.data?.badges,
           // @ts-ignore
           consumers: d.data?.consumers?.map(mapToItem) ?? [],

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

@@ -278,6 +278,21 @@ nodeGraphs.push({
                 </div>
               )
             }
+            {
+              props.data.draft && (
+                <Admonition type="warning" title={props.data?.draft?.title || `Draft ${friendlyCollectionName}`}>
+                  <div>
+                    {!props.data.draft.message && (
+                      <p>This resource has been marked as a draft and may still be under development.</p>
+                    )}
+                    {props.data.draft.message && (
+                      <div class="prose prose-sm max-w-none" set:html={marked.parse(props.data.draft.message)} />
+                    )}
+                  </div>
+                </Admonition>
+              )
+            }
           </div>
         </div>

package/package.json CHANGED Viewed

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