@quillsql/react 2.16.42 → 2.16.44

package/dist/index.cjs

@@ -16952,7 +16952,7 @@ async function generatePivotWithSQL({
     client,
     task: "pivot-template",
     metadata: {
-      clientId: client.clientId,
+      clientId: client.id,
       pivot: pivotConfig,
       reportId: report?.id !== "__quillTempReport" ? report?.id : void 0,
       itemQuery: reportBuilderState ? void 0 : report?.queryString,
@@ -18778,7 +18778,7 @@ var init_tableProcessing = __esm({
           metadata: {
             reportBuilderState,
             stringColumns: stringColumns.map((col) => col.field),
-            clientId: client.clientId,
+            clientId: client.id,
             databaseType: client.databaseType?.toLowerCase() || "postgresql",
             customFields,
             filters: void 0,
@@ -18969,7 +18969,7 @@ var init_tableProcessing = __esm({
             metadata: {
               reportBuilderState,
               columns: stringNames,
-              clientId: client.publicKey,
+              clientId: client.id,
               databaseType: client.databaseType,
               customFieldsByTable: customFields,
               useNewNodeSql: true,
@@ -18984,7 +18984,7 @@ var init_tableProcessing = __esm({
             task: "query",
             metadata: {
               query: countQuery,
-              clientId: client.publicKey,
+              clientId: client.id,
               databaseType: client.databaseType,
               customFieldsByTable: customFields,
               useNewNodeSql: true,
@@ -19044,7 +19044,7 @@ var init_tableProcessing = __esm({
             metadata: {
               reportBuilderState,
               stringColumns: columns,
-              clientId: client.clientId,
+              clientId: client.id,
               databaseType: client.databaseType?.toLowerCase() || "postgresql",
               customFields,
               filters,
@@ -19094,7 +19094,7 @@ var init_tableProcessing = __esm({
           task: "query",
           metadata: {
             query,
-            clientId: client.publicKey,
+            clientId: client.id,
             databaseType: client.databaseType,
             customFieldsByTable: customFields,
             useNewNodeSql: true,
@@ -19206,7 +19206,7 @@ var init_tableProcessing = __esm({
           task: "query",
           metadata: {
             query,
-            clientId: client.publicKey,
+            clientId: client.id,
             databaseType: client.databaseType,
             customFieldsByTable: customFields,
             useNewNodeSql: true,
@@ -19316,7 +19316,7 @@ var init_tableProcessing = __esm({
             metadata: {
               query,
               filterMap,
-              clientId: client.publicKey,
+              clientId: client.id,
               databaseType: client?.databaseType,
               customFieldsByTable: customFields,
               additionalProcessing: processing,
@@ -19351,7 +19351,7 @@ var init_tableProcessing = __esm({
               task: "log-broken-query",
               metadata: {
                 query,
-                clientId: client.clientId,
+                clientId: client.id,
                 error: parsingError
               },
               getToken
@@ -19459,7 +19459,7 @@ var init_tableProcessing = __esm({
           metadata: {
             dashboardItemId: reportId,
             filters: minimalFilters,
-            clientId: client?.publicKey,
+            clientId: client?.id,
             databaseType: client?.databaseType,
             additionalProcessing: updatedProcessing,
             forcePagination: true,
@@ -19533,7 +19533,7 @@ var init_tableProcessing = __esm({
             rowCountOnly,
             customFields,
             tenants,
-            clientId: client.clientId,
+            clientId: client.id,
             databaseType: client.databaseType?.toLowerCase() || "postgresql",
             dashboardName
           },
@@ -19674,7 +19674,7 @@ async function testSqlViewState(client, referencedTables, getToken) {
         task: "test-view",
         metadata: {
           tables: [table],
-          clientId: client.clientId
+          clientId: client.id
         },
         getToken
       });
@@ -19683,7 +19683,7 @@ async function testSqlViewState(client, referencedTables, getToken) {
           metadata: {
             table,
             task: "set-broken-view",
-            clientId: client.clientId
+            clientId: client.id
           }
         };
         quillFetch({
@@ -19793,7 +19793,7 @@ async function* quillStream({
       body: JSON.stringify({
         metadata: {
           task,
-          clientId: client.clientId,
+          clientId: client.id,
           ...metadata
         }
       }),
@@ -20020,7 +20020,7 @@ async function getData(client, cloudQueryEndpoint, noCred, hostedRequestBody, cl
           body: method === "POST" ? JSON.stringify({
             ...cloudRequestBody,
             ...{
-              publicKey: client?.publicKey
+              publicKey: client?.id
             }
           }) : null,
           signal: abortSignal
@@ -20049,7 +20049,7 @@ async function fetchSqlQuery(ast, client, getToken, formData) {
       client,
       task: "sqlify",
       metadata: {
-        clientId: client.clientId,
+        clientId: client.id,
         useNewNodeSql: true,
         ast: { ...ast, where }
       },
@@ -20070,7 +20070,7 @@ async function fetchSqlQueryFromState(reportBuilderState, client, getToken, data
       client,
       task: "sqlify",
       metadata: {
-        clientId: client.clientId,
+        clientId: client.id,
         useNewNodeSql: true,
         ast
       },
@@ -20087,7 +20087,7 @@ async function fetchQueryDateRangesFromState(reportBuilderState, columns, client
       client,
       task: "report-builder-date-ranges",
       metadata: {
-        clientId: client.clientId,
+        clientId: client.id,
         reportBuilderState,
         dateColumns: columns,
         databaseType: databaseType || "postgresql",
@@ -20178,7 +20178,7 @@ var init_dataFetcher = __esm({
           body: JSON.stringify({
             metadata: {
               task,
-              clientId: client.clientId,
+              clientId: client.id ?? client.clientId,
               ...metadata
             }
           }),
@@ -21158,7 +21158,7 @@ async function getDashboard(dashboardName, client, getToken, tenants, flags) {
     task: "dashboard",
     metadata: {
       name: dashboardName,
-      clientId: client.publicKey,
+      clientId: client.id,
       databaseType: client.databaseType,
       useNewNodeSql: true,
       tenants,
@@ -21377,7 +21377,7 @@ async function fetchReportRows({
     task: "report",
     metadata: {
       reportId,
-      clientId: client.publicKey,
+      clientId: client.id,
       databaseType: client.databaseType,
       filters: filters.map((filter) => ({ ...filter, options: void 0 })),
       useNewNodeSql: true,
@@ -21426,7 +21426,7 @@ async function fetchReport({
       metadata: {
         reportId,
         dashboardItemId: reportId,
-        clientId: client.publicKey,
+        clientId: client.id,
         databaseType: client.databaseType,
         filters: filters.map((filter) => ({ ...filter, options: void 0 })),
         customFields,
@@ -21559,7 +21559,7 @@ async function fetchReportRowCount(reportId, client, getToken, tenants, flags, u
     metadata: {
       reportId,
       dashboardItemId: reportId,
-      clientId: client.publicKey,
+      clientId: client.id,
       databaseType: client.databaseType,
       filters: filters.map((filter) => ({ ...filter, options: void 0 })),
       customFields,
@@ -21588,7 +21588,7 @@ async function saveReport({
   eventTracking,
   tenants
 }) {
-  const { publicKey, databaseType } = client;
+  const { id, databaseType } = client;
   const {
     reportBuilderState,
     queryString,
@@ -21615,7 +21615,7 @@ async function saveReport({
       dashboardItemId,
       ...dashboardItemId ? { reportId: dashboardItemId } : {},
       // Remove useNewNodeSql since backend will handle conversion
-      clientId: publicKey,
+      clientId: id,
       tenants,
       // Only include adminMode for 'create' task, not 'create-report'
       ...isCreateTask && { adminMode },
@@ -22420,7 +22420,6 @@ var getSchemaInfo = async ({
   getToken,
   eventTracking
 }) => {
-  const { publicKey } = client;
   let customFieldsByTableUnique = null;
   if (client.featureFlags?.customFieldsEnabled && tenants && tenants[0] !== "QUILL_ALL_TENANTS" && tenants.length === 1 && (typeof tenants[0] !== "object" || tenants[0].tenantIds?.[0] !== "QUILL_ALL_TENANTS" && tenants[0].tenantIds?.length === 1)) {
     try {
@@ -22439,13 +22438,13 @@ var getSchemaInfo = async ({
     client,
     task: "schema",
     metadata: {
-      clientId: publicKey,
+      clientId: client.id,
       removeCustomerField: true,
       removeCustomFieldRef: true,
       tableIds,
       customFieldsByTable: customFieldsByTableUnique,
       useNewCustomFields: true,
-      gatherSchemaData: "665610862cf7a3000be66453" === publicKey ? true : false,
+      gatherSchemaData: "665610862cf7a3000be66453" === client.id ? true : false,
       // TODO: this should be a feature flag on the client
       tenants
     },
@@ -23539,7 +23538,7 @@ var CacheCab = class {
         task: "report",
         metadata: {
           reportId,
-          clientId: client.publicKey,
+          clientId: client.id,
           databaseType: client.databaseType,
           filters: adjusted,
           additionalProcessing: { page: { rowsPerPage: 1e3, rowsPerRequest: 1e5 } },
@@ -23678,7 +23677,7 @@ var CacheCab = class {
     );
     const keyParts = [
       reportId,
-      client.publicKey,
+      client.id,
       client.databaseType,
       hashString(stableStringify(canonicalizeForKey(tenants ?? null))),
       hashString(stableStringify(canonicalizeForKey(flags ?? null))),
@@ -24316,12 +24315,11 @@ var ContextProvider = ({
     typeof window !== "undefined" && sessionStorage ? JSON.parse(sessionStorage.getItem("quill-client") ?? "null") : null
   );
   const populatedClient = (0, import_react.useMemo)(() => {
-    if (!client || client.clientId !== publicKey) return null;
+    if (!client || client.id !== publicKey) return null;
     return {
       ...client,
-      publicKey,
-      _id: publicKey,
       id: publicKey,
+      clientId: publicKey,
       queryHeaders,
       queryEndpoint,
       streamEndpoint,
@@ -24482,7 +24480,7 @@ var ContextProvider = ({
           try {
             const result = await quillFetch({
               client: {
-                clientId: publicKey,
+                id: publicKey,
                 queryEndpoint,
                 queryHeaders,
                 withCredentials: !!withCredentials
@@ -24604,7 +24602,7 @@ var ContextProvider = ({
     try {
       const resp = await quillFetch({
         client: {
-          clientId: publicKey,
+          id: publicKey,
           queryEndpoint,
           queryHeaders,
           withCredentials: !!withCredentials
@@ -24612,7 +24610,7 @@ var ContextProvider = ({
         task: fetchRows ? "report" : "report-info",
         metadata: {
           reportId,
-          clientId: populatedClient.publicKey,
+          clientId: populatedClient.id,
           useNewNodeSql: true,
           filters: filters?.map((f) => ({ ...f, options: void 0 })),
           additionalProcessing,
@@ -24795,7 +24793,7 @@ var ContextProvider = ({
           try {
             const result = await quillFetch({
               client: {
-                clientId: publicKey,
+                id: publicKey,
                 queryEndpoint,
                 queryHeaders,
                 withCredentials: !!withCredentials
@@ -25004,7 +25002,7 @@ var ContextProvider = ({
       });
       return curDashboardConfig;
     }
-    if (!populatedClient || !populatedClient.publicKey) {
+    if (!populatedClient || !populatedClient.id) {
       return curDashboardConfig;
     }
     if (dashboardName === null || dashboardName === void 0)
@@ -25158,7 +25156,7 @@ var ContextProvider = ({
     try {
       const result = await quillFetch({
         client: {
-          clientId: publicKey2,
+          id: publicKey2,
           queryEndpoint,
           queryHeaders,
           withCredentials: !!withCredentials
@@ -25701,8 +25699,7 @@ var ContextProvider = ({
             withCredentials: withCredentials ?? false,
             databaseType: envClient.databaseType,
             name: envClient.name,
-            clientId: publicKey2,
-            publicKey: publicKey2,
+            id: publicKey2,
             featureFlags: envClient.featureFlags,
             clerkOrgId: envClient.clerkOrgId,
             allTenantTypes: hydratedTenantTypes
@@ -25774,16 +25771,16 @@ var ContextProvider = ({
   }, [publicKey]);
   (0, import_react.useEffect)(() => {
     if (!hasHandledInitialPopulatedClient.current) {
-      if (!populatedClient?.publicKey && !populatedClient?.currentTenants) {
+      if (!populatedClient?.id && !populatedClient?.currentTenants) {
         return;
       }
       hasHandledInitialPopulatedClient.current = true;
-      currentPublicKey.current = populatedClient?.publicKey ?? null;
+      currentPublicKey.current = populatedClient?.id ?? null;
       currentTenant.current = populatedClient?.currentTenants ?? null;
       return;
     }
     let publicKeyChanged = false;
-    if (populatedClient?.publicKey && currentPublicKey.current !== populatedClient?.publicKey) {
+    if (populatedClient?.id && currentPublicKey.current !== populatedClient?.id) {
       publicKeyChanged = true;
       dispatch({ type: "CLEAR_DASHBOARDS" });
       dashboardFiltersDispatch({ type: "CLEAR_DASHBOARD_FILTERS" });
@@ -25792,7 +25789,7 @@ var ContextProvider = ({
       backfilledDashboards.current.clear();
       if (isAdmin) {
         setIsDashboardsLoading(true);
-        fetchDashboards(populatedClient?.publicKey);
+        fetchDashboards(populatedClient?.id);
       } else {
         setIsDashboardsLoading(false);
       }
@@ -25824,17 +25821,17 @@ var ContextProvider = ({
         })
       );
     }
-    if (populatedClient?.currentTenants && populatedClient?.publicKey) {
+    if (populatedClient?.currentTenants && populatedClient?.id) {
       const tenant = typeof populatedClient?.currentTenants[0] === "object" ? populatedClient?.currentTenants[0]?.tenantField : void 0;
       const tenantIds = tenant && typeof populatedClient?.currentTenants[0] === "object" ? populatedClient?.currentTenants[0]?.tenantIds : populatedClient?.currentTenants;
       eventTracking?.setUser?.({
-        clientId: populatedClient.publicKey,
+        clientId: populatedClient.id,
         clerkOrgId: populatedClient.clerkOrgId,
         tenant,
         tenantIds
       });
     }
-  }, [populatedClient?.currentTenants, populatedClient?.publicKey]);
+  }, [populatedClient?.currentTenants, populatedClient?.id]);
   if (!theme) {
     return null;
   }
@@ -26142,7 +26139,7 @@ var useDashboardInternal = (dashboardName, customFilters) => {
       });
       const body = {
         task: "set-section-order",
-        clientId: client.clientId,
+        clientId: client.id,
         dashboardName,
         sectionOrder
       };
@@ -26370,7 +26367,7 @@ var useDashboards = () => {
       dateFilter,
       name: name2.trim(),
       task: "edit-dashboard",
-      clientId: clientId ?? client.clientId,
+      clientId: clientId ?? client.id,
       tenantKeys: dashboardOwners
     };
     try {
@@ -26445,7 +26442,7 @@ var useDashboards = () => {
       initialCacheDateRange,
       name: name2.trim(),
       task: "edit-dashboard",
-      clientId: clientId ?? client.clientId,
+      clientId: clientId ?? client.id,
       tenantKeys
     };
     try {
@@ -26623,7 +26620,7 @@ var useDashboards = () => {
       client,
       task: "delete-dashboard",
       metadata: {
-        clientId: client.clientId,
+        clientId: client.id,
         databaseType: client.databaseType,
         name: name2
       }
@@ -27467,7 +27464,7 @@ async function getExportData(client, dashboardFilters, reportId, getToken, event
     metadata: {
       reportId,
       dashboardItemId: reportId,
-      clientId: client.publicKey,
+      clientId: client.id,
       databaseType: client?.databaseType,
       filters: minimalFilters,
       useNewNodeSql: true,
@@ -30534,7 +30531,8 @@ var getLegendLabel = (entry) => {
 var LegendItem = ({
   entry,
   index,
-  theme
+  theme,
+  onClick
 }) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
   "div",
   {
@@ -30543,6 +30541,7 @@ var LegendItem = ({
       alignItems: "baseline",
       marginRight: "1rem"
     },
+    onClick: () => onClick ? onClick(entry) : void 0,
     children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
       "div",
       {
@@ -30586,7 +30585,8 @@ var getOuterWidth = (element) => {
 };
 var RenderLegend = ({
   payload,
-  limit
+  limit,
+  onClickLegendElement
 }) => {
   const [theme] = (0, import_react12.useContext)(ThemeContext);
   const [isOpen, setIsOpen] = (0, import_react12.useState)(false);
@@ -30663,7 +30663,6 @@ var RenderLegend = ({
               visibility: "hidden",
               height: 0,
               overflow: "hidden",
-              pointerEvents: "none",
               display: "flex",
               alignItems: "center",
               flexWrap: "nowrap",
@@ -30687,7 +30686,15 @@ var RenderLegend = ({
                       ref: (element) => {
                         itemRefs.current[index] = element;
                       },
-                      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(LegendItem, { entry, index, theme })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                        LegendItem,
+                        {
+                          entry,
+                          index,
+                          theme,
+                          onClick: onClickLegendElement
+                        }
+                      )
                     },
                     `legend-measure-${index}`
                   ))
@@ -30728,7 +30735,8 @@ var RenderLegend = ({
               {
                 entry,
                 index,
-                theme
+                theme,
+                onClick: onClickLegendElement
               },
               `legend-${index}`
             ))
@@ -30775,7 +30783,8 @@ var RenderLegend = ({
                   {
                     entry,
                     index,
-                    theme
+                    theme,
+                    onClick: onClickLegendElement
                   },
                   `legend-popover-${index}`
                 ))
@@ -31047,6 +31056,7 @@ var PieChartWrapper = import_react13.default.forwardRef(
       containerStyle,
       theme,
       onClickChartElement,
+      onClickLegendElement,
       yAxisFields,
       showLegend = false,
       ...other
@@ -31143,7 +31153,13 @@ var PieChartWrapper = import_react13.default.forwardRef(
                     paddingBottom: 20,
                     fontFamily: theme?.fontFamily
                   },
-                  content: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RenderLegend, { limit: 5 })
+                  content: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                    RenderLegend,
+                    {
+                      limit: 5,
+                      onClickLegendElement
+                    }
+                  )
                 }
               ),
               /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
@@ -32439,6 +32455,8 @@ function LineChart({
   cartesianGridLineColor,
   onClickChartElement = () => {
   },
+  onClickLegendElement = () => {
+  },
   dateFilter,
   referenceLines,
   showLegend = false
@@ -32535,7 +32553,7 @@ function LineChart({
                   paddingBottom: 20,
                   fontFamily: theme?.fontFamily
                 },
-                content: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RenderLegend, {})
+                content: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RenderLegend, { onClickLegendElement })
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
@@ -32757,6 +32775,8 @@ function RadarChart({
   isAnimationActive = true,
   onClickChartElement = () => {
   },
+  onClickLegendElement = () => {
+  },
   dateFilter,
   showLegend = false
 }) {
@@ -32850,7 +32870,7 @@ function RadarChart({
                   paddingBottom: 20,
                   fontFamily: theme?.fontFamily
                 },
-                content: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(RenderLegend, {})
+                content: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(RenderLegend, { onClickLegendElement })
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
@@ -33112,6 +33132,7 @@ function BarChart({
   hideYAxis = false,
   hideCartesianGrid = false,
   onClickChartElement,
+  onClickLegendElement,
   dateFilter,
   referenceLines,
   showLegend = false,
@@ -33205,9 +33226,7 @@ function BarChart({
             {
               data: data ?? [],
               layout,
-              onClick: (event) => onClickChartElement ? onClickChartElement(
-                event?.activePayload ? event.activePayload[0].payload : void 0
-              ) : void 0,
+              onClick: (event) => onClickChartElement ? onClickChartElement(event) : void 0,
               children: [
                 !hideCartesianGrid && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
                   import_recharts4.CartesianGrid,
@@ -33227,7 +33246,7 @@ function BarChart({
                     wrapperStyle: {
                       paddingBottom: 20
                     },
-                    content: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RenderLegend, {})
+                    content: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RenderLegend, { onClickLegendElement })
                   }
                 ),
                 isHorizontalBars ? /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
@@ -38931,6 +38950,7 @@ var ChartDisplay = ({
   onPageChange,
   onSortChange,
   onClickChartElement,
+  onClickLegendElement,
   overrideTheme,
   referenceLines,
   showLegend,
@@ -38999,6 +39019,7 @@ var ChartDisplay = ({
         theme: overrideTheme ?? theme,
         colorMap,
         onClickChartElement,
+        onClickLegendElement,
         yAxisFields: config?.yAxisFields,
         showLegend: resolvedShowLegend
       }
@@ -39072,6 +39093,7 @@ var ChartDisplay = ({
         hideCartesianGrid,
         colorMap,
         onClickChartElement,
+        onClickLegendElement,
         dateFilter: !hideDateRangeFilter ? dateFilter : void 0,
         referenceLines,
         showLegend: resolvedShowLegend
@@ -39099,6 +39121,7 @@ var ChartDisplay = ({
         hideCartesianGrid,
         colorMap,
         onClickChartElement,
+        onClickLegendElement,
         dateFilter: !hideDateRangeFilter ? dateFilter : void 0,
         referenceLines,
         showLegend: resolvedShowLegend,
@@ -39255,6 +39278,7 @@ var ChartDisplay = ({
         className,
         isAnimationActive,
         onClickChartElement,
+        onClickLegendElement,
         dateFilter: !hideDateRangeFilter ? dateFilter : void 0,
         showLegend: resolvedShowLegend
       }
@@ -39285,6 +39309,7 @@ var ChartDisplay = ({
       comparisonLineStyle: comparisonLineStyle ?? "solid",
       cartesianGridLineColor,
       onClickChartElement,
+      onClickLegendElement,
       dateFilter: !hideDateRangeFilter ? dateFilter : void 0,
       referenceLines,
       showLegend: resolvedShowLegend
@@ -41343,7 +41368,7 @@ function DashboardLegacy({
   const [filterValues, setFilterValues] = (0, import_react40.useState)({});
   const prevNameRef = (0, import_react40.useRef)(name2);
   const prevFlagsRef = (0, import_react40.useRef)(flags);
-  const prevClientRef = (0, import_react40.useRef)(client?.publicKey ?? "");
+  const prevClientRef = (0, import_react40.useRef)(client?.id ?? "");
   const addFilterPopoverButtonRef = (0, import_react40.useRef)(null);
   const viewFiltersPopoverButtonRef = (0, import_react40.useRef)(null);
   const previousFilters = (0, import_react40.useRef)(filters);
@@ -41399,15 +41424,15 @@ function DashboardLegacy({
     });
   }, [flags]);
   (0, import_react40.useEffect)(() => {
-    if (prevClientRef.current === client?.publicKey) {
+    if (prevClientRef.current === client?.id) {
       return;
     }
-    const isInitialKeySet = !prevClientRef.current && client?.publicKey;
+    const isInitialKeySet = !prevClientRef.current && client?.id;
     if (isInitialKeySet && Object.values(data?.sections ?? {}).flat().length) {
-      prevClientRef.current = client?.publicKey ?? "";
+      prevClientRef.current = client?.id ?? "";
       return;
     }
-    prevClientRef.current = client?.publicKey ?? "";
+    prevClientRef.current = client?.id ?? "";
     if (isClientLoading) {
       return;
     }
@@ -41419,7 +41444,7 @@ function DashboardLegacy({
       prevFlagsRef.current = flags;
       isInitialLoadOfDashboardRef.current = false;
     });
-  }, [client?.publicKey]);
+  }, [client?.id]);
   (0, import_react40.useEffect)(() => {
     setFilterValues(
       Object.values(populatedDashboardFilters ?? {}).reduce((acc, f) => {
@@ -42402,6 +42427,7 @@ function StaticChart(props) {
   const {
     reportId,
     onClickChartElement,
+    onClickLegendElement,
     containerStyle,
     showLegend,
     className
@@ -42454,6 +42480,7 @@ function StaticChart(props) {
       reportId,
       config,
       onClickChartElement,
+      onClickLegendElement,
       loading,
       className,
       containerStyle: safeContainerStyle,
@@ -47468,7 +47495,7 @@ function ChartBuilder({
       task: "dashboard",
       metadata: {
         name: dashboardName,
-        clientId: client.clientId,
+        clientId: client.id,
         databaseType: client.databaseType,
         useNewNodeSql: true,
         tenants
@@ -47528,11 +47555,11 @@ function ChartBuilder({
   const getReferencedTables = async (client2, dbTables, sqlQuery, reportBuilderState2, skipStar) => {
     const metadata = reportBuilderState2 ? {
       reportBuilderState: reportBuilderState2,
-      clientId: client2.clientId,
+      clientId: client2.id,
       useNewNodeSql: true
     } : {
       query: sqlQuery,
-      clientId: client2.clientId,
+      clientId: client2.id,
       useNewNodeSql: true
     };
     try {
@@ -47758,7 +47785,7 @@ function ChartBuilder({
           client,
           task: "dashnames",
           metadata: {
-            clientId: client.clientId
+            clientId: client.id
           }
         });
         dashNames = resp.dashboardNames;
@@ -51303,7 +51330,7 @@ function SQLEditor({
       setColumns([]);
       setDisplayTable(false);
     }
-  }, [client?.publicKey]);
+  }, [client?.id]);
   (0, import_react50.useEffect)(() => {
     if (isChartBuilderOpen === false) {
       onCloseChartBuilder && onCloseChartBuilder();
@@ -51562,7 +51589,7 @@ function SQLEditor({
       task: "astify",
       metadata: {
         query: sqlQuery,
-        clientId: client2.clientId,
+        clientId: client2.id,
         useNewNodeSql: true
       }
     });
@@ -51755,7 +51782,7 @@ function SQLEditor({
                                         query: query || "",
                                         schema: filteredSchema,
                                         databaseType: client?.databaseType ?? "postgresql",
-                                        clientName: client?.publicKey || "",
+                                        clientName: client?.id || "",
                                         setQuery,
                                         handleRunQuery: () => {
                                           handleRunQuery(currentProcessing, true);
@@ -53909,7 +53936,7 @@ var useReportBuilderInternal = ({
         !client.featureFlags?.["recommendedPivotsDisabled"]
       );
     }
-    if (!initialTableName && !reportId && client.publicKey) {
+    if (!initialTableName && !reportId && client.id) {
       clearAllState();
     }
   }, [client]);
@@ -58872,11 +58899,11 @@ function Chat({
     setIsLoading(false);
   };
   const submitDefaultMessage = async (nextMessages, abortController) => {
-    const clientId = client.clientId ?? client.publicKey;
+    const clientId = client.id;
     let responseBuffer = "";
     for await (const chunk of quillStream({
       client: {
-        clientId,
+        id: clientId,
         queryEndpoint: client.queryEndpoint,
         streamEndpoint: client.streamEndpoint,
         queryHeaders: client.queryHeaders,
@@ -58960,12 +58987,12 @@ function Chat({
     }
   };
   const submitAgentMessage = async (nextMessages, abortController) => {
-    const clientId = client.clientId ?? client.publicKey;
+    const clientId = client.id;
     let updatedMessages = [...nextMessages];
     for await (const event of quillAgentStream({
       endpoint: `${agentEndpoint}/agent/chat`,
       messages: updatedMessages,
-      sourceClientId: clientId,
+      sourceClientId: clientId ?? "<unknown>",
       getToken,
       abortSignal: abortController.signal
     })) {
@@ -59033,7 +59060,7 @@ function Chat({
     setIsLoading(true);
     const abortController = new AbortController();
     abortControllerRef.current = abortController;
-    const clientId = client.clientId ?? client.publicKey;
+    const clientId = client.id;
     if (!clientId) {
       setInputError("No client selected.");
       setIsLoading(false);
@@ -59923,7 +59950,7 @@ var useVirtualTables = () => {
     };
   };
   const handleRefreshSome = async (client, tables) => {
-    if (!client.clientId) return schemaData;
+    if (!client.id) return schemaData;
     setLoadingTables({
       ...loadingTables,
       ...tables.reduce((acc, table) => {
@@ -59941,7 +59968,7 @@ var useVirtualTables = () => {
             name: table.name,
             customFieldInfo: table.customFieldInfo,
             id: table._id,
-            clientId: client.clientId,
+            clientId: client.id,
             runQueryConfig: { getColumns: true },
             databaseType: client.databaseType,
             useNewNodeSql: true