dp-widgets-framework 1.6.6 → 1.6.8

package/dist/index.esm.js

@@ -43606,6 +43606,24 @@ const loadAgentState$5 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$5 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$4 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -44140,6 +44158,8 @@ function CopilotKitAgent({
   const [isTimeoutTriggered, setIsTimeoutTriggered] = useState(false);
   const [apiCallCount, setApiCallCount] = useState(0);
   const [hasTimeoutError, setHasTimeoutError] = useState(false);
+  const hasInitialFetchRef = useRef(false);
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = useState(false);
   useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -44147,6 +44167,18 @@ function CopilotKitAgent({
     name: (_e = widget.config) == null ? void 0 : _e.agentName,
     initialState: createInitialChartState$4(agentType || "", widgetIds, datasetId)
   });
+  useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$5(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$4(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || isTimeoutTriggered || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) return;
@@ -44249,7 +44281,7 @@ function CopilotKitAgent({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && agentType !== "chatbot" && // Check if data is empty based on agent type
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && agentType !== "chatbot" && // Check if data is empty based on agent type
     (agentType === "Bar Chart Agent" && (!((_i = (_h = (_g = chartState.bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.values) == null ? void 0 : _l.length)) || agentType === "Series Bar Chart Agent" && (!((_o = (_n = (_m = chartState.series_bar_chart_data) == null ? void 0 : _m.data) == null ? void 0 : _n.labels) == null ? void 0 : _o.length) || !((_r = (_q = (_p = chartState.series_bar_chart_data) == null ? void 0 : _p.data) == null ? void 0 : _q.series) == null ? void 0 : _r.length)) || agentType === "Series Line Chart Agent" && (!((_u = (_t = (_s = chartState.series_bar_chart_data) == null ? void 0 : _s.data) == null ? void 0 : _t.labels) == null ? void 0 : _u.length) || !((_x = (_w = (_v = chartState.series_bar_chart_data) == null ? void 0 : _v.data) == null ? void 0 : _w.series) == null ? void 0 : _x.length)) || agentType === "Pie Chart Agent" && (!((_A = (_z = (_y = chartState.pie_chart_data) == null ? void 0 : _y.data) == null ? void 0 : _z.labels) == null ? void 0 : _A.length) || !((_D = (_C = (_B = chartState.pie_chart_data) == null ? void 0 : _B.data) == null ? void 0 : _C.values) == null ? void 0 : _D.length)) || agentType === "Line Chart Agent" && (!((_G = (_F = (_E = chartState.bar_chart_data) == null ? void 0 : _E.data) == null ? void 0 : _F.labels) == null ? void 0 : _G.length) || !((_J = (_I = (_H = chartState.bar_chart_data) == null ? void 0 : _H.data) == null ? void 0 : _I.values) == null ? void 0 : _J.length)) || agentType === "Data Grid Agent" && (!((_M = (_L = (_K = chartState.matrix_grid_data) == null ? void 0 : _K.data) == null ? void 0 : _L.headers) == null ? void 0 : _M.length) || !((_P = (_O = (_N = chartState.matrix_grid_data) == null ? void 0 : _N.data) == null ? void 0 : _O.rows) == null ? void 0 : _P.length)) || agentType === "Summary Agent" && (!((_R = (_Q = chartState.summary_data) == null ? void 0 : _Q.data) == null ? void 0 : _R.content) || ((_U = (_T = (_S = chartState.summary_data) == null ? void 0 : _S.data) == null ? void 0 : _T.content) == null ? void 0 : _U.trim()) === "")) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : agentType === "Bar Chart Agent" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
       BarChartComponent,
       {
@@ -44773,6 +44805,24 @@ const loadAgentState$4 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$4 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateFilterState = (apiResponse, setFilterState) => {
   var _a, _b;
   try {
@@ -45236,6 +45286,7 @@ function CopilotKitFilters({
   const timeoutRef = useRef(null);
   const [apiCallCount, setApiCallCount] = useState(0);
   const [hasTimeoutError, setHasTimeoutError] = useState(false);
+  const hasInitialFetchRef = useRef(false);
   useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -45244,6 +45295,17 @@ function CopilotKitFilters({
     initialState: createInitialFilterState(datasetId, widget_data)
   });
   const [filterState, setFilterState] = useState(createInitialFilterState(datasetId, widget_data));
+  useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$4(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateFilterState(apiResponse, setFilterState);
+      }
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setFilterState]);
   const handleLoadingTimeout = useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (filterState == null ? void 0 : filterState.agent_message) || hasTimeoutError) {
@@ -45574,6 +45636,24 @@ const loadAgentState$3 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$3 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$3 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -45707,6 +45787,7 @@ function CopilotKitPieChart({
   const timeoutRef = useRef(null);
   const [apiCallCount, setApiCallCount] = useState(0);
   const [hasTimeoutError, setHasTimeoutError] = useState(false);
+  const hasInitialFetchRef = useRef(false);
   useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -45715,6 +45796,19 @@ function CopilotKitPieChart({
     initialState: createInitialChartState$3(datasetId, widget_data)
   });
   const [chartState, setChartState] = useState(createInitialChartState$3(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = useState(false);
+  useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$3(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$3(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -45812,7 +45906,7 @@ function CopilotKitPieChart({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.pie_chart_data) == null ? void 0 : _f.data) == null ? void 0 : _g.labels) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.pie_chart_data) == null ? void 0 : _i.data) == null ? void 0 : _j.values) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.pie_chart_data) == null ? void 0 : _f.data) == null ? void 0 : _g.labels) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.pie_chart_data) == null ? void 0 : _i.data) == null ? void 0 : _j.values) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       PieChartComponent,
       {
         pieChartState: chartState,
@@ -45974,6 +46068,24 @@ const loadAgentState$2 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$2 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$2 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -46117,6 +46229,7 @@ function CopilotKitSeriesBarChart$1({
   const timeoutRef = useRef(null);
   const [apiCallCount, setApiCallCount] = useState(0);
   const [hasTimeoutError, setHasTimeoutError] = useState(false);
+  const hasInitialFetchRef = useRef(false);
   useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -46125,6 +46238,19 @@ function CopilotKitSeriesBarChart$1({
     initialState: createInitialChartState$2(datasetId, widget_data)
   });
   const [chartState, setChartState] = useState(createInitialChartState$2(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = useState(false);
+  useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$2(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$2(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -46222,7 +46348,7 @@ function CopilotKitSeriesBarChart$1({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       SeriesBarChartComponent$1,
       {
         orientation,
@@ -46385,6 +46511,24 @@ const loadAgentState$1 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$1 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$1 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -46528,6 +46672,7 @@ function CopilotKitSeriesBarChart({
   const timeoutRef = useRef(null);
   const [apiCallCount, setApiCallCount] = useState(0);
   const [hasTimeoutError, setHasTimeoutError] = useState(false);
+  const hasInitialFetchRef = useRef(false);
   useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -46536,6 +46681,19 @@ function CopilotKitSeriesBarChart({
     initialState: createInitialChartState$1(datasetId, widget_data)
   });
   const [chartState, setChartState] = useState(createInitialChartState$1(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = useState(false);
+  useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$1(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$1(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -46633,7 +46791,7 @@ function CopilotKitSeriesBarChart({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       SeriesBarChartComponent,
       {
         orientation,
@@ -46786,6 +46944,24 @@ const loadAgentState = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -46910,6 +47086,7 @@ function CopilotKitDataGrid({
   const timeoutRef = useRef(null);
   const [apiCallCount, setApiCallCount] = useState(0);
   const [hasTimeoutError, setHasTimeoutError] = useState(false);
+  const hasInitialFetchRef = useRef(false);
   useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -46918,6 +47095,19 @@ function CopilotKitDataGrid({
     initialState: createInitialChartState(datasetId, widget_data)
   });
   const [chartState, setChartState] = useState(createInitialChartState(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = useState(false);
+  useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -47015,7 +47205,7 @@ function CopilotKitDataGrid({
       /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.matrix_grid_data) == null ? void 0 : _f.data) == null ? void 0 : _g.headers) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.matrix_grid_data) == null ? void 0 : _i.data) == null ? void 0 : _j.rows) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.matrix_grid_data) == null ? void 0 : _f.data) == null ? void 0 : _g.headers) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.matrix_grid_data) == null ? void 0 : _i.data) == null ? void 0 : _j.rows) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       DataGridComponent,
       {
         dataGridState: chartState,

package/dist/index.js

@@ -43634,6 +43634,24 @@ const loadAgentState$5 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$5 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$4 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -44168,6 +44186,8 @@ function CopilotKitAgent({
   const [isTimeoutTriggered, setIsTimeoutTriggered] = React.useState(false);
   const [apiCallCount, setApiCallCount] = React.useState(0);
   const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
+  const hasInitialFetchRef = React.useRef(false);
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = React.useState(false);
   React.useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -44175,6 +44195,18 @@ function CopilotKitAgent({
     name: (_e = widget.config) == null ? void 0 : _e.agentName,
     initialState: createInitialChartState$4(agentType || "", widgetIds, datasetId)
   });
+  React.useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$5(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$4(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = React.useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || isTimeoutTriggered || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) return;
@@ -44277,7 +44309,7 @@ function CopilotKitAgent({
       /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && agentType !== "chatbot" && // Check if data is empty based on agent type
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && agentType !== "chatbot" && // Check if data is empty based on agent type
     (agentType === "Bar Chart Agent" && (!((_i = (_h = (_g = chartState.bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.values) == null ? void 0 : _l.length)) || agentType === "Series Bar Chart Agent" && (!((_o = (_n = (_m = chartState.series_bar_chart_data) == null ? void 0 : _m.data) == null ? void 0 : _n.labels) == null ? void 0 : _o.length) || !((_r = (_q = (_p = chartState.series_bar_chart_data) == null ? void 0 : _p.data) == null ? void 0 : _q.series) == null ? void 0 : _r.length)) || agentType === "Series Line Chart Agent" && (!((_u = (_t = (_s = chartState.series_bar_chart_data) == null ? void 0 : _s.data) == null ? void 0 : _t.labels) == null ? void 0 : _u.length) || !((_x = (_w = (_v = chartState.series_bar_chart_data) == null ? void 0 : _v.data) == null ? void 0 : _w.series) == null ? void 0 : _x.length)) || agentType === "Pie Chart Agent" && (!((_A = (_z = (_y = chartState.pie_chart_data) == null ? void 0 : _y.data) == null ? void 0 : _z.labels) == null ? void 0 : _A.length) || !((_D = (_C = (_B = chartState.pie_chart_data) == null ? void 0 : _B.data) == null ? void 0 : _C.values) == null ? void 0 : _D.length)) || agentType === "Line Chart Agent" && (!((_G = (_F = (_E = chartState.bar_chart_data) == null ? void 0 : _E.data) == null ? void 0 : _F.labels) == null ? void 0 : _G.length) || !((_J = (_I = (_H = chartState.bar_chart_data) == null ? void 0 : _H.data) == null ? void 0 : _I.values) == null ? void 0 : _J.length)) || agentType === "Data Grid Agent" && (!((_M = (_L = (_K = chartState.matrix_grid_data) == null ? void 0 : _K.data) == null ? void 0 : _L.headers) == null ? void 0 : _M.length) || !((_P = (_O = (_N = chartState.matrix_grid_data) == null ? void 0 : _N.data) == null ? void 0 : _O.rows) == null ? void 0 : _P.length)) || agentType === "Summary Agent" && (!((_R = (_Q = chartState.summary_data) == null ? void 0 : _Q.data) == null ? void 0 : _R.content) || ((_U = (_T = (_S = chartState.summary_data) == null ? void 0 : _S.data) == null ? void 0 : _T.content) == null ? void 0 : _U.trim()) === "")) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : agentType === "Bar Chart Agent" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
       BarChartComponent,
       {
@@ -44801,6 +44833,24 @@ const loadAgentState$4 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$4 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateFilterState = (apiResponse, setFilterState) => {
   var _a, _b;
   try {
@@ -45264,6 +45314,7 @@ function CopilotKitFilters({
   const timeoutRef = React.useRef(null);
   const [apiCallCount, setApiCallCount] = React.useState(0);
   const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
+  const hasInitialFetchRef = React.useRef(false);
   React.useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -45272,6 +45323,17 @@ function CopilotKitFilters({
     initialState: createInitialFilterState(datasetId, widget_data)
   });
   const [filterState, setFilterState] = React.useState(createInitialFilterState(datasetId, widget_data));
+  React.useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$4(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateFilterState(apiResponse, setFilterState);
+      }
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setFilterState]);
   const handleLoadingTimeout = React.useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (filterState == null ? void 0 : filterState.agent_message) || hasTimeoutError) {
@@ -45602,6 +45664,24 @@ const loadAgentState$3 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$3 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$3 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -45735,6 +45815,7 @@ function CopilotKitPieChart({
   const timeoutRef = React.useRef(null);
   const [apiCallCount, setApiCallCount] = React.useState(0);
   const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
+  const hasInitialFetchRef = React.useRef(false);
   React.useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -45743,6 +45824,19 @@ function CopilotKitPieChart({
     initialState: createInitialChartState$3(datasetId, widget_data)
   });
   const [chartState, setChartState] = React.useState(createInitialChartState$3(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = React.useState(false);
+  React.useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$3(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$3(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = React.useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -45840,7 +45934,7 @@ function CopilotKitPieChart({
       /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.pie_chart_data) == null ? void 0 : _f.data) == null ? void 0 : _g.labels) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.pie_chart_data) == null ? void 0 : _i.data) == null ? void 0 : _j.values) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.pie_chart_data) == null ? void 0 : _f.data) == null ? void 0 : _g.labels) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.pie_chart_data) == null ? void 0 : _i.data) == null ? void 0 : _j.values) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       PieChartComponent,
       {
         pieChartState: chartState,
@@ -46002,6 +46096,24 @@ const loadAgentState$2 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$2 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$2 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -46145,6 +46257,7 @@ function CopilotKitSeriesBarChart$1({
   const timeoutRef = React.useRef(null);
   const [apiCallCount, setApiCallCount] = React.useState(0);
   const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
+  const hasInitialFetchRef = React.useRef(false);
   React.useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -46153,6 +46266,19 @@ function CopilotKitSeriesBarChart$1({
     initialState: createInitialChartState$2(datasetId, widget_data)
   });
   const [chartState, setChartState] = React.useState(createInitialChartState$2(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = React.useState(false);
+  React.useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$2(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$2(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = React.useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -46250,7 +46376,7 @@ function CopilotKitSeriesBarChart$1({
       /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       SeriesBarChartComponent$1,
       {
         orientation,
@@ -46413,6 +46539,24 @@ const loadAgentState$1 = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect$1 = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState$1 = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -46556,6 +46700,7 @@ function CopilotKitSeriesBarChart({
   const timeoutRef = React.useRef(null);
   const [apiCallCount, setApiCallCount] = React.useState(0);
   const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
+  const hasInitialFetchRef = React.useRef(false);
   React.useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -46564,6 +46709,19 @@ function CopilotKitSeriesBarChart({
     initialState: createInitialChartState$1(datasetId, widget_data)
   });
   const [chartState, setChartState] = React.useState(createInitialChartState$1(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = React.useState(false);
+  React.useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect$1(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState$1(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = React.useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -46661,7 +46819,7 @@ function CopilotKitSeriesBarChart({
       /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_i = (_h = (_g = chartState.series_bar_chart_data) == null ? void 0 : _g.data) == null ? void 0 : _h.labels) == null ? void 0 : _i.length) || !((_l = (_k = (_j = chartState.series_bar_chart_data) == null ? void 0 : _j.data) == null ? void 0 : _k.series) == null ? void 0 : _l.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       SeriesBarChartComponent,
       {
         orientation,
@@ -46814,6 +46972,24 @@ const loadAgentState = async (widgetBackendUrl, threadId, agentName) => {
     return null;
   }
 };
+const loadSessionStateDirect = async (widgetBackendUrl, sessionId) => {
+  try {
+    const response = await fetch(`${widgetBackendUrl}/api/session/${sessionId}/state`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    console.error("Failed to load session state directly:", error);
+    return null;
+  }
+};
 const parseAndUpdateChartState = (apiResponse, setChartState) => {
   var _a, _b;
   try {
@@ -46938,6 +47114,7 @@ function CopilotKitDataGrid({
   const timeoutRef = React.useRef(null);
   const [apiCallCount, setApiCallCount] = React.useState(0);
   const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
+  const hasInitialFetchRef = React.useRef(false);
   React.useEffect(() => {
     setThreadId(widget.id);
   }, [widget.id, setThreadId]);
@@ -46946,6 +47123,19 @@ function CopilotKitDataGrid({
     initialState: createInitialChartState(datasetId, widget_data)
   });
   const [chartState, setChartState] = React.useState(createInitialChartState(datasetId, widget_data));
+  const [isInitialFetchComplete, setIsInitialFetchComplete] = React.useState(false);
+  React.useEffect(() => {
+    const fetchInitialState = async () => {
+      if (!widgetBackendUrl || !widget.id || hasInitialFetchRef.current) return;
+      hasInitialFetchRef.current = true;
+      const apiResponse = await loadSessionStateDirect(widgetBackendUrl, widget.id);
+      if (apiResponse) {
+        parseAndUpdateChartState(apiResponse, setChartState);
+      }
+      setIsInitialFetchComplete(true);
+    };
+    fetchInitialState();
+  }, [widgetBackendUrl, widget.id, setChartState]);
   const handleLoadingTimeout = React.useCallback(async () => {
     var _a2;
     if (!widgetBackendUrl || !widget.id || (chartState == null ? void 0 : chartState.agent_message) || hasTimeoutError) {
@@ -47043,7 +47233,7 @@ function CopilotKitDataGrid({
       /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.Bot, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })
     ] }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.matrix_grid_data) == null ? void 0 : _f.data) == null ? void 0 : _g.headers) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.matrix_grid_data) == null ? void 0 : _i.data) == null ? void 0 : _j.rows) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: !isInitialFetchComplete && !isFirstLoad ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(lucideReact.RefreshCw, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : (chartState == null ? void 0 : chartState.agent_message) && (!((_h = (_g = (_f = chartState.matrix_grid_data) == null ? void 0 : _f.data) == null ? void 0 : _g.headers) == null ? void 0 : _h.length) || !((_k = (_j = (_i = chartState.matrix_grid_data) == null ? void 0 : _i.data) == null ? void 0 : _j.rows) == null ? void 0 : _k.length)) ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       DataGridComponent,
       {
         dataGridState: chartState,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dp-widgets-framework",
-  "version": "1.6.6",
+  "version": "1.6.8",
   "private": false,
   "publishConfig": {
     "registry": "https://registry.npmjs.org"