@eventcatalog/core 0.0.0-202201214199 → 0.0.0-2022018141010

package/lib/graphs.ts

@@ -16,10 +16,8 @@ ${rNodes.map((node) => `${nodeValue}:::event-->${node}:::consumer\n`).join('')}
   `;
 };
 
-export const buildMermaidFlowChartForEvent = (
-  { name: eventName, producers, consumers }: Event,
-  rootNodeColor = '#2563eb'
-) => buildMermaid(eventName, producers, consumers, rootNodeColor);
+export const buildMermaidFlowChartForEvent = ({ name: eventName, producers, consumers }: Event, rootNodeColor = '#2563eb') =>
+  buildMermaid(eventName, producers, consumers, rootNodeColor);
 
 export const buildMermaidFlowChartForService = (
   { publishes, subscribes, name: serviceName }: Service,

package/lib/services.ts

@@ -16,9 +16,7 @@ export const getAllServices = (): Service[] => {
   const servicesDir = path.join(process.env.PROJECT_DIR, 'services');
 
   const folders = fs.readdirSync(servicesDir);
-  const services = folders.map((folder) =>
-    readMarkdownFile(path.join(servicesDir, folder, 'index.md'))
-  );
+  const services = folders.map((folder) => readMarkdownFile(path.join(servicesDir, folder, 'index.md')));
   const events = getAllEvents();
 
   const parsedServices = services.map((frontMatter) => buildService(frontMatter.data));
@@ -32,17 +30,13 @@ export const getAllServices = (): Service[] => {
 
 export const getAllServicesByOwnerId = async (ownerId): Promise<Service[]> => {
   const services = await getAllServices();
-  const servicesOwnedByUser = services.filter((service) =>
-    service.owners.some((id) => id === ownerId)
-  );
+  const servicesOwnedByUser = services.filter((service) => service.owners.some((id) => id === ownerId));
   return servicesOwnedByUser.map((service) => ({
     ...service,
   }));
 };
 
-export const getServiceByName = async (
-  serviceName
-): Promise<{ service: Service; markdown: MarkdownFile }> => {
+export const getServiceByName = async (serviceName): Promise<{ service: Service; markdown: MarkdownFile }> => {
   try {
     const servicesDir = path.join(process.env.PROJECT_DIR, 'services');
     const serviceDirectory = path.join(servicesDir, serviceName);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eventcatalog/core",
-  "version": "0.0.0-202201214199",
+  "version": "0.0.0-2022018141010",
   "publishConfig": {
     "access": "public"
   },
@@ -37,7 +37,7 @@
     "react-syntax-highlighter": "^15.4.5"
   },
   "devDependencies": {
-    "@eventcatalog/types": "0.0.2",
+    "@eventcatalog/types": "0.0.0-2022018141010",
     "@types/react": "^17.0.36",
     "autoprefixer": "^10.4.0",
     "commander": "^8.3.0",

package/pages/_app.tsx

@@ -18,29 +18,20 @@ export default ({ Component, pageProps }: AppProps) => (
       />
       <meta property="og:url" content="https://eventcatalog.dev/" />
       <meta property="og:type" content="website" />
-      <meta
-        property="og:title"
-        content="EventCatalog | Discover, Explore and Document your Event Driven Architectures."
-      />
+      <meta property="og:title" content="EventCatalog | Discover, Explore and Document your Event Driven Architectures." />
       <meta
         property="og:description"
         content="An open source tool powered by markdown to document your Event Driven Architecture."
       />
       <meta property="og:image" content="https://eventcatalog.dev/img/opengraph.png" />
-      <meta
-        property="og:image:alt"
-        content="EventCatalog | Discover, Explore and Document your Event Driven Architectures."
-      />
+      <meta property="og:image:alt" content="EventCatalog | Discover, Explore and Document your Event Driven Architectures." />
       <meta property="og:image:width" content="1200" />
       <meta property="og:image:height" content="600" />
       <meta property="og:locale" content="en-GB" />
       <meta name="author" content="David Boyne" />
 
       {/* Need to load this before any of the Html2Diff Code */}
-      <link
-        rel="stylesheet"
-        href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/atom-one-light.min.css"
-      />
+      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/atom-one-light.min.css" />
     </Head>
     <Header />
     <Component {...pageProps} />

package/pages/events/[name]/logs.tsx

@@ -67,9 +67,7 @@ function Logs({ changes, name: eventName, currentVersion }: LogsProps) {
                     </div>
                   </div>
 
-                  {changes.length === 0 && (
-                    <div className="text-gray-400 text-xl">No versions for Event found.</div>
-                  )}
+                  {changes.length === 0 && <div className="text-gray-400 text-xl">No versions for Event found.</div>}
 
                   <div className="flow-root mb-20">
                     <ul className="">
@@ -77,10 +75,7 @@ function Logs({ changes, name: eventName, currentVersion }: LogsProps) {
                         <li key={eventIdx} className="">
                           <div className="relative pb-8">
                             {eventIdx !== changes.length - 1 ? (
-                              <span
-                                className="absolute top-4 left-4 -ml-px h-full w-0.5 bg-gray-100"
-                                aria-hidden="true"
-                              />
+                              <span className="absolute top-4 left-4 -ml-px h-full w-0.5 bg-gray-100" aria-hidden="true" />
                             ) : null}
                             <div className="relative flex space-x-3">
                               <div>
@@ -99,9 +94,7 @@ function Logs({ changes, name: eventName, currentVersion }: LogsProps) {
                                     Schema version update
                                     {event.versions.map((version, index) => {
                                       const linkHref =
-                                        version === currentVersion
-                                          ? `/events/${eventName}`
-                                          : `/events/${eventName}/v/${version}`;
+                                        version === currentVersion ? `/events/${eventName}` : `/events/${eventName}/v/${version}`;
                                       return (
                                         <Link key={version} href={linkHref}>
                                           <a className="font-medium">
@@ -127,9 +120,7 @@ function Logs({ changes, name: eventName, currentVersion }: LogsProps) {
                                     </>
                                   )}
                                   {!event.changelog.source && (
-                                    <h2 className="text-base text-gray-300 font-bold mt-4">
-                                      No changelog file found.
-                                    </h2>
+                                    <h2 className="text-base text-gray-300 font-bold mt-4">No changelog file found.</h2>
                                   )}
                                 </div>
                                 <div className="text-right text-sm text-gray-500 py-4">

package/pages/events/[name].tsx

@@ -31,11 +31,7 @@ export const getComponents = ({ event, schema, examples }: any) => ({
   code: ({ className, ...props }) => {
     const match = /language-(\w+)/.exec(className || '');
 
-    return match ? (
-      <SyntaxHighlighter language={match[1]} {...props} />
-    ) : (
-      <code className={className} {...props} />
-    );
+    return match ? <SyntaxHighlighter language={match[1]} {...props} /> : <code className={className} {...props} />;
   },
   Schema: ({ title = 'Event Schema' }: { title: string }) => {
     if (!schema) return null;
@@ -45,11 +41,7 @@ export const getComponents = ({ event, schema, examples }: any) => ({
         <h2 id="activity-title" className="text-lg font-medium text-gray-900 underline">
           {title}
         </h2>
-        <SyntaxHighlighter
-          language={schema.language}
-          showLineNumbers={false}
-          name={`${event.name} Schema (${schema.language})`}
-        >
+        <SyntaxHighlighter language={schema.language} showLineNumbers={false} name={`${event.name} Schema (${schema.language})`}>
           {schema.snippet}
         </SyntaxHighlighter>
       </section>

package/pages/events.tsx

@@ -57,12 +57,8 @@ export default function Page({ events, services }: PageProps) {
     eventsToRender = eventsToRender.filter((event) => {
       const { services: serviceFilters } = selectedFilters;
 
-      const hasConsumersFromFilters = event.consumers.some(
-        (consumerId) => serviceFilters.indexOf(consumerId) > -1
-      );
-      const hasProducersFromFilters = event.producers.some(
-        (producerId) => serviceFilters.indexOf(producerId) > -1
-      );
+      const hasConsumersFromFilters = event.consumers.some((consumerId) => serviceFilters.indexOf(consumerId) > -1);
+      const hasProducersFromFilters = event.producers.some((producerId) => serviceFilters.indexOf(producerId) > -1);
 
       return hasConsumersFromFilters || hasProducersFromFilters;
     });
@@ -75,9 +71,7 @@ export default function Page({ events, services }: PageProps) {
       </Head>
       <main className="max-w-7xl mx-auto min-h-screen px-4 md:px-0">
         <div className="relative z-10 flex items-baseline justify-between pt-8 pb-6 border-b border-gray-200">
-          <h1 className="text-2xl font-extrabold tracking-tight text-gray-900">
-            Events ({events.length})
-          </h1>
+          <h1 className="text-2xl font-extrabold tracking-tight text-gray-900">Events ({events.length})</h1>
 
           <div className="flex items-center">
             <Menu as="div" className="hidden relative text-left">
@@ -160,10 +154,7 @@ export default function Page({ events, services }: PageProps) {
                             defaultChecked={option.checked}
                             className="h-4 w-4 border-gray-300 rounded text-gray-600 focus:ring-gray-500"
                           />
-                          <label
-                            htmlFor={`filter-${section.id}-${optionIdx}`}
-                            className="ml-3 text-sm text-gray-600"
-                          >
+                          <label htmlFor={`filter-${section.id}-${optionIdx}`} className="ml-3 text-sm text-gray-600">
                             {option.label}
                           </label>
                         </div>
@@ -200,9 +191,7 @@ export default function Page({ events, services }: PageProps) {
 
             <div className="col-span-4 lg:col-span-3">
               <div>
-                <h2 className="text-gray-500 text-xs font-medium uppercase tracking-wide">
-                  Events ({eventsToRender.length})
-                </h2>
+                <h2 className="text-gray-500 text-xs font-medium uppercase tracking-wide">Events ({eventsToRender.length})</h2>
                 <EventGrid events={eventsToRender} showMermaidDiagrams={showMermaidDiagrams} />
               </div>
             </div>

package/pages/index.tsx

@@ -11,15 +11,8 @@ export default function Example() {
   return (
     <main className="sm:bg-top md:min-h-screen bg-gradient-to-t from-blue-700  to-gray-800">
       <div className="max-w-7xl mx-auto px-4 py-16 text-center sm:px-6 sm:py-24 lg:px-8 lg:py-48">
-        <img
-          src={logoToLoad.src}
-          alt={logoToLoad.alt}
-          style={{ height: '85px' }}
-          className="mx-auto"
-        />
-        <h1 className="mt-2 text-4xl font-extrabold text-white tracking-tight sm:text-5xl">
-          {title}
-        </h1>
+        <img src={logoToLoad.src} alt={logoToLoad.alt} style={{ height: '85px' }} className="mx-auto" />
+        <h1 className="mt-2 text-4xl font-extrabold text-white tracking-tight sm:text-5xl">{title}</h1>
         {tagline && <p className="mt-2 text-lg font-medium text-white">{tagline}</p>}
         <div className="mt-5 max-w-md mx-auto sm:flex sm:justify-center md:mt-8">
           <div className="rounded-md shadow">

package/pages/overview.tsx

@@ -6,10 +6,7 @@ import dynamic from 'next/dynamic';
 
 import { getAllEvents, getUniqueServicesNamesFromEvents } from '@/lib/events';
 
-const ForceGraph3D = dynamic(
-  () => import('react-force-graph-3d').then((module) => module.default),
-  { ssr: false }
-);
+const ForceGraph3D = dynamic(() => import('react-force-graph-3d').then((module) => module.default), { ssr: false });
 
 function NodeElement({ node: { id } }: { node: { id: string } }) {
   return <div className={`text-sm text-center p-1 rounded-md `}>{id}</div>;

package/pages/services.tsx

@@ -31,9 +31,7 @@ export default function Page({ services }: PageProps) {
       </Head>
       <main className="max-w-7xl mx-auto md:min-h-screen px-4 md:px-0">
         <div className="relative z-10 flex items-baseline justify-between pt-8 pb-6 border-b border-gray-200">
-          <h1 className="text-2xl font-extrabold tracking-tight text-gray-900">
-            Services ({services.length})
-          </h1>
+          <h1 className="text-2xl font-extrabold tracking-tight text-gray-900">Services ({services.length})</h1>
 
           <div className="flex items-center">
             <Menu as="div" className="relative hidden text-left">
@@ -99,9 +97,7 @@ export default function Page({ services }: PageProps) {
 
             <div className="col-span-4 lg:col-span-3">
               <div>
-                <h2 className="text-gray-500 text-xs font-medium uppercase tracking-wide">
-                  Services
-                </h2>
+                <h2 className="text-gray-500 text-xs font-medium uppercase tracking-wide">Services</h2>
                 <ServiceGrid services={services} />
               </div>
             </div>

package/pages/users/[id].tsx

@@ -29,15 +29,11 @@ export default function UserPage({ events, services, userId }: UserPageProps) {
                 </div>
               </div>
               <div className=" border-b border-gray-100 pb-6">
-                <h1 className="text-lg font-bold text-gray-800 relative mt-4">
-                  Owner of Events ({events.length})
-                </h1>
+                <h1 className="text-lg font-bold text-gray-800 relative mt-4">Owner of Events ({events.length})</h1>
                 <EventGrid events={events} />
               </div>
               <div>
-                <h1 className="text-lg font-bold text-gray-800 relative mt-4">
-                  Owner of Services ({services.length})
-                </h1>
+                <h1 className="text-lg font-bold text-gray-800 relative mt-4">Owner of Services ({services.length})</h1>
                 <ServiceGrid services={services} />
               </div>
             </div>
@@ -46,10 +42,7 @@ export default function UserPage({ events, services, userId }: UserPageProps) {
                 <div className="flex-shrink-0">
                   <div className="relative">
                     <img className="h-16 w-16 rounded-full" src={user.avatarUrl} alt="" />
-                    <span
-                      className="absolute inset-0 shadow-inner rounded-full"
-                      aria-hidden="true"
-                    />
+                    <span className="absolute inset-0 shadow-inner rounded-full" aria-hidden="true" />
                   </div>
                 </div>
                 <div>
@@ -57,9 +50,7 @@ export default function UserPage({ events, services, userId }: UserPageProps) {
                   <p className="text-sm font-medium text-gray-500">{user.role}</p>
                 </div>
               </div>
-              <div className="mt-6 flow-root border-t border-gray-200 py-6 text-sm">
-                {user.summary}
-              </div>
+              <div className="mt-6 flow-root border-t border-gray-200 py-6 text-sm">{user.summary}</div>
             </div>
           </div>
         </div>

package/scripts/__tests__/assets/eventcatalog.config.js

@@ -26,8 +26,7 @@ module.exports = {
       name: 'Matthew Smith',
       avatarUrl: 'https://randomuser.me/api/portraits/lego/3.jpg',
       role: 'Developer',
-      summary:
-        'About Fugiat ipsum ipsum deserunt culpa aute sint do nostrud anim incididunt cillum culpa consequat.',
+      summary: 'About Fugiat ipsum ipsum deserunt culpa aute sint do nostrud anim incididunt cillum culpa consequat.',
     },
   ],
 };

package/scripts/__tests__/generate.spec.ts

@@ -31,9 +31,6 @@ describe('generate script', () => {
     await generate();
 
     expect(mockPlugin).toHaveBeenCalled();
-    expect(mockPlugin).toHaveBeenCalledWith(
-      { eventCatalogConfig: config },
-      { file: './asyncapi.yml' }
-    );
+    expect(mockPlugin).toHaveBeenCalledWith({ eventCatalogConfig: config }, { file: './asyncapi.yml' });
   });
 });

package/tailwind.config.js

@@ -8,9 +8,5 @@ module.exports = {
     extend: {},
   },
   purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
-  plugins: [
-    require('@tailwindcss/typography'),
-    require('@tailwindcss/forms'),
-    require('@tailwindcss/line-clamp'),
-  ],
+  plugins: [require('@tailwindcss/typography'), require('@tailwindcss/forms'), require('@tailwindcss/line-clamp')],
 };

package/tsconfig.json

@@ -27,12 +27,6 @@
     },
     "jsx": "preserve"
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    "hooks/EventCatalog.tsx",
-    "scripts/generate.js"
-  ],
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "hooks/EventCatalog.tsx", "scripts/generate.js"],
   "exclude": ["node_modules"]
 }