@copilotz/admin 0.3.4 → 0.3.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/dist/index.cjs +955 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +214 -0
- package/dist/index.js +430 -181
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1414 -0
- package/package.json +25 -7
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,955 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/index.ts
|
|
31
|
+
var index_exports = {};
|
|
32
|
+
__export(index_exports, {
|
|
33
|
+
CopilotzAdmin: () => CopilotzAdmin,
|
|
34
|
+
defaultAdminConfig: () => defaultAdminConfig,
|
|
35
|
+
fetchAdminActivity: () => fetchAdminActivity,
|
|
36
|
+
fetchAdminAgents: () => fetchAdminAgents,
|
|
37
|
+
fetchAdminOverview: () => fetchAdminOverview,
|
|
38
|
+
fetchAdminParticipants: () => fetchAdminParticipants,
|
|
39
|
+
fetchAdminThreads: () => fetchAdminThreads,
|
|
40
|
+
mergeAdminConfig: () => mergeAdminConfig,
|
|
41
|
+
useCopilotzAdmin: () => useCopilotzAdmin
|
|
42
|
+
});
|
|
43
|
+
module.exports = __toCommonJS(index_exports);
|
|
44
|
+
|
|
45
|
+
// src/CopilotzAdmin.tsx
|
|
46
|
+
var import_react2 = require("react");
|
|
47
|
+
|
|
48
|
+
// src/config.ts
|
|
49
|
+
var defaultAdminConfig = {
|
|
50
|
+
branding: {
|
|
51
|
+
title: "Copilotz Admin",
|
|
52
|
+
subtitle: "Read-only operational visibility for Copilotz clients",
|
|
53
|
+
logo: null,
|
|
54
|
+
actions: null
|
|
55
|
+
},
|
|
56
|
+
labels: {
|
|
57
|
+
overviewTitle: "Overview",
|
|
58
|
+
activityTitle: "Activity",
|
|
59
|
+
threadsTitle: "Threads",
|
|
60
|
+
participantsTitle: "Participants",
|
|
61
|
+
agentsTitle: "Agents",
|
|
62
|
+
range24h: "24h",
|
|
63
|
+
range7d: "7d",
|
|
64
|
+
range30d: "30d",
|
|
65
|
+
intervalHour: "Hourly",
|
|
66
|
+
intervalDay: "Daily",
|
|
67
|
+
refresh: "Refresh",
|
|
68
|
+
retry: "Try again",
|
|
69
|
+
loading: "Loading admin data...",
|
|
70
|
+
emptyTitle: "No activity yet",
|
|
71
|
+
emptyDescription: "Admin metrics will appear after threads, events, and graph data start flowing.",
|
|
72
|
+
threadSearchPlaceholder: "Search threads",
|
|
73
|
+
participantSearchPlaceholder: "Search participants",
|
|
74
|
+
agentSearchPlaceholder: "Search agents",
|
|
75
|
+
messagesCard: "Messages",
|
|
76
|
+
activeThreadsCard: "Active threads",
|
|
77
|
+
participantsCard: "Participants",
|
|
78
|
+
tokensCard: "LLM tokens",
|
|
79
|
+
queueCard: "Queued events",
|
|
80
|
+
statusActive: "Active",
|
|
81
|
+
statusArchived: "Archived",
|
|
82
|
+
scopeGlobal: "Global",
|
|
83
|
+
scopeScoped: "Scoped",
|
|
84
|
+
configured: "Configured",
|
|
85
|
+
unconfigured: "Observed only",
|
|
86
|
+
noResults: "No results"
|
|
87
|
+
},
|
|
88
|
+
features: {
|
|
89
|
+
showOverview: true,
|
|
90
|
+
showActivity: true,
|
|
91
|
+
showThreads: true,
|
|
92
|
+
showParticipants: true,
|
|
93
|
+
showAgents: true
|
|
94
|
+
},
|
|
95
|
+
ui: {
|
|
96
|
+
compact: false,
|
|
97
|
+
maxActivityBars: 18
|
|
98
|
+
},
|
|
99
|
+
baseUrl: "",
|
|
100
|
+
getRequestHeaders: async () => ({}),
|
|
101
|
+
namespace: "",
|
|
102
|
+
initialRange: "7d",
|
|
103
|
+
initialInterval: "day"
|
|
104
|
+
};
|
|
105
|
+
function mergeAdminConfig(_baseConfig, userConfig) {
|
|
106
|
+
if (!userConfig) return defaultAdminConfig;
|
|
107
|
+
return {
|
|
108
|
+
branding: {
|
|
109
|
+
...defaultAdminConfig.branding,
|
|
110
|
+
...userConfig.branding
|
|
111
|
+
},
|
|
112
|
+
labels: {
|
|
113
|
+
...defaultAdminConfig.labels,
|
|
114
|
+
...userConfig.labels
|
|
115
|
+
},
|
|
116
|
+
features: {
|
|
117
|
+
...defaultAdminConfig.features,
|
|
118
|
+
...userConfig.features
|
|
119
|
+
},
|
|
120
|
+
ui: {
|
|
121
|
+
...defaultAdminConfig.ui,
|
|
122
|
+
...userConfig.ui
|
|
123
|
+
},
|
|
124
|
+
baseUrl: userConfig.baseUrl ?? defaultAdminConfig.baseUrl,
|
|
125
|
+
getRequestHeaders: userConfig.getRequestHeaders ?? defaultAdminConfig.getRequestHeaders,
|
|
126
|
+
namespace: userConfig.namespace ?? defaultAdminConfig.namespace,
|
|
127
|
+
initialRange: userConfig.initialRange ?? defaultAdminConfig.initialRange,
|
|
128
|
+
initialInterval: userConfig.initialInterval ?? defaultAdminConfig.initialInterval
|
|
129
|
+
};
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
// src/useCopilotzAdmin.ts
|
|
133
|
+
var import_react = require("react");
|
|
134
|
+
|
|
135
|
+
// src/adminService.ts
|
|
136
|
+
var import_meta = {};
|
|
137
|
+
var rawBaseValue = import_meta.env?.VITE_API_URL;
|
|
138
|
+
var rawBase = typeof rawBaseValue === "string" && rawBaseValue.length > 0 ? rawBaseValue : "/api";
|
|
139
|
+
var normalizedBase = rawBase.replace(/\/$/, "");
|
|
140
|
+
var runtimeProcess = typeof process !== "undefined" ? process : void 0;
|
|
141
|
+
var API_KEY = (() => {
|
|
142
|
+
const env = import_meta.env ?? {};
|
|
143
|
+
const candidates = [
|
|
144
|
+
env.VITE_API_KEY,
|
|
145
|
+
env.VITE_COPILOTZ_API_KEY,
|
|
146
|
+
runtimeProcess?.env?.COPILOTZ_API_KEY,
|
|
147
|
+
runtimeProcess?.env?.API_KEY
|
|
148
|
+
];
|
|
149
|
+
return candidates.find(
|
|
150
|
+
(value) => typeof value === "string" && value.length > 0
|
|
151
|
+
);
|
|
152
|
+
})();
|
|
153
|
+
var resolveBaseUrl = (baseUrl) => {
|
|
154
|
+
const candidate = (baseUrl && baseUrl.length > 0 ? baseUrl : normalizedBase).replace(/\/$/, "");
|
|
155
|
+
return candidate.startsWith("http") || candidate.startsWith("/") ? candidate : `/${candidate}`;
|
|
156
|
+
};
|
|
157
|
+
var withAuthHeaders = async (headers = {}, getRequestHeaders) => {
|
|
158
|
+
const providedHeaders = getRequestHeaders ? await getRequestHeaders() : void 0;
|
|
159
|
+
if (providedHeaders && Object.keys(providedHeaders).length > 0) {
|
|
160
|
+
return { ...headers, ...providedHeaders };
|
|
161
|
+
}
|
|
162
|
+
if (API_KEY) {
|
|
163
|
+
return { ...headers, Authorization: `Bearer ${API_KEY}` };
|
|
164
|
+
}
|
|
165
|
+
return headers;
|
|
166
|
+
};
|
|
167
|
+
var getRangeWindow = (range) => {
|
|
168
|
+
const to = /* @__PURE__ */ new Date();
|
|
169
|
+
const from = new Date(to);
|
|
170
|
+
if (range === "24h") {
|
|
171
|
+
from.setHours(from.getHours() - 24);
|
|
172
|
+
} else if (range === "30d") {
|
|
173
|
+
from.setDate(from.getDate() - 30);
|
|
174
|
+
} else {
|
|
175
|
+
from.setDate(from.getDate() - 7);
|
|
176
|
+
}
|
|
177
|
+
return {
|
|
178
|
+
from: from.toISOString(),
|
|
179
|
+
to: to.toISOString()
|
|
180
|
+
};
|
|
181
|
+
};
|
|
182
|
+
async function fetchAdminJson(path, params, options) {
|
|
183
|
+
const url = new URL(`${resolveBaseUrl(options?.baseUrl)}${path}`, window.location.origin);
|
|
184
|
+
for (const [key, value] of Object.entries(params)) {
|
|
185
|
+
if (typeof value === "string" && value.length > 0) {
|
|
186
|
+
url.searchParams.set(key, value);
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
const response = await fetch(url.toString(), {
|
|
190
|
+
headers: await withAuthHeaders({}, options?.getRequestHeaders)
|
|
191
|
+
});
|
|
192
|
+
if (!response.ok) {
|
|
193
|
+
throw new Error(`Admin request failed (${response.status})`);
|
|
194
|
+
}
|
|
195
|
+
const payload = await response.json();
|
|
196
|
+
return payload.data;
|
|
197
|
+
}
|
|
198
|
+
async function fetchAdminOverview(range, namespace, options) {
|
|
199
|
+
const windowRange = getRangeWindow(range);
|
|
200
|
+
return await fetchAdminJson("/v1/admin/overview", {
|
|
201
|
+
namespace,
|
|
202
|
+
from: windowRange.from,
|
|
203
|
+
to: windowRange.to
|
|
204
|
+
}, options);
|
|
205
|
+
}
|
|
206
|
+
async function fetchAdminActivity(range, interval, namespace, options) {
|
|
207
|
+
const windowRange = getRangeWindow(range);
|
|
208
|
+
return await fetchAdminJson("/v1/admin/activity", {
|
|
209
|
+
namespace,
|
|
210
|
+
interval,
|
|
211
|
+
from: windowRange.from,
|
|
212
|
+
to: windowRange.to
|
|
213
|
+
}, options);
|
|
214
|
+
}
|
|
215
|
+
async function fetchAdminThreads(search, namespace, options) {
|
|
216
|
+
return await fetchAdminJson("/v1/admin/threads", {
|
|
217
|
+
search,
|
|
218
|
+
namespace,
|
|
219
|
+
limit: "8"
|
|
220
|
+
}, options);
|
|
221
|
+
}
|
|
222
|
+
async function fetchAdminParticipants(search, namespace, options) {
|
|
223
|
+
return await fetchAdminJson("/v1/admin/participants", {
|
|
224
|
+
search,
|
|
225
|
+
namespace,
|
|
226
|
+
limit: "8"
|
|
227
|
+
}, options);
|
|
228
|
+
}
|
|
229
|
+
async function fetchAdminAgents(search, namespace, options) {
|
|
230
|
+
return await fetchAdminJson("/v1/admin/agents", {
|
|
231
|
+
search,
|
|
232
|
+
namespace,
|
|
233
|
+
limit: "8"
|
|
234
|
+
}, options);
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
// src/useCopilotzAdmin.ts
|
|
238
|
+
function useCopilotzAdmin(options = {}) {
|
|
239
|
+
const [range, setRange] = (0, import_react.useState)(options.range ?? "7d");
|
|
240
|
+
const [interval, setInterval] = (0, import_react.useState)(
|
|
241
|
+
options.interval ?? "day"
|
|
242
|
+
);
|
|
243
|
+
const [overview, setOverview] = (0, import_react.useState)(
|
|
244
|
+
null
|
|
245
|
+
);
|
|
246
|
+
const [activity, setActivity] = (0, import_react.useState)(
|
|
247
|
+
[]
|
|
248
|
+
);
|
|
249
|
+
const [threads, setThreads] = (0, import_react.useState)([]);
|
|
250
|
+
const [participants, setParticipants] = (0, import_react.useState)([]);
|
|
251
|
+
const [agents, setAgents] = (0, import_react.useState)([]);
|
|
252
|
+
const [isLoading, setIsLoading] = (0, import_react.useState)(true);
|
|
253
|
+
const [error, setError] = (0, import_react.useState)(null);
|
|
254
|
+
const fetchAll = (0, import_react.useCallback)(async () => {
|
|
255
|
+
setIsLoading(true);
|
|
256
|
+
setError(null);
|
|
257
|
+
try {
|
|
258
|
+
const shared = {
|
|
259
|
+
baseUrl: options.baseUrl,
|
|
260
|
+
getRequestHeaders: options.getRequestHeaders
|
|
261
|
+
};
|
|
262
|
+
const [
|
|
263
|
+
nextOverview,
|
|
264
|
+
nextActivity,
|
|
265
|
+
nextThreads,
|
|
266
|
+
nextParticipants,
|
|
267
|
+
nextAgents
|
|
268
|
+
] = await Promise.all([
|
|
269
|
+
fetchAdminOverview(range, options.namespace, shared),
|
|
270
|
+
fetchAdminActivity(range, interval, options.namespace, shared),
|
|
271
|
+
fetchAdminThreads(options.threadSearch, options.namespace, shared),
|
|
272
|
+
fetchAdminParticipants(
|
|
273
|
+
options.participantSearch,
|
|
274
|
+
options.namespace,
|
|
275
|
+
shared
|
|
276
|
+
),
|
|
277
|
+
fetchAdminAgents(options.agentSearch, options.namespace, shared)
|
|
278
|
+
]);
|
|
279
|
+
setOverview(nextOverview);
|
|
280
|
+
setActivity(nextActivity);
|
|
281
|
+
setThreads(nextThreads);
|
|
282
|
+
setParticipants(nextParticipants);
|
|
283
|
+
setAgents(nextAgents);
|
|
284
|
+
} catch (nextError) {
|
|
285
|
+
setError(nextError instanceof Error ? nextError : new Error("Failed to load admin data"));
|
|
286
|
+
} finally {
|
|
287
|
+
setIsLoading(false);
|
|
288
|
+
}
|
|
289
|
+
}, [
|
|
290
|
+
interval,
|
|
291
|
+
options.agentSearch,
|
|
292
|
+
options.baseUrl,
|
|
293
|
+
options.getRequestHeaders,
|
|
294
|
+
options.namespace,
|
|
295
|
+
options.participantSearch,
|
|
296
|
+
options.threadSearch,
|
|
297
|
+
range
|
|
298
|
+
]);
|
|
299
|
+
(0, import_react.useEffect)(() => {
|
|
300
|
+
void fetchAll();
|
|
301
|
+
}, [fetchAll]);
|
|
302
|
+
return (0, import_react.useMemo)(() => ({
|
|
303
|
+
overview,
|
|
304
|
+
activity,
|
|
305
|
+
threads,
|
|
306
|
+
participants,
|
|
307
|
+
agents,
|
|
308
|
+
filters: {
|
|
309
|
+
namespace: options.namespace,
|
|
310
|
+
threadSearch: options.threadSearch,
|
|
311
|
+
participantSearch: options.participantSearch,
|
|
312
|
+
agentSearch: options.agentSearch,
|
|
313
|
+
range,
|
|
314
|
+
interval
|
|
315
|
+
},
|
|
316
|
+
isLoading,
|
|
317
|
+
error,
|
|
318
|
+
refresh: fetchAll,
|
|
319
|
+
setRange,
|
|
320
|
+
setInterval
|
|
321
|
+
}), [
|
|
322
|
+
activity,
|
|
323
|
+
agents,
|
|
324
|
+
error,
|
|
325
|
+
fetchAll,
|
|
326
|
+
interval,
|
|
327
|
+
isLoading,
|
|
328
|
+
options.agentSearch,
|
|
329
|
+
options.namespace,
|
|
330
|
+
options.participantSearch,
|
|
331
|
+
options.threadSearch,
|
|
332
|
+
overview,
|
|
333
|
+
participants,
|
|
334
|
+
range,
|
|
335
|
+
threads
|
|
336
|
+
]);
|
|
337
|
+
}
|
|
338
|
+
|
|
339
|
+
// src/lib/utils.ts
|
|
340
|
+
var import_clsx = require("clsx");
|
|
341
|
+
var import_tailwind_merge = require("tailwind-merge");
|
|
342
|
+
function cn(...inputs) {
|
|
343
|
+
return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
// src/components/ui/card.tsx
|
|
347
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
348
|
+
function Card({ className, ...props }) {
|
|
349
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
350
|
+
"div",
|
|
351
|
+
{
|
|
352
|
+
"data-slot": "card",
|
|
353
|
+
className: cn(
|
|
354
|
+
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
|
|
355
|
+
className
|
|
356
|
+
),
|
|
357
|
+
...props
|
|
358
|
+
}
|
|
359
|
+
);
|
|
360
|
+
}
|
|
361
|
+
function CardContent({ className, ...props }) {
|
|
362
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
363
|
+
"div",
|
|
364
|
+
{
|
|
365
|
+
"data-slot": "card-content",
|
|
366
|
+
className: cn("px-6", className),
|
|
367
|
+
...props
|
|
368
|
+
}
|
|
369
|
+
);
|
|
370
|
+
}
|
|
371
|
+
|
|
372
|
+
// src/components/ui/button.tsx
|
|
373
|
+
var import_react_slot = require("@radix-ui/react-slot");
|
|
374
|
+
var import_class_variance_authority = require("class-variance-authority");
|
|
375
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
376
|
+
var buttonVariants = (0, import_class_variance_authority.cva)(
|
|
377
|
+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
378
|
+
{
|
|
379
|
+
variants: {
|
|
380
|
+
variant: {
|
|
381
|
+
default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
|
|
382
|
+
destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
|
383
|
+
outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
384
|
+
secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
|
|
385
|
+
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
|
386
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
387
|
+
},
|
|
388
|
+
size: {
|
|
389
|
+
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
390
|
+
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
|
|
391
|
+
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
|
392
|
+
icon: "size-9"
|
|
393
|
+
}
|
|
394
|
+
},
|
|
395
|
+
defaultVariants: {
|
|
396
|
+
variant: "default",
|
|
397
|
+
size: "default"
|
|
398
|
+
}
|
|
399
|
+
}
|
|
400
|
+
);
|
|
401
|
+
function Button({
|
|
402
|
+
className,
|
|
403
|
+
variant,
|
|
404
|
+
size,
|
|
405
|
+
asChild = false,
|
|
406
|
+
...props
|
|
407
|
+
}) {
|
|
408
|
+
const Comp = asChild ? import_react_slot.Slot : "button";
|
|
409
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
410
|
+
Comp,
|
|
411
|
+
{
|
|
412
|
+
"data-slot": "button",
|
|
413
|
+
className: cn(buttonVariants({ variant, size, className })),
|
|
414
|
+
...props
|
|
415
|
+
}
|
|
416
|
+
);
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
// src/components/ui/input.tsx
|
|
420
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
421
|
+
function Input({ className, type, ...props }) {
|
|
422
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
423
|
+
"input",
|
|
424
|
+
{
|
|
425
|
+
type,
|
|
426
|
+
"data-slot": "input",
|
|
427
|
+
className: cn(
|
|
428
|
+
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
429
|
+
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
|
430
|
+
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
431
|
+
className
|
|
432
|
+
),
|
|
433
|
+
...props
|
|
434
|
+
}
|
|
435
|
+
);
|
|
436
|
+
}
|
|
437
|
+
|
|
438
|
+
// src/components/ui/badge.tsx
|
|
439
|
+
var import_react_slot2 = require("@radix-ui/react-slot");
|
|
440
|
+
var import_class_variance_authority2 = require("class-variance-authority");
|
|
441
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
442
|
+
var badgeVariants = (0, import_class_variance_authority2.cva)(
|
|
443
|
+
"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
|
|
444
|
+
{
|
|
445
|
+
variants: {
|
|
446
|
+
variant: {
|
|
447
|
+
default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
|
|
448
|
+
secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
|
|
449
|
+
destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
|
450
|
+
outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
|
|
451
|
+
}
|
|
452
|
+
},
|
|
453
|
+
defaultVariants: {
|
|
454
|
+
variant: "default"
|
|
455
|
+
}
|
|
456
|
+
}
|
|
457
|
+
);
|
|
458
|
+
function Badge({
|
|
459
|
+
className,
|
|
460
|
+
variant,
|
|
461
|
+
asChild = false,
|
|
462
|
+
...props
|
|
463
|
+
}) {
|
|
464
|
+
const Comp = asChild ? import_react_slot2.Slot : "span";
|
|
465
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
466
|
+
Comp,
|
|
467
|
+
{
|
|
468
|
+
"data-slot": "badge",
|
|
469
|
+
className: cn(badgeVariants({ variant }), className),
|
|
470
|
+
...props
|
|
471
|
+
}
|
|
472
|
+
);
|
|
473
|
+
}
|
|
474
|
+
|
|
475
|
+
// src/components/ui/select.tsx
|
|
476
|
+
var React = __toESM(require("react"), 1);
|
|
477
|
+
var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
|
|
478
|
+
var import_lucide_react = require("lucide-react");
|
|
479
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
480
|
+
var Select = SelectPrimitive.Root;
|
|
481
|
+
var SelectValue = SelectPrimitive.Value;
|
|
482
|
+
var SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
483
|
+
SelectPrimitive.Trigger,
|
|
484
|
+
{
|
|
485
|
+
ref,
|
|
486
|
+
className: cn(
|
|
487
|
+
"flex h-9 w-full items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs outline-none transition-colors placeholder:text-muted-foreground focus:ring-2 focus:ring-ring/40 disabled:cursor-not-allowed disabled:opacity-50",
|
|
488
|
+
className
|
|
489
|
+
),
|
|
490
|
+
...props,
|
|
491
|
+
children: [
|
|
492
|
+
children,
|
|
493
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.ChevronDown, { className: "h-4 w-4 opacity-50" }) })
|
|
494
|
+
]
|
|
495
|
+
}
|
|
496
|
+
));
|
|
497
|
+
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
498
|
+
var SelectContent = React.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
499
|
+
SelectPrimitive.Content,
|
|
500
|
+
{
|
|
501
|
+
ref,
|
|
502
|
+
className: cn(
|
|
503
|
+
"relative z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
|
|
504
|
+
position === "popper" && "translate-y-1",
|
|
505
|
+
className
|
|
506
|
+
),
|
|
507
|
+
position,
|
|
508
|
+
...props,
|
|
509
|
+
children: [
|
|
510
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.ScrollUpButton, { className: "flex cursor-default items-center justify-center py-1", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.ChevronUp, { className: "h-4 w-4" }) }),
|
|
511
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
512
|
+
SelectPrimitive.Viewport,
|
|
513
|
+
{
|
|
514
|
+
className: cn(
|
|
515
|
+
"p-1",
|
|
516
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
|
|
517
|
+
),
|
|
518
|
+
children
|
|
519
|
+
}
|
|
520
|
+
),
|
|
521
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.ScrollDownButton, { className: "flex cursor-default items-center justify-center py-1", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.ChevronDown, { className: "h-4 w-4" }) })
|
|
522
|
+
]
|
|
523
|
+
}
|
|
524
|
+
) }));
|
|
525
|
+
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
526
|
+
var SelectItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
527
|
+
SelectPrimitive.Item,
|
|
528
|
+
{
|
|
529
|
+
ref,
|
|
530
|
+
className: cn(
|
|
531
|
+
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
532
|
+
className
|
|
533
|
+
),
|
|
534
|
+
...props,
|
|
535
|
+
children: [
|
|
536
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.ItemText, { children }),
|
|
537
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.ItemIndicator, { className: "absolute right-2 inline-flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.Check, { className: "h-4 w-4" }) })
|
|
538
|
+
]
|
|
539
|
+
}
|
|
540
|
+
));
|
|
541
|
+
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
542
|
+
|
|
543
|
+
// src/CopilotzAdmin.tsx
|
|
544
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
545
|
+
var CopilotzAdmin = ({
|
|
546
|
+
config: userConfig,
|
|
547
|
+
className
|
|
548
|
+
}) => {
|
|
549
|
+
const config = (0, import_react2.useMemo)(
|
|
550
|
+
() => mergeAdminConfig(defaultAdminConfig, userConfig),
|
|
551
|
+
[userConfig]
|
|
552
|
+
);
|
|
553
|
+
const [threadSearch, setThreadSearch] = (0, import_react2.useState)("");
|
|
554
|
+
const [participantSearch, setParticipantSearch] = (0, import_react2.useState)("");
|
|
555
|
+
const [agentSearch, setAgentSearch] = (0, import_react2.useState)("");
|
|
556
|
+
const deferredThreadSearch = (0, import_react2.useDeferredValue)(threadSearch);
|
|
557
|
+
const deferredParticipantSearch = (0, import_react2.useDeferredValue)(participantSearch);
|
|
558
|
+
const deferredAgentSearch = (0, import_react2.useDeferredValue)(agentSearch);
|
|
559
|
+
const admin = useCopilotzAdmin({
|
|
560
|
+
baseUrl: config.baseUrl,
|
|
561
|
+
getRequestHeaders: config.getRequestHeaders,
|
|
562
|
+
namespace: config.namespace,
|
|
563
|
+
range: config.initialRange,
|
|
564
|
+
interval: config.initialInterval,
|
|
565
|
+
threadSearch: deferredThreadSearch,
|
|
566
|
+
participantSearch: deferredParticipantSearch,
|
|
567
|
+
agentSearch: deferredAgentSearch
|
|
568
|
+
});
|
|
569
|
+
const cards = [
|
|
570
|
+
{
|
|
571
|
+
label: config.labels.messagesCard,
|
|
572
|
+
value: admin.overview?.messageTotals.total ?? 0,
|
|
573
|
+
detail: `${admin.overview?.messageTotals.toolCallMessages ?? 0} tool-call messages`
|
|
574
|
+
},
|
|
575
|
+
{
|
|
576
|
+
label: config.labels.activeThreadsCard,
|
|
577
|
+
value: admin.overview?.threadTotals.active ?? 0,
|
|
578
|
+
detail: `${admin.overview?.threadTotals.total ?? 0} total threads`
|
|
579
|
+
},
|
|
580
|
+
{
|
|
581
|
+
label: config.labels.participantsCard,
|
|
582
|
+
value: admin.overview?.participantTotals.total ?? 0,
|
|
583
|
+
detail: `${admin.overview?.participantTotals.agents ?? 0} agents`
|
|
584
|
+
},
|
|
585
|
+
{
|
|
586
|
+
label: config.labels.tokensCard,
|
|
587
|
+
value: admin.overview?.llmTotals.totalTokens ?? 0,
|
|
588
|
+
detail: `${admin.overview?.llmTotals.totalCalls ?? 0} calls`
|
|
589
|
+
},
|
|
590
|
+
{
|
|
591
|
+
label: config.labels.queueCard,
|
|
592
|
+
value: admin.overview?.queueTotals.pending ?? 0,
|
|
593
|
+
detail: `${admin.overview?.queueTotals.failed ?? 0} failed`
|
|
594
|
+
}
|
|
595
|
+
];
|
|
596
|
+
if (admin.isLoading && !admin.overview) {
|
|
597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Card, { className: cn("border-border", className), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CardContent, { className: "text-muted-foreground", children: config.labels.loading }) });
|
|
598
|
+
}
|
|
599
|
+
if (admin.error && !admin.overview) {
|
|
600
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Card, { className: cn("border-destructive/50 bg-destructive/10", className), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(CardContent, { className: "space-y-4", children: [
|
|
601
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-base font-semibold text-destructive", children: admin.error.message }),
|
|
602
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
603
|
+
Button,
|
|
604
|
+
{
|
|
605
|
+
variant: "destructive",
|
|
606
|
+
onClick: () => void admin.refresh(),
|
|
607
|
+
children: config.labels.retry
|
|
608
|
+
}
|
|
609
|
+
)
|
|
610
|
+
] }) });
|
|
611
|
+
}
|
|
612
|
+
const isEmpty = cards.every((card) => card.value === 0) && admin.activity.length === 0 && admin.threads.length === 0 && admin.participants.length === 0 && admin.agents.length === 0;
|
|
613
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Card, { className: cn("gap-0 overflow-hidden py-0", className), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(CardContent, { className: "space-y-6 p-6", children: [
|
|
614
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("header", { className: "flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between", children: [
|
|
615
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "space-y-1", children: [
|
|
616
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
617
|
+
config.branding.logo ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-xl border bg-background shadow-sm", children: config.branding.logo }) : null,
|
|
618
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
|
|
619
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h2", { className: "text-2xl font-semibold tracking-tight", children: config.branding.title }),
|
|
620
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-sm text-muted-foreground", children: config.branding.subtitle })
|
|
621
|
+
] })
|
|
622
|
+
] }),
|
|
623
|
+
config.namespace ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("p", { className: "text-xs font-medium uppercase tracking-[0.18em] text-muted-foreground", children: [
|
|
624
|
+
"Namespace: ",
|
|
625
|
+
config.namespace
|
|
626
|
+
] }) : null
|
|
627
|
+
] }),
|
|
628
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-wrap items-center gap-2", children: [
|
|
629
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
630
|
+
Button,
|
|
631
|
+
{
|
|
632
|
+
variant: admin.filters.range === "24h" ? "default" : "outline",
|
|
633
|
+
size: "sm",
|
|
634
|
+
onClick: () => admin.setRange("24h"),
|
|
635
|
+
children: config.labels.range24h
|
|
636
|
+
}
|
|
637
|
+
),
|
|
638
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
639
|
+
Button,
|
|
640
|
+
{
|
|
641
|
+
variant: admin.filters.range === "7d" ? "default" : "outline",
|
|
642
|
+
size: "sm",
|
|
643
|
+
onClick: () => admin.setRange("7d"),
|
|
644
|
+
children: config.labels.range7d
|
|
645
|
+
}
|
|
646
|
+
),
|
|
647
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
648
|
+
Button,
|
|
649
|
+
{
|
|
650
|
+
variant: admin.filters.range === "30d" ? "default" : "outline",
|
|
651
|
+
size: "sm",
|
|
652
|
+
onClick: () => admin.setRange("30d"),
|
|
653
|
+
children: config.labels.range30d
|
|
654
|
+
}
|
|
655
|
+
),
|
|
656
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
657
|
+
Select,
|
|
658
|
+
{
|
|
659
|
+
value: admin.filters.interval,
|
|
660
|
+
onValueChange: (v) => admin.setInterval(v),
|
|
661
|
+
children: [
|
|
662
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectTrigger, { className: "h-8 w-[110px]", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectValue, {}) }),
|
|
663
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(SelectContent, { children: [
|
|
664
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectItem, { value: "hour", children: config.labels.intervalHour }),
|
|
665
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectItem, { value: "day", children: config.labels.intervalDay })
|
|
666
|
+
] })
|
|
667
|
+
]
|
|
668
|
+
}
|
|
669
|
+
),
|
|
670
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
671
|
+
Button,
|
|
672
|
+
{
|
|
673
|
+
variant: "outline",
|
|
674
|
+
size: "sm",
|
|
675
|
+
onClick: () => void admin.refresh(),
|
|
676
|
+
children: config.labels.refresh
|
|
677
|
+
}
|
|
678
|
+
),
|
|
679
|
+
config.branding.actions
|
|
680
|
+
] })
|
|
681
|
+
] }),
|
|
682
|
+
isEmpty ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "rounded-xl border border-dashed p-10 text-center", children: [
|
|
683
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "text-lg font-semibold", children: config.labels.emptyTitle }),
|
|
684
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-2 text-sm text-muted-foreground", children: config.labels.emptyDescription })
|
|
685
|
+
] }) : null,
|
|
686
|
+
config.features.showOverview ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("section", { className: "space-y-4", children: [
|
|
687
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SectionHeading, { title: config.labels.overviewTitle }),
|
|
688
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "grid grid-cols-2 gap-4 md:grid-cols-3 lg:grid-cols-5", children: cards.map((card) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
689
|
+
"div",
|
|
690
|
+
{
|
|
691
|
+
className: "rounded-xl border bg-background p-5 shadow-sm",
|
|
692
|
+
children: [
|
|
693
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-sm font-medium text-muted-foreground", children: card.label }),
|
|
694
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-3 text-3xl font-semibold tracking-tight", children: formatNumber(card.value) }),
|
|
695
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-2 text-xs text-muted-foreground", children: card.detail })
|
|
696
|
+
]
|
|
697
|
+
},
|
|
698
|
+
card.label
|
|
699
|
+
)) })
|
|
700
|
+
] }) : null,
|
|
701
|
+
config.features.showActivity ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("section", { className: "space-y-4", children: [
|
|
702
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SectionHeading, { title: config.labels.activityTitle }),
|
|
703
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
704
|
+
ActivityChart,
|
|
705
|
+
{
|
|
706
|
+
interval: admin.filters.interval,
|
|
707
|
+
labels: config.labels,
|
|
708
|
+
maxBars: config.ui.maxActivityBars,
|
|
709
|
+
points: admin.activity
|
|
710
|
+
}
|
|
711
|
+
)
|
|
712
|
+
] }) : null,
|
|
713
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid gap-6 lg:grid-cols-3", children: [
|
|
714
|
+
config.features.showThreads ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
715
|
+
DataTable,
|
|
716
|
+
{
|
|
717
|
+
rows: admin.threads,
|
|
718
|
+
searchPlaceholder: config.labels.threadSearchPlaceholder,
|
|
719
|
+
searchValue: threadSearch,
|
|
720
|
+
setSearchValue: setThreadSearch,
|
|
721
|
+
title: config.labels.threadsTitle,
|
|
722
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ThreadsTable, { rows: admin.threads, labels: config.labels })
|
|
723
|
+
}
|
|
724
|
+
) : null,
|
|
725
|
+
config.features.showParticipants ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
726
|
+
DataTable,
|
|
727
|
+
{
|
|
728
|
+
rows: admin.participants,
|
|
729
|
+
searchPlaceholder: config.labels.participantSearchPlaceholder,
|
|
730
|
+
searchValue: participantSearch,
|
|
731
|
+
setSearchValue: setParticipantSearch,
|
|
732
|
+
title: config.labels.participantsTitle,
|
|
733
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
734
|
+
ParticipantsTable,
|
|
735
|
+
{
|
|
736
|
+
rows: admin.participants,
|
|
737
|
+
labels: config.labels
|
|
738
|
+
}
|
|
739
|
+
)
|
|
740
|
+
}
|
|
741
|
+
) : null,
|
|
742
|
+
config.features.showAgents ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
743
|
+
DataTable,
|
|
744
|
+
{
|
|
745
|
+
rows: admin.agents,
|
|
746
|
+
searchPlaceholder: config.labels.agentSearchPlaceholder,
|
|
747
|
+
searchValue: agentSearch,
|
|
748
|
+
setSearchValue: setAgentSearch,
|
|
749
|
+
title: config.labels.agentsTitle,
|
|
750
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AgentsTable, { rows: admin.agents, labels: config.labels })
|
|
751
|
+
}
|
|
752
|
+
) : null
|
|
753
|
+
] })
|
|
754
|
+
] }) });
|
|
755
|
+
};
|
|
756
|
+
function SectionHeading({ title }) {
|
|
757
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "text-lg font-semibold tracking-tight", children: title });
|
|
758
|
+
}
|
|
759
|
+
function ActivityChart(props) {
|
|
760
|
+
const trimmedPoints = props.points.slice(-props.maxBars);
|
|
761
|
+
const maxMessages = Math.max(
|
|
762
|
+
...trimmedPoints.map((point) => point.messageCount),
|
|
763
|
+
1
|
|
764
|
+
);
|
|
765
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "rounded-xl border bg-background p-5 shadow-sm", children: trimmedPoints.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-sm text-muted-foreground", children: props.labels.noResults }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex min-h-48 items-end gap-2", children: trimmedPoints.map((point) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
766
|
+
"div",
|
|
767
|
+
{
|
|
768
|
+
className: "flex min-w-0 flex-1 flex-col items-center gap-2",
|
|
769
|
+
children: [
|
|
770
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex h-36 w-full items-end rounded-lg bg-muted px-1 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
771
|
+
"div",
|
|
772
|
+
{
|
|
773
|
+
className: "w-full rounded-md bg-primary transition-all",
|
|
774
|
+
style: {
|
|
775
|
+
height: `${Math.max(point.messageCount / maxMessages * 100, 8)}%`
|
|
776
|
+
}
|
|
777
|
+
}
|
|
778
|
+
) }),
|
|
779
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "text-center", children: [
|
|
780
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-xs font-medium", children: formatBucket(point.bucket, props.interval) }),
|
|
781
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("p", { className: "text-[11px] text-muted-foreground", children: [
|
|
782
|
+
formatNumber(point.messageCount),
|
|
783
|
+
" msg"
|
|
784
|
+
] })
|
|
785
|
+
] })
|
|
786
|
+
]
|
|
787
|
+
},
|
|
788
|
+
point.bucket
|
|
789
|
+
)) }) });
|
|
790
|
+
}
|
|
791
|
+
function DataTable(props) {
|
|
792
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "rounded-xl border bg-background p-5 shadow-sm", children: [
|
|
793
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mb-4 flex items-center justify-between gap-3", children: [
|
|
794
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SectionHeading, { title: props.title }),
|
|
795
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
796
|
+
Input,
|
|
797
|
+
{
|
|
798
|
+
className: "h-8 w-full max-w-44",
|
|
799
|
+
onChange: (event) => props.setSearchValue(event.target.value),
|
|
800
|
+
placeholder: props.searchPlaceholder,
|
|
801
|
+
value: props.searchValue
|
|
802
|
+
}
|
|
803
|
+
)
|
|
804
|
+
] }),
|
|
805
|
+
props.rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-sm text-muted-foreground", children: "No results" }) : props.children
|
|
806
|
+
] });
|
|
807
|
+
}
|
|
808
|
+
function ThreadsTable({
|
|
809
|
+
rows,
|
|
810
|
+
labels
|
|
811
|
+
}) {
|
|
812
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "space-y-3", children: rows.map((thread) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
813
|
+
"div",
|
|
814
|
+
{
|
|
815
|
+
className: "rounded-lg border bg-muted/50 p-4",
|
|
816
|
+
children: [
|
|
817
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
|
|
818
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "min-w-0", children: [
|
|
819
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "font-medium", children: thread.name }),
|
|
820
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-1 truncate text-xs text-muted-foreground", children: thread.summary ?? thread.lastMessagePreview ?? "No summary yet" })
|
|
821
|
+
] }),
|
|
822
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
823
|
+
Badge,
|
|
824
|
+
{
|
|
825
|
+
variant: thread.status === "archived" ? "secondary" : "default",
|
|
826
|
+
children: thread.status === "archived" ? labels.statusArchived : labels.statusActive
|
|
827
|
+
}
|
|
828
|
+
)
|
|
829
|
+
] }),
|
|
830
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mt-3 flex flex-wrap gap-3 text-xs text-muted-foreground", children: [
|
|
831
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
832
|
+
formatNumber(thread.messageCount),
|
|
833
|
+
" messages"
|
|
834
|
+
] }),
|
|
835
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
836
|
+
thread.participantIds.length,
|
|
837
|
+
" participants"
|
|
838
|
+
] }),
|
|
839
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { children: formatDate(thread.lastActivityAt) })
|
|
840
|
+
] })
|
|
841
|
+
]
|
|
842
|
+
},
|
|
843
|
+
thread.threadId
|
|
844
|
+
)) });
|
|
845
|
+
}
|
|
846
|
+
function ParticipantsTable({
|
|
847
|
+
rows,
|
|
848
|
+
labels
|
|
849
|
+
}) {
|
|
850
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "space-y-3", children: rows.map((participant) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
851
|
+
"div",
|
|
852
|
+
{
|
|
853
|
+
className: "rounded-lg border bg-muted/50 p-4",
|
|
854
|
+
children: [
|
|
855
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
|
|
856
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "min-w-0", children: [
|
|
857
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "font-medium", children: participant.displayName }),
|
|
858
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-1 text-xs uppercase tracking-[0.18em] text-muted-foreground", children: participant.participantType })
|
|
859
|
+
] }),
|
|
860
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Badge, { variant: "outline", children: participant.isGlobal ? labels.scopeGlobal : labels.scopeScoped })
|
|
861
|
+
] }),
|
|
862
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mt-3 flex flex-wrap gap-3 text-xs text-muted-foreground", children: [
|
|
863
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
864
|
+
formatNumber(participant.messageCount),
|
|
865
|
+
" messages"
|
|
866
|
+
] }),
|
|
867
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
868
|
+
formatNumber(participant.threadCount),
|
|
869
|
+
" threads"
|
|
870
|
+
] }),
|
|
871
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { children: formatDate(participant.lastActivityAt) })
|
|
872
|
+
] })
|
|
873
|
+
]
|
|
874
|
+
},
|
|
875
|
+
`${participant.namespace}:${participant.externalId}`
|
|
876
|
+
)) });
|
|
877
|
+
}
|
|
878
|
+
function AgentsTable({
|
|
879
|
+
rows,
|
|
880
|
+
labels
|
|
881
|
+
}) {
|
|
882
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "space-y-3", children: rows.map((agent) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
883
|
+
"div",
|
|
884
|
+
{
|
|
885
|
+
className: "rounded-lg border bg-muted/50 p-4",
|
|
886
|
+
children: [
|
|
887
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
|
|
888
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "min-w-0", children: [
|
|
889
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "font-medium", children: agent.displayName }),
|
|
890
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-1 truncate text-xs text-muted-foreground", children: agent.description ?? agent.agentId })
|
|
891
|
+
] }),
|
|
892
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Badge, { variant: "outline", children: agent.isConfigured ? labels.configured : labels.unconfigured })
|
|
893
|
+
] }),
|
|
894
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mt-3 grid grid-cols-2 gap-2 text-xs text-muted-foreground", children: [
|
|
895
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
896
|
+
formatNumber(agent.messageCount),
|
|
897
|
+
" messages"
|
|
898
|
+
] }),
|
|
899
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
900
|
+
formatNumber(agent.llmCallCount),
|
|
901
|
+
" LLM calls"
|
|
902
|
+
] }),
|
|
903
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
904
|
+
formatNumber(agent.toolCallMessageCount),
|
|
905
|
+
" tool calls"
|
|
906
|
+
] }),
|
|
907
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { children: [
|
|
908
|
+
formatNumber(agent.totalTokens),
|
|
909
|
+
" tokens"
|
|
910
|
+
] })
|
|
911
|
+
] })
|
|
912
|
+
]
|
|
913
|
+
},
|
|
914
|
+
`${agent.namespace}:${agent.agentId}`
|
|
915
|
+
)) });
|
|
916
|
+
}
|
|
917
|
+
function formatBucket(bucket, interval) {
|
|
918
|
+
const date = new Date(bucket);
|
|
919
|
+
if (Number.isNaN(date.getTime())) return bucket;
|
|
920
|
+
return interval === "hour" ? date.toLocaleString(void 0, {
|
|
921
|
+
hour: "numeric",
|
|
922
|
+
month: "short",
|
|
923
|
+
day: "numeric"
|
|
924
|
+
}) : date.toLocaleDateString(void 0, {
|
|
925
|
+
month: "short",
|
|
926
|
+
day: "numeric"
|
|
927
|
+
});
|
|
928
|
+
}
|
|
929
|
+
function formatDate(value) {
|
|
930
|
+
if (!value) return "No activity";
|
|
931
|
+
const date = new Date(value);
|
|
932
|
+
if (Number.isNaN(date.getTime())) return value;
|
|
933
|
+
return date.toLocaleString(void 0, {
|
|
934
|
+
month: "short",
|
|
935
|
+
day: "numeric",
|
|
936
|
+
hour: "numeric",
|
|
937
|
+
minute: "2-digit"
|
|
938
|
+
});
|
|
939
|
+
}
|
|
940
|
+
function formatNumber(value) {
|
|
941
|
+
return new Intl.NumberFormat().format(value);
|
|
942
|
+
}
|
|
943
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
944
|
+
0 && (module.exports = {
|
|
945
|
+
CopilotzAdmin,
|
|
946
|
+
defaultAdminConfig,
|
|
947
|
+
fetchAdminActivity,
|
|
948
|
+
fetchAdminAgents,
|
|
949
|
+
fetchAdminOverview,
|
|
950
|
+
fetchAdminParticipants,
|
|
951
|
+
fetchAdminThreads,
|
|
952
|
+
mergeAdminConfig,
|
|
953
|
+
useCopilotzAdmin
|
|
954
|
+
});
|
|
955
|
+
//# sourceMappingURL=index.cjs.map
|