@contractspec/example.integration-hub 2.5.0 → 2.6.1

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 (48) hide show
  1. package/README.md +40 -0
  2. package/dist/docs/index.js +2 -0
  3. package/dist/docs/integration-hub.docblock.js +2 -0
  4. package/dist/index.d.ts +1 -0
  5. package/dist/index.js +149 -0
  6. package/dist/mcp-example.d.ts +16 -0
  7. package/dist/mcp-example.js +151 -0
  8. package/dist/node/docs/index.js +2 -0
  9. package/dist/node/docs/integration-hub.docblock.js +2 -0
  10. package/dist/node/index.js +149 -0
  11. package/dist/node/mcp-example.js +150 -0
  12. package/dist/node/run-mcp.js +155 -0
  13. package/dist/run-mcp.d.ts +1 -0
  14. package/dist/run-mcp.js +156 -0
  15. package/package.json +34 -94
  16. package/dist/browser/connection/connection.enum.js +0 -12
  17. package/dist/browser/connection/connection.operation.js +0 -101
  18. package/dist/browser/connection/connection.presentation.js +0 -102
  19. package/dist/browser/connection/connection.schema.js +0 -48
  20. package/dist/browser/connection/index.js +0 -104
  21. package/dist/browser/docs/index.js +0 -104
  22. package/dist/browser/docs/integration-hub.docblock.js +0 -104
  23. package/dist/browser/events.js +0 -211
  24. package/dist/browser/example.js +0 -42
  25. package/dist/browser/handlers/index.js +0 -246
  26. package/dist/browser/handlers/integration.handlers.js +0 -246
  27. package/dist/browser/index.js +0 -1595
  28. package/dist/browser/integration/index.js +0 -92
  29. package/dist/browser/integration/integration.enum.js +0 -12
  30. package/dist/browser/integration/integration.operations.js +0 -89
  31. package/dist/browser/integration/integration.presentation.js +0 -120
  32. package/dist/browser/integration/integration.schema.js +0 -42
  33. package/dist/browser/integration-hub.capability.js +0 -43
  34. package/dist/browser/integration-hub.feature.js +0 -114
  35. package/dist/browser/seeders/index.js +0 -60
  36. package/dist/browser/sync/index.js +0 -332
  37. package/dist/browser/sync/sync.enum.js +0 -26
  38. package/dist/browser/sync/sync.operations.js +0 -321
  39. package/dist/browser/sync/sync.presentation.js +0 -301
  40. package/dist/browser/sync/sync.schema.js +0 -154
  41. package/dist/browser/sync-engine/index.js +0 -186
  42. package/dist/browser/tests/operations.test-spec.js +0 -85
  43. package/dist/browser/ui/IntegrationDashboard.js +0 -369
  44. package/dist/browser/ui/hooks/index.js +0 -57
  45. package/dist/browser/ui/hooks/useIntegrationData.js +0 -54
  46. package/dist/browser/ui/index.js +0 -644
  47. package/dist/browser/ui/renderers/index.js +0 -273
  48. package/dist/browser/ui/renderers/integration.markdown.js +0 -273
@@ -1,85 +0,0 @@
1
- // src/tests/operations.test-spec.ts
2
- import { defineTestSpec } from "@contractspec/lib.contracts-spec/tests";
3
- var SyncConfigCreateTest = defineTestSpec({
4
- meta: {
5
- key: "integration.syncConfig.create.test",
6
- version: "1.0.0",
7
- stability: "experimental",
8
- owners: ["@example.integration-hub"],
9
- description: "Test for creating sync config",
10
- tags: ["test"]
11
- },
12
- target: {
13
- type: "operation",
14
- operation: { key: "integration.syncConfig.create", version: "1.0.0" }
15
- },
16
- scenarios: [
17
- {
18
- key: "success",
19
- when: { operation: { key: "integration.syncConfig.create" } },
20
- then: [{ type: "expectOutput", match: {} }]
21
- },
22
- {
23
- key: "error",
24
- when: { operation: { key: "integration.syncConfig.create" } },
25
- then: [{ type: "expectError" }]
26
- }
27
- ]
28
- });
29
- var FieldMappingAddTest = defineTestSpec({
30
- meta: {
31
- key: "integration.fieldMapping.add.test",
32
- version: "1.0.0",
33
- stability: "experimental",
34
- owners: ["@example.integration-hub"],
35
- description: "Test for adding field mapping",
36
- tags: ["test"]
37
- },
38
- target: {
39
- type: "operation",
40
- operation: { key: "integration.fieldMapping.add", version: "1.0.0" }
41
- },
42
- scenarios: [
43
- {
44
- key: "success",
45
- when: { operation: { key: "integration.fieldMapping.add" } },
46
- then: [{ type: "expectOutput", match: {} }]
47
- },
48
- {
49
- key: "error",
50
- when: { operation: { key: "integration.fieldMapping.add" } },
51
- then: [{ type: "expectError" }]
52
- }
53
- ]
54
- });
55
- var SyncRunListTest = defineTestSpec({
56
- meta: {
57
- key: "integration.syncRun.list.test",
58
- version: "1.0.0",
59
- stability: "experimental",
60
- owners: ["@example.integration-hub"],
61
- description: "Test for listing sync runs",
62
- tags: ["test"]
63
- },
64
- target: {
65
- type: "operation",
66
- operation: { key: "integration.syncRun.list", version: "1.0.0" }
67
- },
68
- scenarios: [
69
- {
70
- key: "success",
71
- when: { operation: { key: "integration.syncRun.list" } },
72
- then: [{ type: "expectOutput", match: {} }]
73
- },
74
- {
75
- key: "error",
76
- when: { operation: { key: "integration.syncRun.list" } },
77
- then: [{ type: "expectError" }]
78
- }
79
- ]
80
- });
81
- export {
82
- SyncRunListTest,
83
- SyncConfigCreateTest,
84
- FieldMappingAddTest
85
- };
@@ -1,369 +0,0 @@
1
- // src/ui/hooks/useIntegrationData.ts
2
- import { useCallback, useEffect, useState } from "react";
3
- import { useTemplateRuntime } from "@contractspec/lib.example-shared-ui";
4
- "use client";
5
- function useIntegrationData(projectId = "local-project") {
6
- const { handlers } = useTemplateRuntime();
7
- const integration = handlers.integration;
8
- const [integrations, setIntegrations] = useState([]);
9
- const [connections, setConnections] = useState([]);
10
- const [syncConfigs, setSyncConfigs] = useState([]);
11
- const [loading, setLoading] = useState(true);
12
- const [error, setError] = useState(null);
13
- const fetchData = useCallback(async () => {
14
- try {
15
- setLoading(true);
16
- setError(null);
17
- const [integResult, connResult, syncResult] = await Promise.all([
18
- integration.listIntegrations({ projectId, limit: 100 }),
19
- integration.listConnections({ limit: 100 }),
20
- integration.listSyncConfigs({ limit: 100 })
21
- ]);
22
- setIntegrations(integResult.integrations);
23
- setConnections(connResult.connections);
24
- setSyncConfigs(syncResult.configs);
25
- } catch (err) {
26
- setError(err instanceof Error ? err : new Error("Failed to load integrations"));
27
- } finally {
28
- setLoading(false);
29
- }
30
- }, [integration, projectId]);
31
- useEffect(() => {
32
- fetchData();
33
- }, [fetchData]);
34
- const stats = {
35
- totalIntegrations: integrations.length,
36
- activeIntegrations: integrations.filter((i) => i.status === "ACTIVE").length,
37
- totalConnections: connections.length,
38
- connectedCount: connections.filter((c) => c.status === "CONNECTED").length,
39
- totalSyncs: syncConfigs.length,
40
- activeSyncs: syncConfigs.filter((s) => s.status === "ACTIVE").length
41
- };
42
- return {
43
- integrations,
44
- connections,
45
- syncConfigs,
46
- loading,
47
- error,
48
- stats,
49
- refetch: fetchData
50
- };
51
- }
52
-
53
- // src/ui/IntegrationDashboard.tsx
54
- import { useState as useState2 } from "react";
55
- import {
56
- Button,
57
- ErrorState,
58
- LoaderBlock,
59
- StatCard,
60
- StatCardGroup
61
- } from "@contractspec/lib.design-system";
62
- import { jsxDEV } from "react/jsx-dev-runtime";
63
- "use client";
64
- var STATUS_COLORS = {
65
- ACTIVE: "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400",
66
- INACTIVE: "bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400",
67
- CONNECTED: "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400",
68
- DISCONNECTED: "bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400",
69
- PENDING: "bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400",
70
- ERROR: "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400",
71
- PAUSED: "bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400"
72
- };
73
- var TYPE_ICONS = {
74
- CRM: "\uD83D\uDCCA",
75
- MARKETING: "\uD83D\uDCE3",
76
- PAYMENT: "\uD83D\uDCB3",
77
- COMMUNICATION: "\uD83D\uDCAC",
78
- DATA: "\uD83D\uDDC4️",
79
- CUSTOM: "⚙️"
80
- };
81
- function IntegrationDashboard() {
82
- const [activeTab, setActiveTab] = useState2("integrations");
83
- const {
84
- integrations,
85
- connections,
86
- syncConfigs,
87
- loading,
88
- error,
89
- stats,
90
- refetch
91
- } = useIntegrationData();
92
- const tabs = [
93
- { id: "integrations", label: "Integrations", icon: "\uD83D\uDD0C" },
94
- { id: "connections", label: "Connections", icon: "\uD83D\uDD17" },
95
- { id: "syncs", label: "Sync Configs", icon: "\uD83D\uDD04" }
96
- ];
97
- if (loading) {
98
- return /* @__PURE__ */ jsxDEV(LoaderBlock, {
99
- label: "Loading Integrations..."
100
- }, undefined, false, undefined, this);
101
- }
102
- if (error) {
103
- return /* @__PURE__ */ jsxDEV(ErrorState, {
104
- title: "Failed to load Integrations",
105
- description: error.message,
106
- onRetry: refetch,
107
- retryLabel: "Retry"
108
- }, undefined, false, undefined, this);
109
- }
110
- return /* @__PURE__ */ jsxDEV("div", {
111
- className: "space-y-6",
112
- children: [
113
- /* @__PURE__ */ jsxDEV("div", {
114
- className: "flex items-center justify-between",
115
- children: [
116
- /* @__PURE__ */ jsxDEV("h2", {
117
- className: "text-2xl font-bold",
118
- children: "Integration Hub"
119
- }, undefined, false, undefined, this),
120
- /* @__PURE__ */ jsxDEV(Button, {
121
- onClick: () => alert("Add integration modal"),
122
- children: [
123
- /* @__PURE__ */ jsxDEV("span", {
124
- className: "mr-2",
125
- children: "+"
126
- }, undefined, false, undefined, this),
127
- " Add Integration"
128
- ]
129
- }, undefined, true, undefined, this)
130
- ]
131
- }, undefined, true, undefined, this),
132
- /* @__PURE__ */ jsxDEV(StatCardGroup, {
133
- children: [
134
- /* @__PURE__ */ jsxDEV(StatCard, {
135
- label: "Integrations",
136
- value: stats.totalIntegrations,
137
- hint: `${stats.activeIntegrations} active`
138
- }, undefined, false, undefined, this),
139
- /* @__PURE__ */ jsxDEV(StatCard, {
140
- label: "Connections",
141
- value: stats.totalConnections,
142
- hint: `${stats.connectedCount} connected`
143
- }, undefined, false, undefined, this),
144
- /* @__PURE__ */ jsxDEV(StatCard, {
145
- label: "Syncs",
146
- value: stats.totalSyncs,
147
- hint: `${stats.activeSyncs} active`
148
- }, undefined, false, undefined, this)
149
- ]
150
- }, undefined, true, undefined, this),
151
- /* @__PURE__ */ jsxDEV("nav", {
152
- className: "bg-muted flex gap-1 rounded-lg p-1",
153
- role: "tablist",
154
- children: tabs.map((tab) => /* @__PURE__ */ jsxDEV(Button, {
155
- type: "button",
156
- role: "tab",
157
- "aria-selected": activeTab === tab.id,
158
- onClick: () => setActiveTab(tab.id),
159
- className: `flex flex-1 items-center justify-center gap-2 rounded-md px-4 py-2 text-sm font-medium transition-colors ${activeTab === tab.id ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"}`,
160
- children: [
161
- /* @__PURE__ */ jsxDEV("span", {
162
- children: tab.icon
163
- }, undefined, false, undefined, this),
164
- tab.label
165
- ]
166
- }, tab.id, true, undefined, this))
167
- }, undefined, false, undefined, this),
168
- /* @__PURE__ */ jsxDEV("div", {
169
- className: "min-h-[400px]",
170
- role: "tabpanel",
171
- children: [
172
- activeTab === "integrations" && /* @__PURE__ */ jsxDEV("div", {
173
- className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3",
174
- children: [
175
- integrations.map((integration) => /* @__PURE__ */ jsxDEV("div", {
176
- className: "border-border bg-card hover:bg-muted/50 cursor-pointer rounded-lg border p-4 transition-colors",
177
- children: [
178
- /* @__PURE__ */ jsxDEV("div", {
179
- className: "mb-3 flex items-center gap-3",
180
- children: [
181
- /* @__PURE__ */ jsxDEV("span", {
182
- className: "text-2xl",
183
- children: TYPE_ICONS[integration.type] ?? "⚙️"
184
- }, undefined, false, undefined, this),
185
- /* @__PURE__ */ jsxDEV("div", {
186
- children: [
187
- /* @__PURE__ */ jsxDEV("h3", {
188
- className: "font-medium",
189
- children: integration.name
190
- }, undefined, false, undefined, this),
191
- /* @__PURE__ */ jsxDEV("p", {
192
- className: "text-muted-foreground text-sm",
193
- children: integration.type
194
- }, undefined, false, undefined, this)
195
- ]
196
- }, undefined, true, undefined, this)
197
- ]
198
- }, undefined, true, undefined, this),
199
- /* @__PURE__ */ jsxDEV("div", {
200
- className: "flex items-center justify-between",
201
- children: [
202
- /* @__PURE__ */ jsxDEV("span", {
203
- className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_COLORS[integration.status] ?? ""}`,
204
- children: integration.status
205
- }, undefined, false, undefined, this),
206
- /* @__PURE__ */ jsxDEV("span", {
207
- className: "text-muted-foreground text-xs",
208
- children: integration.createdAt.toLocaleDateString()
209
- }, undefined, false, undefined, this)
210
- ]
211
- }, undefined, true, undefined, this)
212
- ]
213
- }, integration.id, true, undefined, this)),
214
- integrations.length === 0 && /* @__PURE__ */ jsxDEV("div", {
215
- className: "text-muted-foreground col-span-full flex h-64 items-center justify-center",
216
- children: "No integrations configured"
217
- }, undefined, false, undefined, this)
218
- ]
219
- }, undefined, true, undefined, this),
220
- activeTab === "connections" && /* @__PURE__ */ jsxDEV("div", {
221
- className: "border-border rounded-lg border",
222
- children: /* @__PURE__ */ jsxDEV("table", {
223
- className: "w-full",
224
- children: [
225
- /* @__PURE__ */ jsxDEV("thead", {
226
- className: "border-border bg-muted/30 border-b",
227
- children: /* @__PURE__ */ jsxDEV("tr", {
228
- children: [
229
- /* @__PURE__ */ jsxDEV("th", {
230
- className: "px-4 py-3 text-left text-sm font-medium",
231
- children: "Connection"
232
- }, undefined, false, undefined, this),
233
- /* @__PURE__ */ jsxDEV("th", {
234
- className: "px-4 py-3 text-left text-sm font-medium",
235
- children: "Status"
236
- }, undefined, false, undefined, this),
237
- /* @__PURE__ */ jsxDEV("th", {
238
- className: "px-4 py-3 text-left text-sm font-medium",
239
- children: "Last Sync"
240
- }, undefined, false, undefined, this)
241
- ]
242
- }, undefined, true, undefined, this)
243
- }, undefined, false, undefined, this),
244
- /* @__PURE__ */ jsxDEV("tbody", {
245
- className: "divide-border divide-y",
246
- children: [
247
- connections.map((conn) => /* @__PURE__ */ jsxDEV("tr", {
248
- className: "hover:bg-muted/50",
249
- children: [
250
- /* @__PURE__ */ jsxDEV("td", {
251
- className: "px-4 py-3",
252
- children: /* @__PURE__ */ jsxDEV("div", {
253
- className: "font-medium",
254
- children: conn.name
255
- }, undefined, false, undefined, this)
256
- }, undefined, false, undefined, this),
257
- /* @__PURE__ */ jsxDEV("td", {
258
- className: "px-4 py-3",
259
- children: /* @__PURE__ */ jsxDEV("span", {
260
- className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_COLORS[conn.status] ?? ""}`,
261
- children: conn.status
262
- }, undefined, false, undefined, this)
263
- }, undefined, false, undefined, this),
264
- /* @__PURE__ */ jsxDEV("td", {
265
- className: "text-muted-foreground px-4 py-3 text-sm",
266
- children: conn.lastSyncAt?.toLocaleString() ?? "Never"
267
- }, undefined, false, undefined, this)
268
- ]
269
- }, conn.id, true, undefined, this)),
270
- connections.length === 0 && /* @__PURE__ */ jsxDEV("tr", {
271
- children: /* @__PURE__ */ jsxDEV("td", {
272
- colSpan: 3,
273
- className: "text-muted-foreground px-4 py-8 text-center",
274
- children: "No connections found"
275
- }, undefined, false, undefined, this)
276
- }, undefined, false, undefined, this)
277
- ]
278
- }, undefined, true, undefined, this)
279
- ]
280
- }, undefined, true, undefined, this)
281
- }, undefined, false, undefined, this),
282
- activeTab === "syncs" && /* @__PURE__ */ jsxDEV("div", {
283
- className: "border-border rounded-lg border",
284
- children: /* @__PURE__ */ jsxDEV("table", {
285
- className: "w-full",
286
- children: [
287
- /* @__PURE__ */ jsxDEV("thead", {
288
- className: "border-border bg-muted/30 border-b",
289
- children: /* @__PURE__ */ jsxDEV("tr", {
290
- children: [
291
- /* @__PURE__ */ jsxDEV("th", {
292
- className: "px-4 py-3 text-left text-sm font-medium",
293
- children: "Sync Config"
294
- }, undefined, false, undefined, this),
295
- /* @__PURE__ */ jsxDEV("th", {
296
- className: "px-4 py-3 text-left text-sm font-medium",
297
- children: "Frequency"
298
- }, undefined, false, undefined, this),
299
- /* @__PURE__ */ jsxDEV("th", {
300
- className: "px-4 py-3 text-left text-sm font-medium",
301
- children: "Status"
302
- }, undefined, false, undefined, this),
303
- /* @__PURE__ */ jsxDEV("th", {
304
- className: "px-4 py-3 text-left text-sm font-medium",
305
- children: "Records"
306
- }, undefined, false, undefined, this)
307
- ]
308
- }, undefined, true, undefined, this)
309
- }, undefined, false, undefined, this),
310
- /* @__PURE__ */ jsxDEV("tbody", {
311
- className: "divide-border divide-y",
312
- children: [
313
- syncConfigs.map((sync) => /* @__PURE__ */ jsxDEV("tr", {
314
- className: "hover:bg-muted/50",
315
- children: [
316
- /* @__PURE__ */ jsxDEV("td", {
317
- className: "px-4 py-3",
318
- children: [
319
- /* @__PURE__ */ jsxDEV("div", {
320
- className: "font-medium",
321
- children: sync.name
322
- }, undefined, false, undefined, this),
323
- /* @__PURE__ */ jsxDEV("div", {
324
- className: "text-muted-foreground text-sm",
325
- children: [
326
- sync.sourceEntity,
327
- " → ",
328
- sync.targetEntity
329
- ]
330
- }, undefined, true, undefined, this)
331
- ]
332
- }, undefined, true, undefined, this),
333
- /* @__PURE__ */ jsxDEV("td", {
334
- className: "px-4 py-3 text-sm",
335
- children: sync.frequency
336
- }, undefined, false, undefined, this),
337
- /* @__PURE__ */ jsxDEV("td", {
338
- className: "px-4 py-3",
339
- children: /* @__PURE__ */ jsxDEV("span", {
340
- className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_COLORS[sync.status] ?? ""}`,
341
- children: sync.status
342
- }, undefined, false, undefined, this)
343
- }, undefined, false, undefined, this),
344
- /* @__PURE__ */ jsxDEV("td", {
345
- className: "text-muted-foreground px-4 py-3 text-sm",
346
- children: sync.recordsSynced.toLocaleString()
347
- }, undefined, false, undefined, this)
348
- ]
349
- }, sync.id, true, undefined, this)),
350
- syncConfigs.length === 0 && /* @__PURE__ */ jsxDEV("tr", {
351
- children: /* @__PURE__ */ jsxDEV("td", {
352
- colSpan: 4,
353
- className: "text-muted-foreground px-4 py-8 text-center",
354
- children: "No sync configurations found"
355
- }, undefined, false, undefined, this)
356
- }, undefined, false, undefined, this)
357
- ]
358
- }, undefined, true, undefined, this)
359
- ]
360
- }, undefined, true, undefined, this)
361
- }, undefined, false, undefined, this)
362
- ]
363
- }, undefined, true, undefined, this)
364
- ]
365
- }, undefined, true, undefined, this);
366
- }
367
- export {
368
- IntegrationDashboard
369
- };
@@ -1,57 +0,0 @@
1
- // src/ui/hooks/useIntegrationData.ts
2
- import { useCallback, useEffect, useState } from "react";
3
- import { useTemplateRuntime } from "@contractspec/lib.example-shared-ui";
4
- "use client";
5
- function useIntegrationData(projectId = "local-project") {
6
- const { handlers } = useTemplateRuntime();
7
- const integration = handlers.integration;
8
- const [integrations, setIntegrations] = useState([]);
9
- const [connections, setConnections] = useState([]);
10
- const [syncConfigs, setSyncConfigs] = useState([]);
11
- const [loading, setLoading] = useState(true);
12
- const [error, setError] = useState(null);
13
- const fetchData = useCallback(async () => {
14
- try {
15
- setLoading(true);
16
- setError(null);
17
- const [integResult, connResult, syncResult] = await Promise.all([
18
- integration.listIntegrations({ projectId, limit: 100 }),
19
- integration.listConnections({ limit: 100 }),
20
- integration.listSyncConfigs({ limit: 100 })
21
- ]);
22
- setIntegrations(integResult.integrations);
23
- setConnections(connResult.connections);
24
- setSyncConfigs(syncResult.configs);
25
- } catch (err) {
26
- setError(err instanceof Error ? err : new Error("Failed to load integrations"));
27
- } finally {
28
- setLoading(false);
29
- }
30
- }, [integration, projectId]);
31
- useEffect(() => {
32
- fetchData();
33
- }, [fetchData]);
34
- const stats = {
35
- totalIntegrations: integrations.length,
36
- activeIntegrations: integrations.filter((i) => i.status === "ACTIVE").length,
37
- totalConnections: connections.length,
38
- connectedCount: connections.filter((c) => c.status === "CONNECTED").length,
39
- totalSyncs: syncConfigs.length,
40
- activeSyncs: syncConfigs.filter((s) => s.status === "ACTIVE").length
41
- };
42
- return {
43
- integrations,
44
- connections,
45
- syncConfigs,
46
- loading,
47
- error,
48
- stats,
49
- refetch: fetchData
50
- };
51
- }
52
-
53
- // src/ui/hooks/index.ts
54
- "use client";
55
- export {
56
- useIntegrationData
57
- };
@@ -1,54 +0,0 @@
1
- // src/ui/hooks/useIntegrationData.ts
2
- import { useCallback, useEffect, useState } from "react";
3
- import { useTemplateRuntime } from "@contractspec/lib.example-shared-ui";
4
- "use client";
5
- function useIntegrationData(projectId = "local-project") {
6
- const { handlers } = useTemplateRuntime();
7
- const integration = handlers.integration;
8
- const [integrations, setIntegrations] = useState([]);
9
- const [connections, setConnections] = useState([]);
10
- const [syncConfigs, setSyncConfigs] = useState([]);
11
- const [loading, setLoading] = useState(true);
12
- const [error, setError] = useState(null);
13
- const fetchData = useCallback(async () => {
14
- try {
15
- setLoading(true);
16
- setError(null);
17
- const [integResult, connResult, syncResult] = await Promise.all([
18
- integration.listIntegrations({ projectId, limit: 100 }),
19
- integration.listConnections({ limit: 100 }),
20
- integration.listSyncConfigs({ limit: 100 })
21
- ]);
22
- setIntegrations(integResult.integrations);
23
- setConnections(connResult.connections);
24
- setSyncConfigs(syncResult.configs);
25
- } catch (err) {
26
- setError(err instanceof Error ? err : new Error("Failed to load integrations"));
27
- } finally {
28
- setLoading(false);
29
- }
30
- }, [integration, projectId]);
31
- useEffect(() => {
32
- fetchData();
33
- }, [fetchData]);
34
- const stats = {
35
- totalIntegrations: integrations.length,
36
- activeIntegrations: integrations.filter((i) => i.status === "ACTIVE").length,
37
- totalConnections: connections.length,
38
- connectedCount: connections.filter((c) => c.status === "CONNECTED").length,
39
- totalSyncs: syncConfigs.length,
40
- activeSyncs: syncConfigs.filter((s) => s.status === "ACTIVE").length
41
- };
42
- return {
43
- integrations,
44
- connections,
45
- syncConfigs,
46
- loading,
47
- error,
48
- stats,
49
- refetch: fetchData
50
- };
51
- }
52
- export {
53
- useIntegrationData
54
- };