@eventcatalog/core 2.8.5 → 2.8.6
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.
- package/.all-contributorsrc +9 -0
- package/CHANGELOG.md +6 -0
- package/README.md +2 -1
- package/package.json +1 -1
- package/src/components/DiscoverInsight.astro +52 -0
- package/src/pages/index.astro +47 -123
package/.all-contributorsrc
CHANGED
|
@@ -410,6 +410,15 @@
|
|
|
410
410
|
"contributions": [
|
|
411
411
|
"doc"
|
|
412
412
|
]
|
|
413
|
+
},
|
|
414
|
+
{
|
|
415
|
+
"login": "d-o-h",
|
|
416
|
+
"name": "d-o-h",
|
|
417
|
+
"avatar_url": "https://avatars.githubusercontent.com/u/23699653?v=4",
|
|
418
|
+
"profile": "https://github.com/d-o-h",
|
|
419
|
+
"contributions": [
|
|
420
|
+
"code"
|
|
421
|
+
]
|
|
413
422
|
}
|
|
414
423
|
],
|
|
415
424
|
"contributorsPerLine": 7,
|
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
<h4>Features: Documentation generator for Event Driven Architectures, Markdown driven, Document Domains/Services/Messages/Schemas and more, Content versioning, Assign Owners, Schemas, OpenAPI, MDX Components and more...</h4>
|
|
30
30
|
|
|
31
31
|
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
|
|
32
|
-
[](#contributors-)
|
|
33
33
|
<!-- ALL-CONTRIBUTORS-BADGE:END -->
|
|
34
34
|
|
|
35
35
|
[Read the Docs](https://eventcatalog.dev/) | [Edit the Docs](https://github.com/event-catalog/docs) | [View Demo](https://demo.eventcatalog.dev/docs)
|
|
@@ -228,6 +228,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
|
|
|
228
228
|
</tr>
|
|
229
229
|
<tr>
|
|
230
230
|
<td align="center" valign="top" width="14.28%"><a href="https://github.com/hpatoio"><img src="https://avatars.githubusercontent.com/u/249948?v=4?s=100" width="100px;" alt="Simone Fumagalli"/><br /><sub><b>Simone Fumagalli</b></sub></a><br /><a href="https://github.com/event-catalog/eventcatalog/commits?author=hpatoio" title="Documentation">📖</a></td>
|
|
231
|
+
<td align="center" valign="top" width="14.28%"><a href="https://github.com/d-o-h"><img src="https://avatars.githubusercontent.com/u/23699653?v=4?s=100" width="100px;" alt="d-o-h"/><br /><sub><b>d-o-h</b></sub></a><br /><a href="https://github.com/event-catalog/eventcatalog/commits?author=d-o-h" title="Code">💻</a></td>
|
|
231
232
|
</tr>
|
|
232
233
|
</tbody>
|
|
233
234
|
</table>
|
package/package.json
CHANGED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
---
|
|
2
|
+
import { buildUrl } from '@utils/url-builder';
|
|
3
|
+
import type React from 'react';
|
|
4
|
+
|
|
5
|
+
interface Props {
|
|
6
|
+
color: string;
|
|
7
|
+
dataTarget: number;
|
|
8
|
+
icon: React.ElementType;
|
|
9
|
+
label: 'domains' | 'services' | 'commands' | 'events' | 'flows';
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
const { color, dataTarget, icon: Icon, label } = Astro.props;
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
<div class={`relative text-center ${color}`}>
|
|
16
|
+
<div class="flex justify-center mb-2">
|
|
17
|
+
<Icon className="w-8 h-8" />
|
|
18
|
+
</div>
|
|
19
|
+
|
|
20
|
+
<div class="text-2xl font-bold mb-1">
|
|
21
|
+
<span class="statistic" data-target={dataTarget}>0</span>
|
|
22
|
+
</div>
|
|
23
|
+
|
|
24
|
+
<a
|
|
25
|
+
href={buildUrl(`/discover/${label}`)}
|
|
26
|
+
class="static before:block before:absolute before:top-0 before:left-0 before:z-0 before:w-full before:h-full hover:underline underline-offset-8 text-sm text-gray-600 capitalize"
|
|
27
|
+
>
|
|
28
|
+
{label}
|
|
29
|
+
</a>
|
|
30
|
+
</div>
|
|
31
|
+
|
|
32
|
+
<script>
|
|
33
|
+
function animateStatistics() {
|
|
34
|
+
const statistics = document.querySelectorAll('.statistic');
|
|
35
|
+
statistics.forEach((statistic) => {
|
|
36
|
+
let target = parseInt(statistic.getAttribute('data-target')!);
|
|
37
|
+
let current = 0;
|
|
38
|
+
const increment = target / 50;
|
|
39
|
+
const timer = setInterval(() => {
|
|
40
|
+
current += increment;
|
|
41
|
+
if (current >= target) {
|
|
42
|
+
clearInterval(timer);
|
|
43
|
+
statistic.textContent = target.toString();
|
|
44
|
+
} else {
|
|
45
|
+
statistic.textContent = Math.round(current).toString();
|
|
46
|
+
}
|
|
47
|
+
}, 20);
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
window.addEventListener('load', animateStatistics);
|
|
52
|
+
</script>
|
package/src/pages/index.astro
CHANGED
|
@@ -8,6 +8,7 @@ import { getMessages } from '@utils/messages';
|
|
|
8
8
|
import { getDomains } from '@utils/domains/domains';
|
|
9
9
|
import { getServices } from '@utils/services/services';
|
|
10
10
|
import { getFlows } from '@utils/flows/flows';
|
|
11
|
+
import DiscoverInsight from '@components/DiscoverInsight.astro';
|
|
11
12
|
|
|
12
13
|
const { commands = [], events = [] } = await getMessages();
|
|
13
14
|
const domains = await getDomains();
|
|
@@ -30,138 +31,61 @@ const flows = await getFlows();
|
|
|
30
31
|
<h2 class="text-center text-xl font-bold">Architecture insights</h2>
|
|
31
32
|
<section class="mb-16 bg-white rounded-xl shadow-lg p-6">
|
|
32
33
|
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4">
|
|
33
|
-
<
|
|
34
|
-
<div class="flex justify-center mb-2">
|
|
35
|
-
<RectangleGroupIcon className="w-8 h-8 text-yellow-600" />
|
|
36
|
-
</div>
|
|
37
|
-
<div class="text-2xl font-bold text-yellow-600 mb-1">
|
|
38
|
-
<span class="statistic" data-target="5">0</span>
|
|
39
|
-
</div>
|
|
40
|
-
<div class="text-sm text-gray-600">Domains</div>
|
|
41
|
-
</div>
|
|
42
|
-
<div class="text-center">
|
|
43
|
-
<div class="flex justify-center mb-2">
|
|
44
|
-
<ServerIcon className="w-8 h-8 text-pink-500" />
|
|
45
|
-
</div>
|
|
46
|
-
<div class="text-2xl font-bold text-pink-500 mb-1">
|
|
47
|
-
<span class="statistic" data-target="12">0</span>
|
|
48
|
-
</div>
|
|
49
|
-
<div class="text-sm text-gray-600">Services</div>
|
|
50
|
-
</div>
|
|
51
|
-
<div class="text-center">
|
|
52
|
-
<div class="flex justify-center mb-2">
|
|
53
|
-
<ChatBubbleLeftIcon className="w-8 h-8 text-blue-500" />
|
|
54
|
-
</div>
|
|
55
|
-
<div class="text-2xl font-bold text-blue-500 mb-1">
|
|
56
|
-
<span class="statistic" data-target="30">0</span>
|
|
57
|
-
</div>
|
|
58
|
-
<div class="text-sm text-gray-600">Commands</div>
|
|
59
|
-
</div>
|
|
60
|
-
<div class="text-center">
|
|
61
|
-
<div class="flex justify-center mb-2">
|
|
62
|
-
<BoltIcon className="w-8 h-8 text-orange-400" />
|
|
63
|
-
</div>
|
|
64
|
-
<div class="text-2xl font-bold text-orange-400 mb-1">
|
|
65
|
-
<span class="statistic" data-target="20">0</span>
|
|
66
|
-
</div>
|
|
67
|
-
<div class="text-sm text-gray-600">Events</div>
|
|
68
|
-
</div>
|
|
34
|
+
<DiscoverInsight color="text-yellow-600" dataTarget={domains.length} icon={RectangleGroupIcon} label="domains" />
|
|
69
35
|
|
|
70
|
-
<
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
<div class="text-sm text-gray-600">Flows</div>
|
|
78
|
-
</div>
|
|
36
|
+
<DiscoverInsight color="text-pink-500" dataTarget={services.length} icon={ServerIcon} label="services" />
|
|
37
|
+
|
|
38
|
+
<DiscoverInsight color="text-blue-500" dataTarget={commands.length} icon={ChatBubbleLeftIcon} label="commands" />
|
|
39
|
+
|
|
40
|
+
<DiscoverInsight color="text-orange-400" dataTarget={events.length} icon={BoltIcon} label="events" />
|
|
41
|
+
|
|
42
|
+
<DiscoverInsight color="text-green-800" dataTarget={flows.length} icon={QueueListIcon} label="flows" />
|
|
79
43
|
</div>
|
|
80
44
|
</section>
|
|
81
|
-
</div>
|
|
82
45
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
46
|
+
<section class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
|
47
|
+
<div
|
|
48
|
+
class="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-xl transition duration-300 transform hover:-translate-y-1"
|
|
49
|
+
>
|
|
50
|
+
<div class="h-2 bg-blue-400"></div>
|
|
51
|
+
<div class="p-6">
|
|
52
|
+
<h2 class="text-2xl font-semibold mb-4 text-blue-700">Documentation</h2>
|
|
53
|
+
<p class="text-gray-600 mb-4">
|
|
54
|
+
Create and maintain comprehensive documentation for your events, including schemas, examples, and versioning.
|
|
55
|
+
</p>
|
|
56
|
+
<a href={buildUrl('/docs')} class="text-blue-600 hover:text-blue-800 font-semibold">Explore docs →</a>
|
|
57
|
+
</div>
|
|
94
58
|
</div>
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
59
|
+
<div
|
|
60
|
+
class="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-xl transition duration-300 transform hover:-translate-y-1"
|
|
61
|
+
>
|
|
62
|
+
<div class="h-2 bg-teal-400"></div>
|
|
63
|
+
<div class="p-6">
|
|
64
|
+
<h2 class="text-2xl font-semibold mb-4 text-teal-700">Visualiser</h2>
|
|
65
|
+
<p class="text-gray-600 mb-4">
|
|
66
|
+
Transform complex event flows into clear, interactive diagrams. Gain insights at a glance and communicate
|
|
67
|
+
effectively across teams.
|
|
68
|
+
</p>
|
|
69
|
+
<a href={buildUrl('/visualiser')} class="text-teal-600 hover:text-teal-800 font-semibold">Explore visualiser →</a>
|
|
70
|
+
</div>
|
|
107
71
|
</div>
|
|
108
|
-
</div>
|
|
109
72
|
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
73
|
+
<div
|
|
74
|
+
class="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-xl transition duration-300 transform hover:-translate-y-1"
|
|
75
|
+
>
|
|
76
|
+
<div class="h-2 bg-red-700"></div>
|
|
77
|
+
<div class="p-6">
|
|
78
|
+
<h2 class="text-2xl font-semibold mb-4 text-red-700">Discover</h2>
|
|
79
|
+
<p class="text-gray-600 mb-4">
|
|
80
|
+
Dive deep into your event catalog. Search, filter, and analyze your events to gain insights and improve your
|
|
81
|
+
architecture.
|
|
82
|
+
</p>
|
|
83
|
+
<a href={buildUrl('/discover/events')} class="text-red-600 hover:text-red-800 font-semibold">Start exploring →</a>
|
|
84
|
+
</div>
|
|
121
85
|
</div>
|
|
122
|
-
</
|
|
123
|
-
</
|
|
86
|
+
</section>
|
|
87
|
+
</div>
|
|
124
88
|
</main>
|
|
125
|
-
|
|
126
|
-
<script define:vars={{ domains, services, commands, events, flows }}>
|
|
127
|
-
function animateStatistics() {
|
|
128
|
-
const statistics = document.querySelectorAll('.statistic');
|
|
129
|
-
statistics.forEach((statistic) => {
|
|
130
|
-
let target;
|
|
131
|
-
switch (statistic.parentElement.nextElementSibling.textContent.trim()) {
|
|
132
|
-
case 'Domains':
|
|
133
|
-
target = domains.length;
|
|
134
|
-
break;
|
|
135
|
-
case 'Services':
|
|
136
|
-
target = services.length;
|
|
137
|
-
break;
|
|
138
|
-
case 'Commands':
|
|
139
|
-
target = commands.length;
|
|
140
|
-
break;
|
|
141
|
-
case 'Events':
|
|
142
|
-
target = events.length;
|
|
143
|
-
break;
|
|
144
|
-
case 'Flows':
|
|
145
|
-
target = flows.length;
|
|
146
|
-
break;
|
|
147
|
-
default:
|
|
148
|
-
target = parseInt(statistic.getAttribute('data-target'));
|
|
149
|
-
}
|
|
150
|
-
let current = 0;
|
|
151
|
-
const increment = target / 50;
|
|
152
|
-
const timer = setInterval(() => {
|
|
153
|
-
current += increment;
|
|
154
|
-
statistic.textContent = Math.round(current);
|
|
155
|
-
if (current >= target) {
|
|
156
|
-
clearInterval(timer);
|
|
157
|
-
statistic.textContent = target;
|
|
158
|
-
}
|
|
159
|
-
}, 20);
|
|
160
|
-
});
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
window.addEventListener('load', animateStatistics);
|
|
164
|
-
</script>
|
|
165
89
|
</body>
|
|
166
90
|
</PlainPage>
|
|
167
91
|
|