dp-widgets-framework 1.0.5 → 1.0.7
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.esm.js +166 -644
- package/dist/index.js +166 -644
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -15110,7 +15110,14 @@ function BarChart({ orientation, title, data, options, className }) {
|
|
|
15110
15110
|
},
|
|
15111
15111
|
scales: {
|
|
15112
15112
|
x: {
|
|
15113
|
-
ticks: {
|
|
15113
|
+
ticks: {
|
|
15114
|
+
autoSkip: false,
|
|
15115
|
+
maxRotation: 45,
|
|
15116
|
+
minRotation: 45,
|
|
15117
|
+
font: {
|
|
15118
|
+
size: 10
|
|
15119
|
+
}
|
|
15120
|
+
},
|
|
15114
15121
|
},
|
|
15115
15122
|
y: { beginAtZero: true },
|
|
15116
15123
|
},
|
|
@@ -35959,7 +35966,87 @@ function SummaryWidget({ title, data, metadata, className }) {
|
|
|
35959
35966
|
}, children: title }) })), jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-auto space-y-4", children: jsxRuntimeExports.jsx("div", { className: "prose prose-sm max-w-none", children: jsxRuntimeExports.jsx(Markdown, { className: "text-gray-800 dark:text-gray-200", children: data.content }) }) })] }));
|
|
35960
35967
|
}
|
|
35961
35968
|
|
|
35962
|
-
const CHART_REFRESH_TIMEOUT =
|
|
35969
|
+
const CHART_REFRESH_TIMEOUT = 3000;
|
|
35970
|
+
const DEFAULT_COLORS = ["#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#601B07", "#50649D", "#B4A8A0", "#6F2587"];
|
|
35971
|
+
const LINE_COLORS = ["#243D84", "#69238B", "#4A959F", "#D0A677", "#B31E47", "#396431"];
|
|
35972
|
+
const clearChat = async (widgetBackendUrl, widgetId) => {
|
|
35973
|
+
if (!widgetBackendUrl || !widgetId)
|
|
35974
|
+
return;
|
|
35975
|
+
console.log('clearChat called for widgetId:', widgetId);
|
|
35976
|
+
try {
|
|
35977
|
+
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
35978
|
+
method: 'POST',
|
|
35979
|
+
headers: {
|
|
35980
|
+
'Content-Type': 'application/json',
|
|
35981
|
+
},
|
|
35982
|
+
body: JSON.stringify({
|
|
35983
|
+
session_id: widgetId,
|
|
35984
|
+
delete_state: true
|
|
35985
|
+
}),
|
|
35986
|
+
});
|
|
35987
|
+
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
35988
|
+
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
35989
|
+
}
|
|
35990
|
+
catch (error) {
|
|
35991
|
+
console.error('Failed to clear chat:', error);
|
|
35992
|
+
}
|
|
35993
|
+
};
|
|
35994
|
+
const createLoadingComponent = (message = "Loading chart data...") => (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-2", children: [jsxRuntimeExports.jsx(lucideReact.RefreshCw, { className: "h-6 w-6 animate-spin text-blue-500" }), jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-500", children: message })] }) }));
|
|
35995
|
+
const createInitialChartState = (agentType, widgetIds, datasetId) => {
|
|
35996
|
+
const baseState = { dataset_id: datasetId || "home_generation_dataset" };
|
|
35997
|
+
switch (agentType) {
|
|
35998
|
+
case "Pie Chart Agent":
|
|
35999
|
+
return {
|
|
36000
|
+
pie_chart_data: {
|
|
36001
|
+
title: "",
|
|
36002
|
+
type: "pie",
|
|
36003
|
+
chart_type: "financial",
|
|
36004
|
+
data: { labels: [], values: [], percentages: [], total: 0 },
|
|
36005
|
+
metadata: { categories: 0, largest_category: "", largest_value: 0, largest_percentage: 0 }
|
|
36006
|
+
}
|
|
36007
|
+
};
|
|
36008
|
+
case "Line Chart Agent":
|
|
36009
|
+
case "Bar Chart Agent":
|
|
36010
|
+
return Object.assign({ bar_chart_data: {
|
|
36011
|
+
title: "",
|
|
36012
|
+
type: agentType === "Line Chart Agent" ? "line" : "bar",
|
|
36013
|
+
chart_type: "financial",
|
|
36014
|
+
orientation: agentType === "Line Chart Agent" ? "horizontal" : "vertical",
|
|
36015
|
+
data: { labels: [], values: [], total: 0, average: 0 },
|
|
36016
|
+
metadata: { categories: 0, highest_category: "", highest_value: 0, lowest_category: "", lowest_value: 0, range: 0 }
|
|
36017
|
+
} }, baseState);
|
|
36018
|
+
case "Series Bar Chart Agent":
|
|
36019
|
+
case "Series Line Chart Agent":
|
|
36020
|
+
return Object.assign({ series_bar_chart_data: {
|
|
36021
|
+
title: "",
|
|
36022
|
+
type: "series_bar",
|
|
36023
|
+
chart_type: "financial",
|
|
36024
|
+
orientation: "vertical",
|
|
36025
|
+
data: { labels: [], series: [], total: 0, average: 0 },
|
|
36026
|
+
metadata: {
|
|
36027
|
+
categories: 0, series_count: 0, highest_category: "", highest_value: 0, highest_series: "",
|
|
36028
|
+
lowest_category: "", lowest_value: 0, lowest_series: "", range: 0, series_totals: {}, series_averages: {}
|
|
36029
|
+
}
|
|
36030
|
+
} }, baseState);
|
|
36031
|
+
case "Data Grid Agent":
|
|
36032
|
+
return Object.assign({ matrix_grid_data: {
|
|
36033
|
+
title: "",
|
|
36034
|
+
type: "data_grid",
|
|
36035
|
+
grid_type: "",
|
|
36036
|
+
data: { headers: [], rows: [], row_count: 0, column_count: 0 },
|
|
36037
|
+
metadata: { total_rows: 0, total_columns: 0, numeric_columns: [] }
|
|
36038
|
+
} }, baseState);
|
|
36039
|
+
case "Summary Agent":
|
|
36040
|
+
return Object.assign({ summary_data: {
|
|
36041
|
+
title: "",
|
|
36042
|
+
type: "summary",
|
|
36043
|
+
data: { content: "", word_count: 0, character_count: 0, character_count_no_spaces: 0, line_count: 0 },
|
|
36044
|
+
metadata: { created_at: "", content_type: "text", is_multiline: false }
|
|
36045
|
+
} }, baseState);
|
|
36046
|
+
default:
|
|
36047
|
+
return { widget_ids: widgetIds };
|
|
36048
|
+
}
|
|
36049
|
+
};
|
|
35963
36050
|
const loadAgentState = async (widgetBackendUrl, threadId, agentName) => {
|
|
35964
36051
|
try {
|
|
35965
36052
|
const response = await fetch(`${widgetBackendUrl}/api/copilot/${agentName}`, {
|
|
@@ -36023,7 +36110,6 @@ const parseAndUpdateChartState = (apiResponse, setChartState) => {
|
|
|
36023
36110
|
if (chartData.agent_message) {
|
|
36024
36111
|
newChartState.agent_message = chartData.agent_message;
|
|
36025
36112
|
}
|
|
36026
|
-
console.log('Chart state updated from API response:', newChartState);
|
|
36027
36113
|
return newChartState;
|
|
36028
36114
|
});
|
|
36029
36115
|
}
|
|
@@ -36058,40 +36144,15 @@ const getStyleValues = (styles = {}) => {
|
|
|
36058
36144
|
};
|
|
36059
36145
|
function BarChartComponent({ orientation, barChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36060
36146
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36147
|
+
const hasCalledRef = React.useRef(false);
|
|
36061
36148
|
const labels = ((_b = (_a = barChartState === null || barChartState === void 0 ? void 0 : barChartState.bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = barChartState === null || barChartState === void 0 ? void 0 : barChartState.state) === null || _c === void 0 ? void 0 : _c.bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36062
36149
|
const values = ((_g = (_f = barChartState === null || barChartState === void 0 ? void 0 : barChartState.bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.values) || ((_k = (_j = (_h = barChartState === null || barChartState === void 0 ? void 0 : barChartState.state) === null || _h === void 0 ? void 0 : _h.bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) || [];
|
|
36063
36150
|
const chartTitle = ((_l = barChartState === null || barChartState === void 0 ? void 0 : barChartState.bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = barChartState === null || barChartState === void 0 ? void 0 : barChartState.state) === null || _m === void 0 ? void 0 : _m.bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36064
36151
|
values.length > 0 ? Math.max(...values) : 0;
|
|
36065
36152
|
const isEmpty = labels.length === 0 || values.length === 0;
|
|
36066
|
-
const clearChat = async () => {
|
|
36067
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36068
|
-
return;
|
|
36069
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36070
|
-
try {
|
|
36071
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36072
|
-
method: 'POST',
|
|
36073
|
-
headers: {
|
|
36074
|
-
'Content-Type': 'application/json',
|
|
36075
|
-
},
|
|
36076
|
-
body: JSON.stringify({
|
|
36077
|
-
session_id: widgetId,
|
|
36078
|
-
delete_state: true
|
|
36079
|
-
}),
|
|
36080
|
-
});
|
|
36081
|
-
// Clear chart state directly after clearing chat
|
|
36082
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36083
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36084
|
-
}
|
|
36085
|
-
catch (error) {
|
|
36086
|
-
console.error('Failed to clear chat:', error);
|
|
36087
|
-
}
|
|
36088
|
-
};
|
|
36089
36153
|
const handleRefresh = async () => {
|
|
36090
|
-
if (query) {
|
|
36091
|
-
await clearChat();
|
|
36092
|
-
// Send trigger event to clear chart state
|
|
36093
|
-
console.log('Dispatching clearChartState event for widgetId:', widgetId);
|
|
36094
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36154
|
+
if (query && widgetBackendUrl && widgetId) {
|
|
36155
|
+
await clearChat(widgetBackendUrl, widgetId);
|
|
36095
36156
|
appendMessage(new TextMessage({
|
|
36096
36157
|
content: `${query} and render data on a bar chart`,
|
|
36097
36158
|
role: Role.User,
|
|
@@ -36099,10 +36160,12 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36099
36160
|
}
|
|
36100
36161
|
};
|
|
36101
36162
|
React.useEffect(() => {
|
|
36102
|
-
if (isEmpty && query && isFirstLoad && !(barChartState === null || barChartState === void 0 ? void 0 : barChartState.agent_message)) {
|
|
36163
|
+
if (isEmpty && query && isFirstLoad && !(barChartState === null || barChartState === void 0 ? void 0 : barChartState.agent_message) && !hasCalledRef.current) {
|
|
36164
|
+
// console.log('calling append message')
|
|
36165
|
+
hasCalledRef.current = true;
|
|
36103
36166
|
handleRefresh();
|
|
36104
36167
|
}
|
|
36105
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36168
|
+
}, [isEmpty, query, isFirstLoad, barChartState]);
|
|
36106
36169
|
// Start timeout when chart is empty and loading
|
|
36107
36170
|
React.useEffect(() => {
|
|
36108
36171
|
if (isEmpty && startLoadingTimeout && !(barChartState === null || barChartState === void 0 ? void 0 : barChartState.agent_message)) {
|
|
@@ -36112,12 +36175,11 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36112
36175
|
clearLoadingTimeout();
|
|
36113
36176
|
}
|
|
36114
36177
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36115
|
-
const colors = ["#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#8C99C4", "#601B07", "#50649D", "#B4A8A0", "#808080", "#6F2587"];
|
|
36116
36178
|
const finalColors = React.useMemo(() => {
|
|
36117
|
-
return shuffleColors(
|
|
36179
|
+
return shuffleColors(DEFAULT_COLORS, labels === null || labels === void 0 ? void 0 : labels.length);
|
|
36118
36180
|
}, [labels.length]);
|
|
36119
36181
|
if (isEmpty) {
|
|
36120
|
-
return (
|
|
36182
|
+
return createLoadingComponent();
|
|
36121
36183
|
}
|
|
36122
36184
|
const transformedData = {
|
|
36123
36185
|
labels: labels,
|
|
@@ -36126,10 +36188,6 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36126
36188
|
label: chartTitle || "Data",
|
|
36127
36189
|
data: values,
|
|
36128
36190
|
backgroundColor: finalColors,
|
|
36129
|
-
// backgroundColor: labels.map((_, index) => {
|
|
36130
|
-
// const colors = ["#60a5fa", "#34d399", "#fbbf24", "#f87171", "#a78bfa", "#fb7185", "#4ade80", "#facc15"];
|
|
36131
|
-
// return colors[index % colors.length];
|
|
36132
|
-
// }),
|
|
36133
36191
|
},
|
|
36134
36192
|
],
|
|
36135
36193
|
};
|
|
@@ -36137,33 +36195,11 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36137
36195
|
}
|
|
36138
36196
|
function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36139
36197
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36198
|
+
const hasCalledRef = React.useRef(false);
|
|
36140
36199
|
const labels = ((_b = (_a = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.series_bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.state) === null || _c === void 0 ? void 0 : _c.series_bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36141
36200
|
const series = ((_g = (_f = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.series_bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.series) || ((_k = (_j = (_h = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.state) === null || _h === void 0 ? void 0 : _h.series_bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.series) || [];
|
|
36142
36201
|
const chartTitle = ((_l = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.series_bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.state) === null || _m === void 0 ? void 0 : _m.series_bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36143
36202
|
const isEmpty = labels.length === 0 || series.length === 0;
|
|
36144
|
-
const clearChat = async () => {
|
|
36145
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36146
|
-
return;
|
|
36147
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36148
|
-
try {
|
|
36149
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36150
|
-
method: 'POST',
|
|
36151
|
-
headers: {
|
|
36152
|
-
'Content-Type': 'application/json',
|
|
36153
|
-
},
|
|
36154
|
-
body: JSON.stringify({
|
|
36155
|
-
session_id: widgetId,
|
|
36156
|
-
delete_state: true
|
|
36157
|
-
}),
|
|
36158
|
-
});
|
|
36159
|
-
// Clear chart state directly after clearing chat
|
|
36160
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36161
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36162
|
-
}
|
|
36163
|
-
catch (error) {
|
|
36164
|
-
console.error('Failed to clear chat:', error);
|
|
36165
|
-
}
|
|
36166
|
-
};
|
|
36167
36203
|
const handleRefresh = async () => {
|
|
36168
36204
|
if (query) {
|
|
36169
36205
|
await clearChat();
|
|
@@ -36177,10 +36213,11 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36177
36213
|
}
|
|
36178
36214
|
};
|
|
36179
36215
|
React.useEffect(() => {
|
|
36180
|
-
if (isEmpty && query && isFirstLoad && !(seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.agent_message)) {
|
|
36216
|
+
if (isEmpty && query && isFirstLoad && !(seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.agent_message) && !hasCalledRef.current) {
|
|
36217
|
+
hasCalledRef.current = true;
|
|
36181
36218
|
handleRefresh();
|
|
36182
36219
|
}
|
|
36183
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36220
|
+
}, [isEmpty, query, isFirstLoad, seriesBarChartState]);
|
|
36184
36221
|
// Start timeout when chart is empty and loading
|
|
36185
36222
|
React.useEffect(() => {
|
|
36186
36223
|
if (isEmpty && startLoadingTimeout && !(seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.agent_message)) {
|
|
@@ -36190,12 +36227,11 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36190
36227
|
clearLoadingTimeout();
|
|
36191
36228
|
}
|
|
36192
36229
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36193
|
-
const colors = ["#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#8C99C4", "#601B07", "#50649D", "#B4A8A0", "#808080", "#6F2587"];
|
|
36194
36230
|
const finalColors = React.useMemo(() => {
|
|
36195
|
-
return shuffleColors(
|
|
36231
|
+
return shuffleColors(DEFAULT_COLORS, series === null || series === void 0 ? void 0 : series.length);
|
|
36196
36232
|
}, [series.length]);
|
|
36197
36233
|
if (isEmpty) {
|
|
36198
|
-
return (
|
|
36234
|
+
return createLoadingComponent();
|
|
36199
36235
|
}
|
|
36200
36236
|
const transformedData = {
|
|
36201
36237
|
labels: labels,
|
|
@@ -36209,33 +36245,11 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36209
36245
|
}
|
|
36210
36246
|
function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36211
36247
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36248
|
+
const hasCalledRef = React.useRef(false);
|
|
36212
36249
|
const labels = ((_b = (_a = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _c === void 0 ? void 0 : _c.series_bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36213
36250
|
const series = ((_g = (_f = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.series) || ((_k = (_j = (_h = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _h === void 0 ? void 0 : _h.series_bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.series) || [];
|
|
36214
36251
|
const chartTitle = ((_l = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _m === void 0 ? void 0 : _m.series_bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36215
36252
|
const isEmpty = labels.length === 0 || series.length === 0;
|
|
36216
|
-
const clearChat = async () => {
|
|
36217
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36218
|
-
return;
|
|
36219
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36220
|
-
try {
|
|
36221
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36222
|
-
method: 'POST',
|
|
36223
|
-
headers: {
|
|
36224
|
-
'Content-Type': 'application/json',
|
|
36225
|
-
},
|
|
36226
|
-
body: JSON.stringify({
|
|
36227
|
-
session_id: widgetId,
|
|
36228
|
-
delete_state: true
|
|
36229
|
-
}),
|
|
36230
|
-
});
|
|
36231
|
-
// Clear chart state directly after clearing chat
|
|
36232
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36233
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36234
|
-
}
|
|
36235
|
-
catch (error) {
|
|
36236
|
-
console.error('Failed to clear chat:', error);
|
|
36237
|
-
}
|
|
36238
|
-
};
|
|
36239
36253
|
const handleRefresh = async () => {
|
|
36240
36254
|
if (query) {
|
|
36241
36255
|
await clearChat();
|
|
@@ -36249,10 +36263,11 @@ function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, a
|
|
|
36249
36263
|
}
|
|
36250
36264
|
};
|
|
36251
36265
|
React.useEffect(() => {
|
|
36252
|
-
if (isEmpty && query && isFirstLoad && !(seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.agent_message)) {
|
|
36266
|
+
if (isEmpty && query && isFirstLoad && !(seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.agent_message) && !hasCalledRef.current) {
|
|
36267
|
+
hasCalledRef.current = true;
|
|
36253
36268
|
handleRefresh();
|
|
36254
36269
|
}
|
|
36255
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36270
|
+
}, [isEmpty, query, isFirstLoad, seriesLineChartState]);
|
|
36256
36271
|
// Start timeout when chart is empty and loading
|
|
36257
36272
|
React.useEffect(() => {
|
|
36258
36273
|
if (isEmpty && startLoadingTimeout && !(seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.agent_message)) {
|
|
@@ -36262,12 +36277,11 @@ function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, a
|
|
|
36262
36277
|
clearLoadingTimeout();
|
|
36263
36278
|
}
|
|
36264
36279
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36265
|
-
const colors = ["#243D84", "#69238B", "#4A959F", "#D0A677", "#B31E47", "#396431", "#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC"];
|
|
36266
36280
|
const finalColors = React.useMemo(() => {
|
|
36267
|
-
return shuffleColors(
|
|
36281
|
+
return shuffleColors([...LINE_COLORS, ...DEFAULT_COLORS], series === null || series === void 0 ? void 0 : series.length);
|
|
36268
36282
|
}, [series.length]);
|
|
36269
36283
|
if (isEmpty) {
|
|
36270
|
-
return (
|
|
36284
|
+
return createLoadingComponent();
|
|
36271
36285
|
}
|
|
36272
36286
|
const transformedData = {
|
|
36273
36287
|
labels: labels,
|
|
@@ -36288,34 +36302,12 @@ function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, a
|
|
|
36288
36302
|
}
|
|
36289
36303
|
function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36290
36304
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
36305
|
+
const hasCalledRef = React.useRef(false);
|
|
36291
36306
|
const labels = ((_b = (_a = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _c === void 0 ? void 0 : _c.pie_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36292
36307
|
const values = ((_g = (_f = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.values) || ((_k = (_j = (_h = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _h === void 0 ? void 0 : _h.pie_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) || [];
|
|
36293
36308
|
((_m = (_l = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _l === void 0 ? void 0 : _l.data) === null || _m === void 0 ? void 0 : _m.percentages) || ((_q = (_p = (_o = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _o === void 0 ? void 0 : _o.pie_chart_data) === null || _p === void 0 ? void 0 : _p.data) === null || _q === void 0 ? void 0 : _q.percentages) || [];
|
|
36294
36309
|
const chartTitle = ((_r = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _r === void 0 ? void 0 : _r.title) || ((_t = (_s = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _s === void 0 ? void 0 : _s.pie_chart_data) === null || _t === void 0 ? void 0 : _t.title) || "";
|
|
36295
36310
|
const isEmpty = labels.length === 0 || values.length === 0;
|
|
36296
|
-
const clearChat = async () => {
|
|
36297
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36298
|
-
return;
|
|
36299
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36300
|
-
try {
|
|
36301
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36302
|
-
method: 'POST',
|
|
36303
|
-
headers: {
|
|
36304
|
-
'Content-Type': 'application/json',
|
|
36305
|
-
},
|
|
36306
|
-
body: JSON.stringify({
|
|
36307
|
-
session_id: widgetId,
|
|
36308
|
-
delete_state: true
|
|
36309
|
-
}),
|
|
36310
|
-
});
|
|
36311
|
-
// Clear chart state directly after clearing chat
|
|
36312
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36313
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36314
|
-
}
|
|
36315
|
-
catch (error) {
|
|
36316
|
-
console.error('Failed to clear chat:', error);
|
|
36317
|
-
}
|
|
36318
|
-
};
|
|
36319
36311
|
const handleRefresh = async () => {
|
|
36320
36312
|
if (query) {
|
|
36321
36313
|
await clearChat();
|
|
@@ -36329,10 +36321,11 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36329
36321
|
}
|
|
36330
36322
|
};
|
|
36331
36323
|
React.useEffect(() => {
|
|
36332
|
-
if (isEmpty && query && isFirstLoad && !(pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.agent_message)) {
|
|
36324
|
+
if (isEmpty && query && isFirstLoad && !(pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.agent_message) && !hasCalledRef.current) {
|
|
36325
|
+
hasCalledRef.current = true;
|
|
36333
36326
|
handleRefresh();
|
|
36334
36327
|
}
|
|
36335
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36328
|
+
}, [isEmpty, query, isFirstLoad, pieChartState]);
|
|
36336
36329
|
// Start timeout when chart is empty and loading
|
|
36337
36330
|
React.useEffect(() => {
|
|
36338
36331
|
if (isEmpty && startLoadingTimeout && !(pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.agent_message)) {
|
|
@@ -36342,23 +36335,12 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36342
36335
|
clearLoadingTimeout();
|
|
36343
36336
|
}
|
|
36344
36337
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36345
|
-
const palette = ["#E4DCB8", "#DAC46C", "#808080", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#601B07", "#50649D", "#B4A8A0", "#808080", "#6F2587"];
|
|
36346
36338
|
const backgroundColors = React.useMemo(() => {
|
|
36347
|
-
return shuffleColorsWithPriority(
|
|
36339
|
+
return shuffleColorsWithPriority(DEFAULT_COLORS, labels.length, ["#7B0D3F"]);
|
|
36348
36340
|
}, [labels.length]);
|
|
36349
36341
|
if (isEmpty) {
|
|
36350
|
-
return (
|
|
36351
|
-
}
|
|
36352
|
-
// const borderColors = [
|
|
36353
|
-
// "rgba(255, 99, 132, 1)",
|
|
36354
|
-
// "rgba(54, 162, 235, 1)",
|
|
36355
|
-
// "rgba(255, 206, 86, 1)",
|
|
36356
|
-
// "rgba(75, 192, 192, 1)",
|
|
36357
|
-
// "rgba(153, 102, 255, 1)",
|
|
36358
|
-
// "rgba(255, 159, 64, 1)",
|
|
36359
|
-
// "rgba(199, 199, 199, 1)",
|
|
36360
|
-
// "rgba(83, 102, 255, 1)",
|
|
36361
|
-
// ];
|
|
36342
|
+
return createLoadingComponent();
|
|
36343
|
+
}
|
|
36362
36344
|
const transformedData = {
|
|
36363
36345
|
labels: labels,
|
|
36364
36346
|
datasets: [
|
|
@@ -36366,7 +36348,6 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36366
36348
|
label: chartTitle || "Data",
|
|
36367
36349
|
data: values,
|
|
36368
36350
|
backgroundColor: labels.map((_, index) => backgroundColors[index % backgroundColors.length]),
|
|
36369
|
-
// borderColor: labels.map((_, index) => borderColors[index % borderColors.length]),
|
|
36370
36351
|
borderWidth: 0,
|
|
36371
36352
|
},
|
|
36372
36353
|
],
|
|
@@ -36375,40 +36356,15 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36375
36356
|
}
|
|
36376
36357
|
function LineChartComponent({ lineChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36377
36358
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36359
|
+
const hasCalledRef = React.useRef(false);
|
|
36378
36360
|
const labels = ((_b = (_a = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.state) === null || _c === void 0 ? void 0 : _c.bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36379
36361
|
const values = ((_g = (_f = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.values) || ((_k = (_j = (_h = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.state) === null || _h === void 0 ? void 0 : _h.bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) || [];
|
|
36380
36362
|
const chartTitle = ((_l = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.state) === null || _m === void 0 ? void 0 : _m.bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36381
36363
|
values.length > 0 ? Math.max(...values) : 0;
|
|
36382
36364
|
const isEmpty = labels.length === 0 || values.length === 0;
|
|
36383
|
-
const clearChat = async () => {
|
|
36384
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36385
|
-
return;
|
|
36386
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36387
|
-
try {
|
|
36388
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36389
|
-
method: 'POST',
|
|
36390
|
-
headers: {
|
|
36391
|
-
'Content-Type': 'application/json',
|
|
36392
|
-
},
|
|
36393
|
-
body: JSON.stringify({
|
|
36394
|
-
session_id: widgetId,
|
|
36395
|
-
delete_state: true
|
|
36396
|
-
}),
|
|
36397
|
-
});
|
|
36398
|
-
// Clear chart state directly after clearing chat
|
|
36399
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36400
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36401
|
-
}
|
|
36402
|
-
catch (error) {
|
|
36403
|
-
console.error('Failed to clear chat:', error);
|
|
36404
|
-
}
|
|
36405
|
-
};
|
|
36406
36365
|
const handleRefresh = async () => {
|
|
36407
|
-
if (query) {
|
|
36408
|
-
await clearChat();
|
|
36409
|
-
// Send trigger event to clear chart state
|
|
36410
|
-
console.log('Dispatching clearChartState event for widgetId:', widgetId);
|
|
36411
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36366
|
+
if (query && widgetBackendUrl && widgetId) {
|
|
36367
|
+
await clearChat(widgetBackendUrl, widgetId);
|
|
36412
36368
|
appendMessage(new TextMessage({
|
|
36413
36369
|
content: `${query} and render data on a bar chart`,
|
|
36414
36370
|
role: Role.User,
|
|
@@ -36416,10 +36372,11 @@ function LineChartComponent({ lineChartState, styles, appendMessage, query, isFi
|
|
|
36416
36372
|
}
|
|
36417
36373
|
};
|
|
36418
36374
|
React.useEffect(() => {
|
|
36419
|
-
if (isEmpty && query && isFirstLoad && !(lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.agent_message)) {
|
|
36375
|
+
if (isEmpty && query && isFirstLoad && !(lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.agent_message) && !hasCalledRef.current) {
|
|
36376
|
+
hasCalledRef.current = true;
|
|
36420
36377
|
handleRefresh();
|
|
36421
36378
|
}
|
|
36422
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36379
|
+
}, [isEmpty, query, isFirstLoad, lineChartState]);
|
|
36423
36380
|
// Start timeout when chart is empty and loading
|
|
36424
36381
|
React.useEffect(() => {
|
|
36425
36382
|
if (isEmpty && startLoadingTimeout && !(lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.agent_message)) {
|
|
@@ -36429,19 +36386,11 @@ function LineChartComponent({ lineChartState, styles, appendMessage, query, isFi
|
|
|
36429
36386
|
clearLoadingTimeout();
|
|
36430
36387
|
}
|
|
36431
36388
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36432
|
-
const colors = [
|
|
36433
|
-
"#243D84",
|
|
36434
|
-
"#69238B",
|
|
36435
|
-
"#4A959F",
|
|
36436
|
-
"#D0A677",
|
|
36437
|
-
"#B31E47",
|
|
36438
|
-
"#396431",
|
|
36439
|
-
];
|
|
36440
36389
|
const lineColor = React.useMemo(() => {
|
|
36441
|
-
return
|
|
36390
|
+
return LINE_COLORS[Math.floor(Math.random() * LINE_COLORS.length)];
|
|
36442
36391
|
}, [labels.length]);
|
|
36443
36392
|
if (isEmpty) {
|
|
36444
|
-
return (
|
|
36393
|
+
return createLoadingComponent();
|
|
36445
36394
|
}
|
|
36446
36395
|
const transformedData = {
|
|
36447
36396
|
labels: labels,
|
|
@@ -36463,33 +36412,11 @@ function LineChartComponent({ lineChartState, styles, appendMessage, query, isFi
|
|
|
36463
36412
|
}
|
|
36464
36413
|
function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36465
36414
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36415
|
+
const hasCalledRef = React.useRef(false);
|
|
36466
36416
|
const columns = ((_b = (_a = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.matrix_grid_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.headers) || ((_e = (_d = (_c = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.state) === null || _c === void 0 ? void 0 : _c.matrix_grid_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.headers) || [];
|
|
36467
36417
|
const rows = ((_g = (_f = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.matrix_grid_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.rows) || ((_k = (_j = (_h = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.state) === null || _h === void 0 ? void 0 : _h.matrix_grid_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.rows) || [];
|
|
36468
36418
|
const gridTitle = ((_l = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.matrix_grid_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.state) === null || _m === void 0 ? void 0 : _m.matrix_grid_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36469
36419
|
const isEmpty = columns.length === 0 || rows.length === 0;
|
|
36470
|
-
const clearChat = async () => {
|
|
36471
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36472
|
-
return;
|
|
36473
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36474
|
-
try {
|
|
36475
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36476
|
-
method: 'POST',
|
|
36477
|
-
headers: {
|
|
36478
|
-
'Content-Type': 'application/json',
|
|
36479
|
-
},
|
|
36480
|
-
body: JSON.stringify({
|
|
36481
|
-
session_id: widgetId,
|
|
36482
|
-
delete_state: true
|
|
36483
|
-
}),
|
|
36484
|
-
});
|
|
36485
|
-
// Clear chart state directly after clearing chat
|
|
36486
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36487
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36488
|
-
}
|
|
36489
|
-
catch (error) {
|
|
36490
|
-
console.error('Failed to clear chat:', error);
|
|
36491
|
-
}
|
|
36492
|
-
};
|
|
36493
36420
|
const handleRefresh = async () => {
|
|
36494
36421
|
if (query) {
|
|
36495
36422
|
await clearChat();
|
|
@@ -36503,10 +36430,11 @@ function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirs
|
|
|
36503
36430
|
}
|
|
36504
36431
|
};
|
|
36505
36432
|
React.useEffect(() => {
|
|
36506
|
-
if (isEmpty && query && isFirstLoad && !(dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.agent_message)) {
|
|
36433
|
+
if (isEmpty && query && isFirstLoad && !(dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.agent_message) && !hasCalledRef.current) {
|
|
36434
|
+
hasCalledRef.current = true;
|
|
36507
36435
|
handleRefresh();
|
|
36508
36436
|
}
|
|
36509
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36437
|
+
}, [isEmpty, query, isFirstLoad, dataGridState]);
|
|
36510
36438
|
// Start timeout when chart is empty and loading
|
|
36511
36439
|
React.useEffect(() => {
|
|
36512
36440
|
if (isEmpty && startLoadingTimeout && !(dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.agent_message)) {
|
|
@@ -36517,7 +36445,7 @@ function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirs
|
|
|
36517
36445
|
}
|
|
36518
36446
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36519
36447
|
if (isEmpty) {
|
|
36520
|
-
return (
|
|
36448
|
+
return createLoadingComponent("Loading table data...");
|
|
36521
36449
|
}
|
|
36522
36450
|
const transformedData = {
|
|
36523
36451
|
columns: columns,
|
|
@@ -36527,34 +36455,12 @@ function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirs
|
|
|
36527
36455
|
}
|
|
36528
36456
|
function SummaryComponent({ summaryState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout, setChartState, widget_ids }) {
|
|
36529
36457
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
36458
|
+
const hasCalledRef = React.useRef(false);
|
|
36530
36459
|
const content = ((_b = (_a = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.content) || ((_e = (_d = (_c = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _c === void 0 ? void 0 : _c.summary_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.content) || "";
|
|
36531
36460
|
const title = ((_f = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _f === void 0 ? void 0 : _f.title) || ((_h = (_g = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _g === void 0 ? void 0 : _g.summary_data) === null || _h === void 0 ? void 0 : _h.title) || "";
|
|
36532
36461
|
const data = ((_j = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _j === void 0 ? void 0 : _j.data) || ((_l = (_k = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _k === void 0 ? void 0 : _k.summary_data) === null || _l === void 0 ? void 0 : _l.data) || null;
|
|
36533
36462
|
const metadata = ((_m = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _m === void 0 ? void 0 : _m.metadata) || ((_p = (_o = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _o === void 0 ? void 0 : _o.summary_data) === null || _p === void 0 ? void 0 : _p.metadata) || null;
|
|
36534
36463
|
const isEmpty = !content || content.trim() === "";
|
|
36535
|
-
const clearChat = async () => {
|
|
36536
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36537
|
-
return;
|
|
36538
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36539
|
-
try {
|
|
36540
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36541
|
-
method: 'POST',
|
|
36542
|
-
headers: {
|
|
36543
|
-
'Content-Type': 'application/json',
|
|
36544
|
-
},
|
|
36545
|
-
body: JSON.stringify({
|
|
36546
|
-
session_id: widgetId,
|
|
36547
|
-
delete_state: true
|
|
36548
|
-
}),
|
|
36549
|
-
});
|
|
36550
|
-
// Clear chart state directly after clearing chat
|
|
36551
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36552
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36553
|
-
}
|
|
36554
|
-
catch (error) {
|
|
36555
|
-
console.error('Failed to clear chat:', error);
|
|
36556
|
-
}
|
|
36557
|
-
};
|
|
36558
36464
|
const handleRefresh = async () => {
|
|
36559
36465
|
if (query) {
|
|
36560
36466
|
await clearChat();
|
|
@@ -36568,13 +36474,14 @@ function SummaryComponent({ summaryState, styles, appendMessage, query, isFirstL
|
|
|
36568
36474
|
}
|
|
36569
36475
|
};
|
|
36570
36476
|
React.useEffect(() => {
|
|
36571
|
-
if (isEmpty && query && isFirstLoad && !(summaryState === null || summaryState === void 0 ? void 0 : summaryState.agent_message)) {
|
|
36477
|
+
if (isEmpty && query && isFirstLoad && !(summaryState === null || summaryState === void 0 ? void 0 : summaryState.agent_message) && !hasCalledRef.current) {
|
|
36478
|
+
hasCalledRef.current = true;
|
|
36572
36479
|
setChartState(prevState => (Object.assign(Object.assign({}, prevState), { widget_ids: widget_ids })));
|
|
36573
36480
|
setTimeout(() => {
|
|
36574
36481
|
handleRefresh();
|
|
36575
36482
|
}, 500);
|
|
36576
36483
|
}
|
|
36577
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36484
|
+
}, [isEmpty, query, isFirstLoad, summaryState]);
|
|
36578
36485
|
// Start timeout when summary is empty and loading
|
|
36579
36486
|
React.useEffect(() => {
|
|
36580
36487
|
if (isEmpty && startLoadingTimeout && !(summaryState === null || summaryState === void 0 ? void 0 : summaryState.agent_message)) {
|
|
@@ -36585,196 +36492,24 @@ function SummaryComponent({ summaryState, styles, appendMessage, query, isFirstL
|
|
|
36585
36492
|
}
|
|
36586
36493
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36587
36494
|
if (isEmpty) {
|
|
36588
|
-
return (
|
|
36495
|
+
return createLoadingComponent("Loading summary...");
|
|
36589
36496
|
}
|
|
36590
36497
|
return (jsxRuntimeExports.jsx(SummaryWidget, { title: title, data: data, metadata: metadata, className: "" }));
|
|
36591
36498
|
}
|
|
36592
|
-
function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds, widgetBackendUrl }) {
|
|
36593
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31
|
|
36499
|
+
function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds, widgetBackendUrl, datasetId }) {
|
|
36500
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31;
|
|
36594
36501
|
const agentType = (_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentType;
|
|
36595
36502
|
const orientation = (_b = widget.config) === null || _b === void 0 ? void 0 : _b.orientation;
|
|
36596
36503
|
const isFirstLoad = (_c = widget.config) === null || _c === void 0 ? void 0 : _c.isFirstLoad;
|
|
36597
36504
|
const { threadId, setThreadId } = reactCore.useCopilotContext();
|
|
36598
36505
|
const timeoutRef = React.useRef(null);
|
|
36599
36506
|
const [isTimeoutTriggered, setIsTimeoutTriggered] = React.useState(false);
|
|
36600
|
-
const [timeoutCount, setTimeoutCount] = React.useState(0);
|
|
36601
36507
|
React.useEffect(() => {
|
|
36602
36508
|
setThreadId(widget.id);
|
|
36603
36509
|
}, [widget.id, setThreadId]);
|
|
36604
|
-
const getInitialState = () => {
|
|
36605
|
-
if (agentType === "Pie Chart Agent") {
|
|
36606
|
-
return {
|
|
36607
|
-
pie_chart_data: {
|
|
36608
|
-
title: "",
|
|
36609
|
-
type: "pie",
|
|
36610
|
-
chart_type: "financial",
|
|
36611
|
-
data: {
|
|
36612
|
-
labels: [],
|
|
36613
|
-
values: [],
|
|
36614
|
-
percentages: [],
|
|
36615
|
-
total: 0
|
|
36616
|
-
},
|
|
36617
|
-
metadata: {
|
|
36618
|
-
categories: 0,
|
|
36619
|
-
largest_category: "",
|
|
36620
|
-
largest_value: 0,
|
|
36621
|
-
largest_percentage: 0
|
|
36622
|
-
}
|
|
36623
|
-
}
|
|
36624
|
-
};
|
|
36625
|
-
}
|
|
36626
|
-
else if (agentType === "Line Chart Agent") {
|
|
36627
|
-
return {
|
|
36628
|
-
bar_chart_data: {
|
|
36629
|
-
title: "",
|
|
36630
|
-
type: "line",
|
|
36631
|
-
chart_type: "financial",
|
|
36632
|
-
orientation: "horizontal",
|
|
36633
|
-
data: {
|
|
36634
|
-
labels: [],
|
|
36635
|
-
values: [],
|
|
36636
|
-
total: 0,
|
|
36637
|
-
average: 0
|
|
36638
|
-
},
|
|
36639
|
-
metadata: {
|
|
36640
|
-
categories: 0,
|
|
36641
|
-
highest_category: "",
|
|
36642
|
-
highest_value: 0,
|
|
36643
|
-
lowest_category: "",
|
|
36644
|
-
lowest_value: 0,
|
|
36645
|
-
range: 0
|
|
36646
|
-
}
|
|
36647
|
-
}
|
|
36648
|
-
};
|
|
36649
|
-
}
|
|
36650
|
-
else if (agentType === "Data Grid Agent") {
|
|
36651
|
-
return {
|
|
36652
|
-
matrix_grid_data: {
|
|
36653
|
-
title: "",
|
|
36654
|
-
type: "data_grid",
|
|
36655
|
-
data: {
|
|
36656
|
-
headers: [],
|
|
36657
|
-
rows: [],
|
|
36658
|
-
"row_count": 0,
|
|
36659
|
-
"column_count": 0
|
|
36660
|
-
},
|
|
36661
|
-
metadata: {
|
|
36662
|
-
total_rows: 0,
|
|
36663
|
-
total_columns: 0,
|
|
36664
|
-
numeric_columns: []
|
|
36665
|
-
}
|
|
36666
|
-
}
|
|
36667
|
-
};
|
|
36668
|
-
}
|
|
36669
|
-
else if (agentType === "Bar Chart Agent") {
|
|
36670
|
-
return {
|
|
36671
|
-
bar_chart_data: {
|
|
36672
|
-
title: "",
|
|
36673
|
-
type: "bar",
|
|
36674
|
-
chart_type: "financial",
|
|
36675
|
-
orientation: "vertical",
|
|
36676
|
-
data: {
|
|
36677
|
-
labels: [],
|
|
36678
|
-
values: [],
|
|
36679
|
-
total: 0,
|
|
36680
|
-
average: 0
|
|
36681
|
-
},
|
|
36682
|
-
metadata: {
|
|
36683
|
-
categories: 0,
|
|
36684
|
-
highest_category: "",
|
|
36685
|
-
highest_value: 0,
|
|
36686
|
-
lowest_category: "",
|
|
36687
|
-
lowest_value: 0,
|
|
36688
|
-
range: 0
|
|
36689
|
-
}
|
|
36690
|
-
}
|
|
36691
|
-
};
|
|
36692
|
-
}
|
|
36693
|
-
else if (agentType === "Series Bar Chart Agent") {
|
|
36694
|
-
return {
|
|
36695
|
-
series_bar_chart_data: {
|
|
36696
|
-
title: "",
|
|
36697
|
-
type: "series_bar",
|
|
36698
|
-
chart_type: "financial",
|
|
36699
|
-
orientation: "vertical",
|
|
36700
|
-
data: {
|
|
36701
|
-
labels: [],
|
|
36702
|
-
series: [],
|
|
36703
|
-
total: 0,
|
|
36704
|
-
average: 0
|
|
36705
|
-
},
|
|
36706
|
-
metadata: {
|
|
36707
|
-
categories: 0,
|
|
36708
|
-
series_count: 0,
|
|
36709
|
-
highest_category: "",
|
|
36710
|
-
highest_value: 0,
|
|
36711
|
-
highest_series: "",
|
|
36712
|
-
lowest_category: "",
|
|
36713
|
-
lowest_value: 0,
|
|
36714
|
-
lowest_series: "",
|
|
36715
|
-
range: 0,
|
|
36716
|
-
series_totals: {},
|
|
36717
|
-
series_averages: {}
|
|
36718
|
-
}
|
|
36719
|
-
}
|
|
36720
|
-
};
|
|
36721
|
-
}
|
|
36722
|
-
else if (agentType === "Series Line Chart Agent") {
|
|
36723
|
-
return {
|
|
36724
|
-
series_bar_chart_data: {
|
|
36725
|
-
title: "",
|
|
36726
|
-
type: "series_bar",
|
|
36727
|
-
chart_type: "financial",
|
|
36728
|
-
orientation: "vertical",
|
|
36729
|
-
data: {
|
|
36730
|
-
labels: [],
|
|
36731
|
-
series: [],
|
|
36732
|
-
total: 0,
|
|
36733
|
-
average: 0
|
|
36734
|
-
},
|
|
36735
|
-
metadata: {
|
|
36736
|
-
categories: 0,
|
|
36737
|
-
series_count: 0,
|
|
36738
|
-
highest_category: "",
|
|
36739
|
-
highest_value: 0,
|
|
36740
|
-
highest_series: "",
|
|
36741
|
-
lowest_category: "",
|
|
36742
|
-
lowest_value: 0,
|
|
36743
|
-
lowest_series: "",
|
|
36744
|
-
range: 0,
|
|
36745
|
-
series_totals: {},
|
|
36746
|
-
series_averages: {}
|
|
36747
|
-
}
|
|
36748
|
-
}
|
|
36749
|
-
};
|
|
36750
|
-
}
|
|
36751
|
-
else if (agentType === "Summary Agent") {
|
|
36752
|
-
return {
|
|
36753
|
-
summary_data: {
|
|
36754
|
-
title: "",
|
|
36755
|
-
type: "summary",
|
|
36756
|
-
data: {
|
|
36757
|
-
content: "",
|
|
36758
|
-
word_count: 0,
|
|
36759
|
-
character_count: 0,
|
|
36760
|
-
character_count_no_spaces: 0,
|
|
36761
|
-
line_count: 0
|
|
36762
|
-
},
|
|
36763
|
-
metadata: {
|
|
36764
|
-
created_at: "",
|
|
36765
|
-
content_type: "text",
|
|
36766
|
-
is_multiline: false
|
|
36767
|
-
}
|
|
36768
|
-
}
|
|
36769
|
-
};
|
|
36770
|
-
}
|
|
36771
|
-
else {
|
|
36772
|
-
return { widget_ids: widgetIds };
|
|
36773
|
-
}
|
|
36774
|
-
};
|
|
36775
36510
|
const { state: chartState, setState: setChartState } = reactCore.useCoAgent({
|
|
36776
36511
|
name: (_d = widget.config) === null || _d === void 0 ? void 0 : _d.agentName,
|
|
36777
|
-
initialState:
|
|
36512
|
+
initialState: createInitialChartState(agentType || '', widgetIds, datasetId),
|
|
36778
36513
|
});
|
|
36779
36514
|
// Function to handle timeout and call loadAgentState API
|
|
36780
36515
|
const handleLoadingTimeout = React.useCallback(async () => {
|
|
@@ -36783,7 +36518,6 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36783
36518
|
return;
|
|
36784
36519
|
console.log('Loading timeout triggered for widget:', widget.id);
|
|
36785
36520
|
setIsTimeoutTriggered(true);
|
|
36786
|
-
setTimeoutCount(prev => prev + 1);
|
|
36787
36521
|
const agentName = ((_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentName) || "adk-construction-project-agent";
|
|
36788
36522
|
const apiResponse = await loadAgentState(widgetBackendUrl, widget.id, agentName);
|
|
36789
36523
|
if (apiResponse && !(chartState === null || chartState === void 0 ? void 0 : chartState.agent_message)) {
|
|
@@ -36822,8 +36556,7 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36822
36556
|
delete_state: true
|
|
36823
36557
|
}),
|
|
36824
36558
|
});
|
|
36825
|
-
|
|
36826
|
-
setChartState(getInitialState());
|
|
36559
|
+
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
36827
36560
|
}
|
|
36828
36561
|
catch (error) {
|
|
36829
36562
|
console.error('Failed to clear chat and state:', error);
|
|
@@ -36837,25 +36570,16 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36837
36570
|
}
|
|
36838
36571
|
};
|
|
36839
36572
|
}, []);
|
|
36840
|
-
const { appendMessage, reset
|
|
36573
|
+
const { appendMessage, reset } = reactCore.useCopilotChat();
|
|
36841
36574
|
// Register the reset function with the parent component
|
|
36842
36575
|
React.useEffect(() => {
|
|
36843
|
-
console.log('onResetReady available:', !!onResetReady, 'reset available:', !!reset, 'widget.id:', widget.id);
|
|
36844
36576
|
if (onResetReady && reset && widget.id) {
|
|
36845
|
-
console.log('Registering reset function for widget:', widget.id);
|
|
36846
|
-
// Create a wrapped reset function that also clears chart state
|
|
36847
36577
|
const wrappedReset = () => {
|
|
36848
|
-
console.log('Reset called for widget:', widget.id);
|
|
36849
36578
|
reset();
|
|
36850
|
-
// Clear chart state after reset
|
|
36851
|
-
console.log('Dispatching clearChartState event from reset for widgetId:', widget.id);
|
|
36852
36579
|
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId: widget.id } }));
|
|
36853
36580
|
};
|
|
36854
36581
|
onResetReady(widget.id, wrappedReset);
|
|
36855
36582
|
}
|
|
36856
|
-
else {
|
|
36857
|
-
console.log('Not registering reset - missing dependencies');
|
|
36858
|
-
}
|
|
36859
36583
|
}, [reset, widget.id, onResetReady]); // Removed onResetReady from deps to avoid the error
|
|
36860
36584
|
// Listen for triggerAgent events for this widget
|
|
36861
36585
|
React.useEffect(() => {
|
|
@@ -36893,183 +36617,10 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36893
36617
|
};
|
|
36894
36618
|
const handleClearChartState = (event) => {
|
|
36895
36619
|
const { widgetId } = event.detail;
|
|
36896
|
-
console.log('Received clearChartState event - widgetId:', widgetId, 'current widget.id:', widget.id);
|
|
36897
36620
|
if (widgetId === widget.id) {
|
|
36898
|
-
|
|
36899
|
-
// Reset chart state based on agent type with explicit initial state
|
|
36900
|
-
if (agentType === "Pie Chart Agent") {
|
|
36901
|
-
setChartState({
|
|
36902
|
-
pie_chart_data: {
|
|
36903
|
-
title: "",
|
|
36904
|
-
type: "pie",
|
|
36905
|
-
chart_type: "financial",
|
|
36906
|
-
data: {
|
|
36907
|
-
labels: [],
|
|
36908
|
-
values: [],
|
|
36909
|
-
percentages: [],
|
|
36910
|
-
total: 0
|
|
36911
|
-
},
|
|
36912
|
-
metadata: {
|
|
36913
|
-
categories: 0,
|
|
36914
|
-
largest_category: "",
|
|
36915
|
-
largest_value: 0,
|
|
36916
|
-
largest_percentage: 0
|
|
36917
|
-
}
|
|
36918
|
-
}
|
|
36919
|
-
});
|
|
36920
|
-
}
|
|
36921
|
-
else if (agentType === "Bar Chart Agent") {
|
|
36922
|
-
setChartState({
|
|
36923
|
-
bar_chart_data: {
|
|
36924
|
-
title: "",
|
|
36925
|
-
type: "bar",
|
|
36926
|
-
chart_type: "financial",
|
|
36927
|
-
orientation: "vertical",
|
|
36928
|
-
data: {
|
|
36929
|
-
labels: [],
|
|
36930
|
-
values: [],
|
|
36931
|
-
total: 0,
|
|
36932
|
-
average: 0
|
|
36933
|
-
},
|
|
36934
|
-
metadata: {
|
|
36935
|
-
categories: 0,
|
|
36936
|
-
highest_category: "",
|
|
36937
|
-
highest_value: 0,
|
|
36938
|
-
lowest_category: "",
|
|
36939
|
-
lowest_value: 0,
|
|
36940
|
-
range: 0
|
|
36941
|
-
}
|
|
36942
|
-
}
|
|
36943
|
-
});
|
|
36944
|
-
}
|
|
36945
|
-
else if (agentType === "Series Bar Chart Agent") {
|
|
36946
|
-
setChartState({
|
|
36947
|
-
series_bar_chart_data: {
|
|
36948
|
-
title: "",
|
|
36949
|
-
type: "series_bar",
|
|
36950
|
-
chart_type: "financial",
|
|
36951
|
-
orientation: "vertical",
|
|
36952
|
-
data: {
|
|
36953
|
-
labels: [],
|
|
36954
|
-
series: [],
|
|
36955
|
-
total: 0,
|
|
36956
|
-
average: 0
|
|
36957
|
-
},
|
|
36958
|
-
metadata: {
|
|
36959
|
-
categories: 0,
|
|
36960
|
-
series_count: 0,
|
|
36961
|
-
highest_category: "",
|
|
36962
|
-
highest_value: 0,
|
|
36963
|
-
highest_series: "",
|
|
36964
|
-
lowest_category: "",
|
|
36965
|
-
lowest_value: 0,
|
|
36966
|
-
lowest_series: "",
|
|
36967
|
-
range: 0,
|
|
36968
|
-
series_totals: {},
|
|
36969
|
-
series_averages: {}
|
|
36970
|
-
}
|
|
36971
|
-
}
|
|
36972
|
-
});
|
|
36973
|
-
}
|
|
36974
|
-
else if (agentType === "Series Line Chart Agent") {
|
|
36975
|
-
setChartState({
|
|
36976
|
-
series_bar_chart_data: {
|
|
36977
|
-
title: "",
|
|
36978
|
-
type: "series_bar",
|
|
36979
|
-
chart_type: "financial",
|
|
36980
|
-
orientation: "vertical",
|
|
36981
|
-
data: {
|
|
36982
|
-
labels: [],
|
|
36983
|
-
series: [],
|
|
36984
|
-
total: 0,
|
|
36985
|
-
average: 0
|
|
36986
|
-
},
|
|
36987
|
-
metadata: {
|
|
36988
|
-
categories: 0,
|
|
36989
|
-
series_count: 0,
|
|
36990
|
-
highest_category: "",
|
|
36991
|
-
highest_value: 0,
|
|
36992
|
-
highest_series: "",
|
|
36993
|
-
lowest_category: "",
|
|
36994
|
-
lowest_value: 0,
|
|
36995
|
-
lowest_series: "",
|
|
36996
|
-
range: 0,
|
|
36997
|
-
series_totals: {},
|
|
36998
|
-
series_averages: {}
|
|
36999
|
-
}
|
|
37000
|
-
}
|
|
37001
|
-
});
|
|
37002
|
-
}
|
|
37003
|
-
else if (agentType === "Line Chart Agent") {
|
|
37004
|
-
setChartState({
|
|
37005
|
-
bar_chart_data: {
|
|
37006
|
-
title: "",
|
|
37007
|
-
type: "line",
|
|
37008
|
-
chart_type: "financial",
|
|
37009
|
-
orientation: "horizontal",
|
|
37010
|
-
data: {
|
|
37011
|
-
labels: [],
|
|
37012
|
-
values: [],
|
|
37013
|
-
total: 0,
|
|
37014
|
-
average: 0
|
|
37015
|
-
},
|
|
37016
|
-
metadata: {
|
|
37017
|
-
categories: 0,
|
|
37018
|
-
highest_category: "",
|
|
37019
|
-
highest_value: 0,
|
|
37020
|
-
lowest_category: "",
|
|
37021
|
-
lowest_value: 0,
|
|
37022
|
-
range: 0
|
|
37023
|
-
}
|
|
37024
|
-
}
|
|
37025
|
-
});
|
|
37026
|
-
}
|
|
37027
|
-
else if (agentType === "Data Grid Agent") {
|
|
37028
|
-
setChartState({
|
|
37029
|
-
matrix_grid_data: {
|
|
37030
|
-
title: "",
|
|
37031
|
-
type: "data_grid",
|
|
37032
|
-
grid_type: "",
|
|
37033
|
-
data: {
|
|
37034
|
-
headers: [],
|
|
37035
|
-
rows: [],
|
|
37036
|
-
row_count: 0,
|
|
37037
|
-
column_count: 0
|
|
37038
|
-
},
|
|
37039
|
-
metadata: {
|
|
37040
|
-
total_rows: 0,
|
|
37041
|
-
total_columns: 0,
|
|
37042
|
-
numeric_columns: []
|
|
37043
|
-
}
|
|
37044
|
-
}
|
|
37045
|
-
});
|
|
37046
|
-
}
|
|
37047
|
-
else if (agentType === "Summary Agent") {
|
|
37048
|
-
setChartState({
|
|
37049
|
-
summary_data: {
|
|
37050
|
-
title: "",
|
|
37051
|
-
type: "summary",
|
|
37052
|
-
data: {
|
|
37053
|
-
content: "",
|
|
37054
|
-
word_count: 0,
|
|
37055
|
-
character_count: 0,
|
|
37056
|
-
character_count_no_spaces: 0,
|
|
37057
|
-
line_count: 0
|
|
37058
|
-
},
|
|
37059
|
-
metadata: {
|
|
37060
|
-
created_at: "",
|
|
37061
|
-
content_type: "text",
|
|
37062
|
-
is_multiline: false
|
|
37063
|
-
}
|
|
37064
|
-
}
|
|
37065
|
-
});
|
|
37066
|
-
}
|
|
37067
|
-
else {
|
|
37068
|
-
setChartState({ widget_ids: widgetIds });
|
|
37069
|
-
}
|
|
36621
|
+
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
37070
36622
|
}
|
|
37071
36623
|
};
|
|
37072
|
-
console.log('Setting up event listeners for widget:', widget.id);
|
|
37073
36624
|
window.addEventListener('triggerAgent', handleTriggerAgent);
|
|
37074
36625
|
window.addEventListener('clearChartState', handleClearChartState);
|
|
37075
36626
|
return () => {
|
|
@@ -37077,59 +36628,22 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
37077
36628
|
window.removeEventListener('clearChartState', handleClearChartState);
|
|
37078
36629
|
};
|
|
37079
36630
|
}, [widget.id, appendMessage, agentType, setChartState]);
|
|
37080
|
-
// Monitor chartState and add manual clear functionality
|
|
37081
|
-
React.useEffect(() => {
|
|
37082
|
-
// Add a global function to manually clear this widget's state
|
|
37083
|
-
const clearThisWidget = () => {
|
|
37084
|
-
console.log('Manual clear triggered for widget:', widget.id);
|
|
37085
|
-
if (agentType === "Pie Chart Agent") {
|
|
37086
|
-
setChartState({
|
|
37087
|
-
pie_chart_data: {
|
|
37088
|
-
title: "",
|
|
37089
|
-
type: "pie",
|
|
37090
|
-
chart_type: "financial",
|
|
37091
|
-
data: {
|
|
37092
|
-
labels: [],
|
|
37093
|
-
values: [],
|
|
37094
|
-
percentages: [],
|
|
37095
|
-
total: 0
|
|
37096
|
-
},
|
|
37097
|
-
metadata: {
|
|
37098
|
-
categories: 0,
|
|
37099
|
-
largest_category: "",
|
|
37100
|
-
largest_value: 0,
|
|
37101
|
-
largest_percentage: 0
|
|
37102
|
-
}
|
|
37103
|
-
}
|
|
37104
|
-
});
|
|
37105
|
-
}
|
|
37106
|
-
// Add other agent types as needed
|
|
37107
|
-
};
|
|
37108
|
-
// Make it globally accessible for testing
|
|
37109
|
-
window[`clearWidget_${widget.id}`] = clearThisWidget;
|
|
37110
|
-
return () => {
|
|
37111
|
-
delete window[`clearWidget_${widget.id}`];
|
|
37112
|
-
};
|
|
37113
|
-
}, [widget.id, agentType, setChartState]);
|
|
37114
|
-
console.log('agent_message==>', chartState === null || chartState === void 0 ? void 0 : chartState.agent_message);
|
|
37115
|
-
console.log('Pie Chart Agent==>', (agentType === "Pie Chart Agent" && (!((_h = (_g = (_f = chartState.pie_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.labels) === null || _h === void 0 ? void 0 : _h.length) || !((_l = (_k = (_j = chartState.pie_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) === null || _l === void 0 ? void 0 : _l.length))));
|
|
37116
|
-
console.log('chartState.pie_chart_data?.data?.labels?.length==>', (_o = (_m = chartState.pie_chart_data) === null || _m === void 0 ? void 0 : _m.data) === null || _o === void 0 ? void 0 : _o.labels);
|
|
37117
36631
|
return (jsxRuntimeExports.jsxs("div", { className: cn("flex flex-col h-full"), children: [showHeader && (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-between pb-2 border-b", children: jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntimeExports.jsx(lucideReact.Bot, { className: "h-4 w-4" }), jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })] }) })), jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState === null || chartState === void 0 ? void 0 : chartState.agent_message) && agentType !== "chatbot" && (
|
|
37118
36632
|
// Check if data is empty based on agent type
|
|
37119
|
-
(agentType === "Bar Chart Agent" && (!((
|
|
37120
|
-
(agentType === "Series Bar Chart Agent" && (!((
|
|
37121
|
-
(agentType === "Series Line Chart Agent" && (!((
|
|
37122
|
-
(agentType === "Pie Chart Agent" && (!((
|
|
37123
|
-
(agentType === "Line Chart Agent" && (!((
|
|
37124
|
-
(agentType === "Data Grid Agent" && (!((
|
|
37125
|
-
(agentType === "Summary Agent" && (!((
|
|
37126
|
-
title: ((
|
|
37127
|
-
initial: ((
|
|
36633
|
+
(agentType === "Bar Chart Agent" && (!((_h = (_g = (_f = chartState.bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.labels) === null || _h === void 0 ? void 0 : _h.length) || !((_l = (_k = (_j = chartState.bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) === null || _l === void 0 ? void 0 : _l.length))) ||
|
|
36634
|
+
(agentType === "Series Bar Chart Agent" && (!((_p = (_o = (_m = chartState.series_bar_chart_data) === null || _m === void 0 ? void 0 : _m.data) === null || _o === void 0 ? void 0 : _o.labels) === null || _p === void 0 ? void 0 : _p.length) || !((_s = (_r = (_q = chartState.series_bar_chart_data) === null || _q === void 0 ? void 0 : _q.data) === null || _r === void 0 ? void 0 : _r.series) === null || _s === void 0 ? void 0 : _s.length))) ||
|
|
36635
|
+
(agentType === "Series Line Chart Agent" && (!((_v = (_u = (_t = chartState.series_bar_chart_data) === null || _t === void 0 ? void 0 : _t.data) === null || _u === void 0 ? void 0 : _u.labels) === null || _v === void 0 ? void 0 : _v.length) || !((_y = (_x = (_w = chartState.series_bar_chart_data) === null || _w === void 0 ? void 0 : _w.data) === null || _x === void 0 ? void 0 : _x.series) === null || _y === void 0 ? void 0 : _y.length))) ||
|
|
36636
|
+
(agentType === "Pie Chart Agent" && (!((_1 = (_0 = (_z = chartState.pie_chart_data) === null || _z === void 0 ? void 0 : _z.data) === null || _0 === void 0 ? void 0 : _0.labels) === null || _1 === void 0 ? void 0 : _1.length) || !((_4 = (_3 = (_2 = chartState.pie_chart_data) === null || _2 === void 0 ? void 0 : _2.data) === null || _3 === void 0 ? void 0 : _3.values) === null || _4 === void 0 ? void 0 : _4.length))) ||
|
|
36637
|
+
(agentType === "Line Chart Agent" && (!((_7 = (_6 = (_5 = chartState.bar_chart_data) === null || _5 === void 0 ? void 0 : _5.data) === null || _6 === void 0 ? void 0 : _6.labels) === null || _7 === void 0 ? void 0 : _7.length) || !((_10 = (_9 = (_8 = chartState.bar_chart_data) === null || _8 === void 0 ? void 0 : _8.data) === null || _9 === void 0 ? void 0 : _9.values) === null || _10 === void 0 ? void 0 : _10.length))) ||
|
|
36638
|
+
(agentType === "Data Grid Agent" && (!((_13 = (_12 = (_11 = chartState.matrix_grid_data) === null || _11 === void 0 ? void 0 : _11.data) === null || _12 === void 0 ? void 0 : _12.headers) === null || _13 === void 0 ? void 0 : _13.length) || !((_16 = (_15 = (_14 = chartState.matrix_grid_data) === null || _14 === void 0 ? void 0 : _14.data) === null || _15 === void 0 ? void 0 : _15.rows) === null || _16 === void 0 ? void 0 : _16.length))) ||
|
|
36639
|
+
(agentType === "Summary Agent" && (!((_18 = (_17 = chartState.summary_data) === null || _17 === void 0 ? void 0 : _17.data) === null || _18 === void 0 ? void 0 : _18.content) || ((_21 = (_20 = (_19 = chartState.summary_data) === null || _19 === void 0 ? void 0 : _19.data) === null || _20 === void 0 ? void 0 : _20.content) === null || _21 === void 0 ? void 0 : _21.trim()) === ""))) ? (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) })) : agentType === "Bar Chart Agent" ? (jsxRuntimeExports.jsx(BarChartComponent, { barChartState: chartState, styles: styles, orientation: orientation, appendMessage: appendMessage, query: (_22 = widget.config) === null || _22 === void 0 ? void 0 : _22.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Series Bar Chart Agent" ? (jsxRuntimeExports.jsx(SeriesBarChartComponent, { seriesBarChartState: chartState, styles: styles, orientation: orientation, appendMessage: appendMessage, query: (_23 = widget.config) === null || _23 === void 0 ? void 0 : _23.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Series Line Chart Agent" ? (jsxRuntimeExports.jsx(SeriesLineChartComponent, { seriesLineChartState: chartState, styles: styles, orientation: orientation, appendMessage: appendMessage, query: (_24 = widget.config) === null || _24 === void 0 ? void 0 : _24.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Pie Chart Agent" ? (jsxRuntimeExports.jsx(PieChartComponent, { pieChartState: chartState, styles: styles, appendMessage: appendMessage, query: (_25 = widget.config) === null || _25 === void 0 ? void 0 : _25.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Line Chart Agent" ? (jsxRuntimeExports.jsx(LineChartComponent, { lineChartState: chartState, styles: styles, appendMessage: appendMessage, query: (_26 = widget.config) === null || _26 === void 0 ? void 0 : _26.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Data Grid Agent" ? (jsxRuntimeExports.jsx(DataGridComponent, { dataGridState: chartState, styles: styles, appendMessage: appendMessage, query: (_27 = widget.config) === null || _27 === void 0 ? void 0 : _27.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Summary Agent" ? (jsxRuntimeExports.jsx(SummaryComponent, { summaryState: chartState, styles: styles, appendMessage: appendMessage, query: (_28 = widget.config) === null || _28 === void 0 ? void 0 : _28.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, widget_ids: widgetIds, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout, setChartState: setChartState })) : (jsxRuntimeExports.jsx(reactUi.CopilotChat, { className: "h-full text-xs [&_.copilot-chat-message]:text-xs [&_.copilot-chat-input]:text-xs", labels: {
|
|
36640
|
+
title: ((_29 = widget.config) === null || _29 === void 0 ? void 0 : _29.copilotTitle) || widget.title,
|
|
36641
|
+
initial: ((_30 = widget.config) === null || _30 === void 0 ? void 0 : _30.copilotInitialMessage) || ((_31 = widget.config) === null || _31 === void 0 ? void 0 : _31.placeholder) || "How can I help you today?"
|
|
37128
36642
|
}, onSubmitMessage: () => {
|
|
37129
36643
|
setChartState(prevState => (Object.assign(Object.assign({}, prevState), { widget_ids: widgetIds })));
|
|
37130
36644
|
} })) })] }));
|
|
37131
36645
|
}
|
|
37132
|
-
function AgentWidget({ widget, showHeader = true, widgetBackendUrl, onResetReady, widgetIds, }) {
|
|
36646
|
+
function AgentWidget({ widget, showHeader = true, widgetBackendUrl, onResetReady, widgetIds, datasetId, }) {
|
|
37133
36647
|
var _a, _b;
|
|
37134
36648
|
const styles = getStyleValues((_a = widget.config) === null || _a === void 0 ? void 0 : _a.styles);
|
|
37135
36649
|
// Construct the runtime URL using the configurable backend URL
|
|
@@ -37139,10 +36653,10 @@ function AgentWidget({ widget, showHeader = true, widgetBackendUrl, onResetReady
|
|
|
37139
36653
|
const agentName = ((_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentName) || 'default-agent';
|
|
37140
36654
|
return `${baseUrl}/api/copilot/${agentName}`;
|
|
37141
36655
|
};
|
|
37142
|
-
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(reactCore.CopilotKit, { runtimeUrl: getRuntimeUrl(), showDevConsole: false, agent: ((_b = widget.config) === null || _b === void 0 ? void 0 : _b.agentName) || "widget_assistant", children: jsxRuntimeExports.jsx(CopilotKitAgent, { widget: widget, showHeader: showHeader, styles: styles, onResetReady: onResetReady, widgetIds: widgetIds, widgetBackendUrl: widgetBackendUrl }) }) }));
|
|
36656
|
+
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(reactCore.CopilotKit, { runtimeUrl: getRuntimeUrl(), showDevConsole: false, agent: ((_b = widget.config) === null || _b === void 0 ? void 0 : _b.agentName) || "widget_assistant", children: jsxRuntimeExports.jsx(CopilotKitAgent, { widget: widget, showHeader: showHeader, styles: styles, onResetReady: onResetReady, widgetIds: widgetIds, widgetBackendUrl: widgetBackendUrl, datasetId: datasetId }) }) }));
|
|
37143
36657
|
}
|
|
37144
36658
|
|
|
37145
|
-
function WidgetRenderer({ widget, isTemplate = false, onConfigUpdate, widgetBackendUrl, onResetReady, widgetIds, }) {
|
|
36659
|
+
function WidgetRenderer({ widget, isTemplate = false, onConfigUpdate, widgetBackendUrl, onResetReady, widgetIds, datasetId, }) {
|
|
37146
36660
|
const handleConfigUpdate = (config) => {
|
|
37147
36661
|
if (onConfigUpdate) {
|
|
37148
36662
|
onConfigUpdate(widget.id, config);
|
|
@@ -37165,7 +36679,7 @@ function WidgetRenderer({ widget, isTemplate = false, onConfigUpdate, widgetBack
|
|
|
37165
36679
|
return (jsxRuntimeExports.jsx(FacetWidget, { widget: widget, showHeader: false, onConfigUpdate: handleConfigUpdate }));
|
|
37166
36680
|
case "agent":
|
|
37167
36681
|
case "chatbot":
|
|
37168
|
-
return jsxRuntimeExports.jsx(AgentWidget, { widget: widget, showHeader: false, widgetBackendUrl: widgetBackendUrl, onResetReady: onResetReady, widgetIds: widgetIds });
|
|
36682
|
+
return jsxRuntimeExports.jsx(AgentWidget, { widget: widget, showHeader: false, widgetBackendUrl: widgetBackendUrl, onResetReady: onResetReady, widgetIds: widgetIds, datasetId: datasetId });
|
|
37169
36683
|
default:
|
|
37170
36684
|
return (jsxRuntimeExports.jsxs("div", { className: "text-muted-foreground", children: ["Unknown widget type: ", widget.type] }));
|
|
37171
36685
|
}
|
|
@@ -37405,6 +36919,7 @@ const IconMap = {
|
|
|
37405
36919
|
};
|
|
37406
36920
|
function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSelect, refreshKey, widgetBackendUrl, onSaveLayoutReady, openWidgetPallete = false, onCloseWidgetPallete, defaultAgentName = "adk-construction-project-agent", userId }) {
|
|
37407
36921
|
const [widgets, setWidgets] = React.useState([]);
|
|
36922
|
+
const [datasetId, setDatasetId] = React.useState('');
|
|
37408
36923
|
const [availableWidgets, setAvailableWidgets] = React.useState([]);
|
|
37409
36924
|
const [isLoading, setIsLoading] = React.useState(true);
|
|
37410
36925
|
const [pageData, setPageData] = React.useState(null);
|
|
@@ -37538,6 +37053,7 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37538
37053
|
console.log(data);
|
|
37539
37054
|
setPageData(data);
|
|
37540
37055
|
setWidgets(data.widgets || []);
|
|
37056
|
+
setDatasetId(data === null || data === void 0 ? void 0 : data.dataset_id);
|
|
37541
37057
|
}
|
|
37542
37058
|
catch (err) {
|
|
37543
37059
|
console.error("Error loading page data:", err);
|
|
@@ -37595,9 +37111,15 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37595
37111
|
throw new Error("Failed to save layout");
|
|
37596
37112
|
}
|
|
37597
37113
|
const savedData = await response.json();
|
|
37598
|
-
setPageData(savedData);
|
|
37599
|
-
// Update local widgets state to clear isFirstLoad flag
|
|
37600
|
-
setWidgets(prevWidgets => prevWidgets.map(widget => (
|
|
37114
|
+
// setPageData(savedData);
|
|
37115
|
+
// // Update local widgets state to clear isFirstLoad flag
|
|
37116
|
+
// setWidgets(prevWidgets => prevWidgets.map(widget => ({
|
|
37117
|
+
// ...widget,
|
|
37118
|
+
// config: {
|
|
37119
|
+
// ...widget.config,
|
|
37120
|
+
// isFirstLoad: false
|
|
37121
|
+
// }
|
|
37122
|
+
// })));
|
|
37601
37123
|
console.log('Layout saved successfully');
|
|
37602
37124
|
}
|
|
37603
37125
|
catch (err) {
|
|
@@ -37866,7 +37388,7 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37866
37388
|
onCloseWidgetPallete === null || onCloseWidgetPallete === void 0 ? void 0 : onCloseWidgetPallete();
|
|
37867
37389
|
}, defaultAgentName: defaultAgentName }), jsxRuntimeExports.jsx(EditWidgetDialog, { initialText: editInitialQuery, isOpen: showEditModal, onClose: () => setShowEditModal(false), onSubmit: handleEditSubmit }), jsxRuntimeExports.jsx("div", { className: "min-h-full", onDragOver: (e) => e.preventDefault(), onDrop: handleDrop, onClick: () => setSelectedWidget(null), children: isLoading ? (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: jsxRuntimeExports.jsx(lucideReact.Loader2, { className: "h-8 w-8 animate-spin" }) })) : (jsxRuntimeExports.jsx(RGL, { className: "layout m-0 p-0", layouts: { lg: getLayoutFromWidgets() }, breakpoints: { lg: 1200, md: 996, sm: 768, xs: 480 }, cols: { lg: 12, md: 8, sm: 6, xs: 2 }, rowHeight: 100, isDraggable: isEditing, isResizable: isEditing, draggableHandle: ".drag-icon", onLayoutChange: handleLayoutChange, compactType: "vertical", containerPadding: [0, 0], resizeHandles: ["sw", "nw", "se", "ne"], children: widgets.map((w) => (jsxRuntimeExports.jsxs("div", { style: { borderColor: "rgb(147 197 253 / 1)" }, className: `border border-blue-300 rounded-xl p-4 shadow-lg overflow-hidden ${isEditing ? 'pb-20' : 'pb-14'}`, children: [isEditing &&
|
|
37868
37390
|
jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end mb-4 relative", children: [jsxRuntimeExports.jsxs("div", { className: "flex items-center drag-icon cursor-grab absolute left-1/2 -translate-x-1/2", children: [jsxRuntimeExports.jsx(lucideReact.GripHorizontal, { className: "" }), jsxRuntimeExports.jsx(lucideReact.GripHorizontal, { className: "-ml-[3px]" }), jsxRuntimeExports.jsx(lucideReact.GripHorizontal, { className: "-ml-[3px]" })] }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 cursor-pointer justify-end", children: [jsxRuntimeExports.jsx(lucideReact.Trash2, { onClick: () => removeWidget(w.id), className: "w-5 h-5 text-red-700" }), jsxRuntimeExports.jsx(lucideReact.Edit, { onClick: () => onClickSettings && onClickSettings(w), className: "w-5 h-5 text-gray-600" })] })] }), jsxRuntimeExports.jsxs("div", { className: "w-full h-full relative", children: [(w === null || w === void 0 ? void 0 : w.type) === "chatbot" &&
|
|
37869
|
-
jsxRuntimeExports.jsxs("div", { className: "relative z-50", children: [jsxRuntimeExports.jsx("div", { onClick: () => handleClearChat(w.id), onMouseOver: () => setVisibleClearButton(true), onMouseLeave: () => setVisibleClearButton(false), className: "absolute z-40 flex align-middle justify-center gap-2 text-sm px-4 py-2 border-blue-300 rounded-sm dark:bg-white w-fit bg-gray-900 text-white dark:text-gray-900 cursor-pointer shadow-md transition-all", style: { top: "12px", right: "0", borderTopLeftRadius: "4px", borderBottomLeftRadius: "4px" }, children: jsxRuntimeExports.jsx(lucideReact.MessageCircleX, { className: "w-5 h-5" }) }), jsxRuntimeExports.jsx("span", { className: `absolute z-50 w-max py-1 text-xs px-2 rounded-sm dark:text-gray-900 dark:bg-white text-white bg-gray-900 ${visibleClearButton ? "block" : "hidden"}`, style: { top: "56px", right: "16px", borderRadius: "3px" }, children: "Clear Chat" })] }), jsxRuntimeExports.jsx(WidgetRenderer, { widget: w, widgetBackendUrl: widgetBackendUrl, onResetReady: handleResetReady, widgetIds: widgets.filter(widget => widget.type !== 'chatbot').map(widget => widget.id) })] })] }, w.id))) })) })] }));
|
|
37391
|
+
jsxRuntimeExports.jsxs("div", { className: "relative z-50", children: [jsxRuntimeExports.jsx("div", { onClick: () => handleClearChat(w.id), onMouseOver: () => setVisibleClearButton(true), onMouseLeave: () => setVisibleClearButton(false), className: "absolute z-40 flex align-middle justify-center gap-2 text-sm px-4 py-2 border-blue-300 rounded-sm dark:bg-white w-fit bg-gray-900 text-white dark:text-gray-900 cursor-pointer shadow-md transition-all", style: { top: "12px", right: "0", borderTopLeftRadius: "4px", borderBottomLeftRadius: "4px" }, children: jsxRuntimeExports.jsx(lucideReact.MessageCircleX, { className: "w-5 h-5" }) }), jsxRuntimeExports.jsx("span", { className: `absolute z-50 w-max py-1 text-xs px-2 rounded-sm dark:text-gray-900 dark:bg-white text-white bg-gray-900 ${visibleClearButton ? "block" : "hidden"}`, style: { top: "56px", right: "16px", borderRadius: "3px" }, children: "Clear Chat" })] }), jsxRuntimeExports.jsx(WidgetRenderer, { widget: w, widgetBackendUrl: widgetBackendUrl, onResetReady: handleResetReady, widgetIds: widgets.filter(widget => widget.type !== 'chatbot').map(widget => widget.id), datasetId: datasetId })] })] }, w.id))) })) })] }));
|
|
37870
37392
|
}
|
|
37871
37393
|
|
|
37872
37394
|
const Checkbox = React__namespace.forwardRef((_a, ref) => {
|