@contractspec/example.integration-hub 3.5.4 → 3.6.0
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/dist/index.js +107 -63
- package/dist/node/index.js +107 -63
- package/dist/node/ui/IntegrationDashboard.js +106 -63
- package/dist/node/ui/IntegrationHubChat.js +34 -0
- package/dist/node/ui/index.js +107 -63
- package/dist/ui/IntegrationDashboard.js +106 -63
- package/dist/ui/IntegrationHubChat.d.ts +15 -0
- package/dist/ui/IntegrationHubChat.js +35 -0
- package/dist/ui/index.d.ts +1 -0
- package/dist/ui/index.js +107 -63
- package/package.json +22 -9
|
@@ -50,6 +50,38 @@ function useIntegrationData(projectId = "local-project") {
|
|
|
50
50
|
};
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
+
// src/ui/IntegrationHubChat.tsx
|
|
54
|
+
import { ChatWithSidebar } from "@contractspec/module.ai-chat";
|
|
55
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
56
|
+
"use client";
|
|
57
|
+
var DEFAULT_SUGGESTIONS = [
|
|
58
|
+
"List my integrations",
|
|
59
|
+
"Show sync status",
|
|
60
|
+
"Add a connection"
|
|
61
|
+
];
|
|
62
|
+
var DEFAULT_SYSTEM_PROMPT = `You are an Integration Hub assistant. Help users manage integrations, connections, and sync configurations. When asked about integrations, connections, or syncs, provide clear, actionable guidance.`;
|
|
63
|
+
function IntegrationHubChat({
|
|
64
|
+
proxyUrl = "/api/chat",
|
|
65
|
+
mcpServers,
|
|
66
|
+
thinkingLevel = "thinking",
|
|
67
|
+
suggestions = DEFAULT_SUGGESTIONS,
|
|
68
|
+
systemPrompt = DEFAULT_SYSTEM_PROMPT,
|
|
69
|
+
className
|
|
70
|
+
}) {
|
|
71
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
72
|
+
className: className ?? "flex h-[500px] flex-col",
|
|
73
|
+
children: /* @__PURE__ */ jsxDEV(ChatWithSidebar, {
|
|
74
|
+
className: "flex-1",
|
|
75
|
+
systemPrompt,
|
|
76
|
+
proxyUrl,
|
|
77
|
+
mcpServers,
|
|
78
|
+
thinkingLevel,
|
|
79
|
+
suggestions,
|
|
80
|
+
showSuggestionsWhenEmpty: true
|
|
81
|
+
}, undefined, false, undefined, this)
|
|
82
|
+
}, undefined, false, undefined, this);
|
|
83
|
+
}
|
|
84
|
+
|
|
53
85
|
// src/ui/IntegrationDashboard.tsx
|
|
54
86
|
import { useState as useState2 } from "react";
|
|
55
87
|
import {
|
|
@@ -59,7 +91,7 @@ import {
|
|
|
59
91
|
StatCard,
|
|
60
92
|
StatCardGroup
|
|
61
93
|
} from "@contractspec/lib.design-system";
|
|
62
|
-
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
94
|
+
import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
|
|
63
95
|
"use client";
|
|
64
96
|
var STATUS_COLORS = {
|
|
65
97
|
ACTIVE: "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400",
|
|
@@ -92,35 +124,36 @@ function IntegrationDashboard() {
|
|
|
92
124
|
const tabs = [
|
|
93
125
|
{ id: "integrations", label: "Integrations", icon: "\uD83D\uDD0C" },
|
|
94
126
|
{ id: "connections", label: "Connections", icon: "\uD83D\uDD17" },
|
|
95
|
-
{ id: "syncs", label: "Sync Configs", icon: "\uD83D\uDD04" }
|
|
127
|
+
{ id: "syncs", label: "Sync Configs", icon: "\uD83D\uDD04" },
|
|
128
|
+
{ id: "chat", label: "Chat", icon: "\uD83D\uDCAC" }
|
|
96
129
|
];
|
|
97
130
|
if (loading) {
|
|
98
|
-
return /* @__PURE__ */
|
|
131
|
+
return /* @__PURE__ */ jsxDEV2(LoaderBlock, {
|
|
99
132
|
label: "Loading Integrations..."
|
|
100
133
|
}, undefined, false, undefined, this);
|
|
101
134
|
}
|
|
102
135
|
if (error) {
|
|
103
|
-
return /* @__PURE__ */
|
|
136
|
+
return /* @__PURE__ */ jsxDEV2(ErrorState, {
|
|
104
137
|
title: "Failed to load Integrations",
|
|
105
138
|
description: error.message,
|
|
106
139
|
onRetry: refetch,
|
|
107
140
|
retryLabel: "Retry"
|
|
108
141
|
}, undefined, false, undefined, this);
|
|
109
142
|
}
|
|
110
|
-
return /* @__PURE__ */
|
|
143
|
+
return /* @__PURE__ */ jsxDEV2("div", {
|
|
111
144
|
className: "space-y-6",
|
|
112
145
|
children: [
|
|
113
|
-
/* @__PURE__ */
|
|
146
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
114
147
|
className: "flex items-center justify-between",
|
|
115
148
|
children: [
|
|
116
|
-
/* @__PURE__ */
|
|
149
|
+
/* @__PURE__ */ jsxDEV2("h2", {
|
|
117
150
|
className: "text-2xl font-bold",
|
|
118
151
|
children: "Integration Hub"
|
|
119
152
|
}, undefined, false, undefined, this),
|
|
120
|
-
/* @__PURE__ */
|
|
153
|
+
/* @__PURE__ */ jsxDEV2(Button, {
|
|
121
154
|
onClick: () => alert("Add integration modal"),
|
|
122
155
|
children: [
|
|
123
|
-
/* @__PURE__ */
|
|
156
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
124
157
|
className: "mr-2",
|
|
125
158
|
children: "+"
|
|
126
159
|
}, undefined, false, undefined, this),
|
|
@@ -129,66 +162,66 @@ function IntegrationDashboard() {
|
|
|
129
162
|
}, undefined, true, undefined, this)
|
|
130
163
|
]
|
|
131
164
|
}, undefined, true, undefined, this),
|
|
132
|
-
/* @__PURE__ */
|
|
165
|
+
/* @__PURE__ */ jsxDEV2(StatCardGroup, {
|
|
133
166
|
children: [
|
|
134
|
-
/* @__PURE__ */
|
|
167
|
+
/* @__PURE__ */ jsxDEV2(StatCard, {
|
|
135
168
|
label: "Integrations",
|
|
136
169
|
value: stats.totalIntegrations,
|
|
137
170
|
hint: `${stats.activeIntegrations} active`
|
|
138
171
|
}, undefined, false, undefined, this),
|
|
139
|
-
/* @__PURE__ */
|
|
172
|
+
/* @__PURE__ */ jsxDEV2(StatCard, {
|
|
140
173
|
label: "Connections",
|
|
141
174
|
value: stats.totalConnections,
|
|
142
175
|
hint: `${stats.connectedCount} connected`
|
|
143
176
|
}, undefined, false, undefined, this),
|
|
144
|
-
/* @__PURE__ */
|
|
177
|
+
/* @__PURE__ */ jsxDEV2(StatCard, {
|
|
145
178
|
label: "Syncs",
|
|
146
179
|
value: stats.totalSyncs,
|
|
147
180
|
hint: `${stats.activeSyncs} active`
|
|
148
181
|
}, undefined, false, undefined, this)
|
|
149
182
|
]
|
|
150
183
|
}, undefined, true, undefined, this),
|
|
151
|
-
/* @__PURE__ */
|
|
184
|
+
/* @__PURE__ */ jsxDEV2("nav", {
|
|
152
185
|
className: "bg-muted flex gap-1 rounded-lg p-1",
|
|
153
186
|
role: "tablist",
|
|
154
|
-
children: tabs.map((tab) => /* @__PURE__ */
|
|
187
|
+
children: tabs.map((tab) => /* @__PURE__ */ jsxDEV2(Button, {
|
|
155
188
|
type: "button",
|
|
156
189
|
role: "tab",
|
|
157
190
|
"aria-selected": activeTab === tab.id,
|
|
158
191
|
onClick: () => setActiveTab(tab.id),
|
|
159
192
|
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
193
|
children: [
|
|
161
|
-
/* @__PURE__ */
|
|
194
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
162
195
|
children: tab.icon
|
|
163
196
|
}, undefined, false, undefined, this),
|
|
164
197
|
tab.label
|
|
165
198
|
]
|
|
166
199
|
}, tab.id, true, undefined, this))
|
|
167
200
|
}, undefined, false, undefined, this),
|
|
168
|
-
/* @__PURE__ */
|
|
201
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
169
202
|
className: "min-h-[400px]",
|
|
170
203
|
role: "tabpanel",
|
|
171
204
|
children: [
|
|
172
|
-
activeTab === "integrations" && /* @__PURE__ */
|
|
205
|
+
activeTab === "integrations" && /* @__PURE__ */ jsxDEV2("div", {
|
|
173
206
|
className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3",
|
|
174
207
|
children: [
|
|
175
|
-
integrations.map((integration) => /* @__PURE__ */
|
|
208
|
+
integrations.map((integration) => /* @__PURE__ */ jsxDEV2("div", {
|
|
176
209
|
className: "border-border bg-card hover:bg-muted/50 cursor-pointer rounded-lg border p-4 transition-colors",
|
|
177
210
|
children: [
|
|
178
|
-
/* @__PURE__ */
|
|
211
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
179
212
|
className: "mb-3 flex items-center gap-3",
|
|
180
213
|
children: [
|
|
181
|
-
/* @__PURE__ */
|
|
214
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
182
215
|
className: "text-2xl",
|
|
183
216
|
children: TYPE_ICONS[integration.type] ?? "⚙️"
|
|
184
217
|
}, undefined, false, undefined, this),
|
|
185
|
-
/* @__PURE__ */
|
|
218
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
186
219
|
children: [
|
|
187
|
-
/* @__PURE__ */
|
|
220
|
+
/* @__PURE__ */ jsxDEV2("h3", {
|
|
188
221
|
className: "font-medium",
|
|
189
222
|
children: integration.name
|
|
190
223
|
}, undefined, false, undefined, this),
|
|
191
|
-
/* @__PURE__ */
|
|
224
|
+
/* @__PURE__ */ jsxDEV2("p", {
|
|
192
225
|
className: "text-muted-foreground text-sm",
|
|
193
226
|
children: integration.type
|
|
194
227
|
}, undefined, false, undefined, this)
|
|
@@ -196,14 +229,14 @@ function IntegrationDashboard() {
|
|
|
196
229
|
}, undefined, true, undefined, this)
|
|
197
230
|
]
|
|
198
231
|
}, undefined, true, undefined, this),
|
|
199
|
-
/* @__PURE__ */
|
|
232
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
200
233
|
className: "flex items-center justify-between",
|
|
201
234
|
children: [
|
|
202
|
-
/* @__PURE__ */
|
|
235
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
203
236
|
className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_COLORS[integration.status] ?? ""}`,
|
|
204
237
|
children: integration.status
|
|
205
238
|
}, undefined, false, undefined, this),
|
|
206
|
-
/* @__PURE__ */
|
|
239
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
207
240
|
className: "text-muted-foreground text-xs",
|
|
208
241
|
children: integration.createdAt.toLocaleDateString()
|
|
209
242
|
}, undefined, false, undefined, this)
|
|
@@ -211,64 +244,64 @@ function IntegrationDashboard() {
|
|
|
211
244
|
}, undefined, true, undefined, this)
|
|
212
245
|
]
|
|
213
246
|
}, integration.id, true, undefined, this)),
|
|
214
|
-
integrations.length === 0 && /* @__PURE__ */
|
|
247
|
+
integrations.length === 0 && /* @__PURE__ */ jsxDEV2("div", {
|
|
215
248
|
className: "text-muted-foreground col-span-full flex h-64 items-center justify-center",
|
|
216
249
|
children: "No integrations configured"
|
|
217
250
|
}, undefined, false, undefined, this)
|
|
218
251
|
]
|
|
219
252
|
}, undefined, true, undefined, this),
|
|
220
|
-
activeTab === "connections" && /* @__PURE__ */
|
|
253
|
+
activeTab === "connections" && /* @__PURE__ */ jsxDEV2("div", {
|
|
221
254
|
className: "border-border rounded-lg border",
|
|
222
|
-
children: /* @__PURE__ */
|
|
255
|
+
children: /* @__PURE__ */ jsxDEV2("table", {
|
|
223
256
|
className: "w-full",
|
|
224
257
|
children: [
|
|
225
|
-
/* @__PURE__ */
|
|
258
|
+
/* @__PURE__ */ jsxDEV2("thead", {
|
|
226
259
|
className: "border-border bg-muted/30 border-b",
|
|
227
|
-
children: /* @__PURE__ */
|
|
260
|
+
children: /* @__PURE__ */ jsxDEV2("tr", {
|
|
228
261
|
children: [
|
|
229
|
-
/* @__PURE__ */
|
|
262
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
230
263
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
231
264
|
children: "Connection"
|
|
232
265
|
}, undefined, false, undefined, this),
|
|
233
|
-
/* @__PURE__ */
|
|
266
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
234
267
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
235
268
|
children: "Status"
|
|
236
269
|
}, undefined, false, undefined, this),
|
|
237
|
-
/* @__PURE__ */
|
|
270
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
238
271
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
239
272
|
children: "Last Sync"
|
|
240
273
|
}, undefined, false, undefined, this)
|
|
241
274
|
]
|
|
242
275
|
}, undefined, true, undefined, this)
|
|
243
276
|
}, undefined, false, undefined, this),
|
|
244
|
-
/* @__PURE__ */
|
|
277
|
+
/* @__PURE__ */ jsxDEV2("tbody", {
|
|
245
278
|
className: "divide-border divide-y",
|
|
246
279
|
children: [
|
|
247
|
-
connections.map((conn) => /* @__PURE__ */
|
|
280
|
+
connections.map((conn) => /* @__PURE__ */ jsxDEV2("tr", {
|
|
248
281
|
className: "hover:bg-muted/50",
|
|
249
282
|
children: [
|
|
250
|
-
/* @__PURE__ */
|
|
283
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
251
284
|
className: "px-4 py-3",
|
|
252
|
-
children: /* @__PURE__ */
|
|
285
|
+
children: /* @__PURE__ */ jsxDEV2("div", {
|
|
253
286
|
className: "font-medium",
|
|
254
287
|
children: conn.name
|
|
255
288
|
}, undefined, false, undefined, this)
|
|
256
289
|
}, undefined, false, undefined, this),
|
|
257
|
-
/* @__PURE__ */
|
|
290
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
258
291
|
className: "px-4 py-3",
|
|
259
|
-
children: /* @__PURE__ */
|
|
292
|
+
children: /* @__PURE__ */ jsxDEV2("span", {
|
|
260
293
|
className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_COLORS[conn.status] ?? ""}`,
|
|
261
294
|
children: conn.status
|
|
262
295
|
}, undefined, false, undefined, this)
|
|
263
296
|
}, undefined, false, undefined, this),
|
|
264
|
-
/* @__PURE__ */
|
|
297
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
265
298
|
className: "text-muted-foreground px-4 py-3 text-sm",
|
|
266
299
|
children: conn.lastSyncAt?.toLocaleString() ?? "Never"
|
|
267
300
|
}, undefined, false, undefined, this)
|
|
268
301
|
]
|
|
269
302
|
}, conn.id, true, undefined, this)),
|
|
270
|
-
connections.length === 0 && /* @__PURE__ */
|
|
271
|
-
children: /* @__PURE__ */
|
|
303
|
+
connections.length === 0 && /* @__PURE__ */ jsxDEV2("tr", {
|
|
304
|
+
children: /* @__PURE__ */ jsxDEV2("td", {
|
|
272
305
|
colSpan: 3,
|
|
273
306
|
className: "text-muted-foreground px-4 py-8 text-center",
|
|
274
307
|
children: "No connections found"
|
|
@@ -279,48 +312,58 @@ function IntegrationDashboard() {
|
|
|
279
312
|
]
|
|
280
313
|
}, undefined, true, undefined, this)
|
|
281
314
|
}, undefined, false, undefined, this),
|
|
282
|
-
activeTab === "
|
|
315
|
+
activeTab === "chat" && /* @__PURE__ */ jsxDEV2(IntegrationHubChat, {
|
|
316
|
+
proxyUrl: "/api/chat",
|
|
317
|
+
thinkingLevel: "thinking",
|
|
318
|
+
suggestions: [
|
|
319
|
+
"List my integrations",
|
|
320
|
+
"Show sync status",
|
|
321
|
+
"Add a connection"
|
|
322
|
+
],
|
|
323
|
+
className: "min-h-[400px]"
|
|
324
|
+
}, undefined, false, undefined, this),
|
|
325
|
+
activeTab === "syncs" && /* @__PURE__ */ jsxDEV2("div", {
|
|
283
326
|
className: "border-border rounded-lg border",
|
|
284
|
-
children: /* @__PURE__ */
|
|
327
|
+
children: /* @__PURE__ */ jsxDEV2("table", {
|
|
285
328
|
className: "w-full",
|
|
286
329
|
children: [
|
|
287
|
-
/* @__PURE__ */
|
|
330
|
+
/* @__PURE__ */ jsxDEV2("thead", {
|
|
288
331
|
className: "border-border bg-muted/30 border-b",
|
|
289
|
-
children: /* @__PURE__ */
|
|
332
|
+
children: /* @__PURE__ */ jsxDEV2("tr", {
|
|
290
333
|
children: [
|
|
291
|
-
/* @__PURE__ */
|
|
334
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
292
335
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
293
336
|
children: "Sync Config"
|
|
294
337
|
}, undefined, false, undefined, this),
|
|
295
|
-
/* @__PURE__ */
|
|
338
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
296
339
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
297
340
|
children: "Frequency"
|
|
298
341
|
}, undefined, false, undefined, this),
|
|
299
|
-
/* @__PURE__ */
|
|
342
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
300
343
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
301
344
|
children: "Status"
|
|
302
345
|
}, undefined, false, undefined, this),
|
|
303
|
-
/* @__PURE__ */
|
|
346
|
+
/* @__PURE__ */ jsxDEV2("th", {
|
|
304
347
|
className: "px-4 py-3 text-left text-sm font-medium",
|
|
305
348
|
children: "Records"
|
|
306
349
|
}, undefined, false, undefined, this)
|
|
307
350
|
]
|
|
308
351
|
}, undefined, true, undefined, this)
|
|
309
352
|
}, undefined, false, undefined, this),
|
|
310
|
-
/* @__PURE__ */
|
|
353
|
+
/* @__PURE__ */ jsxDEV2("tbody", {
|
|
311
354
|
className: "divide-border divide-y",
|
|
312
355
|
children: [
|
|
313
|
-
syncConfigs.map((sync) => /* @__PURE__ */
|
|
356
|
+
syncConfigs.map((sync) => /* @__PURE__ */ jsxDEV2("tr", {
|
|
314
357
|
className: "hover:bg-muted/50",
|
|
315
358
|
children: [
|
|
316
|
-
/* @__PURE__ */
|
|
359
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
317
360
|
className: "px-4 py-3",
|
|
318
361
|
children: [
|
|
319
|
-
/* @__PURE__ */
|
|
362
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
320
363
|
className: "font-medium",
|
|
321
364
|
children: sync.name
|
|
322
365
|
}, undefined, false, undefined, this),
|
|
323
|
-
/* @__PURE__ */
|
|
366
|
+
/* @__PURE__ */ jsxDEV2("div", {
|
|
324
367
|
className: "text-muted-foreground text-sm",
|
|
325
368
|
children: [
|
|
326
369
|
sync.sourceEntity,
|
|
@@ -330,25 +373,25 @@ function IntegrationDashboard() {
|
|
|
330
373
|
}, undefined, true, undefined, this)
|
|
331
374
|
]
|
|
332
375
|
}, undefined, true, undefined, this),
|
|
333
|
-
/* @__PURE__ */
|
|
376
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
334
377
|
className: "px-4 py-3 text-sm",
|
|
335
378
|
children: sync.frequency
|
|
336
379
|
}, undefined, false, undefined, this),
|
|
337
|
-
/* @__PURE__ */
|
|
380
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
338
381
|
className: "px-4 py-3",
|
|
339
|
-
children: /* @__PURE__ */
|
|
382
|
+
children: /* @__PURE__ */ jsxDEV2("span", {
|
|
340
383
|
className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_COLORS[sync.status] ?? ""}`,
|
|
341
384
|
children: sync.status
|
|
342
385
|
}, undefined, false, undefined, this)
|
|
343
386
|
}, undefined, false, undefined, this),
|
|
344
|
-
/* @__PURE__ */
|
|
387
|
+
/* @__PURE__ */ jsxDEV2("td", {
|
|
345
388
|
className: "text-muted-foreground px-4 py-3 text-sm",
|
|
346
389
|
children: sync.recordsSynced.toLocaleString()
|
|
347
390
|
}, undefined, false, undefined, this)
|
|
348
391
|
]
|
|
349
392
|
}, sync.id, true, undefined, this)),
|
|
350
|
-
syncConfigs.length === 0 && /* @__PURE__ */
|
|
351
|
-
children: /* @__PURE__ */
|
|
393
|
+
syncConfigs.length === 0 && /* @__PURE__ */ jsxDEV2("tr", {
|
|
394
|
+
children: /* @__PURE__ */ jsxDEV2("td", {
|
|
352
395
|
colSpan: 4,
|
|
353
396
|
className: "text-muted-foreground px-4 py-8 text-center",
|
|
354
397
|
children: "No sync configurations found"
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
// src/ui/IntegrationHubChat.tsx
|
|
2
|
+
import { ChatWithSidebar } from "@contractspec/module.ai-chat";
|
|
3
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
4
|
+
"use client";
|
|
5
|
+
var DEFAULT_SUGGESTIONS = [
|
|
6
|
+
"List my integrations",
|
|
7
|
+
"Show sync status",
|
|
8
|
+
"Add a connection"
|
|
9
|
+
];
|
|
10
|
+
var DEFAULT_SYSTEM_PROMPT = `You are an Integration Hub assistant. Help users manage integrations, connections, and sync configurations. When asked about integrations, connections, or syncs, provide clear, actionable guidance.`;
|
|
11
|
+
function IntegrationHubChat({
|
|
12
|
+
proxyUrl = "/api/chat",
|
|
13
|
+
mcpServers,
|
|
14
|
+
thinkingLevel = "thinking",
|
|
15
|
+
suggestions = DEFAULT_SUGGESTIONS,
|
|
16
|
+
systemPrompt = DEFAULT_SYSTEM_PROMPT,
|
|
17
|
+
className
|
|
18
|
+
}) {
|
|
19
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
20
|
+
className: className ?? "flex h-[500px] flex-col",
|
|
21
|
+
children: /* @__PURE__ */ jsxDEV(ChatWithSidebar, {
|
|
22
|
+
className: "flex-1",
|
|
23
|
+
systemPrompt,
|
|
24
|
+
proxyUrl,
|
|
25
|
+
mcpServers,
|
|
26
|
+
thinkingLevel,
|
|
27
|
+
suggestions,
|
|
28
|
+
showSuggestionsWhenEmpty: true
|
|
29
|
+
}, undefined, false, undefined, this)
|
|
30
|
+
}, undefined, false, undefined, this);
|
|
31
|
+
}
|
|
32
|
+
export {
|
|
33
|
+
IntegrationHubChat
|
|
34
|
+
};
|