Skip to content

Commit fa47d1e

Browse files
authored
feat(core): added ability for defult homepage and turn visualizer off (event-catalog#1861)
* feat(core): added ability for defult homepage and turn visualizer off * Create three-suits-switch.md
1 parent 3e48417 commit fa47d1e

File tree

20 files changed

+163
-89
lines changed

20 files changed

+163
-89
lines changed

.changeset/three-suits-switch.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@eventcatalog/core": patch
3+
---
4+
5+
feat(core): added ability for defult homepage and turn visualizer off

eventcatalog/src/components/Grids/MessageGrid.tsx

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ interface MessageGridProps {
1111
messages: CollectionEntry<CollectionMessageTypes>[];
1212
containers?: CollectionEntry<'containers'>[];
1313
embeded: boolean;
14+
isVisualiserEnabled: boolean;
1415
}
1516

1617
interface GroupedMessages {
@@ -19,7 +20,7 @@ interface GroupedMessages {
1920
receives?: CollectionEntry<CollectionMessageTypes>[];
2021
}
2122

22-
export default function MessageGrid({ messages, embeded, containers }: MessageGridProps) {
23+
export default function MessageGrid({ messages, embeded, containers, isVisualiserEnabled }: MessageGridProps) {
2324
const [searchQuery, setSearchQuery] = useState('');
2425
const [urlParams, setUrlParams] = useState<{
2526
serviceId?: string;
@@ -344,12 +345,14 @@ export default function MessageGrid({ messages, embeded, containers }: MessageGr
344345
</a>
345346
</div>
346347
<div className="flex gap-2">
347-
<a
348-
href={buildUrl(`/visualiser/domains/${urlParams.domainId}`)}
349-
className="inline-flex items-center px-3 py-2 text-sm font-medium bg-white border border-gray-300 rounded-md transition-colors duration-200"
350-
>
351-
View in visualizer
352-
</a>
348+
{isVisualiserEnabled && (
349+
<a
350+
href={buildUrl(`/visualiser/domains/${urlParams.domainId}`)}
351+
className="inline-flex items-center px-3 py-2 text-sm font-medium bg-white border border-gray-300 rounded-md transition-colors duration-200"
352+
>
353+
View in visualizer
354+
</a>
355+
)}
353356
<a
354357
href={buildUrl(`/docs/domains/${urlParams.domainId}`)}
355358
className="inline-flex items-center px-3 py-2 text-sm font-medium text-black border border-gray-300 bg-white rounded-md transition-colors duration-200"
@@ -372,12 +375,14 @@ export default function MessageGrid({ messages, embeded, containers }: MessageGr
372375
<ServerIcon className="h-6 w-6 text-pink-500" />
373376
<h2 className="text-2xl font-semibold text-gray-900">{urlParams.serviceName}</h2>
374377
<div className="flex gap-2 ml-auto">
375-
<a
376-
href={buildUrl(`/visualiser/services/${urlParams.serviceId}`)}
377-
className="inline-flex items-center px-3 py-2 text-sm font-medium bg-white border border-gray-300 rounded-md transition-colors duration-200 hover:bg-gray-50"
378-
>
379-
View in visualizer
380-
</a>
378+
{isVisualiserEnabled && (
379+
<a
380+
href={buildUrl(`/visualiser/services/${urlParams.serviceId}`)}
381+
className="inline-flex items-center px-3 py-2 text-sm font-medium bg-white border border-gray-300 rounded-md transition-colors duration-200 hover:bg-gray-50"
382+
>
383+
View in visualizer
384+
</a>
385+
)}
381386
<a
382387
href={buildUrl(`/docs/services/${urlParams.serviceId}`)}
383388
className="inline-flex items-center px-3 py-2 text-sm font-medium text-black border border-gray-300 bg-white rounded-md transition-colors duration-200 hover:bg-gray-50"

eventcatalog/src/components/Grids/ServiceGrid.tsx

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -183,12 +183,14 @@ const DomainSection = memo(
183183
urlParams,
184184
selectedTypes,
185185
isMultiColumn,
186+
isVisualiserEnabled,
186187
}: {
187188
domain: any;
188189
services: any[];
189190
urlParams: any;
190191
selectedTypes: string[];
191192
isMultiColumn: boolean;
193+
isVisualiserEnabled: boolean;
192194
}) => {
193195
const subdomains = domain.data.domains || [];
194196
const allSubDomainServices = subdomains.map((subdomain: any) => subdomain.data.services || []).flat();
@@ -227,12 +229,14 @@ const DomainSection = memo(
227229
<h3 className="text-xl font-semibold text-gray-900">{subdomain.data.name} (Subdomain)</h3>
228230
</div>
229231
<div className="flex gap-2">
230-
<a
231-
href={buildUrl(`/visualiser/domains/${subdomain.data.id}`)}
232-
className="inline-flex items-center px-3 py-2 text-sm font-medium bg-white border border-gray-300 rounded-md transition-colors duration-200"
233-
>
234-
View in visualizer
235-
</a>
232+
{isVisualiserEnabled && (
233+
<a
234+
href={buildUrl(`/visualiser/domains/${subdomain.data.id}`)}
235+
className="inline-flex items-center px-3 py-2 text-sm font-medium bg-white border border-gray-300 rounded-md transition-colors duration-200"
236+
>
237+
View in visualizer
238+
</a>
239+
)}
236240
<a
237241
href={buildUrl(`/docs/domains/${subdomain.data.id}`)}
238242
className="inline-flex items-center px-3 py-2 text-sm font-medium text-black border border-gray-300 bg-white rounded-md transition-colors duration-200"
@@ -292,10 +296,11 @@ interface ServiceGridProps {
292296
services: CollectionEntry<'services'>[];
293297
domains: ExtendedDomain[];
294298
embeded: boolean;
299+
isVisualiserEnabled: boolean;
295300
}
296301

297302
// Main ServiceGrid component
298-
export default function ServiceGrid({ services, domains, embeded }: ServiceGridProps) {
303+
export default function ServiceGrid({ services, domains, embeded, isVisualiserEnabled }: ServiceGridProps) {
299304
const [searchQuery, setSearchQuery] = useState('');
300305
const [currentPage, setCurrentPage] = useState(1);
301306
const [selectedTypes, setSelectedTypes] = useState<CollectionMessageTypes[]>([]);
@@ -493,6 +498,7 @@ export default function ServiceGrid({ services, domains, embeded }: ServiceGridP
493498
urlParams={urlParams}
494499
selectedTypes={selectedTypes}
495500
isMultiColumn={isMultiColumn}
501+
isVisualiserEnabled={isVisualiserEnabled}
496502
/>
497503
))
498504
) : (

eventcatalog/src/components/MDX/Design/Design.astro

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import { getAbsoluteFilePathForAstroFile } from '@utils/files';
55
import Admonition from '@components/MDX/Admonition';
66
import NodeGraph from '../NodeGraph/NodeGraph';
77
8+
import { isVisualiserEnabled } from '@utils/feature';
9+
810
let design: any;
911
let id = 'design';
1012
let maxHeight = 30;
@@ -49,7 +51,8 @@ try {
4951
title={title ?? design.name}
5052
nodes={design.nodes || []}
5153
edges={design.edges || []}
52-
hrefLabel={'View in visualizer'}
54+
hrefLabel={isVisualiserEnabled() ? 'View in visualizer' : undefined}
55+
href={isVisualiserEnabled() ? `/visualiser/designs/${design.id}` : undefined}
5356
linkTo={'visualiser'}
5457
designId={design.id || id}
5558
client:only="react"

eventcatalog/src/components/MDX/Flow/Flow.astro

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { getNodesAndEdges } from '@utils/node-graphs/flows-node-graph';
44
import Admonition from '@components/MDX/Admonition';
55
import NodeGraph from '../NodeGraph/NodeGraph';
66
import { getVersionFromCollection } from '@utils/collections/versions';
7+
import { isVisualiserEnabled } from '@utils/feature';
78
89
const { id, version = 'latest', maxHeight, includeKey = true, mode = 'simple', walkthrough = true, search = true } = Astro.props;
910
@@ -49,7 +50,7 @@ const { nodes, edges } = await getNodesAndEdges({
4950
nodes={nodes}
5051
edges={edges}
5152
hrefLabel={'View in visualizer'}
52-
href={`/visualiser/flows/${id}/${version}`}
53+
href={isVisualiserEnabled() ? `/visualiser/flows/${id}/${version}` : undefined}
5354
linkTo={'visualiser'}
5455
includeKey={includeKey}
5556
footerLabel=`Flow diagram - ${flow.data.name} - v(${flow.data.version})`

eventcatalog/src/components/MDX/NodeGraph/NodeGraph.astro

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ interface Props {
2626
version: string;
2727
mode: 'full' | 'simple';
2828
linkTo?: 'docs' | 'visualiser';
29-
href: {
29+
href?: {
3030
label: string;
3131
url: string;
3232
};
@@ -142,8 +142,8 @@ if (collection === 'services-containers') {
142142
nodes={nodes}
143143
edges={edges}
144144
title={title}
145-
hrefLabel={href.label}
146-
href={href.url}
145+
hrefLabel={href?.label}
146+
href={href?.url}
147147
linkTo={linkTo}
148148
client:only="react"
149149
linksToVisualiser={linksToVisualiser}

eventcatalog/src/components/SideBars/ContainerSideBar.astro

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { ScrollText, Workflow, RssIcon } from 'lucide-react';
88
import RepositoryList from '@components/Lists/RepositoryList.astro';
99
import { getOwner } from '@utils/collections/owners';
1010
import CustomSideBarSectionList from '@components/Lists/CustomSideBarSectionList.astro';
11-
import { isChangelogEnabled } from '@utils/feature';
11+
import { isChangelogEnabled, isVisualiserEnabled } from '@utils/feature';
1212
import config from '@config';
1313
1414
interface Props {
@@ -156,14 +156,17 @@ const isRSSEnabled = config.rss?.enabled;
156156
}
157157

158158
<div class="space-y-2">
159-
<a
160-
href={buildUrl(`/visualiser/${container.collection}/${container.data.id}/${container.data.version}`)}
161-
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
162-
>
163-
<Workflow strokeWidth={2} size={16} />
164-
<span class="block">View in visualiser</span>
165-
</a>
166-
159+
{
160+
isVisualiserEnabled() && (
161+
<a
162+
href={buildUrl(`/visualiser/${container.collection}/${container.data.id}/${container.data.version}`)}
163+
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
164+
>
165+
<Workflow strokeWidth={2} size={16} />
166+
<span class="block">View in visualiser</span>
167+
</a>
168+
)
169+
}
167170
{
168171
isChangelogEnabled() && shouldRenderSideBarSection('changelog') && (
169172
<a

eventcatalog/src/components/SideBars/DomainSideBar.astro

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { getOwner } from '@utils/collections/owners';
99
import { buildUrl } from '@utils/url-builder';
1010
import type { CollectionEntry } from 'astro:content';
1111
import { ScrollText, Workflow } from 'lucide-react';
12-
import { isChangelogEnabled } from '@utils/feature';
12+
import { isChangelogEnabled, isVisualiserEnabled } from '@utils/feature';
1313
1414
interface Props {
1515
domain: CollectionEntry<'domains'>;
@@ -250,13 +250,17 @@ const shouldRenderSideBarSection = (section: string) => {
250250
}
251251

252252
<div class="space-y-2">
253-
<a
254-
href={buildUrl(`/visualiser/${domain.collection}/${domain.data.id}/${domain.data.version}`)}
255-
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
256-
>
257-
<Workflow strokeWidth={2} size={16} />
258-
<span class="block">View in visualiser</span>
259-
</a>
253+
{
254+
isVisualiserEnabled() && (
255+
<a
256+
href={buildUrl(`/visualiser/${domain.collection}/${domain.data.id}/${domain.data.version}`)}
257+
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
258+
>
259+
<Workflow strokeWidth={2} size={16} />
260+
<span class="block">View in visualiser</span>
261+
</a>
262+
)
263+
}
260264
{
261265
isChangelogEnabled() && shouldRenderSideBarSection('changelog') && (
262266
<a

eventcatalog/src/components/SideBars/FlowSideBar.astro

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { getOwner } from '@utils/collections/owners';
77
import type { CollectionEntry } from 'astro:content';
88
import { ScrollText, Workflow, RssIcon } from 'lucide-react';
99
import config from '@config';
10-
import { isChangelogEnabled } from '@utils/feature';
10+
import { isChangelogEnabled, isVisualiserEnabled } from '@utils/feature';
1111
import CustomSideBarSectionList from '@components/Lists/CustomSideBarSectionList.astro';
1212
interface Props {
1313
flow: CollectionEntry<'flows'>;
@@ -105,13 +105,17 @@ const shouldRenderSideBarSection = (section: string) => {
105105
}
106106

107107
<div class="space-y-2">
108-
<a
109-
href={buildUrl(`/visualiser/${flow.collection}/${flow.data.id}/${flow.data.version}`)}
110-
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
111-
>
112-
<Workflow strokeWidth={2} size={16} />
113-
<span class="block">View in visualiser</span>
114-
</a>
108+
{
109+
isVisualiserEnabled() && (
110+
<a
111+
href={buildUrl(`/visualiser/${flow.collection}/${flow.data.id}/${flow.data.version}`)}
112+
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
113+
>
114+
<Workflow strokeWidth={2} size={16} />
115+
<span class="block">View in visualiser</span>
116+
</a>
117+
)
118+
}
115119
{
116120
isChangelogEnabled() && shouldRenderSideBarSection('changelog') && (
117121
<a

eventcatalog/src/components/SideBars/MessageSideBar.astro

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { getOwner } from '@utils/collections/owners';
1212
import CustomSideBarSectionList from '@components/Lists/CustomSideBarSectionList.astro';
1313
import config from '@config';
1414
import { getSchemaFormatFromURL } from '@utils/collections/schemas';
15-
import { isChangelogEnabled } from '@utils/feature';
15+
import { isChangelogEnabled, isVisualiserEnabled } from '@utils/feature';
1616
interface Props {
1717
message: CollectionEntry<CollectionMessageTypes>;
1818
}
@@ -224,14 +224,17 @@ const shouldRenderSideBarSection = (section: string) => {
224224
</a>
225225
)
226226
}
227-
<a
228-
href={buildUrl(`/visualiser/${message.collection}/${message.data.id}/${message.data.version}`)}
229-
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
230-
>
231-
<Workflow strokeWidth={2} size={16} />
232-
<span class="block">View in visualiser</span>
233-
</a>
234-
227+
{
228+
isVisualiserEnabled() && (
229+
<a
230+
href={buildUrl(`/visualiser/${message.collection}/${message.data.id}/${message.data.version}`)}
231+
class="flex items-center justify-center space-x-2 text-center rounded-md w-full bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-100/60 hover:text-primary"
232+
>
233+
<Workflow strokeWidth={2} size={16} />
234+
<span class="block">View in visualiser</span>
235+
</a>
236+
)
237+
}
235238
{
236239
isChangelogEnabled() && shouldRenderSideBarSection('changelog') && (
237240
<a

0 commit comments

Comments
 (0)