@quillsql/react 2.16.4 → 2.16.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +1348 -1249
- package/dist/index.d.cts +3 -10
- package/dist/index.d.ts +3 -10
- package/dist/index.js +1105 -1001
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -18945,7 +18945,9 @@ var init_dataFetcher = __esm({
|
|
|
18945
18945
|
if (e instanceof Error && e.name === "AbortError") {
|
|
18946
18946
|
throw e;
|
|
18947
18947
|
}
|
|
18948
|
-
|
|
18948
|
+
if (task !== "set-section-order") {
|
|
18949
|
+
console.error("Failed to fetch:", e);
|
|
18950
|
+
}
|
|
18949
18951
|
return { error: "Failed to fetch data" };
|
|
18950
18952
|
}
|
|
18951
18953
|
};
|
|
@@ -19415,10 +19417,10 @@ __export(index_exports, {
|
|
|
19415
19417
|
module.exports = __toCommonJS(index_exports);
|
|
19416
19418
|
|
|
19417
19419
|
// src/Dashboard.tsx
|
|
19418
|
-
var
|
|
19420
|
+
var import_react38 = require("react");
|
|
19419
19421
|
|
|
19420
19422
|
// src/Chart.tsx
|
|
19421
|
-
var
|
|
19423
|
+
var import_react30 = require("react");
|
|
19422
19424
|
|
|
19423
19425
|
// src/utils/csv.ts
|
|
19424
19426
|
init_valueFormatter();
|
|
@@ -22282,28 +22284,16 @@ var ContextProvider = ({
|
|
|
22282
22284
|
dashboardName,
|
|
22283
22285
|
sectionOrder: newSectionOrder
|
|
22284
22286
|
};
|
|
22285
|
-
|
|
22286
|
-
|
|
22287
|
-
|
|
22288
|
-
|
|
22289
|
-
|
|
22290
|
-
|
|
22291
|
-
|
|
22292
|
-
|
|
22293
|
-
|
|
22294
|
-
|
|
22295
|
-
type: "bug",
|
|
22296
|
-
// TODO: determine type
|
|
22297
|
-
severity: "high",
|
|
22298
|
-
message: "Error setting section order",
|
|
22299
|
-
errorMessage: e.message,
|
|
22300
|
-
errorStack: e.stack,
|
|
22301
|
-
errorData: {
|
|
22302
|
-
caller: "Context",
|
|
22303
|
-
function: "loadDashboard"
|
|
22304
|
-
}
|
|
22305
|
-
});
|
|
22306
|
-
}
|
|
22287
|
+
void quillFetch({
|
|
22288
|
+
client,
|
|
22289
|
+
task: "set-section-order",
|
|
22290
|
+
metadata: body,
|
|
22291
|
+
getToken: getAuthorizationToken
|
|
22292
|
+
}).catch((error) => {
|
|
22293
|
+
if (error instanceof Error && error.name === "AbortError") {
|
|
22294
|
+
return;
|
|
22295
|
+
}
|
|
22296
|
+
});
|
|
22307
22297
|
}
|
|
22308
22298
|
}
|
|
22309
22299
|
}
|
|
@@ -23159,12 +23149,11 @@ var useDashboardInternal = (dashboardName, customFilters) => {
|
|
|
23159
23149
|
dashboardName,
|
|
23160
23150
|
sectionOrder
|
|
23161
23151
|
};
|
|
23162
|
-
|
|
23163
|
-
|
|
23164
|
-
|
|
23165
|
-
|
|
23166
|
-
|
|
23167
|
-
});
|
|
23152
|
+
void quillFetchWithToken({
|
|
23153
|
+
client,
|
|
23154
|
+
task: "set-section-order",
|
|
23155
|
+
metadata: body
|
|
23156
|
+
}).then((response) => {
|
|
23168
23157
|
Object.entries(response?.data?.newIds ?? {}).forEach(
|
|
23169
23158
|
([section, newId2]) => {
|
|
23170
23159
|
dashboardConfigDispatch({
|
|
@@ -23186,21 +23175,11 @@ var useDashboardInternal = (dashboardName, customFilters) => {
|
|
|
23186
23175
|
});
|
|
23187
23176
|
}
|
|
23188
23177
|
);
|
|
23189
|
-
}
|
|
23190
|
-
|
|
23191
|
-
|
|
23192
|
-
|
|
23193
|
-
|
|
23194
|
-
severity: "high",
|
|
23195
|
-
message: "Error setting section order",
|
|
23196
|
-
errorMessage: e.message,
|
|
23197
|
-
errorStack: e.stack,
|
|
23198
|
-
errorData: {
|
|
23199
|
-
caller: "useDashboard",
|
|
23200
|
-
function: "setSectionOrder"
|
|
23201
|
-
}
|
|
23202
|
-
});
|
|
23203
|
-
}
|
|
23178
|
+
}).catch((error) => {
|
|
23179
|
+
if (error instanceof Error && error.name === "AbortError") {
|
|
23180
|
+
return;
|
|
23181
|
+
}
|
|
23182
|
+
});
|
|
23204
23183
|
}
|
|
23205
23184
|
};
|
|
23206
23185
|
function isDashboardFilterLoading(filterName) {
|
|
@@ -25544,11 +25523,11 @@ var PieChartWrapper = import_react5.default.forwardRef(
|
|
|
25544
25523
|
var PieChart_default = PieChartWrapper;
|
|
25545
25524
|
|
|
25546
25525
|
// src/components/QuillTable.tsx
|
|
25547
|
-
var
|
|
25526
|
+
var import_react13 = require("react");
|
|
25548
25527
|
init_valueFormatter();
|
|
25549
25528
|
|
|
25550
25529
|
// src/components/UiComponents.tsx
|
|
25551
|
-
var
|
|
25530
|
+
var import_react12 = require("react");
|
|
25552
25531
|
|
|
25553
25532
|
// src/assets/ArrowDownHeadIcon.tsx
|
|
25554
25533
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
@@ -25799,6 +25778,141 @@ var import_react9 = require("react");
|
|
|
25799
25778
|
// src/hooks/useSelectOnKeyDown.tsx
|
|
25800
25779
|
var import_react10 = require("react");
|
|
25801
25780
|
|
|
25781
|
+
// src/hooks/useResponsiveFirstChildWidth.ts
|
|
25782
|
+
var import_react11 = require("react");
|
|
25783
|
+
var DEFAULT_MIN_WIDTH = 0;
|
|
25784
|
+
var parseNumericValue = (value) => {
|
|
25785
|
+
if (!value) {
|
|
25786
|
+
return 0;
|
|
25787
|
+
}
|
|
25788
|
+
const parsed = parseFloat(value);
|
|
25789
|
+
return Number.isFinite(parsed) ? parsed : 0;
|
|
25790
|
+
};
|
|
25791
|
+
var getHorizontalGap = (element, explicitGap) => {
|
|
25792
|
+
if (typeof explicitGap === "number") {
|
|
25793
|
+
return explicitGap;
|
|
25794
|
+
}
|
|
25795
|
+
const computedStyle = window.getComputedStyle(element);
|
|
25796
|
+
const columnGap = parseNumericValue(computedStyle.columnGap);
|
|
25797
|
+
if (columnGap > 0) {
|
|
25798
|
+
return columnGap;
|
|
25799
|
+
}
|
|
25800
|
+
const genericGap = parseNumericValue(computedStyle.gap);
|
|
25801
|
+
return genericGap;
|
|
25802
|
+
};
|
|
25803
|
+
var calculateFirstChildWidth = (element, options) => {
|
|
25804
|
+
const { gap, minWidth, maxWidth } = options;
|
|
25805
|
+
const computedStyle = window.getComputedStyle(element);
|
|
25806
|
+
const horizontalPadding = parseNumericValue(computedStyle.paddingLeft) + parseNumericValue(computedStyle.paddingRight);
|
|
25807
|
+
const availableWidth = Math.max(
|
|
25808
|
+
0,
|
|
25809
|
+
element.clientWidth - horizontalPadding
|
|
25810
|
+
);
|
|
25811
|
+
const children = Array.from(element.children);
|
|
25812
|
+
if (!children.length) {
|
|
25813
|
+
return Math.max(minWidth ?? DEFAULT_MIN_WIDTH, 0);
|
|
25814
|
+
}
|
|
25815
|
+
const siblings = children.slice(1);
|
|
25816
|
+
const gapCount = Math.max(children.length - 1, 0);
|
|
25817
|
+
const effectiveGap = getHorizontalGap(element, gap) * gapCount;
|
|
25818
|
+
let siblingsWidth = 0;
|
|
25819
|
+
siblings.forEach((child) => {
|
|
25820
|
+
const rect = child.getBoundingClientRect();
|
|
25821
|
+
const childStyle = window.getComputedStyle(child);
|
|
25822
|
+
siblingsWidth += rect.width + parseNumericValue(childStyle.marginLeft) + parseNumericValue(childStyle.marginRight);
|
|
25823
|
+
});
|
|
25824
|
+
const rawWidth = Math.max(0, availableWidth - siblingsWidth - effectiveGap);
|
|
25825
|
+
const min2 = Math.max(minWidth ?? DEFAULT_MIN_WIDTH, 0);
|
|
25826
|
+
const max2 = typeof maxWidth === "number" && Number.isFinite(maxWidth) ? Math.max(maxWidth, min2) : void 0;
|
|
25827
|
+
const clampedWidth = max2 !== void 0 ? Math.min(Math.max(rawWidth, min2), max2) : Math.max(rawWidth, min2);
|
|
25828
|
+
return Math.floor(clampedWidth);
|
|
25829
|
+
};
|
|
25830
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react11.useLayoutEffect : import_react11.useEffect;
|
|
25831
|
+
var useResponsiveFirstChildWidth = (containerRef, options = {}) => {
|
|
25832
|
+
const {
|
|
25833
|
+
gap,
|
|
25834
|
+
initialWidth = -1,
|
|
25835
|
+
minWidth = DEFAULT_MIN_WIDTH,
|
|
25836
|
+
maxWidth
|
|
25837
|
+
} = options;
|
|
25838
|
+
const [width, setWidth] = (0, import_react11.useState)(initialWidth);
|
|
25839
|
+
const previousWidthRef = (0, import_react11.useRef)(initialWidth);
|
|
25840
|
+
useIsomorphicLayoutEffect(() => {
|
|
25841
|
+
const element = containerRef?.current ?? null;
|
|
25842
|
+
if (!element || typeof window === "undefined") {
|
|
25843
|
+
return;
|
|
25844
|
+
}
|
|
25845
|
+
let frameId = null;
|
|
25846
|
+
const updateWidth = () => {
|
|
25847
|
+
if (!element.isConnected) {
|
|
25848
|
+
return;
|
|
25849
|
+
}
|
|
25850
|
+
const nextWidth = calculateFirstChildWidth(element, {
|
|
25851
|
+
gap,
|
|
25852
|
+
minWidth,
|
|
25853
|
+
maxWidth
|
|
25854
|
+
});
|
|
25855
|
+
if (frameId !== null) {
|
|
25856
|
+
cancelAnimationFrame(frameId);
|
|
25857
|
+
}
|
|
25858
|
+
frameId = window.requestAnimationFrame(() => {
|
|
25859
|
+
frameId = null;
|
|
25860
|
+
if (Math.abs(previousWidthRef.current - nextWidth) > 0.5) {
|
|
25861
|
+
previousWidthRef.current = nextWidth;
|
|
25862
|
+
setWidth(nextWidth);
|
|
25863
|
+
}
|
|
25864
|
+
});
|
|
25865
|
+
};
|
|
25866
|
+
if (typeof ResizeObserver === "undefined") {
|
|
25867
|
+
updateWidth();
|
|
25868
|
+
const handleResize = () => updateWidth();
|
|
25869
|
+
window.addEventListener("resize", handleResize);
|
|
25870
|
+
return () => {
|
|
25871
|
+
if (frameId !== null) {
|
|
25872
|
+
cancelAnimationFrame(frameId);
|
|
25873
|
+
}
|
|
25874
|
+
window.removeEventListener("resize", handleResize);
|
|
25875
|
+
};
|
|
25876
|
+
}
|
|
25877
|
+
const resizeObserver = new ResizeObserver(() => {
|
|
25878
|
+
updateWidth();
|
|
25879
|
+
});
|
|
25880
|
+
const observeChildren = () => {
|
|
25881
|
+
resizeObserver.observe(element);
|
|
25882
|
+
Array.from(element.children).forEach((child) => {
|
|
25883
|
+
resizeObserver.observe(child);
|
|
25884
|
+
});
|
|
25885
|
+
};
|
|
25886
|
+
observeChildren();
|
|
25887
|
+
updateWidth();
|
|
25888
|
+
const mutationObserver = new MutationObserver((mutations) => {
|
|
25889
|
+
mutations.forEach((mutation) => {
|
|
25890
|
+
mutation.addedNodes.forEach((node) => {
|
|
25891
|
+
if (node instanceof HTMLElement) {
|
|
25892
|
+
resizeObserver.observe(node);
|
|
25893
|
+
}
|
|
25894
|
+
});
|
|
25895
|
+
mutation.removedNodes.forEach((node) => {
|
|
25896
|
+
if (node instanceof HTMLElement) {
|
|
25897
|
+
resizeObserver.unobserve(node);
|
|
25898
|
+
}
|
|
25899
|
+
});
|
|
25900
|
+
});
|
|
25901
|
+
updateWidth();
|
|
25902
|
+
});
|
|
25903
|
+
mutationObserver.observe(element, { childList: true });
|
|
25904
|
+
return () => {
|
|
25905
|
+
if (frameId !== null) {
|
|
25906
|
+
cancelAnimationFrame(frameId);
|
|
25907
|
+
}
|
|
25908
|
+
resizeObserver.disconnect();
|
|
25909
|
+
mutationObserver.disconnect();
|
|
25910
|
+
};
|
|
25911
|
+
}, [containerRef?.current, gap, minWidth, maxWidth]);
|
|
25912
|
+
return width;
|
|
25913
|
+
};
|
|
25914
|
+
var useResponsiveFirstChildWidth_default = useResponsiveFirstChildWidth;
|
|
25915
|
+
|
|
25802
25916
|
// src/components/UiComponents.tsx
|
|
25803
25917
|
var import_react_dom2 = require("react-dom");
|
|
25804
25918
|
|
|
@@ -25819,7 +25933,7 @@ var getScrollableParent = (element) => {
|
|
|
25819
25933
|
|
|
25820
25934
|
// src/components/UiComponents.tsx
|
|
25821
25935
|
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
25822
|
-
var QuillTextInput = (0,
|
|
25936
|
+
var QuillTextInput = (0, import_react12.forwardRef)(
|
|
25823
25937
|
({
|
|
25824
25938
|
id: id2,
|
|
25825
25939
|
value,
|
|
@@ -25829,15 +25943,20 @@ var QuillTextInput = (0, import_react11.forwardRef)(
|
|
|
25829
25943
|
onChange,
|
|
25830
25944
|
disabled
|
|
25831
25945
|
}, ref) => {
|
|
25832
|
-
const [theme] = (0,
|
|
25946
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
25947
|
+
const isNumericWidth = typeof width === "number";
|
|
25948
|
+
const resolvedWidth = typeof width === "string" ? width : isNumericWidth ? width : "100%";
|
|
25833
25949
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
25834
25950
|
"label",
|
|
25835
25951
|
{
|
|
25836
25952
|
style: {
|
|
25837
25953
|
position: "relative",
|
|
25838
25954
|
borderRadius: "6px",
|
|
25839
|
-
|
|
25840
|
-
|
|
25955
|
+
display: "flex",
|
|
25956
|
+
flexDirection: "column",
|
|
25957
|
+
width: resolvedWidth,
|
|
25958
|
+
minWidth: isNumericWidth ? width : 0,
|
|
25959
|
+
flex: isNumericWidth ? "0 0 auto" : "1 1 auto"
|
|
25841
25960
|
},
|
|
25842
25961
|
children: [
|
|
25843
25962
|
label && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
@@ -25859,6 +25978,7 @@ var QuillTextInput = (0, import_react11.forwardRef)(
|
|
|
25859
25978
|
ref,
|
|
25860
25979
|
style: {
|
|
25861
25980
|
display: "flex",
|
|
25981
|
+
flex: "1 1 auto",
|
|
25862
25982
|
height: 40,
|
|
25863
25983
|
minHeight: 40,
|
|
25864
25984
|
maxHeight: 40,
|
|
@@ -25870,8 +25990,8 @@ var QuillTextInput = (0, import_react11.forwardRef)(
|
|
|
25870
25990
|
backgroundColor: theme?.backgroundColor,
|
|
25871
25991
|
color: theme?.primaryTextColor,
|
|
25872
25992
|
fontFamily: theme?.fontFamily,
|
|
25873
|
-
width,
|
|
25874
|
-
minWidth:
|
|
25993
|
+
width: "100%",
|
|
25994
|
+
minWidth: 0
|
|
25875
25995
|
},
|
|
25876
25996
|
id: id2,
|
|
25877
25997
|
value,
|
|
@@ -25893,7 +26013,7 @@ var MemoizedButton = ({
|
|
|
25893
26013
|
tooltipText,
|
|
25894
26014
|
isLoading
|
|
25895
26015
|
}) => {
|
|
25896
|
-
const [theme] = (0,
|
|
26016
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
25897
26017
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
25898
26018
|
QuillToolTipPortal,
|
|
25899
26019
|
{
|
|
@@ -25966,7 +26086,7 @@ var MemoizedSecondaryButton = ({
|
|
|
25966
26086
|
tooltipText,
|
|
25967
26087
|
width
|
|
25968
26088
|
}) => {
|
|
25969
|
-
const [theme] = (0,
|
|
26089
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
25970
26090
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
25971
26091
|
QuillToolTip,
|
|
25972
26092
|
{
|
|
@@ -26040,7 +26160,7 @@ var MemoizedSecondaryButton = ({
|
|
|
26040
26160
|
);
|
|
26041
26161
|
};
|
|
26042
26162
|
var MemoizedHeader = ({ label }) => {
|
|
26043
|
-
const [theme] = (0,
|
|
26163
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26044
26164
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
26045
26165
|
"h1",
|
|
26046
26166
|
{
|
|
@@ -26058,7 +26178,7 @@ var MemoizedHeader = ({ label }) => {
|
|
|
26058
26178
|
);
|
|
26059
26179
|
};
|
|
26060
26180
|
var MemoizedSubHeader = ({ label }) => {
|
|
26061
|
-
const [theme] = (0,
|
|
26181
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26062
26182
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
26063
26183
|
"h2",
|
|
26064
26184
|
{
|
|
@@ -26077,7 +26197,7 @@ var MemoizedSubHeader = ({ label }) => {
|
|
|
26077
26197
|
);
|
|
26078
26198
|
};
|
|
26079
26199
|
var MemoizedLabel = ({ label }) => {
|
|
26080
|
-
const [theme] = (0,
|
|
26200
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26081
26201
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
26082
26202
|
"h1",
|
|
26083
26203
|
{
|
|
@@ -26100,7 +26220,7 @@ var MemoizedCheckbox = ({
|
|
|
26100
26220
|
containerStyle,
|
|
26101
26221
|
disabled
|
|
26102
26222
|
}) => {
|
|
26103
|
-
const [theme] = (0,
|
|
26223
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26104
26224
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
26105
26225
|
"label",
|
|
26106
26226
|
{
|
|
@@ -26209,7 +26329,7 @@ var QuillTabs = ({
|
|
|
26209
26329
|
}
|
|
26210
26330
|
);
|
|
26211
26331
|
var MemoizedText = ({ label }) => {
|
|
26212
|
-
const [theme] = (0,
|
|
26332
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26213
26333
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
26214
26334
|
"p",
|
|
26215
26335
|
{
|
|
@@ -26240,11 +26360,11 @@ var MemoizedPopover = ({
|
|
|
26240
26360
|
horizontalPadding = 20,
|
|
26241
26361
|
titlePaddingLeft = 0
|
|
26242
26362
|
}) => {
|
|
26243
|
-
const [theme] = (0,
|
|
26244
|
-
const [rightAlignment, setRightAlignment] = (0,
|
|
26245
|
-
const modalRef = (0,
|
|
26246
|
-
const popoverRef = (0,
|
|
26247
|
-
(0,
|
|
26363
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26364
|
+
const [rightAlignment, setRightAlignment] = (0, import_react12.useState)("auto");
|
|
26365
|
+
const modalRef = (0, import_react12.useRef)(null);
|
|
26366
|
+
const popoverRef = (0, import_react12.useRef)(null);
|
|
26367
|
+
(0, import_react12.useEffect)(() => {
|
|
26248
26368
|
const listener = (event) => {
|
|
26249
26369
|
const target = event.target;
|
|
26250
26370
|
if (modalRef.current?.contains(target) || target.closest("[data-portal-ignore]") || ignoredRefs?.some(
|
|
@@ -26263,7 +26383,7 @@ var MemoizedPopover = ({
|
|
|
26263
26383
|
document.removeEventListener("mousedown", listener);
|
|
26264
26384
|
};
|
|
26265
26385
|
}, [isOpen, ignoredRefs, setIsOpen, modalRef]);
|
|
26266
|
-
(0,
|
|
26386
|
+
(0, import_react12.useEffect)(() => {
|
|
26267
26387
|
updatePopoverPosition();
|
|
26268
26388
|
window.addEventListener("resize", updatePopoverPosition);
|
|
26269
26389
|
return () => {
|
|
@@ -26338,7 +26458,7 @@ function MemoizedModal({
|
|
|
26338
26458
|
width,
|
|
26339
26459
|
height
|
|
26340
26460
|
}) {
|
|
26341
|
-
const [theme] = (0,
|
|
26461
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26342
26462
|
if (!isOpen) {
|
|
26343
26463
|
return null;
|
|
26344
26464
|
}
|
|
@@ -26658,11 +26778,11 @@ var QuillModalComponent = ({
|
|
|
26658
26778
|
triggerLabel,
|
|
26659
26779
|
title
|
|
26660
26780
|
}) => {
|
|
26661
|
-
const [theme] = (0,
|
|
26662
|
-
const [rightAlignment, setRightAlignment] = (0,
|
|
26663
|
-
const modalRef = (0,
|
|
26664
|
-
const popoverRef = (0,
|
|
26665
|
-
(0,
|
|
26781
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26782
|
+
const [rightAlignment, setRightAlignment] = (0, import_react12.useState)("auto");
|
|
26783
|
+
const modalRef = (0, import_react12.useRef)(null);
|
|
26784
|
+
const popoverRef = (0, import_react12.useRef)(null);
|
|
26785
|
+
(0, import_react12.useEffect)(() => {
|
|
26666
26786
|
const listener = (event) => {
|
|
26667
26787
|
if (modalRef?.current && !modalRef?.current?.contains(event.target)) {
|
|
26668
26788
|
if (setIsOpen) setIsOpen(false);
|
|
@@ -26677,7 +26797,7 @@ var QuillModalComponent = ({
|
|
|
26677
26797
|
document.removeEventListener("mousedown", listener);
|
|
26678
26798
|
};
|
|
26679
26799
|
}, [modalRef, setIsOpen, isOpen]);
|
|
26680
|
-
(0,
|
|
26800
|
+
(0, import_react12.useEffect)(() => {
|
|
26681
26801
|
updatePopoverPosition();
|
|
26682
26802
|
window.addEventListener("resize", updatePopoverPosition);
|
|
26683
26803
|
return () => {
|
|
@@ -26842,7 +26962,7 @@ var QuillErrorMessageComponent = ({
|
|
|
26842
26962
|
errorMessage,
|
|
26843
26963
|
containerStyle
|
|
26844
26964
|
}) => {
|
|
26845
|
-
const [theme] = (0,
|
|
26965
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26846
26966
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
26847
26967
|
"div",
|
|
26848
26968
|
{
|
|
@@ -26891,11 +27011,11 @@ var QuillErrorMessageComponent = ({
|
|
|
26891
27011
|
);
|
|
26892
27012
|
};
|
|
26893
27013
|
var QuillColumnSearchEmptyState = () => {
|
|
26894
|
-
const [theme] = (0,
|
|
27014
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26895
27015
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { style: { fontFamily: theme?.fontFamily }, children: "No results found" });
|
|
26896
27016
|
};
|
|
26897
27017
|
var QuillLoadingComponent = () => {
|
|
26898
|
-
const [theme] = (0,
|
|
27018
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
26899
27019
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
26900
27020
|
"div",
|
|
26901
27021
|
{
|
|
@@ -26974,9 +27094,9 @@ var OverflowContainer = ({
|
|
|
26974
27094
|
children,
|
|
26975
27095
|
style: style2
|
|
26976
27096
|
}) => {
|
|
26977
|
-
const containerRef = (0,
|
|
26978
|
-
const [showTopShadow, setShowTopShadow] = (0,
|
|
26979
|
-
const [showBottomShadow, setShowBottomShadow] = (0,
|
|
27097
|
+
const containerRef = (0, import_react12.useRef)(null);
|
|
27098
|
+
const [showTopShadow, setShowTopShadow] = (0, import_react12.useState)(false);
|
|
27099
|
+
const [showBottomShadow, setShowBottomShadow] = (0, import_react12.useState)(false);
|
|
26980
27100
|
const checkOverflow = () => {
|
|
26981
27101
|
const container = containerRef.current;
|
|
26982
27102
|
if (container) {
|
|
@@ -26987,7 +27107,7 @@ var OverflowContainer = ({
|
|
|
26987
27107
|
);
|
|
26988
27108
|
}
|
|
26989
27109
|
};
|
|
26990
|
-
(0,
|
|
27110
|
+
(0, import_react12.useEffect)(() => {
|
|
26991
27111
|
const container = containerRef.current;
|
|
26992
27112
|
if (container) {
|
|
26993
27113
|
checkOverflow();
|
|
@@ -27065,7 +27185,7 @@ var QuillToolTip = ({
|
|
|
27065
27185
|
textStyle = {},
|
|
27066
27186
|
displayBelow = false
|
|
27067
27187
|
}) => {
|
|
27068
|
-
const [theme] = (0,
|
|
27188
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
27069
27189
|
return enabled ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "tooltip-container", style: { ...containerStyle }, children: [
|
|
27070
27190
|
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("style", { children: `
|
|
27071
27191
|
.tooltip-container {
|
|
@@ -27140,11 +27260,11 @@ var QuillToolTipPortal = ({
|
|
|
27140
27260
|
textStyle = {},
|
|
27141
27261
|
mirror = false
|
|
27142
27262
|
}) => {
|
|
27143
|
-
const [theme] = (0,
|
|
27144
|
-
const [isOpen, setIsOpen] = (0,
|
|
27145
|
-
const tooltipRef = (0,
|
|
27146
|
-
const triggerRef = (0,
|
|
27147
|
-
const [tooltipPosition, setTooltipPosition] = (0,
|
|
27263
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
27264
|
+
const [isOpen, setIsOpen] = (0, import_react12.useState)(false);
|
|
27265
|
+
const tooltipRef = (0, import_react12.useRef)(null);
|
|
27266
|
+
const triggerRef = (0, import_react12.useRef)(null);
|
|
27267
|
+
const [tooltipPosition, setTooltipPosition] = (0, import_react12.useState)(void 0);
|
|
27148
27268
|
const updatePosition = () => {
|
|
27149
27269
|
if (triggerRef.current && tooltipRef.current) {
|
|
27150
27270
|
const rect = triggerRef.current.getBoundingClientRect();
|
|
@@ -27169,7 +27289,7 @@ var QuillToolTipPortal = ({
|
|
|
27169
27289
|
setTooltipPosition({ top, left });
|
|
27170
27290
|
}
|
|
27171
27291
|
};
|
|
27172
|
-
(0,
|
|
27292
|
+
(0, import_react12.useEffect)(() => {
|
|
27173
27293
|
if (isOpen) {
|
|
27174
27294
|
const timer2 = setTimeout(() => {
|
|
27175
27295
|
updatePosition();
|
|
@@ -27273,7 +27393,7 @@ var QuillChartBuilderCheckboxComponent = ({
|
|
|
27273
27393
|
disabled,
|
|
27274
27394
|
containerStyle
|
|
27275
27395
|
}) => {
|
|
27276
|
-
const [theme] = (0,
|
|
27396
|
+
const [theme] = (0, import_react12.useContext)(ThemeContext);
|
|
27277
27397
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
27278
27398
|
"div",
|
|
27279
27399
|
{
|
|
@@ -27312,10 +27432,10 @@ var QuillPortal = ({
|
|
|
27312
27432
|
showModal,
|
|
27313
27433
|
setShowModal
|
|
27314
27434
|
}) => {
|
|
27315
|
-
const modalRef = (0,
|
|
27316
|
-
const [popoverPosition, setPopoverPosition] = (0,
|
|
27317
|
-
const [z, setZ] = (0,
|
|
27318
|
-
const scrollableParentRef = (0,
|
|
27435
|
+
const modalRef = (0, import_react12.useRef)(null);
|
|
27436
|
+
const [popoverPosition, setPopoverPosition] = (0, import_react12.useState)(void 0);
|
|
27437
|
+
const [z, setZ] = (0, import_react12.useState)(10);
|
|
27438
|
+
const scrollableParentRef = (0, import_react12.useRef)(document.body);
|
|
27319
27439
|
const updatePosition = () => {
|
|
27320
27440
|
if (anchorRef.current) {
|
|
27321
27441
|
requestAnimationFrame(() => {
|
|
@@ -27333,7 +27453,7 @@ var QuillPortal = ({
|
|
|
27333
27453
|
});
|
|
27334
27454
|
}
|
|
27335
27455
|
};
|
|
27336
|
-
(0,
|
|
27456
|
+
(0, import_react12.useEffect)(() => {
|
|
27337
27457
|
let resizeObserver;
|
|
27338
27458
|
let mutationObserver;
|
|
27339
27459
|
if (showModal && anchorRef.current) {
|
|
@@ -27430,18 +27550,18 @@ function QuillTable({
|
|
|
27430
27550
|
hideLabels,
|
|
27431
27551
|
disableSort
|
|
27432
27552
|
}) {
|
|
27433
|
-
const [activeRows, setActiveRows] = (0,
|
|
27434
|
-
const [maxPage, setMaxPage] = (0,
|
|
27435
|
-
const [sortColumn, setSortColumn] = (0,
|
|
27436
|
-
const [sortDirection, setSortDirection] = (0,
|
|
27437
|
-
const [theme] = (0,
|
|
27438
|
-
const [isPaginating, setIsPaginating] = (0,
|
|
27439
|
-
const [initialLoad, setInitialLoad] = (0,
|
|
27440
|
-
(0,
|
|
27553
|
+
const [activeRows, setActiveRows] = (0, import_react13.useState)([]);
|
|
27554
|
+
const [maxPage, setMaxPage] = (0, import_react13.useState)(1);
|
|
27555
|
+
const [sortColumn, setSortColumn] = (0, import_react13.useState)(sort?.field || "");
|
|
27556
|
+
const [sortDirection, setSortDirection] = (0, import_react13.useState)(sort?.direction || "desc");
|
|
27557
|
+
const [theme] = (0, import_react13.useContext)(ThemeContext);
|
|
27558
|
+
const [isPaginating, setIsPaginating] = (0, import_react13.useState)(true);
|
|
27559
|
+
const [initialLoad, setInitialLoad] = (0, import_react13.useState)(true);
|
|
27560
|
+
(0, import_react13.useEffect)(() => {
|
|
27441
27561
|
setSortColumn(sort?.field || "");
|
|
27442
27562
|
setSortDirection(sort?.direction || "desc");
|
|
27443
27563
|
}, [sort]);
|
|
27444
|
-
(0,
|
|
27564
|
+
(0, import_react13.useEffect)(() => {
|
|
27445
27565
|
if (rows?.length === 0 && isLoading) {
|
|
27446
27566
|
return;
|
|
27447
27567
|
}
|
|
@@ -27473,7 +27593,7 @@ function QuillTable({
|
|
|
27473
27593
|
rowCount,
|
|
27474
27594
|
isLoading
|
|
27475
27595
|
]);
|
|
27476
|
-
(0,
|
|
27596
|
+
(0, import_react13.useEffect)(() => {
|
|
27477
27597
|
if (rows.length <= currentPage * rowsPerPage) {
|
|
27478
27598
|
onPageChange && onPageChange(0);
|
|
27479
27599
|
setMaxPage(1);
|
|
@@ -28504,7 +28624,7 @@ function hashCode(obj) {
|
|
|
28504
28624
|
}
|
|
28505
28625
|
|
|
28506
28626
|
// src/components/Chart/LineChart.tsx
|
|
28507
|
-
var
|
|
28627
|
+
var import_react15 = require("react");
|
|
28508
28628
|
|
|
28509
28629
|
// src/components/Chart/CustomReferenceLine.tsx
|
|
28510
28630
|
init_constants();
|
|
@@ -28581,11 +28701,11 @@ function CustomReferenceLine({
|
|
|
28581
28701
|
}
|
|
28582
28702
|
|
|
28583
28703
|
// src/components/Chart/CustomLegend.tsx
|
|
28584
|
-
var
|
|
28704
|
+
var import_react14 = require("react");
|
|
28585
28705
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
28586
28706
|
var RenderLegend = (props) => {
|
|
28587
28707
|
const { payload } = props;
|
|
28588
|
-
const [theme] = (0,
|
|
28708
|
+
const [theme] = (0, import_react14.useContext)(ThemeContext);
|
|
28589
28709
|
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { style: { display: "flex", justifyContent: "flex-start" }, children: payload.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
28590
28710
|
"div",
|
|
28591
28711
|
{
|
|
@@ -28671,7 +28791,7 @@ function LineChart({
|
|
|
28671
28791
|
referenceLines,
|
|
28672
28792
|
showLegend = false
|
|
28673
28793
|
}) {
|
|
28674
|
-
const formattedData = (0,
|
|
28794
|
+
const formattedData = (0, import_react15.useMemo)(() => {
|
|
28675
28795
|
if (!data || data.length === 0) {
|
|
28676
28796
|
return createLineForEmptyChart(
|
|
28677
28797
|
yAxisFields,
|
|
@@ -28961,7 +29081,7 @@ var import_recharts3 = require("recharts");
|
|
|
28961
29081
|
init_valueFormatter();
|
|
28962
29082
|
|
|
28963
29083
|
// src/components/Chart/CustomBar.tsx
|
|
28964
|
-
var
|
|
29084
|
+
var import_react16 = require("react");
|
|
28965
29085
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
28966
29086
|
function isTopMostBarWithValue(yAxisFields, dataKey, payload) {
|
|
28967
29087
|
if (!dataKey || !yAxisFields.length) return false;
|
|
@@ -28982,7 +29102,7 @@ function createRoundedPath(x, y, width, height, radius, roundTop) {
|
|
|
28982
29102
|
return `M ${x} ${y} h ${width} v ${height - r} q 0 ${r} -${r} ${r} h -${width + 2 * r} q -${r} 0 -${r} -${r} v -${height - r} z`.replace(/\s+/g, " ").trim();
|
|
28983
29103
|
}
|
|
28984
29104
|
}
|
|
28985
|
-
var CustomBar = (0,
|
|
29105
|
+
var CustomBar = (0, import_react16.memo)((props) => {
|
|
28986
29106
|
const {
|
|
28987
29107
|
x,
|
|
28988
29108
|
y,
|
|
@@ -28998,10 +29118,10 @@ var CustomBar = (0, import_react15.memo)((props) => {
|
|
|
28998
29118
|
return null;
|
|
28999
29119
|
}
|
|
29000
29120
|
const customCornerRadius = theme?.barChartCornerRadius ?? (theme?.barChartCornerRadiusRatio ? theme?.barChartCornerRadiusRatio * width : void 0);
|
|
29001
|
-
const shouldRoundCorners = (0,
|
|
29121
|
+
const shouldRoundCorners = (0, import_react16.useMemo)(() => {
|
|
29002
29122
|
return customCornerRadius !== void 0 ? customCornerRadius > 0 : isTopMostBarWithValue(yAxisFields, dataKey, payload);
|
|
29003
29123
|
}, [customCornerRadius, yAxisFields, dataKey, payload]);
|
|
29004
|
-
const radius = (0,
|
|
29124
|
+
const radius = (0, import_react16.useMemo)(() => {
|
|
29005
29125
|
return shouldRoundCorners ? Math.min(
|
|
29006
29126
|
customCornerRadius || width * 0.1,
|
|
29007
29127
|
width / 2,
|
|
@@ -29012,7 +29132,7 @@ var CustomBar = (0, import_react15.memo)((props) => {
|
|
|
29012
29132
|
const absHeight = Math.abs(height);
|
|
29013
29133
|
const startY = isNegative ? y : y;
|
|
29014
29134
|
const endY = isNegative ? y + height : y + height;
|
|
29015
|
-
const path = (0,
|
|
29135
|
+
const path = (0, import_react16.useMemo)(() => {
|
|
29016
29136
|
if (isNegative) {
|
|
29017
29137
|
return radius > 0 ? createRoundedPath(x, startY, width, absHeight, radius, false) : `M ${x} ${startY} h ${width} v ${height} h -${width} z`;
|
|
29018
29138
|
} else {
|
|
@@ -29025,7 +29145,7 @@ CustomBar.displayName = "CustomBar";
|
|
|
29025
29145
|
var CustomBar_default = CustomBar;
|
|
29026
29146
|
|
|
29027
29147
|
// src/components/Chart/BarChart.tsx
|
|
29028
|
-
var
|
|
29148
|
+
var import_react17 = require("react");
|
|
29029
29149
|
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
29030
29150
|
var createCustomBar = (yAxisFields, theme) => {
|
|
29031
29151
|
return (props) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(CustomBar_default, { ...props, yAxisFields, theme });
|
|
@@ -29070,7 +29190,7 @@ function BarChart({
|
|
|
29070
29190
|
}
|
|
29071
29191
|
return fields;
|
|
29072
29192
|
};
|
|
29073
|
-
const customBarShape = (0,
|
|
29193
|
+
const customBarShape = (0, import_react17.useMemo)(() => {
|
|
29074
29194
|
if (!theme?.barChartCornerRadius && !theme?.barChartCornerRadiusRatio)
|
|
29075
29195
|
return void 0;
|
|
29076
29196
|
return createCustomBar(sortYAxisFields([...yAxisFields]), theme);
|
|
@@ -29291,13 +29411,13 @@ function BarChart({
|
|
|
29291
29411
|
}
|
|
29292
29412
|
|
|
29293
29413
|
// src/components/Chart/ChartError.tsx
|
|
29294
|
-
var
|
|
29414
|
+
var import_react18 = require("react");
|
|
29295
29415
|
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
29296
29416
|
function ChartError({
|
|
29297
29417
|
errorMessage = "Failed to fetch data.",
|
|
29298
29418
|
containerStyle
|
|
29299
29419
|
}) {
|
|
29300
|
-
const [theme] = (0,
|
|
29420
|
+
const [theme] = (0, import_react18.useContext)(ThemeContext);
|
|
29301
29421
|
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
29302
29422
|
"div",
|
|
29303
29423
|
{
|
|
@@ -29346,7 +29466,7 @@ function QuillChartErrorWithAction({
|
|
|
29346
29466
|
onClick,
|
|
29347
29467
|
ButtonComponent = MemoizedButton
|
|
29348
29468
|
}) {
|
|
29349
|
-
const [theme] = (0,
|
|
29469
|
+
const [theme] = (0, import_react18.useContext)(ThemeContext);
|
|
29350
29470
|
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
29351
29471
|
"div",
|
|
29352
29472
|
{
|
|
@@ -29413,15 +29533,15 @@ init_Filter();
|
|
|
29413
29533
|
init_filterProcessing();
|
|
29414
29534
|
|
|
29415
29535
|
// src/components/Dashboard/DashboardFilter.tsx
|
|
29416
|
-
var
|
|
29536
|
+
var import_react23 = require("react");
|
|
29417
29537
|
init_dateRangePickerUtils();
|
|
29418
29538
|
|
|
29419
29539
|
// src/DateRangePicker/QuillDateRangePicker.tsx
|
|
29420
|
-
var
|
|
29540
|
+
var import_react20 = require("react");
|
|
29421
29541
|
var import_date_fns11 = require("date-fns");
|
|
29422
29542
|
|
|
29423
29543
|
// src/components/QuillSelect.tsx
|
|
29424
|
-
var
|
|
29544
|
+
var import_react19 = require("react");
|
|
29425
29545
|
var import_react_dom3 = require("react-dom");
|
|
29426
29546
|
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
29427
29547
|
function QuillSelectComponent({
|
|
@@ -29434,10 +29554,10 @@ function QuillSelectComponent({
|
|
|
29434
29554
|
disabled,
|
|
29435
29555
|
hideEmptyOption
|
|
29436
29556
|
}) {
|
|
29437
|
-
const [theme] = (0,
|
|
29438
|
-
const [showModal, setShowModal] = (0,
|
|
29439
|
-
const modalRef = (0,
|
|
29440
|
-
const buttonRef = (0,
|
|
29557
|
+
const [theme] = (0, import_react19.useContext)(ThemeContext);
|
|
29558
|
+
const [showModal, setShowModal] = (0, import_react19.useState)(false);
|
|
29559
|
+
const modalRef = (0, import_react19.useRef)(null);
|
|
29560
|
+
const buttonRef = (0, import_react19.useRef)(null);
|
|
29441
29561
|
useOnClickOutside_default(
|
|
29442
29562
|
modalRef,
|
|
29443
29563
|
(event) => {
|
|
@@ -29446,7 +29566,7 @@ function QuillSelectComponent({
|
|
|
29446
29566
|
},
|
|
29447
29567
|
showModal
|
|
29448
29568
|
);
|
|
29449
|
-
const sortedItems = (0,
|
|
29569
|
+
const sortedItems = (0, import_react19.useMemo)(() => {
|
|
29450
29570
|
return options.sort((a, b) => {
|
|
29451
29571
|
if (a.value === null) {
|
|
29452
29572
|
return -1;
|
|
@@ -29457,12 +29577,12 @@ function QuillSelectComponent({
|
|
|
29457
29577
|
return 0;
|
|
29458
29578
|
});
|
|
29459
29579
|
}, [options]);
|
|
29460
|
-
const nullLabel = (0,
|
|
29580
|
+
const nullLabel = (0, import_react19.useMemo)(() => {
|
|
29461
29581
|
return sortedItems.some((item) => item.value === "-") ? "None" : "-";
|
|
29462
29582
|
}, [sortedItems]);
|
|
29463
|
-
const [popoverPosition, setPopoverPosition] = (0,
|
|
29464
|
-
const [z, setZ] = (0,
|
|
29465
|
-
const scrollableParentRef = (0,
|
|
29583
|
+
const [popoverPosition, setPopoverPosition] = (0, import_react19.useState)(void 0);
|
|
29584
|
+
const [z, setZ] = (0, import_react19.useState)(10);
|
|
29585
|
+
const scrollableParentRef = (0, import_react19.useRef)(document.body);
|
|
29466
29586
|
const updatePosition = () => {
|
|
29467
29587
|
if (buttonRef.current) {
|
|
29468
29588
|
requestAnimationFrame(() => {
|
|
@@ -29480,7 +29600,7 @@ function QuillSelectComponent({
|
|
|
29480
29600
|
});
|
|
29481
29601
|
}
|
|
29482
29602
|
};
|
|
29483
|
-
(0,
|
|
29603
|
+
(0, import_react19.useEffect)(() => {
|
|
29484
29604
|
let resizeObserver;
|
|
29485
29605
|
let mutationObserver;
|
|
29486
29606
|
if (showModal && buttonRef.current) {
|
|
@@ -29759,25 +29879,25 @@ function QuillDateRangePicker({
|
|
|
29759
29879
|
hidePreset,
|
|
29760
29880
|
disabled
|
|
29761
29881
|
}) {
|
|
29762
|
-
const [theme] = (0,
|
|
29763
|
-
const [client] = (0,
|
|
29764
|
-
const [anchorStartDate, setAnchorStartDate] = (0,
|
|
29882
|
+
const [theme] = (0, import_react20.useContext)(ThemeContext);
|
|
29883
|
+
const [client] = (0, import_react20.useContext)(ClientContext);
|
|
29884
|
+
const [anchorStartDate, setAnchorStartDate] = (0, import_react20.useState)(
|
|
29765
29885
|
getAnchorStartDate(dateRange.startDate, dateRange.endDate)
|
|
29766
29886
|
);
|
|
29767
|
-
const [anchorEndDate, setAnchorEndDate] = (0,
|
|
29887
|
+
const [anchorEndDate, setAnchorEndDate] = (0, import_react20.useState)(
|
|
29768
29888
|
getAnchorEndDate(dateRange.startDate, dateRange.endDate)
|
|
29769
29889
|
);
|
|
29770
|
-
const [localStartDate, setLocalStartDate] = (0,
|
|
29890
|
+
const [localStartDate, setLocalStartDate] = (0, import_react20.useState)(
|
|
29771
29891
|
dateRange.startDate
|
|
29772
29892
|
);
|
|
29773
|
-
const [localEndDate, setLocalEndDate] = (0,
|
|
29893
|
+
const [localEndDate, setLocalEndDate] = (0, import_react20.useState)(
|
|
29774
29894
|
dateRange.endDate
|
|
29775
29895
|
);
|
|
29776
|
-
const [localPreset, setLocalPreset] = (0,
|
|
29777
|
-
const [showModal, setShowModal] = (0,
|
|
29778
|
-
const buttonRef = (0,
|
|
29779
|
-
const modalRef = (0,
|
|
29780
|
-
(0,
|
|
29896
|
+
const [localPreset, setLocalPreset] = (0, import_react20.useState)(preset);
|
|
29897
|
+
const [showModal, setShowModal] = (0, import_react20.useState)(false);
|
|
29898
|
+
const buttonRef = (0, import_react20.useRef)(null);
|
|
29899
|
+
const modalRef = (0, import_react20.useRef)(null);
|
|
29900
|
+
(0, import_react20.useEffect)(() => {
|
|
29781
29901
|
setLocalEndDate(dateRange.endDate);
|
|
29782
29902
|
setLocalStartDate(dateRange.startDate);
|
|
29783
29903
|
setLocalPreset(preset || "");
|
|
@@ -30288,7 +30408,7 @@ function getAnchorEndDate(startDate, endDate) {
|
|
|
30288
30408
|
}
|
|
30289
30409
|
|
|
30290
30410
|
// src/components/QuillMultiSelectWithCombo.tsx
|
|
30291
|
-
var
|
|
30411
|
+
var import_react21 = __toESM(require("react"), 1);
|
|
30292
30412
|
var import_react_dom4 = require("react-dom");
|
|
30293
30413
|
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
30294
30414
|
function QuillMultiSelectComponentWithCombo({
|
|
@@ -30303,35 +30423,35 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30303
30423
|
allSelectedLabel,
|
|
30304
30424
|
style: style2
|
|
30305
30425
|
}) {
|
|
30306
|
-
const [theme] = (0,
|
|
30307
|
-
const [selectedOptions, setSelectedOptions] = (0,
|
|
30308
|
-
const [showModal, setShowModal] = (0,
|
|
30309
|
-
const modalRef = (0,
|
|
30310
|
-
const buttonRef = (0,
|
|
30311
|
-
const debounceTimeoutId = (0,
|
|
30312
|
-
const [searchQuery, setSearchQuery] =
|
|
30313
|
-
const [exceedsLimit, setExceedsLimit] = (0,
|
|
30314
|
-
const [popoverPosition, setPopoverPosition] = (0,
|
|
30315
|
-
const [z, setZ] = (0,
|
|
30316
|
-
const scrollableParentRef = (0,
|
|
30317
|
-
const selectAllRef = (0,
|
|
30426
|
+
const [theme] = (0, import_react21.useContext)(ThemeContext);
|
|
30427
|
+
const [selectedOptions, setSelectedOptions] = (0, import_react21.useState)([]);
|
|
30428
|
+
const [showModal, setShowModal] = (0, import_react21.useState)(false);
|
|
30429
|
+
const modalRef = (0, import_react21.useRef)(null);
|
|
30430
|
+
const buttonRef = (0, import_react21.useRef)(null);
|
|
30431
|
+
const debounceTimeoutId = (0, import_react21.useRef)(null);
|
|
30432
|
+
const [searchQuery, setSearchQuery] = import_react21.default.useState("");
|
|
30433
|
+
const [exceedsLimit, setExceedsLimit] = (0, import_react21.useState)(false);
|
|
30434
|
+
const [popoverPosition, setPopoverPosition] = (0, import_react21.useState)(void 0);
|
|
30435
|
+
const [z, setZ] = (0, import_react21.useState)(10);
|
|
30436
|
+
const scrollableParentRef = (0, import_react21.useRef)(document.body);
|
|
30437
|
+
const selectAllRef = (0, import_react21.useRef)(null);
|
|
30318
30438
|
let CheckboxState;
|
|
30319
30439
|
((CheckboxState2) => {
|
|
30320
30440
|
CheckboxState2[CheckboxState2["SELECTED"] = 0] = "SELECTED";
|
|
30321
30441
|
CheckboxState2[CheckboxState2["UNSELECTED"] = 1] = "UNSELECTED";
|
|
30322
30442
|
CheckboxState2[CheckboxState2["INDETERMINATE"] = 2] = "INDETERMINATE";
|
|
30323
30443
|
})(CheckboxState || (CheckboxState = {}));
|
|
30324
|
-
const optionValues = (0,
|
|
30444
|
+
const optionValues = (0, import_react21.useMemo)(
|
|
30325
30445
|
() => new Set(options.map((opt) => opt.value ?? "")),
|
|
30326
30446
|
[options]
|
|
30327
30447
|
);
|
|
30328
|
-
const potentialOptions = (0,
|
|
30448
|
+
const potentialOptions = (0, import_react21.useMemo)(() => {
|
|
30329
30449
|
return value.filter((opt) => !optionValues.has(opt ?? "")).map((opt) => ({
|
|
30330
30450
|
label: opt === "" ? "-" : opt?.toString() ?? "-",
|
|
30331
30451
|
value: opt ?? ""
|
|
30332
30452
|
})).concat(options);
|
|
30333
30453
|
}, [value, options]);
|
|
30334
|
-
const selectedOptionsLabel = (0,
|
|
30454
|
+
const selectedOptionsLabel = (0, import_react21.useMemo)(() => {
|
|
30335
30455
|
if (!value || !value.length) {
|
|
30336
30456
|
return "Select";
|
|
30337
30457
|
}
|
|
@@ -30348,7 +30468,7 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30348
30468
|
(elem) => elem.label ?? "-"
|
|
30349
30469
|
).join(", ");
|
|
30350
30470
|
}, [options, value]);
|
|
30351
|
-
const [selectAllCheckboxState, setSelectAllCheckboxState] = (0,
|
|
30471
|
+
const [selectAllCheckboxState, setSelectAllCheckboxState] = (0, import_react21.useState)(
|
|
30352
30472
|
(() => {
|
|
30353
30473
|
if (value.length === 0) {
|
|
30354
30474
|
return 1 /* UNSELECTED */;
|
|
@@ -30359,12 +30479,12 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30359
30479
|
return 2 /* INDETERMINATE */;
|
|
30360
30480
|
})()
|
|
30361
30481
|
);
|
|
30362
|
-
(0,
|
|
30482
|
+
(0, import_react21.useEffect)(() => {
|
|
30363
30483
|
if (selectAllRef.current) {
|
|
30364
30484
|
selectAllRef.current.indeterminate = selectAllCheckboxState === 2 /* INDETERMINATE */;
|
|
30365
30485
|
}
|
|
30366
30486
|
}, [selectAllCheckboxState, showModal]);
|
|
30367
|
-
(0,
|
|
30487
|
+
(0, import_react21.useEffect)(() => {
|
|
30368
30488
|
if (options.length > 0 && options?.[0]?.value === "EXCEEDS_LIMIT") {
|
|
30369
30489
|
setExceedsLimit(true);
|
|
30370
30490
|
} else {
|
|
@@ -30379,7 +30499,7 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30379
30499
|
},
|
|
30380
30500
|
showModal
|
|
30381
30501
|
);
|
|
30382
|
-
(0,
|
|
30502
|
+
(0, import_react21.useEffect)(() => {
|
|
30383
30503
|
if (!value) {
|
|
30384
30504
|
setSelectedOptions([]);
|
|
30385
30505
|
} else {
|
|
@@ -30394,7 +30514,7 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30394
30514
|
onChange(updatedChangeEvent);
|
|
30395
30515
|
}, 200);
|
|
30396
30516
|
};
|
|
30397
|
-
const filteredItems =
|
|
30517
|
+
const filteredItems = import_react21.default.useMemo(() => {
|
|
30398
30518
|
if (searchQuery === "") {
|
|
30399
30519
|
return potentialOptions.sort((a, b) => {
|
|
30400
30520
|
if (a.value === null) {
|
|
@@ -30424,7 +30544,7 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30424
30544
|
return 0;
|
|
30425
30545
|
}).slice(0, 20);
|
|
30426
30546
|
}, [potentialOptions, searchQuery]);
|
|
30427
|
-
const nullLabel = (0,
|
|
30547
|
+
const nullLabel = (0, import_react21.useMemo)(() => {
|
|
30428
30548
|
return filteredItems.some((item) => item.value === "-") ? "None" : "-";
|
|
30429
30549
|
}, [filteredItems]);
|
|
30430
30550
|
const updatePosition = () => {
|
|
@@ -30444,7 +30564,7 @@ function QuillMultiSelectComponentWithCombo({
|
|
|
30444
30564
|
});
|
|
30445
30565
|
}
|
|
30446
30566
|
};
|
|
30447
|
-
(0,
|
|
30567
|
+
(0, import_react21.useEffect)(() => {
|
|
30448
30568
|
let resizeObserver;
|
|
30449
30569
|
let mutationObserver;
|
|
30450
30570
|
if (showModal && buttonRef.current) {
|
|
@@ -30878,7 +30998,7 @@ var ListboxTextInput = ({
|
|
|
30878
30998
|
onChange,
|
|
30879
30999
|
placeholder
|
|
30880
31000
|
}) => {
|
|
30881
|
-
const [theme] = (0,
|
|
31001
|
+
const [theme] = (0, import_react21.useContext)(ThemeContext);
|
|
30882
31002
|
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
30883
31003
|
"div",
|
|
30884
31004
|
{
|
|
@@ -30948,7 +31068,7 @@ var ListboxTextInput = ({
|
|
|
30948
31068
|
};
|
|
30949
31069
|
|
|
30950
31070
|
// src/components/QuillSelectWithCombo.tsx
|
|
30951
|
-
var
|
|
31071
|
+
var import_react22 = __toESM(require("react"), 1);
|
|
30952
31072
|
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
30953
31073
|
function QuillSelectComponentWithCombo({
|
|
30954
31074
|
options,
|
|
@@ -30960,12 +31080,12 @@ function QuillSelectComponentWithCombo({
|
|
|
30960
31080
|
hideEmptyOption,
|
|
30961
31081
|
disabled
|
|
30962
31082
|
}) {
|
|
30963
|
-
const [theme] = (0,
|
|
30964
|
-
const [showModal, setShowModal] = (0,
|
|
30965
|
-
const modalRef = (0,
|
|
30966
|
-
const buttonRef = (0,
|
|
30967
|
-
const [searchQuery, setSearchQuery] =
|
|
30968
|
-
const filteredItems =
|
|
31083
|
+
const [theme] = (0, import_react22.useContext)(ThemeContext);
|
|
31084
|
+
const [showModal, setShowModal] = (0, import_react22.useState)(false);
|
|
31085
|
+
const modalRef = (0, import_react22.useRef)(null);
|
|
31086
|
+
const buttonRef = (0, import_react22.useRef)(null);
|
|
31087
|
+
const [searchQuery, setSearchQuery] = import_react22.default.useState("");
|
|
31088
|
+
const filteredItems = import_react22.default.useMemo(() => {
|
|
30969
31089
|
if (searchQuery === "") {
|
|
30970
31090
|
return options?.sort((a, b) => {
|
|
30971
31091
|
if (a.value === null) {
|
|
@@ -30995,10 +31115,10 @@ function QuillSelectComponentWithCombo({
|
|
|
30995
31115
|
return 0;
|
|
30996
31116
|
})?.slice(0, 20) ?? [];
|
|
30997
31117
|
}, [options, searchQuery]);
|
|
30998
|
-
const nullLabel = (0,
|
|
31118
|
+
const nullLabel = (0, import_react22.useMemo)(() => {
|
|
30999
31119
|
return filteredItems.some((item) => item.value === "-") ? "None" : "-";
|
|
31000
31120
|
}, [filteredItems]);
|
|
31001
|
-
const selectedLabel = (0,
|
|
31121
|
+
const selectedLabel = (0, import_react22.useMemo)(() => {
|
|
31002
31122
|
const selectedOption = options?.find((elem) => elem.value === value);
|
|
31003
31123
|
return selectedOption && selectedOption.label == "-" ? nullLabel : selectedOption?.label ?? "Select";
|
|
31004
31124
|
}, [value, options, nullLabel]);
|
|
@@ -31266,7 +31386,7 @@ function DashboardFilter2({
|
|
|
31266
31386
|
disabled,
|
|
31267
31387
|
containerStyle
|
|
31268
31388
|
}) {
|
|
31269
|
-
const preset = (0,
|
|
31389
|
+
const preset = (0, import_react23.useMemo)(() => {
|
|
31270
31390
|
if (
|
|
31271
31391
|
/*'preset' in filter && */
|
|
31272
31392
|
"primaryRange" in filter
|
|
@@ -31467,7 +31587,7 @@ function DashboardFilter2({
|
|
|
31467
31587
|
init_paginationProcessing();
|
|
31468
31588
|
|
|
31469
31589
|
// src/components/Dashboard/MetricComponent.tsx
|
|
31470
|
-
var
|
|
31590
|
+
var import_react24 = require("react");
|
|
31471
31591
|
init_dateRangePickerUtils();
|
|
31472
31592
|
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
31473
31593
|
function QuillMetricComponent({
|
|
@@ -31477,7 +31597,7 @@ function QuillMetricComponent({
|
|
|
31477
31597
|
isLoading,
|
|
31478
31598
|
children
|
|
31479
31599
|
}) {
|
|
31480
|
-
const [theme] = (0,
|
|
31600
|
+
const [theme] = (0, import_react24.useContext)(ThemeContext);
|
|
31481
31601
|
const dateFilter = report?.filtersApplied?.find(
|
|
31482
31602
|
(filter) => filter.filterType === "date_range"
|
|
31483
31603
|
);
|
|
@@ -31751,7 +31871,7 @@ var MetricDisplay = ({
|
|
|
31751
31871
|
};
|
|
31752
31872
|
|
|
31753
31873
|
// src/components/Dashboard/DataLoader.tsx
|
|
31754
|
-
var
|
|
31874
|
+
var import_react25 = require("react");
|
|
31755
31875
|
init_paginationProcessing();
|
|
31756
31876
|
init_tableProcessing();
|
|
31757
31877
|
var import_fast_deep_equal2 = __toESM(require("fast-deep-equal"), 1);
|
|
@@ -31852,29 +31972,29 @@ function DataLoader({
|
|
|
31852
31972
|
dashboardName,
|
|
31853
31973
|
propagateChanges
|
|
31854
31974
|
}) {
|
|
31855
|
-
const [client] = (0,
|
|
31975
|
+
const [client] = (0, import_react25.useContext)(ClientContext);
|
|
31856
31976
|
const {
|
|
31857
31977
|
dashboardReports: dashboard,
|
|
31858
31978
|
addReport,
|
|
31859
31979
|
updateReport
|
|
31860
31980
|
} = useDashboardReports(dashboardName);
|
|
31861
|
-
const { dashboardFilters } = (0,
|
|
31862
|
-
const { tenants, flags } = (0,
|
|
31863
|
-
const { reports, reportsDispatch, fetchIndividualReport } = (0,
|
|
31864
|
-
const { reportFilters } = (0,
|
|
31865
|
-
const { getToken } = (0,
|
|
31866
|
-
const { eventTracking } = (0,
|
|
31867
|
-
const contextFilters = (0,
|
|
31981
|
+
const { dashboardFilters } = (0, import_react25.useContext)(DashboardFiltersContext);
|
|
31982
|
+
const { tenants, flags } = (0, import_react25.useContext)(TenantContext);
|
|
31983
|
+
const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react25.useContext)(ReportsContext);
|
|
31984
|
+
const { reportFilters } = (0, import_react25.useContext)(ReportFiltersContext);
|
|
31985
|
+
const { getToken } = (0, import_react25.useContext)(FetchContext);
|
|
31986
|
+
const { eventTracking } = (0, import_react25.useContext)(EventTrackingContext);
|
|
31987
|
+
const contextFilters = (0, import_react25.useMemo)(() => {
|
|
31868
31988
|
return dashboardName ? Object.values(dashboardFilters[dashboardName] ?? {}).map(
|
|
31869
31989
|
(f) => f.filter
|
|
31870
31990
|
) : Object.values(reportFilters[item.id] ?? {}).map((f) => f.filter);
|
|
31871
31991
|
}, [dashboardFilters, reportFilters, dashboardName, item.id]);
|
|
31872
|
-
const [schemaData] = (0,
|
|
31873
|
-
const [loading, setLoading] = (0,
|
|
31874
|
-
const [error, setError] = (0,
|
|
31875
|
-
const [previousPage, setPreviousPage] = (0,
|
|
31876
|
-
const [additionalProcessing, setAdditionalProcessing] = (0,
|
|
31877
|
-
const chartReport = (0,
|
|
31992
|
+
const [schemaData] = (0, import_react25.useContext)(SchemaDataContext);
|
|
31993
|
+
const [loading, setLoading] = (0, import_react25.useState)(true);
|
|
31994
|
+
const [error, setError] = (0, import_react25.useState)(void 0);
|
|
31995
|
+
const [previousPage, setPreviousPage] = (0, import_react25.useState)(0);
|
|
31996
|
+
const [additionalProcessing, setAdditionalProcessing] = (0, import_react25.useState)(defaultAdditionalProcessing);
|
|
31997
|
+
const chartReport = (0, import_react25.useMemo)(() => {
|
|
31878
31998
|
const report = (dashboardName ? dashboard : reports)[item.id];
|
|
31879
31999
|
if (report) {
|
|
31880
32000
|
return convertInternalReportToReport(
|
|
@@ -31890,17 +32010,17 @@ function DataLoader({
|
|
|
31890
32010
|
reportFilters,
|
|
31891
32011
|
dashboardFilters
|
|
31892
32012
|
]);
|
|
31893
|
-
const previousFilters = (0,
|
|
31894
|
-
const previousUserFilters = (0,
|
|
31895
|
-
const previousTenants = (0,
|
|
31896
|
-
const previousCustomFields = (0,
|
|
31897
|
-
const [rowCountIsLoading, setRowCountIsLoading] = (0,
|
|
31898
|
-
const rowsRequestId = (0,
|
|
31899
|
-
const rowsAbortController = (0,
|
|
31900
|
-
const rowCountRequestId = (0,
|
|
31901
|
-
const rowCountAbortController = (0,
|
|
31902
|
-
const updateTableRowsRequestId = (0,
|
|
31903
|
-
const updateTableRowsAbortController = (0,
|
|
32013
|
+
const previousFilters = (0, import_react25.useRef)(filters);
|
|
32014
|
+
const previousUserFilters = (0, import_react25.useRef)(userFilters);
|
|
32015
|
+
const previousTenants = (0, import_react25.useRef)(tenants);
|
|
32016
|
+
const previousCustomFields = (0, import_react25.useRef)(schemaData.customFields);
|
|
32017
|
+
const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react25.useState)(false);
|
|
32018
|
+
const rowsRequestId = (0, import_react25.useRef)(0);
|
|
32019
|
+
const rowsAbortController = (0, import_react25.useRef)(null);
|
|
32020
|
+
const rowCountRequestId = (0, import_react25.useRef)(0);
|
|
32021
|
+
const rowCountAbortController = (0, import_react25.useRef)(null);
|
|
32022
|
+
const updateTableRowsRequestId = (0, import_react25.useRef)(0);
|
|
32023
|
+
const updateTableRowsAbortController = (0, import_react25.useRef)(null);
|
|
31904
32024
|
const fetchRowCount = async (processing) => {
|
|
31905
32025
|
if (!client || !filters) {
|
|
31906
32026
|
if (!rowCountAbortController.current) return;
|
|
@@ -32167,7 +32287,7 @@ function DataLoader({
|
|
|
32167
32287
|
}
|
|
32168
32288
|
}
|
|
32169
32289
|
};
|
|
32170
|
-
(0,
|
|
32290
|
+
(0, import_react25.useEffect)(() => {
|
|
32171
32291
|
if (schemaData.isSchemaLoading || filterValuesEquivalent(
|
|
32172
32292
|
previousFilters.current ?? contextFilters,
|
|
32173
32293
|
filters
|
|
@@ -32197,7 +32317,7 @@ function DataLoader({
|
|
|
32197
32317
|
schemaData.customFields,
|
|
32198
32318
|
schemaData.isSchemaLoading
|
|
32199
32319
|
]);
|
|
32200
|
-
(0,
|
|
32320
|
+
(0, import_react25.useEffect)(() => {
|
|
32201
32321
|
const tempReport = (dashboardName ? dashboard : reports)[item.id];
|
|
32202
32322
|
if (tempReport?.triggerReload) {
|
|
32203
32323
|
fetchReportHelper(additionalProcessing);
|
|
@@ -32229,29 +32349,29 @@ var ChartDataLoader = ({
|
|
|
32229
32349
|
propagateChanges
|
|
32230
32350
|
}) => {
|
|
32231
32351
|
const { dashboardReports: dashboard, addReport } = useDashboardReports(dashboardName);
|
|
32232
|
-
const { dashboardFilters } = (0,
|
|
32233
|
-
const { reports, fetchIndividualReport } = (0,
|
|
32234
|
-
const { getToken } = (0,
|
|
32235
|
-
const { eventTracking } = (0,
|
|
32236
|
-
const { reportFilters } = (0,
|
|
32237
|
-
const { tenants, flags } = (0,
|
|
32238
|
-
const contextFilters = (0,
|
|
32352
|
+
const { dashboardFilters } = (0, import_react25.useContext)(DashboardFiltersContext);
|
|
32353
|
+
const { reports, fetchIndividualReport } = (0, import_react25.useContext)(ReportsContext);
|
|
32354
|
+
const { getToken } = (0, import_react25.useContext)(FetchContext);
|
|
32355
|
+
const { eventTracking } = (0, import_react25.useContext)(EventTrackingContext);
|
|
32356
|
+
const { reportFilters } = (0, import_react25.useContext)(ReportFiltersContext);
|
|
32357
|
+
const { tenants, flags } = (0, import_react25.useContext)(TenantContext);
|
|
32358
|
+
const contextFilters = (0, import_react25.useMemo)(() => {
|
|
32239
32359
|
return dashboardName ? Object.values(dashboardFilters[dashboardName] ?? {}).map(
|
|
32240
32360
|
(f) => f.filter
|
|
32241
32361
|
) : Object.values(reportFilters[item.id] ?? {}).map((f) => f.filter);
|
|
32242
32362
|
}, [dashboardFilters, reportFilters, dashboardName, item.id]);
|
|
32243
|
-
const [loading, setLoading] = (0,
|
|
32244
|
-
const [error, setError] = (0,
|
|
32245
|
-
const [client] = (0,
|
|
32246
|
-
const [schemaData] = (0,
|
|
32247
|
-
const previousFilters = (0,
|
|
32248
|
-
const previousUserFilters = (0,
|
|
32249
|
-
const previousDateBucket = (0,
|
|
32250
|
-
const previousTenants = (0,
|
|
32251
|
-
const previousCustomFields = (0,
|
|
32252
|
-
const fetchReportAbortController = (0,
|
|
32253
|
-
const rowsRequestId = (0,
|
|
32254
|
-
const chartReport = (0,
|
|
32363
|
+
const [loading, setLoading] = (0, import_react25.useState)(true);
|
|
32364
|
+
const [error, setError] = (0, import_react25.useState)(void 0);
|
|
32365
|
+
const [client] = (0, import_react25.useContext)(ClientContext);
|
|
32366
|
+
const [schemaData] = (0, import_react25.useContext)(SchemaDataContext);
|
|
32367
|
+
const previousFilters = (0, import_react25.useRef)(filters);
|
|
32368
|
+
const previousUserFilters = (0, import_react25.useRef)(userFilters);
|
|
32369
|
+
const previousDateBucket = (0, import_react25.useRef)(dateBucket);
|
|
32370
|
+
const previousTenants = (0, import_react25.useRef)(tenants);
|
|
32371
|
+
const previousCustomFields = (0, import_react25.useRef)(schemaData.customFields);
|
|
32372
|
+
const fetchReportAbortController = (0, import_react25.useRef)(null);
|
|
32373
|
+
const rowsRequestId = (0, import_react25.useRef)(0);
|
|
32374
|
+
const chartReport = (0, import_react25.useMemo)(() => {
|
|
32255
32375
|
const report = dashboardName ? dashboard[item.id] : reports[item.id];
|
|
32256
32376
|
if (!report) {
|
|
32257
32377
|
return constructReportFromItem(item);
|
|
@@ -32363,7 +32483,7 @@ var ChartDataLoader = ({
|
|
|
32363
32483
|
}
|
|
32364
32484
|
}
|
|
32365
32485
|
};
|
|
32366
|
-
(0,
|
|
32486
|
+
(0, import_react25.useEffect)(() => {
|
|
32367
32487
|
if (!filters) {
|
|
32368
32488
|
return;
|
|
32369
32489
|
}
|
|
@@ -32398,7 +32518,7 @@ var ChartDataLoader = ({
|
|
|
32398
32518
|
schemaData.customFields,
|
|
32399
32519
|
schemaData.isSchemaLoading
|
|
32400
32520
|
]);
|
|
32401
|
-
(0,
|
|
32521
|
+
(0, import_react25.useEffect)(() => {
|
|
32402
32522
|
const tempReport = (dashboardName ? dashboard : reports)[item.id];
|
|
32403
32523
|
if (tempReport && tempReport.triggerReload) {
|
|
32404
32524
|
fetchReportHelper();
|
|
@@ -32421,9 +32541,9 @@ var ChartDataLoader = ({
|
|
|
32421
32541
|
init_dateRangePickerUtils();
|
|
32422
32542
|
|
|
32423
32543
|
// src/hooks/useReport.ts
|
|
32424
|
-
var
|
|
32544
|
+
var import_react26 = require("react");
|
|
32425
32545
|
var useReports = () => {
|
|
32426
|
-
const [dashboard, dispatch2] = (0,
|
|
32546
|
+
const [dashboard, dispatch2] = (0, import_react26.useContext)(DashboardContext);
|
|
32427
32547
|
const reloadFilteredReports = (predicate) => {
|
|
32428
32548
|
for (const dashboardName of Object.keys(dashboard)) {
|
|
32429
32549
|
for (const id2 of Object.keys(dashboard[dashboardName])) {
|
|
@@ -32443,7 +32563,7 @@ var useReports = () => {
|
|
|
32443
32563
|
};
|
|
32444
32564
|
};
|
|
32445
32565
|
var useReportInternal = (reportId) => {
|
|
32446
|
-
const { loadFiltersForReport } = (0,
|
|
32566
|
+
const { loadFiltersForReport } = (0, import_react26.useContext)(ReportFiltersContext);
|
|
32447
32567
|
const { allReportsById } = useAllReports();
|
|
32448
32568
|
const reload = async (overrideFilters, customFilters = [], initiator = "Chart") => {
|
|
32449
32569
|
const dateFilter = overrideFilters.filters.find(
|
|
@@ -32475,7 +32595,7 @@ var import_fast_deep_equal3 = __toESM(require("fast-deep-equal"), 1);
|
|
|
32475
32595
|
|
|
32476
32596
|
// src/components/Chart/MapChart.tsx
|
|
32477
32597
|
var import_react_simple_maps = require("react-simple-maps");
|
|
32478
|
-
var
|
|
32598
|
+
var import_react27 = require("react");
|
|
32479
32599
|
init_valueFormatter();
|
|
32480
32600
|
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
32481
32601
|
var statesUrl = "https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json";
|
|
@@ -32802,23 +32922,23 @@ function USMap({
|
|
|
32802
32922
|
className,
|
|
32803
32923
|
containerStyle
|
|
32804
32924
|
}) {
|
|
32805
|
-
const containerRef = (0,
|
|
32806
|
-
const [hoveredState, setHoveredState] = (0,
|
|
32925
|
+
const containerRef = (0, import_react27.useRef)(null);
|
|
32926
|
+
const [hoveredState, setHoveredState] = (0, import_react27.useState)(
|
|
32807
32927
|
void 0
|
|
32808
32928
|
);
|
|
32809
|
-
const [hoveredCoords, setHoveredCoords] = (0,
|
|
32929
|
+
const [hoveredCoords, setHoveredCoords] = (0, import_react27.useState)(void 0);
|
|
32810
32930
|
const mappedData = data.reduce((acc, curr) => {
|
|
32811
32931
|
acc[curr[xAxisField]?.toString()] = curr;
|
|
32812
32932
|
return acc;
|
|
32813
32933
|
}, {});
|
|
32814
32934
|
const measureField = yAxisFields[0]?.field ?? xAxisField;
|
|
32815
|
-
const [scaleLog, setScaleLog] = (0,
|
|
32816
|
-
(0,
|
|
32935
|
+
const [scaleLog, setScaleLog] = (0, import_react27.useState)(null);
|
|
32936
|
+
(0, import_react27.useEffect)(() => {
|
|
32817
32937
|
import("d3-scale").then((scale) => {
|
|
32818
32938
|
setScaleLog(() => scale.scaleLog);
|
|
32819
32939
|
});
|
|
32820
32940
|
}, []);
|
|
32821
|
-
const colorScale = (0,
|
|
32941
|
+
const colorScale = (0, import_react27.useMemo)(() => {
|
|
32822
32942
|
if (!scaleLog) return () => "#FFFFFF";
|
|
32823
32943
|
const values = Object.values(mappedData).map((d) => parseFloat(d[measureField])).filter((v) => !isNaN(v));
|
|
32824
32944
|
const minValue = Math.min(...values);
|
|
@@ -32844,7 +32964,7 @@ function USMap({
|
|
|
32844
32964
|
colors,
|
|
32845
32965
|
scaleLog
|
|
32846
32966
|
]);
|
|
32847
|
-
const hoveredValue = (0,
|
|
32967
|
+
const hoveredValue = (0, import_react27.useMemo)(() => {
|
|
32848
32968
|
return !hoveredState ? void 0 : mappedData[fipsToNames[hoveredState]?.abbreviation ?? ""]?.[measureField] ?? mappedData[fipsToNames[hoveredState]?.name ?? ""]?.[measureField] ?? mappedData[fipsToNames[hoveredState]?.abbreviation?.toLowerCase() ?? ""]?.[measureField] ?? mappedData[fipsToNames[hoveredState]?.name?.toLowerCase() ?? ""]?.[measureField];
|
|
32849
32969
|
}, [hoveredState, mappedData, measureField]);
|
|
32850
32970
|
if (!measureField) {
|
|
@@ -32993,23 +33113,23 @@ function WorldMap({
|
|
|
32993
33113
|
className,
|
|
32994
33114
|
containerStyle
|
|
32995
33115
|
}) {
|
|
32996
|
-
const containerRef = (0,
|
|
32997
|
-
const [hoveredCountry, setHoveredCountry] = (0,
|
|
33116
|
+
const containerRef = (0, import_react27.useRef)(null);
|
|
33117
|
+
const [hoveredCountry, setHoveredCountry] = (0, import_react27.useState)(
|
|
32998
33118
|
void 0
|
|
32999
33119
|
);
|
|
33000
|
-
const [hoveredCoords, setHoveredCoords] = (0,
|
|
33120
|
+
const [hoveredCoords, setHoveredCoords] = (0, import_react27.useState)(void 0);
|
|
33001
33121
|
const mappedData = data.reduce((acc, curr) => {
|
|
33002
33122
|
acc[curr[xAxisField]?.toString()] = curr;
|
|
33003
33123
|
return acc;
|
|
33004
33124
|
}, {});
|
|
33005
33125
|
const measureField = yAxisFields[0]?.field ?? xAxisField;
|
|
33006
|
-
const [scaleLog, setScaleLog] = (0,
|
|
33007
|
-
(0,
|
|
33126
|
+
const [scaleLog, setScaleLog] = (0, import_react27.useState)(null);
|
|
33127
|
+
(0, import_react27.useEffect)(() => {
|
|
33008
33128
|
import("d3-scale").then((scale) => {
|
|
33009
33129
|
setScaleLog(() => scale.scaleLog);
|
|
33010
33130
|
});
|
|
33011
33131
|
}, []);
|
|
33012
|
-
const colorScale = (0,
|
|
33132
|
+
const colorScale = (0, import_react27.useMemo)(() => {
|
|
33013
33133
|
if (!scaleLog) return () => "#FFFFFF";
|
|
33014
33134
|
const values = Object.values(mappedData).map((d) => parseFloat(d[measureField])).filter((v) => !isNaN(v));
|
|
33015
33135
|
const minValue = Math.min(...values);
|
|
@@ -33035,7 +33155,7 @@ function WorldMap({
|
|
|
33035
33155
|
colors,
|
|
33036
33156
|
scaleLog
|
|
33037
33157
|
]);
|
|
33038
|
-
const hoveredValue = (0,
|
|
33158
|
+
const hoveredValue = (0, import_react27.useMemo)(() => {
|
|
33039
33159
|
return !hoveredCountry ? void 0 : mappedData[isoToNames[hoveredCountry]?.abbreviation ?? ""]?.[measureField] ?? mappedData[isoToNames[hoveredCountry]?.name ?? ""]?.[measureField] ?? mappedData[isoToNames[hoveredCountry]?.abbreviation?.toLowerCase() ?? ""]?.[measureField] ?? mappedData[isoToNames[hoveredCountry]?.name?.toLowerCase() ?? ""]?.[measureField];
|
|
33040
33160
|
}, [hoveredCountry, mappedData, measureField]);
|
|
33041
33161
|
if (!measureField) {
|
|
@@ -33186,8 +33306,8 @@ function MapLayout({
|
|
|
33186
33306
|
regionNames
|
|
33187
33307
|
}) {
|
|
33188
33308
|
const { projection } = (0, import_react_simple_maps.useMapContext)();
|
|
33189
|
-
const [geoCentroid, setGeoCentroid] = (0,
|
|
33190
|
-
(0,
|
|
33309
|
+
const [geoCentroid, setGeoCentroid] = (0, import_react27.useState)(null);
|
|
33310
|
+
(0, import_react27.useEffect)(() => {
|
|
33191
33311
|
import("d3-geo").then((geo) => {
|
|
33192
33312
|
setGeoCentroid(() => geo.geoCentroid);
|
|
33193
33313
|
});
|
|
@@ -33239,7 +33359,7 @@ function MapLayout({
|
|
|
33239
33359
|
}
|
|
33240
33360
|
|
|
33241
33361
|
// src/components/Chart/GaugeChart.tsx
|
|
33242
|
-
var
|
|
33362
|
+
var import_react28 = require("react");
|
|
33243
33363
|
|
|
33244
33364
|
// ../../node_modules/d3-transition/src/selection/index.js
|
|
33245
33365
|
var import_d3_selection9 = require("d3-selection");
|
|
@@ -34513,20 +34633,20 @@ function D3Gauge({
|
|
|
34513
34633
|
colors,
|
|
34514
34634
|
isAnimationActive
|
|
34515
34635
|
}) {
|
|
34516
|
-
const containerRef = (0,
|
|
34517
|
-
const svgRef = (0,
|
|
34518
|
-
const gaugeGroupRef = (0,
|
|
34519
|
-
const needleRef = (0,
|
|
34520
|
-
const needleOutlineRef = (0,
|
|
34521
|
-
const textRef = (0,
|
|
34522
|
-
const previousPercentageRef = (0,
|
|
34523
|
-
const firstMountRef = (0,
|
|
34636
|
+
const containerRef = (0, import_react28.useRef)(null);
|
|
34637
|
+
const svgRef = (0, import_react28.useRef)(null);
|
|
34638
|
+
const gaugeGroupRef = (0, import_react28.useRef)(null);
|
|
34639
|
+
const needleRef = (0, import_react28.useRef)(null);
|
|
34640
|
+
const needleOutlineRef = (0, import_react28.useRef)(null);
|
|
34641
|
+
const textRef = (0, import_react28.useRef)(null);
|
|
34642
|
+
const previousPercentageRef = (0, import_react28.useRef)(0);
|
|
34643
|
+
const firstMountRef = (0, import_react28.useRef)(true);
|
|
34524
34644
|
const startAngle = -(3 * Math.PI) / 4;
|
|
34525
34645
|
const totalAngle = 3 * Math.PI / 2;
|
|
34526
|
-
const [arc, setArc] = (0,
|
|
34527
|
-
const [interpolate, setInterpolate] = (0,
|
|
34528
|
-
const [select, setSelect] = (0,
|
|
34529
|
-
(0,
|
|
34646
|
+
const [arc, setArc] = (0, import_react28.useState)(null);
|
|
34647
|
+
const [interpolate, setInterpolate] = (0, import_react28.useState)(null);
|
|
34648
|
+
const [select, setSelect] = (0, import_react28.useState)(null);
|
|
34649
|
+
(0, import_react28.useEffect)(() => {
|
|
34530
34650
|
import("d3-shape").then(({ arc: arc2 }) => {
|
|
34531
34651
|
setArc(() => arc2);
|
|
34532
34652
|
});
|
|
@@ -34537,7 +34657,7 @@ function D3Gauge({
|
|
|
34537
34657
|
setSelect(() => select2);
|
|
34538
34658
|
});
|
|
34539
34659
|
}, []);
|
|
34540
|
-
(0,
|
|
34660
|
+
(0, import_react28.useEffect)(() => {
|
|
34541
34661
|
if (!containerRef.current || !select) return;
|
|
34542
34662
|
const container = containerRef.current;
|
|
34543
34663
|
select(container).select("svg").remove();
|
|
@@ -34554,7 +34674,7 @@ function D3Gauge({
|
|
|
34554
34674
|
svgRef.current = null;
|
|
34555
34675
|
};
|
|
34556
34676
|
}, [colors, select]);
|
|
34557
|
-
(0,
|
|
34677
|
+
(0, import_react28.useEffect)(() => {
|
|
34558
34678
|
if (!containerRef.current || !svgRef.current || !gaugeGroupRef.current || !needleRef.current || !needleOutlineRef.current || !textRef.current || !arc || !interpolate || !select)
|
|
34559
34679
|
return;
|
|
34560
34680
|
const rect = containerRef.current.getBoundingClientRect();
|
|
@@ -34654,7 +34774,7 @@ function D3Gauge({
|
|
|
34654
34774
|
arc,
|
|
34655
34775
|
interpolate
|
|
34656
34776
|
]);
|
|
34657
|
-
(0,
|
|
34777
|
+
(0, import_react28.useEffect)(() => {
|
|
34658
34778
|
if (!containerRef.current) return;
|
|
34659
34779
|
const observer = new ResizeObserver(() => {
|
|
34660
34780
|
previousPercentageRef.current = percentage;
|
|
@@ -34672,7 +34792,7 @@ function D3Gauge({
|
|
|
34672
34792
|
}
|
|
34673
34793
|
|
|
34674
34794
|
// src/components/QuillComponentTables.tsx
|
|
34675
|
-
var
|
|
34795
|
+
var import_react29 = require("react");
|
|
34676
34796
|
init_paginationProcessing();
|
|
34677
34797
|
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
34678
34798
|
var QuillTableSQLEditorComponent = ({
|
|
@@ -34689,8 +34809,8 @@ var QuillTableSQLEditorComponent = ({
|
|
|
34689
34809
|
setCurrentPage,
|
|
34690
34810
|
hideLabels
|
|
34691
34811
|
}) => {
|
|
34692
|
-
const [sort, setSort] = (0,
|
|
34693
|
-
const [page, setPage] = (0,
|
|
34812
|
+
const [sort, setSort] = (0, import_react29.useState)({ field: "", direction: "" });
|
|
34813
|
+
const [page, setPage] = (0, import_react29.useState)(0);
|
|
34694
34814
|
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
34695
34815
|
QuillTable,
|
|
34696
34816
|
{
|
|
@@ -34732,9 +34852,9 @@ var QuillTableReportBuilderComponent = ({
|
|
|
34732
34852
|
setCurrentPage,
|
|
34733
34853
|
disableSort
|
|
34734
34854
|
}) => {
|
|
34735
|
-
const [sort, setSort] = (0,
|
|
34736
|
-
const [page, setPage] = (0,
|
|
34737
|
-
(0,
|
|
34855
|
+
const [sort, setSort] = (0, import_react29.useState)({ field: "", direction: "" });
|
|
34856
|
+
const [page, setPage] = (0, import_react29.useState)(0);
|
|
34857
|
+
(0, import_react29.useEffect)(() => {
|
|
34738
34858
|
if (disableSort) {
|
|
34739
34859
|
setSort({ field: "", direction: "" });
|
|
34740
34860
|
}
|
|
@@ -34778,15 +34898,15 @@ var QuillTableComponent = ({
|
|
|
34778
34898
|
currentPage,
|
|
34779
34899
|
hideLabels
|
|
34780
34900
|
}) => {
|
|
34781
|
-
const [sort, setSort] = (0,
|
|
34782
|
-
const [page, setPage] = (0,
|
|
34783
|
-
const [initialLoad, setInitialLoad] = (0,
|
|
34784
|
-
(0,
|
|
34901
|
+
const [sort, setSort] = (0, import_react29.useState)({ field: "", direction: "" });
|
|
34902
|
+
const [page, setPage] = (0, import_react29.useState)(0);
|
|
34903
|
+
const [initialLoad, setInitialLoad] = (0, import_react29.useState)(true);
|
|
34904
|
+
(0, import_react29.useEffect)(() => {
|
|
34785
34905
|
if (initialLoad && !isLoading) {
|
|
34786
34906
|
setInitialLoad(false);
|
|
34787
34907
|
}
|
|
34788
34908
|
}, [isLoading]);
|
|
34789
|
-
(0,
|
|
34909
|
+
(0, import_react29.useEffect)(() => {
|
|
34790
34910
|
setPage(currentPage || 0);
|
|
34791
34911
|
}, [currentPage]);
|
|
34792
34912
|
if (initialLoad) {
|
|
@@ -34839,16 +34959,16 @@ function QuillTableDashboardComponent({
|
|
|
34839
34959
|
onSortChange,
|
|
34840
34960
|
hideName
|
|
34841
34961
|
}) {
|
|
34842
|
-
const [theme] = (0,
|
|
34843
|
-
const [initialLoad, setInitialLoad] = (0,
|
|
34962
|
+
const [theme] = (0, import_react29.useContext)(ThemeContext);
|
|
34963
|
+
const [initialLoad, setInitialLoad] = (0, import_react29.useState)(true);
|
|
34844
34964
|
const { downloadCSV: downloadCSV2 } = useExport(report?.id);
|
|
34845
|
-
const [page, setPage] = (0,
|
|
34846
|
-
(0,
|
|
34965
|
+
const [page, setPage] = (0, import_react29.useState)(0);
|
|
34966
|
+
(0, import_react29.useEffect)(() => {
|
|
34847
34967
|
if (!isLoading) {
|
|
34848
34968
|
setInitialLoad(false);
|
|
34849
34969
|
}
|
|
34850
34970
|
}, [isLoading]);
|
|
34851
|
-
(0,
|
|
34971
|
+
(0, import_react29.useEffect)(() => {
|
|
34852
34972
|
if (rowCountIsLoading) {
|
|
34853
34973
|
setPage(0);
|
|
34854
34974
|
}
|
|
@@ -34984,50 +35104,50 @@ function Chart({
|
|
|
34984
35104
|
dateBucket,
|
|
34985
35105
|
propagateChanges
|
|
34986
35106
|
}) {
|
|
34987
|
-
const [schemaData] = (0,
|
|
35107
|
+
const [schemaData] = (0, import_react30.useContext)(SchemaDataContext);
|
|
34988
35108
|
const { reload } = useReportInternal(reportId);
|
|
34989
|
-
const { reports, reportsDispatch, fetchIndividualReport } = (0,
|
|
35109
|
+
const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react30.useContext)(ReportsContext);
|
|
34990
35110
|
const {
|
|
34991
35111
|
reportFiltersDispatch,
|
|
34992
35112
|
reportFilters,
|
|
34993
35113
|
customReportFiltersDispatch,
|
|
34994
35114
|
customReportFilters
|
|
34995
|
-
} = (0,
|
|
34996
|
-
const { eventTracking } = (0,
|
|
34997
|
-
const { isLoading: isDashboardsLoading } = (0,
|
|
34998
|
-
const { dashboardCustomFilters } = (0,
|
|
35115
|
+
} = (0, import_react30.useContext)(ReportFiltersContext);
|
|
35116
|
+
const { eventTracking } = (0, import_react30.useContext)(EventTrackingContext);
|
|
35117
|
+
const { isLoading: isDashboardsLoading } = (0, import_react30.useContext)(DashboardConfigContext);
|
|
35118
|
+
const { dashboardCustomFilters } = (0, import_react30.useContext)(DashboardFiltersContext);
|
|
34999
35119
|
const { allReportsById } = useAllReports();
|
|
35000
35120
|
const { dashboardFilters } = useDashboardInternal(
|
|
35001
35121
|
allReportsById[reportId]?.dashboardName ?? null
|
|
35002
35122
|
);
|
|
35003
|
-
const specificReportFilters = (0,
|
|
35123
|
+
const specificReportFilters = (0, import_react30.useMemo)(() => {
|
|
35004
35124
|
const reportFilterValues = reportFilters[reportId];
|
|
35005
35125
|
if (reportFilterValues && !hideFilters)
|
|
35006
35126
|
return Object.values(reportFilterValues ?? {}).map((f) => f.filter);
|
|
35007
35127
|
if (allReportsById[reportId]) return dashboardFilters ?? [];
|
|
35008
35128
|
return [];
|
|
35009
35129
|
}, [reportFilters[reportId], allReportsById[reportId], dashboardFilters]);
|
|
35010
|
-
const reportDateFilter = (0,
|
|
35130
|
+
const reportDateFilter = (0, import_react30.useMemo)(() => {
|
|
35011
35131
|
return specificReportFilters.find((f) => f.filterType === "date_range");
|
|
35012
35132
|
}, [specificReportFilters]);
|
|
35013
|
-
const presetOptions = (0,
|
|
35133
|
+
const presetOptions = (0, import_react30.useMemo)(() => {
|
|
35014
35134
|
return reportDateFilter ? convertPresetOptionsToSelectableList(
|
|
35015
35135
|
reportDateFilter.presetOptions ?? [],
|
|
35016
35136
|
reportDateFilter.defaultPresetRanges ?? []
|
|
35017
35137
|
) : defaultOptionsV2;
|
|
35018
35138
|
}, [reportDateFilter]);
|
|
35019
|
-
const userFilters = (0,
|
|
35139
|
+
const userFilters = (0, import_react30.useMemo)(() => {
|
|
35020
35140
|
return filters?.filter((f) => f.filterType !== "date" /* Date */)?.map(convertCustomFilter) ?? dashboardCustomFilters[allReportsById[reportId]?.dashboardName ?? ""];
|
|
35021
35141
|
}, [
|
|
35022
35142
|
filters,
|
|
35023
35143
|
dashboardCustomFilters[allReportsById[reportId]?.dashboardName ?? ""]
|
|
35024
35144
|
]);
|
|
35025
|
-
const previousFilters = (0,
|
|
35145
|
+
const previousFilters = (0, import_react30.useRef)(void 0);
|
|
35026
35146
|
if (!(0, import_fast_deep_equal3.default)(previousFilters.current, filters)) {
|
|
35027
35147
|
previousFilters.current = filters;
|
|
35028
35148
|
}
|
|
35029
|
-
const [filterValues, setFilterValues] = (0,
|
|
35030
|
-
(0,
|
|
35149
|
+
const [filterValues, setFilterValues] = (0, import_react30.useState)({});
|
|
35150
|
+
(0, import_react30.useEffect)(() => {
|
|
35031
35151
|
setFilterValues(
|
|
35032
35152
|
Object.values(reportFilters[reportId] ?? {}).reduce((acc, f) => {
|
|
35033
35153
|
acc[f.filter.label] = f.filter.filterType === "string" ? f.filter.stringFilterType === "multiselect" ? { values: f.filter.values, operator: "IN" } : { selectedValue: f.filter.selectedValue } : f.filter.filterType === "date_range" ? {
|
|
@@ -35042,7 +35162,7 @@ function Chart({
|
|
|
35042
35162
|
}, {})
|
|
35043
35163
|
);
|
|
35044
35164
|
}, [reportFilters[reportId]]);
|
|
35045
|
-
(0,
|
|
35165
|
+
(0, import_react30.useEffect)(() => {
|
|
35046
35166
|
if ((0, import_fast_deep_equal3.default)(customReportFilters[reportId] ?? [], filters ?? [])) {
|
|
35047
35167
|
return;
|
|
35048
35168
|
}
|
|
@@ -35058,7 +35178,7 @@ function Chart({
|
|
|
35058
35178
|
});
|
|
35059
35179
|
};
|
|
35060
35180
|
}, [filters]);
|
|
35061
|
-
(0,
|
|
35181
|
+
(0, import_react30.useEffect)(() => {
|
|
35062
35182
|
if (reportDateFilter) {
|
|
35063
35183
|
const customDateFilter = previousFilters.current?.find(
|
|
35064
35184
|
(f) => f.filterType === "date" /* Date */
|
|
@@ -35091,20 +35211,20 @@ function Chart({
|
|
|
35091
35211
|
});
|
|
35092
35212
|
}
|
|
35093
35213
|
}, [previousFilters.current]);
|
|
35094
|
-
const dashboardReport = (0,
|
|
35214
|
+
const dashboardReport = (0, import_react30.useMemo)(
|
|
35095
35215
|
() => allReportsById[reportId],
|
|
35096
35216
|
[reportId, allReportsById]
|
|
35097
35217
|
);
|
|
35098
|
-
const report = (0,
|
|
35099
|
-
const [loading, setLoading] = (0,
|
|
35100
|
-
const [theme] = (0,
|
|
35101
|
-
const colorMap = (0,
|
|
35218
|
+
const report = (0, import_react30.useMemo)(() => reports[reportId], [reports, reportId]);
|
|
35219
|
+
const [loading, setLoading] = (0, import_react30.useState)(true);
|
|
35220
|
+
const [theme] = (0, import_react30.useContext)(ThemeContext);
|
|
35221
|
+
const colorMap = (0, import_react30.useMemo)(() => {
|
|
35102
35222
|
if (mapColorsToFields && report && theme) {
|
|
35103
35223
|
return mapColorsToFields(report, theme);
|
|
35104
35224
|
}
|
|
35105
35225
|
}, [report, theme]);
|
|
35106
|
-
const [client, clientLoading] = (0,
|
|
35107
|
-
const [error, setError] = (0,
|
|
35226
|
+
const [client, clientLoading] = (0, import_react30.useContext)(ClientContext);
|
|
35227
|
+
const [error, setError] = (0, import_react30.useState)(void 0);
|
|
35108
35228
|
const updateFilter = (filter, value, comparison) => {
|
|
35109
35229
|
let filterValue = {};
|
|
35110
35230
|
if (filter.filterType === "string" /* String */) {
|
|
@@ -35214,7 +35334,7 @@ function Chart({
|
|
|
35214
35334
|
setLoading(false);
|
|
35215
35335
|
}
|
|
35216
35336
|
};
|
|
35217
|
-
(0,
|
|
35337
|
+
(0, import_react30.useEffect)(() => {
|
|
35218
35338
|
if (reportId === void 0 || reportId === "" || clientLoading || isDashboardsLoading) {
|
|
35219
35339
|
return;
|
|
35220
35340
|
}
|
|
@@ -35402,11 +35522,11 @@ var ChartDisplay = ({
|
|
|
35402
35522
|
tableRowsLoading = false
|
|
35403
35523
|
}) => {
|
|
35404
35524
|
const { downloadCSV: downloadCSV2 } = useExport(reportId);
|
|
35405
|
-
const [theme] = (0,
|
|
35406
|
-
const { reports } = (0,
|
|
35407
|
-
const { dashboardFilters } = (0,
|
|
35408
|
-
const { reportFilters } = (0,
|
|
35409
|
-
const specificDashboardFilters = (0,
|
|
35525
|
+
const [theme] = (0, import_react30.useContext)(ThemeContext);
|
|
35526
|
+
const { reports } = (0, import_react30.useContext)(ReportsContext);
|
|
35527
|
+
const { dashboardFilters } = (0, import_react30.useContext)(DashboardFiltersContext);
|
|
35528
|
+
const { reportFilters } = (0, import_react30.useContext)(ReportFiltersContext);
|
|
35529
|
+
const specificDashboardFilters = (0, import_react30.useMemo)(() => {
|
|
35410
35530
|
if (!reportId) return [];
|
|
35411
35531
|
const dashboardName = reports[reportId]?.dashboardName || config?.dashboardName;
|
|
35412
35532
|
if (!dashboardName) return [];
|
|
@@ -35414,24 +35534,24 @@ var ChartDisplay = ({
|
|
|
35414
35534
|
(f) => f.filter
|
|
35415
35535
|
);
|
|
35416
35536
|
}, [dashboardFilters, reportId, reports]);
|
|
35417
|
-
const specificReportFilters = (0,
|
|
35537
|
+
const specificReportFilters = (0, import_react30.useMemo)(() => {
|
|
35418
35538
|
if (!reportId) return [];
|
|
35419
35539
|
return Object.values(reportFilters[reportId] ?? []).map((f) => f.filter);
|
|
35420
35540
|
}, [reportFilters, reportId]);
|
|
35421
|
-
const chartColors = (0,
|
|
35541
|
+
const chartColors = (0, import_react30.useMemo)(() => {
|
|
35422
35542
|
if (overrideTheme && overrideTheme.chartColors) {
|
|
35423
35543
|
return colors?.length ? colors : overrideTheme && overrideTheme.chartColors && overrideTheme.chartColors.length ? overrideTheme.chartColors : ["#4E80EE", "#E14F62", "#55B5A6", "#E9A23B", "#6466E9", "#55B685"];
|
|
35424
35544
|
}
|
|
35425
35545
|
return colors?.length ? colors : theme && theme.chartColors && theme.chartColors.length ? theme.chartColors : ["#4E80EE", "#E14F62", "#55B5A6", "#E9A23B", "#6466E9", "#55B685"];
|
|
35426
35546
|
}, [colors]);
|
|
35427
|
-
const dateFilter = (0,
|
|
35547
|
+
const dateFilter = (0, import_react30.useMemo)(() => {
|
|
35428
35548
|
const filters = specificReportFilters.length > 0 ? specificReportFilters : specificDashboardFilters;
|
|
35429
35549
|
if (!hideDateRangeFilter && filters) {
|
|
35430
35550
|
return findAndProcessDateFilter(filters.map((f) => f));
|
|
35431
35551
|
}
|
|
35432
35552
|
return void 0;
|
|
35433
35553
|
}, [config, specificReportFilters, specificDashboardFilters]);
|
|
35434
|
-
const [page, setPage] = (0,
|
|
35554
|
+
const [page, setPage] = (0, import_react30.useState)(0);
|
|
35435
35555
|
if (loading) {
|
|
35436
35556
|
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(LoadingComponent, {}) });
|
|
35437
35557
|
} else if (config && !["metric", "table", "gauge", "US map", "World map"].includes(
|
|
@@ -35749,7 +35869,7 @@ function DashboardSectionContainer({
|
|
|
35749
35869
|
}
|
|
35750
35870
|
|
|
35751
35871
|
// src/components/Dashboard/ChartComponent.tsx
|
|
35752
|
-
var
|
|
35872
|
+
var import_react31 = require("react");
|
|
35753
35873
|
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
35754
35874
|
function QuillChartComponent({
|
|
35755
35875
|
report,
|
|
@@ -35758,7 +35878,7 @@ function QuillChartComponent({
|
|
|
35758
35878
|
children,
|
|
35759
35879
|
isLoading
|
|
35760
35880
|
}) {
|
|
35761
|
-
const [theme] = (0,
|
|
35881
|
+
const [theme] = (0, import_react31.useContext)(ThemeContext);
|
|
35762
35882
|
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
35763
35883
|
"div",
|
|
35764
35884
|
{
|
|
@@ -35875,7 +35995,7 @@ function QuillChartComponent({
|
|
|
35875
35995
|
}
|
|
35876
35996
|
|
|
35877
35997
|
// src/components/Dashboard/TemplateChartComponent.tsx
|
|
35878
|
-
var
|
|
35998
|
+
var import_react32 = require("react");
|
|
35879
35999
|
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
35880
36000
|
function QuillTemplateChartComponent({
|
|
35881
36001
|
report,
|
|
@@ -35883,7 +36003,7 @@ function QuillTemplateChartComponent({
|
|
|
35883
36003
|
children,
|
|
35884
36004
|
isLoading
|
|
35885
36005
|
}) {
|
|
35886
|
-
const [isSelected, setIsSelected] = (0,
|
|
36006
|
+
const [isSelected, setIsSelected] = (0, import_react32.useState)(false);
|
|
35887
36007
|
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
35888
36008
|
"div",
|
|
35889
36009
|
{
|
|
@@ -35912,13 +36032,13 @@ function QuillTemplateChartComponent({
|
|
|
35912
36032
|
}
|
|
35913
36033
|
|
|
35914
36034
|
// src/components/Dashboard/DashboardSection.tsx
|
|
35915
|
-
var
|
|
36035
|
+
var import_react33 = require("react");
|
|
35916
36036
|
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
35917
36037
|
function DashboardSection({
|
|
35918
36038
|
section,
|
|
35919
36039
|
children
|
|
35920
36040
|
}) {
|
|
35921
|
-
const [theme] = (0,
|
|
36041
|
+
const [theme] = (0, import_react33.useContext)(ThemeContext);
|
|
35922
36042
|
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
|
|
35923
36043
|
section && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { style: { display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
35924
36044
|
"h1",
|
|
@@ -35967,12 +36087,12 @@ init_tableProcessing();
|
|
|
35967
36087
|
init_filterProcessing();
|
|
35968
36088
|
|
|
35969
36089
|
// src/components/ReportBuilder/ui.tsx
|
|
35970
|
-
var
|
|
36090
|
+
var import_react34 = require("react");
|
|
35971
36091
|
init_util();
|
|
35972
36092
|
init_tableProcessing();
|
|
35973
36093
|
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
35974
36094
|
var QuillSecondaryButton = ({ children, ...props }) => {
|
|
35975
|
-
const [theme] = (0,
|
|
36095
|
+
const [theme] = (0, import_react34.useContext)(ThemeContext);
|
|
35976
36096
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
35977
36097
|
"button",
|
|
35978
36098
|
{
|
|
@@ -35998,9 +36118,9 @@ var QuillSecondaryButton = ({ children, ...props }) => {
|
|
|
35998
36118
|
}
|
|
35999
36119
|
);
|
|
36000
36120
|
};
|
|
36001
|
-
var QuillTag = (0,
|
|
36121
|
+
var QuillTag = (0, import_react34.forwardRef)(
|
|
36002
36122
|
({ label, onClick, children, onClickDelete, hideDelete = false }, forwardedRef) => {
|
|
36003
|
-
const [theme] = (0,
|
|
36123
|
+
const [theme] = (0, import_react34.useContext)(ThemeContext);
|
|
36004
36124
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
36005
36125
|
"div",
|
|
36006
36126
|
{
|
|
@@ -36081,7 +36201,7 @@ var QuillTag = (0, import_react33.forwardRef)(
|
|
|
36081
36201
|
var QuillSidebarHeading = ({
|
|
36082
36202
|
label
|
|
36083
36203
|
}) => {
|
|
36084
|
-
const [theme] = (0,
|
|
36204
|
+
const [theme] = (0, import_react34.useContext)(ThemeContext);
|
|
36085
36205
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
36086
36206
|
"h1",
|
|
36087
36207
|
{
|
|
@@ -36236,7 +36356,7 @@ var QuillSelectColumn = ({
|
|
|
36236
36356
|
setSelected,
|
|
36237
36357
|
DragHandle
|
|
36238
36358
|
}) => {
|
|
36239
|
-
const [theme] = (0,
|
|
36359
|
+
const [theme] = (0, import_react34.useContext)(ThemeContext);
|
|
36240
36360
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
36241
36361
|
"div",
|
|
36242
36362
|
{
|
|
@@ -36275,7 +36395,7 @@ var QuillDraggableColumn = ({
|
|
|
36275
36395
|
DragHandle,
|
|
36276
36396
|
deleteDisabled
|
|
36277
36397
|
}) => {
|
|
36278
|
-
const [theme] = (0,
|
|
36398
|
+
const [theme] = (0, import_react34.useContext)(ThemeContext);
|
|
36279
36399
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
36280
36400
|
"div",
|
|
36281
36401
|
{
|
|
@@ -36459,13 +36579,13 @@ var FilterPopoverWrapper = ({
|
|
|
36459
36579
|
getToken,
|
|
36460
36580
|
reportBuilderColumns
|
|
36461
36581
|
}) => {
|
|
36462
|
-
const { tenants } = (0,
|
|
36463
|
-
const { eventTracking } = (0,
|
|
36464
|
-
const [isOpen, setIsOpen] = (0,
|
|
36465
|
-
const [uniqueValues, setUniqueValues] = (0,
|
|
36466
|
-
const [uniqueValuesIsLoading, setUniqueValuesIsLoading] = (0,
|
|
36467
|
-
const prevFiltersRef = (0,
|
|
36468
|
-
const columnInternals = (0,
|
|
36582
|
+
const { tenants } = (0, import_react34.useContext)(TenantContext);
|
|
36583
|
+
const { eventTracking } = (0, import_react34.useContext)(EventTrackingContext);
|
|
36584
|
+
const [isOpen, setIsOpen] = (0, import_react34.useState)(false);
|
|
36585
|
+
const [uniqueValues, setUniqueValues] = (0, import_react34.useState)(void 0);
|
|
36586
|
+
const [uniqueValuesIsLoading, setUniqueValuesIsLoading] = (0, import_react34.useState)(false);
|
|
36587
|
+
const prevFiltersRef = (0, import_react34.useRef)("");
|
|
36588
|
+
const columnInternals = (0, import_react34.useMemo)(() => {
|
|
36469
36589
|
if (!tables) {
|
|
36470
36590
|
return null;
|
|
36471
36591
|
}
|
|
@@ -36479,7 +36599,7 @@ var FilterPopoverWrapper = ({
|
|
|
36479
36599
|
});
|
|
36480
36600
|
return relevantColumns;
|
|
36481
36601
|
}, [schema, tables]);
|
|
36482
|
-
(0,
|
|
36602
|
+
(0, import_react34.useEffect)(() => {
|
|
36483
36603
|
const currentFiltersString = JSON.stringify(priorFilters);
|
|
36484
36604
|
if (currentFiltersString !== prevFiltersRef.current) {
|
|
36485
36605
|
prevFiltersRef.current = currentFiltersString;
|
|
@@ -36548,7 +36668,7 @@ var FilterPopoverWrapper = ({
|
|
|
36548
36668
|
};
|
|
36549
36669
|
|
|
36550
36670
|
// src/components/ReportBuilder/FilterModal.tsx
|
|
36551
|
-
var
|
|
36671
|
+
var import_react35 = require("react");
|
|
36552
36672
|
init_Filter();
|
|
36553
36673
|
var import_date_fns13 = require("date-fns");
|
|
36554
36674
|
init_textProcessing();
|
|
@@ -36571,32 +36691,32 @@ function FilterModal({
|
|
|
36571
36691
|
MultiSelectComponent,
|
|
36572
36692
|
reportBuilderColumns
|
|
36573
36693
|
}) {
|
|
36574
|
-
const [field, setField] = (0,
|
|
36575
|
-
const [fieldOptions, setFieldOptions] = (0,
|
|
36576
|
-
const [fieldValues, setFieldValues] = (0,
|
|
36577
|
-
const [type, setType] = (0,
|
|
36578
|
-
const [value, setValue] = (0,
|
|
36579
|
-
const [selectedOptions, setSelectedOptions] = (0,
|
|
36580
|
-
const [operator, setOperator] = (0,
|
|
36694
|
+
const [field, setField] = (0, import_react35.useState)("");
|
|
36695
|
+
const [fieldOptions, setFieldOptions] = (0, import_react35.useState)([]);
|
|
36696
|
+
const [fieldValues, setFieldValues] = (0, import_react35.useState)([]);
|
|
36697
|
+
const [type, setType] = (0, import_react35.useState)(null);
|
|
36698
|
+
const [value, setValue] = (0, import_react35.useState)(void 0);
|
|
36699
|
+
const [selectedOptions, setSelectedOptions] = (0, import_react35.useState)([]);
|
|
36700
|
+
const [operator, setOperator] = (0, import_react35.useState)(
|
|
36581
36701
|
void 0
|
|
36582
36702
|
);
|
|
36583
|
-
const [operatorOptions, setOperatorOptions] = (0,
|
|
36584
|
-
const [unit, setUnit] = (0,
|
|
36585
|
-
const [unitOptions, setUnitOptions] = (0,
|
|
36586
|
-
const [startDate, setStartDate] = (0,
|
|
36703
|
+
const [operatorOptions, setOperatorOptions] = (0, import_react35.useState)([]);
|
|
36704
|
+
const [unit, setUnit] = (0, import_react35.useState)("");
|
|
36705
|
+
const [unitOptions, setUnitOptions] = (0, import_react35.useState)([]);
|
|
36706
|
+
const [startDate, setStartDate] = (0, import_react35.useState)(
|
|
36587
36707
|
(0, import_date_fns13.startOfToday)().toISOString().substring(0, 10)
|
|
36588
36708
|
);
|
|
36589
|
-
const [endDate, setEndDate] = (0,
|
|
36709
|
+
const [endDate, setEndDate] = (0, import_react35.useState)(
|
|
36590
36710
|
(0, import_date_fns13.startOfToday)().toISOString().substring(0, 10)
|
|
36591
36711
|
);
|
|
36592
|
-
const [filterInitialized, setFilterInitialized] = (0,
|
|
36593
|
-
const [table, setTable] = (0,
|
|
36594
|
-
const memoizedFieldValuesMap = (0,
|
|
36712
|
+
const [filterInitialized, setFilterInitialized] = (0, import_react35.useState)(false);
|
|
36713
|
+
const [table, setTable] = (0, import_react35.useState)(void 0);
|
|
36714
|
+
const memoizedFieldValuesMap = (0, import_react35.useMemo)(
|
|
36595
36715
|
() => fieldValuesMap,
|
|
36596
36716
|
[JSON.stringify(fieldValuesMap)]
|
|
36597
36717
|
);
|
|
36598
|
-
const memoizedFilter = (0,
|
|
36599
|
-
(0,
|
|
36718
|
+
const memoizedFilter = (0, import_react35.useMemo)(() => filter, [JSON.stringify(filter)]);
|
|
36719
|
+
(0, import_react35.useEffect)(() => {
|
|
36600
36720
|
if (!filter) {
|
|
36601
36721
|
onFieldChange(field, fieldOptions, table);
|
|
36602
36722
|
}
|
|
@@ -36641,7 +36761,7 @@ function FilterModal({
|
|
|
36641
36761
|
],
|
|
36642
36762
|
[FieldType.Null]: [NullOperator.IsNotNull, NullOperator.IsNull]
|
|
36643
36763
|
};
|
|
36644
|
-
(0,
|
|
36764
|
+
(0, import_react35.useEffect)(() => {
|
|
36645
36765
|
if (filter) {
|
|
36646
36766
|
setField(filter.field);
|
|
36647
36767
|
setTable(filter.table);
|
|
@@ -36669,7 +36789,7 @@ function FilterModal({
|
|
|
36669
36789
|
}
|
|
36670
36790
|
}
|
|
36671
36791
|
}, [memoizedFilter]);
|
|
36672
|
-
(0,
|
|
36792
|
+
(0, import_react35.useEffect)(() => {
|
|
36673
36793
|
if (schema) {
|
|
36674
36794
|
const fo = schema.flatMap((table2) => {
|
|
36675
36795
|
if (tables && !tables.includes(table2.name)) {
|
|
@@ -37351,7 +37471,7 @@ function FilterModal({
|
|
|
37351
37471
|
}
|
|
37352
37472
|
|
|
37353
37473
|
// src/components/Dashboard/TemplateMetricComponent.tsx
|
|
37354
|
-
var
|
|
37474
|
+
var import_react36 = require("react");
|
|
37355
37475
|
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
37356
37476
|
function QuillTemplateMetricComponent({
|
|
37357
37477
|
report,
|
|
@@ -37359,7 +37479,7 @@ function QuillTemplateMetricComponent({
|
|
|
37359
37479
|
children,
|
|
37360
37480
|
isLoading
|
|
37361
37481
|
}) {
|
|
37362
|
-
const [isSelected, setIsSelected] = (0,
|
|
37482
|
+
const [isSelected, setIsSelected] = (0, import_react36.useState)(false);
|
|
37363
37483
|
return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
|
|
37364
37484
|
"div",
|
|
37365
37485
|
{
|
|
@@ -37388,7 +37508,7 @@ function QuillTemplateMetricComponent({
|
|
|
37388
37508
|
}
|
|
37389
37509
|
|
|
37390
37510
|
// src/components/Dashboard/TemplateTableComponent.tsx
|
|
37391
|
-
var
|
|
37511
|
+
var import_react37 = require("react");
|
|
37392
37512
|
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
37393
37513
|
function QuillTemplateTableComponent({
|
|
37394
37514
|
report,
|
|
@@ -37399,7 +37519,7 @@ function QuillTemplateTableComponent({
|
|
|
37399
37519
|
onPageChange,
|
|
37400
37520
|
onSortChange
|
|
37401
37521
|
}) {
|
|
37402
|
-
const [isSelected, setIsSelected] = (0,
|
|
37522
|
+
const [isSelected, setIsSelected] = (0, import_react37.useState)(false);
|
|
37403
37523
|
return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
37404
37524
|
"div",
|
|
37405
37525
|
{
|
|
@@ -37614,14 +37734,14 @@ function Dashboard({
|
|
|
37614
37734
|
templateDashboardName,
|
|
37615
37735
|
pagination = { rowsPerPage: 10, rowsPerRequest: 50 }
|
|
37616
37736
|
}) {
|
|
37617
|
-
const [userFilters, setUserFilters] = (0,
|
|
37618
|
-
const [selectedSection, setSelectedSection] = (0,
|
|
37619
|
-
const dataLoaderUserFilters = (0,
|
|
37737
|
+
const [userFilters, setUserFilters] = (0, import_react38.useState)({});
|
|
37738
|
+
const [selectedSection, setSelectedSection] = (0, import_react38.useState)("");
|
|
37739
|
+
const dataLoaderUserFilters = (0, import_react38.useMemo)(() => {
|
|
37620
37740
|
return (filters?.map((f) => convertCustomFilter(f)) ?? []).concat(
|
|
37621
37741
|
Object.values(userFilters)
|
|
37622
37742
|
);
|
|
37623
37743
|
}, [filters, userFilters]);
|
|
37624
|
-
(0,
|
|
37744
|
+
(0, import_react38.useEffect)(() => {
|
|
37625
37745
|
onUserFiltersUpdated?.(Object.values(userFilters));
|
|
37626
37746
|
}, [userFilters]);
|
|
37627
37747
|
const {
|
|
@@ -37636,10 +37756,10 @@ function Dashboard({
|
|
|
37636
37756
|
Object.values(userFilters) ?? []
|
|
37637
37757
|
)
|
|
37638
37758
|
);
|
|
37639
|
-
const { getToken } = (0,
|
|
37640
|
-
const { customFilterDispatch } = (0,
|
|
37641
|
-
const { eventTracking } = (0,
|
|
37642
|
-
const metrics = (0,
|
|
37759
|
+
const { getToken } = (0, import_react38.useContext)(FetchContext);
|
|
37760
|
+
const { customFilterDispatch } = (0, import_react38.useContext)(DashboardFiltersContext);
|
|
37761
|
+
const { eventTracking } = (0, import_react38.useContext)(EventTrackingContext);
|
|
37762
|
+
const metrics = (0, import_react38.useMemo)(() => {
|
|
37643
37763
|
const map = {};
|
|
37644
37764
|
Object.keys(data?.sections ?? {}).forEach((section) => {
|
|
37645
37765
|
if (!data?.sections?.[section]) return;
|
|
@@ -37667,7 +37787,7 @@ function Dashboard({
|
|
|
37667
37787
|
});
|
|
37668
37788
|
return map;
|
|
37669
37789
|
}, [data?.sections, data?.sectionOrder]);
|
|
37670
|
-
const charts = (0,
|
|
37790
|
+
const charts = (0, import_react38.useMemo)(() => {
|
|
37671
37791
|
const map = {};
|
|
37672
37792
|
Object.keys(data?.sections ?? {}).forEach((section) => {
|
|
37673
37793
|
if (!data?.sections?.[section]) return;
|
|
@@ -37693,7 +37813,7 @@ function Dashboard({
|
|
|
37693
37813
|
});
|
|
37694
37814
|
return map;
|
|
37695
37815
|
}, [data?.sections, data?.sectionOrder]);
|
|
37696
|
-
const tables = (0,
|
|
37816
|
+
const tables = (0, import_react38.useMemo)(() => {
|
|
37697
37817
|
const map = {};
|
|
37698
37818
|
Object.keys(data?.sections ?? {}).forEach((section) => {
|
|
37699
37819
|
if (!data?.sections?.[section]) return;
|
|
@@ -37719,8 +37839,8 @@ function Dashboard({
|
|
|
37719
37839
|
});
|
|
37720
37840
|
return map;
|
|
37721
37841
|
}, [data?.sections, data?.sectionOrder]);
|
|
37722
|
-
const mounted = (0,
|
|
37723
|
-
(0,
|
|
37842
|
+
const mounted = (0, import_react38.useRef)(false);
|
|
37843
|
+
(0, import_react38.useEffect)(() => {
|
|
37724
37844
|
if (!mounted.current) {
|
|
37725
37845
|
mounted.current = true;
|
|
37726
37846
|
return;
|
|
@@ -37732,53 +37852,53 @@ function Dashboard({
|
|
|
37732
37852
|
filters: populatedDashboardFilters ?? []
|
|
37733
37853
|
});
|
|
37734
37854
|
}, [filters, userFilters]);
|
|
37735
|
-
(0,
|
|
37855
|
+
(0, import_react38.useEffect)(() => {
|
|
37736
37856
|
customFilterDispatch({
|
|
37737
37857
|
type: "ADD_CUSTOM_DASHBOARD_FILTERS",
|
|
37738
37858
|
dashboardName: name2,
|
|
37739
37859
|
data: dataLoaderUserFilters
|
|
37740
37860
|
});
|
|
37741
37861
|
}, [dataLoaderUserFilters]);
|
|
37742
|
-
const [client, isClientLoading] = (0,
|
|
37743
|
-
const { tenants, flags } = (0,
|
|
37744
|
-
const [theme] = (0,
|
|
37745
|
-
const [schemaData] = (0,
|
|
37746
|
-
const { dispatch: dashboardFiltersDispatch } = (0,
|
|
37862
|
+
const [client, isClientLoading] = (0, import_react38.useContext)(ClientContext);
|
|
37863
|
+
const { tenants, flags } = (0, import_react38.useContext)(TenantContext);
|
|
37864
|
+
const [theme] = (0, import_react38.useContext)(ThemeContext);
|
|
37865
|
+
const [schemaData] = (0, import_react38.useContext)(SchemaDataContext);
|
|
37866
|
+
const { dispatch: dashboardFiltersDispatch } = (0, import_react38.useContext)(
|
|
37747
37867
|
DashboardFiltersContext
|
|
37748
37868
|
);
|
|
37749
|
-
const [fieldValuesMap, setFieldValuesMap] = (0,
|
|
37750
|
-
const [fieldValuesIsLoaded, setFieldValuesIsLoaded] = (0,
|
|
37751
|
-
const [addFilterPopoverIsOpen, setAddFilterPopoverIsOpen] = (0,
|
|
37752
|
-
const [filterListIsOpen, setFilterListIsOpen] = (0,
|
|
37869
|
+
const [fieldValuesMap, setFieldValuesMap] = (0, import_react38.useState)({});
|
|
37870
|
+
const [fieldValuesIsLoaded, setFieldValuesIsLoaded] = (0, import_react38.useState)(false);
|
|
37871
|
+
const [addFilterPopoverIsOpen, setAddFilterPopoverIsOpen] = (0, import_react38.useState)(false);
|
|
37872
|
+
const [filterListIsOpen, setFilterListIsOpen] = (0, import_react38.useState)(false);
|
|
37753
37873
|
const [
|
|
37754
37874
|
filterListAddFilterPopoverIsOpen,
|
|
37755
37875
|
setFilterListAddFilterPopoverIsOpen
|
|
37756
|
-
] = (0,
|
|
37757
|
-
const presetOptions = (0,
|
|
37876
|
+
] = (0, import_react38.useState)(false);
|
|
37877
|
+
const presetOptions = (0, import_react38.useMemo)(() => {
|
|
37758
37878
|
return populatedDashboardFilters?.[0]?.filterType === "date_range" ? convertPresetOptionsToSelectableList(
|
|
37759
37879
|
populatedDashboardFilters[0].presetOptions ?? [],
|
|
37760
37880
|
populatedDashboardFilters[0].defaultPresetRanges ?? []
|
|
37761
37881
|
) : defaultOptionsV2;
|
|
37762
37882
|
}, [populatedDashboardFilters]);
|
|
37763
|
-
const [filterValues, setFilterValues] = (0,
|
|
37764
|
-
const prevNameRef = (0,
|
|
37765
|
-
const prevFlagsRef = (0,
|
|
37766
|
-
const prevClientRef = (0,
|
|
37767
|
-
const addFilterPopoverButtonRef = (0,
|
|
37768
|
-
const viewFiltersPopoverButtonRef = (0,
|
|
37769
|
-
const previousFilters = (0,
|
|
37883
|
+
const [filterValues, setFilterValues] = (0, import_react38.useState)({});
|
|
37884
|
+
const prevNameRef = (0, import_react38.useRef)(name2);
|
|
37885
|
+
const prevFlagsRef = (0, import_react38.useRef)(flags);
|
|
37886
|
+
const prevClientRef = (0, import_react38.useRef)(client?.publicKey ?? "");
|
|
37887
|
+
const addFilterPopoverButtonRef = (0, import_react38.useRef)(null);
|
|
37888
|
+
const viewFiltersPopoverButtonRef = (0, import_react38.useRef)(null);
|
|
37889
|
+
const previousFilters = (0, import_react38.useRef)(filters);
|
|
37770
37890
|
if (!(0, import_fast_deep_equal4.default)(previousFilters.current, filters)) {
|
|
37771
37891
|
previousFilters.current = filters;
|
|
37772
37892
|
}
|
|
37773
|
-
const isInitialLoadOfDashboardRef = (0,
|
|
37774
|
-
const referencedTables = (0,
|
|
37893
|
+
const isInitialLoadOfDashboardRef = (0, import_react38.useRef)(false);
|
|
37894
|
+
const referencedTables = (0, import_react38.useMemo)(() => {
|
|
37775
37895
|
const sections = data?.sections || {};
|
|
37776
37896
|
const tables2 = Object.values(sections).flatMap(
|
|
37777
37897
|
(section) => section.map((chart) => chart.referencedTables)
|
|
37778
37898
|
).flat();
|
|
37779
37899
|
return Array.from(new Set(tables2));
|
|
37780
37900
|
}, [data?.sections]);
|
|
37781
|
-
(0,
|
|
37901
|
+
(0, import_react38.useEffect)(() => {
|
|
37782
37902
|
if (prevNameRef.current === name2 && Object.values(data?.sections ?? {}).flat().length) {
|
|
37783
37903
|
return;
|
|
37784
37904
|
}
|
|
@@ -37798,8 +37918,8 @@ function Dashboard({
|
|
|
37798
37918
|
prevFlagsRef.current = flags;
|
|
37799
37919
|
});
|
|
37800
37920
|
}, [name2, isClientLoading]);
|
|
37801
|
-
const tenantMounted = (0,
|
|
37802
|
-
(0,
|
|
37921
|
+
const tenantMounted = (0, import_react38.useRef)(false);
|
|
37922
|
+
(0, import_react38.useEffect)(() => {
|
|
37803
37923
|
if (!tenantMounted.current) {
|
|
37804
37924
|
tenantMounted.current = true;
|
|
37805
37925
|
return;
|
|
@@ -37818,7 +37938,7 @@ function Dashboard({
|
|
|
37818
37938
|
isInitialLoadOfDashboardRef.current = false;
|
|
37819
37939
|
});
|
|
37820
37940
|
}, [flags]);
|
|
37821
|
-
(0,
|
|
37941
|
+
(0, import_react38.useEffect)(() => {
|
|
37822
37942
|
if (prevClientRef.current === client?.publicKey) {
|
|
37823
37943
|
return;
|
|
37824
37944
|
}
|
|
@@ -37833,7 +37953,7 @@ function Dashboard({
|
|
|
37833
37953
|
isInitialLoadOfDashboardRef.current = false;
|
|
37834
37954
|
});
|
|
37835
37955
|
}, [client?.publicKey]);
|
|
37836
|
-
(0,
|
|
37956
|
+
(0, import_react38.useEffect)(() => {
|
|
37837
37957
|
setFilterValues(
|
|
37838
37958
|
Object.values(populatedDashboardFilters ?? {}).reduce((acc, f) => {
|
|
37839
37959
|
acc[f.label] = f.filterType === "string" ? f.stringFilterType === "multiselect" ? { values: f.values, operator: "IN" } : { selectedValue: f.selectedValue } : f.filterType === "date_range" ? {
|
|
@@ -37848,7 +37968,7 @@ function Dashboard({
|
|
|
37848
37968
|
}, {})
|
|
37849
37969
|
);
|
|
37850
37970
|
}, [populatedDashboardFilters]);
|
|
37851
|
-
(0,
|
|
37971
|
+
(0, import_react38.useEffect)(() => {
|
|
37852
37972
|
const dashboardDateFilter = populatedDashboardFilters?.find(
|
|
37853
37973
|
(f) => f.filterType === "date_range"
|
|
37854
37974
|
);
|
|
@@ -37885,7 +38005,7 @@ function Dashboard({
|
|
|
37885
38005
|
});
|
|
37886
38006
|
}
|
|
37887
38007
|
}, [previousFilters.current]);
|
|
37888
|
-
(0,
|
|
38008
|
+
(0, import_react38.useEffect)(() => {
|
|
37889
38009
|
const fetchData = async () => {
|
|
37890
38010
|
setFieldValuesIsLoaded(false);
|
|
37891
38011
|
const newFieldValues = {};
|
|
@@ -38046,7 +38166,7 @@ function Dashboard({
|
|
|
38046
38166
|
[filter.field]: filter
|
|
38047
38167
|
}));
|
|
38048
38168
|
};
|
|
38049
|
-
(0,
|
|
38169
|
+
(0, import_react38.useEffect)(() => {
|
|
38050
38170
|
if (onChangeLoading && isLoading) {
|
|
38051
38171
|
onChangeLoading(isLoading);
|
|
38052
38172
|
}
|
|
@@ -38686,15 +38806,15 @@ function QuillDashboardTemplate({
|
|
|
38686
38806
|
ButtonComponent
|
|
38687
38807
|
}) {
|
|
38688
38808
|
const { isLoading, data } = useDashboardInternal(name2 ?? "");
|
|
38689
|
-
const { getToken } = (0,
|
|
38690
|
-
const { eventTracking } = (0,
|
|
38691
|
-
const { dashboardConfig, dashboardConfigDispatch } = (0,
|
|
38809
|
+
const { getToken } = (0, import_react38.useContext)(FetchContext);
|
|
38810
|
+
const { eventTracking } = (0, import_react38.useContext)(EventTrackingContext);
|
|
38811
|
+
const { dashboardConfig, dashboardConfigDispatch } = (0, import_react38.useContext)(
|
|
38692
38812
|
DashboardConfigContext
|
|
38693
38813
|
);
|
|
38694
|
-
const [addItemModalIsOpen, setAddItemModalIsOpen] = (0,
|
|
38695
|
-
const [selectedTemplates, setSelectedTemplates] = (0,
|
|
38696
|
-
const [selectingTemplate, setSelectingTemplate] = (0,
|
|
38697
|
-
const [submittingTemplate, setSubmittingTemplate] = (0,
|
|
38814
|
+
const [addItemModalIsOpen, setAddItemModalIsOpen] = (0, import_react38.useState)(false);
|
|
38815
|
+
const [selectedTemplates, setSelectedTemplates] = (0, import_react38.useState)([]);
|
|
38816
|
+
const [selectingTemplate, setSelectingTemplate] = (0, import_react38.useState)(false);
|
|
38817
|
+
const [submittingTemplate, setSubmittingTemplate] = (0, import_react38.useState)(false);
|
|
38698
38818
|
const templateSections = data?.sections;
|
|
38699
38819
|
const onSubmitTemplates = async () => {
|
|
38700
38820
|
setSubmittingTemplate(true);
|
|
@@ -38837,7 +38957,7 @@ var QuillProvider = ({
|
|
|
38837
38957
|
var QuillProvider_default = QuillProvider;
|
|
38838
38958
|
|
|
38839
38959
|
// src/Table.tsx
|
|
38840
|
-
var
|
|
38960
|
+
var import_react39 = require("react");
|
|
38841
38961
|
init_Filter();
|
|
38842
38962
|
init_paginationProcessing();
|
|
38843
38963
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
@@ -38846,26 +38966,26 @@ var Table = ({
|
|
|
38846
38966
|
...props
|
|
38847
38967
|
}) => {
|
|
38848
38968
|
const data = props;
|
|
38849
|
-
const [dashboard] = (0,
|
|
38850
|
-
const { dashboardFilters, dashboardCustomFilters } = (0,
|
|
38969
|
+
const [dashboard] = (0, import_react39.useContext)(DashboardContext);
|
|
38970
|
+
const { dashboardFilters, dashboardCustomFilters } = (0, import_react39.useContext)(
|
|
38851
38971
|
DashboardFiltersContext
|
|
38852
38972
|
);
|
|
38853
|
-
const [client, clientLoading] = (0,
|
|
38854
|
-
const [schemaData] = (0,
|
|
38855
|
-
const { eventTracking } = (0,
|
|
38973
|
+
const [client, clientLoading] = (0, import_react39.useContext)(ClientContext);
|
|
38974
|
+
const [schemaData] = (0, import_react39.useContext)(SchemaDataContext);
|
|
38975
|
+
const { eventTracking } = (0, import_react39.useContext)(EventTrackingContext);
|
|
38856
38976
|
const { allReportsById } = useAllReports();
|
|
38857
|
-
const [loading, setLoading] = (0,
|
|
38858
|
-
const report = (0,
|
|
38977
|
+
const [loading, setLoading] = (0, import_react39.useState)(false);
|
|
38978
|
+
const report = (0, import_react39.useMemo)(() => {
|
|
38859
38979
|
return props.reportId ? allReportsById[props.reportId] : null;
|
|
38860
38980
|
}, [allReportsById[props.reportId ?? ""]]);
|
|
38861
|
-
const { reportFilters, customReportFilters, reportFiltersDispatch } = (0,
|
|
38862
|
-
const { reports, fetchIndividualReport, reportsDispatch } = (0,
|
|
38863
|
-
const specificReportFilters = (0,
|
|
38981
|
+
const { reportFilters, customReportFilters, reportFiltersDispatch } = (0, import_react39.useContext)(ReportFiltersContext);
|
|
38982
|
+
const { reports, fetchIndividualReport, reportsDispatch } = (0, import_react39.useContext)(ReportsContext);
|
|
38983
|
+
const specificReportFilters = (0, import_react39.useMemo)(() => {
|
|
38864
38984
|
return Object.values(
|
|
38865
38985
|
reportFilters[props.reportId ?? ""] ?? (dashboard[report?.dashboardName ?? ""]?.[report?.id ?? ""] ? dashboardFilters[report.dashboardName] : null) ?? {}
|
|
38866
38986
|
).map((f) => f.filter);
|
|
38867
38987
|
}, [reportFilters[props.reportId ?? ""]]);
|
|
38868
|
-
const userFilters = (0,
|
|
38988
|
+
const userFilters = (0, import_react39.useMemo)(() => {
|
|
38869
38989
|
return (props.filters?.filter((f) => f.filterType !== "date" /* Date */)?.map(convertCustomFilter) ?? []).concat(
|
|
38870
38990
|
customReportFilters[props.reportId ?? ""] ?? dashboardCustomFilters[report?.dashboardName ?? ""] ?? []
|
|
38871
38991
|
);
|
|
@@ -38907,7 +39027,7 @@ var Table = ({
|
|
|
38907
39027
|
setLoading(false);
|
|
38908
39028
|
}
|
|
38909
39029
|
};
|
|
38910
|
-
(0,
|
|
39030
|
+
(0, import_react39.useEffect)(() => {
|
|
38911
39031
|
if (props.reportId === void 0 || props.reportId === "" || clientLoading) {
|
|
38912
39032
|
return;
|
|
38913
39033
|
}
|
|
@@ -38941,7 +39061,7 @@ var Table = ({
|
|
|
38941
39061
|
clientLoading,
|
|
38942
39062
|
!reports[props.reportId ?? ""]
|
|
38943
39063
|
]);
|
|
38944
|
-
const [page, setPage] = (0,
|
|
39064
|
+
const [page, setPage] = (0, import_react39.useState)(0);
|
|
38945
39065
|
if ("rows" in data && "columns" in data) {
|
|
38946
39066
|
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
38947
39067
|
QuillTable,
|
|
@@ -39001,27 +39121,27 @@ var Table = ({
|
|
|
39001
39121
|
var Table_default = Table;
|
|
39002
39122
|
|
|
39003
39123
|
// src/SQLEditor.tsx
|
|
39004
|
-
var
|
|
39005
|
-
var
|
|
39124
|
+
var import_react46 = require("react");
|
|
39125
|
+
var import_react47 = __toESM(require("@monaco-editor/react"), 1);
|
|
39006
39126
|
|
|
39007
39127
|
// src/ChartBuilder.tsx
|
|
39008
|
-
var
|
|
39128
|
+
var import_react44 = require("react");
|
|
39009
39129
|
var import_core = require("@dnd-kit/core");
|
|
39010
39130
|
var import_sortable = require("@dnd-kit/sortable");
|
|
39011
39131
|
var import_utilities = require("@dnd-kit/utilities");
|
|
39012
39132
|
|
|
39013
39133
|
// src/internals/ReportBuilder/PivotModal.tsx
|
|
39014
|
-
var
|
|
39134
|
+
var import_react41 = require("react");
|
|
39015
39135
|
|
|
39016
39136
|
// src/internals/ReportBuilder/PivotList.tsx
|
|
39017
39137
|
init_valueFormatter();
|
|
39018
39138
|
init_textProcessing();
|
|
39019
39139
|
|
|
39020
39140
|
// src/components/QuillCard.tsx
|
|
39021
|
-
var
|
|
39141
|
+
var import_react40 = require("react");
|
|
39022
39142
|
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
39023
39143
|
function QuillCard({ children, onClick, onDelete }) {
|
|
39024
|
-
const [theme] = (0,
|
|
39144
|
+
const [theme] = (0, import_react40.useContext)(ThemeContext);
|
|
39025
39145
|
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
|
|
39026
39146
|
"div",
|
|
39027
39147
|
{
|
|
@@ -39465,45 +39585,45 @@ var PivotModal = ({
|
|
|
39465
39585
|
heightAdjustment = 0,
|
|
39466
39586
|
reportBuilderState
|
|
39467
39587
|
}) => {
|
|
39468
|
-
const { getToken, quillFetchWithToken } = (0,
|
|
39469
|
-
const [isLoading, setIsLoading] = (0,
|
|
39470
|
-
const [previewLoading, setPreviewLoading] = (0,
|
|
39471
|
-
const [selectedPivotType, setSelectedPivotType] = (0,
|
|
39472
|
-
const [errors, setErrors] = (0,
|
|
39473
|
-
const [client] = (0,
|
|
39474
|
-
const [schemaData] = (0,
|
|
39475
|
-
const { tenants } = (0,
|
|
39476
|
-
const { eventTracking } = (0,
|
|
39477
|
-
const rowFieldRef = (0,
|
|
39478
|
-
const colFieldRef = (0,
|
|
39479
|
-
const [pivotCardWidth, setPivotCardWidth] = (0,
|
|
39480
|
-
const [samplePivotTable, setSamplePivotTable] = (0,
|
|
39481
|
-
const [hasNoRecommendedPivots, sethasNoRecommendedPivots] = (0,
|
|
39482
|
-
const [isFetchingPivots, setIsFetchingPivots] = (0,
|
|
39483
|
-
const [allowedColumnFields, setAllowedColumnFields] = (0,
|
|
39484
|
-
const [allowedRowFields, setAllowedRowFields] = (0,
|
|
39485
|
-
const [allowedValueFields, setAllowedValueFields] = (0,
|
|
39486
|
-
const [uniqueValues, setUniqueValues] = (0,
|
|
39487
|
-
const buttonRef = (0,
|
|
39488
|
-
const [dateRanges, setDateRanges] = (0,
|
|
39489
|
-
const [pivotError, setPivotError] = (0,
|
|
39490
|
-
const [limitInput, setLimitInput] = (0,
|
|
39588
|
+
const { getToken, quillFetchWithToken } = (0, import_react41.useContext)(FetchContext);
|
|
39589
|
+
const [isLoading, setIsLoading] = (0, import_react41.useState)(false);
|
|
39590
|
+
const [previewLoading, setPreviewLoading] = (0, import_react41.useState)(false);
|
|
39591
|
+
const [selectedPivotType, setSelectedPivotType] = (0, import_react41.useState)("recommended");
|
|
39592
|
+
const [errors, setErrors] = (0, import_react41.useState)([]);
|
|
39593
|
+
const [client] = (0, import_react41.useContext)(ClientContext);
|
|
39594
|
+
const [schemaData] = (0, import_react41.useContext)(SchemaDataContext);
|
|
39595
|
+
const { tenants } = (0, import_react41.useContext)(TenantContext);
|
|
39596
|
+
const { eventTracking } = (0, import_react41.useContext)(EventTrackingContext);
|
|
39597
|
+
const rowFieldRef = (0, import_react41.useRef)(null);
|
|
39598
|
+
const colFieldRef = (0, import_react41.useRef)(null);
|
|
39599
|
+
const [pivotCardWidth, setPivotCardWidth] = (0, import_react41.useState)(420);
|
|
39600
|
+
const [samplePivotTable, setSamplePivotTable] = (0, import_react41.useState)(null);
|
|
39601
|
+
const [hasNoRecommendedPivots, sethasNoRecommendedPivots] = (0, import_react41.useState)(false);
|
|
39602
|
+
const [isFetchingPivots, setIsFetchingPivots] = (0, import_react41.useState)(false);
|
|
39603
|
+
const [allowedColumnFields, setAllowedColumnFields] = (0, import_react41.useState)([]);
|
|
39604
|
+
const [allowedRowFields, setAllowedRowFields] = (0, import_react41.useState)([]);
|
|
39605
|
+
const [allowedValueFields, setAllowedValueFields] = (0, import_react41.useState)([]);
|
|
39606
|
+
const [uniqueValues, setUniqueValues] = (0, import_react41.useState)(initialUniqueValues);
|
|
39607
|
+
const buttonRef = (0, import_react41.useRef)(null);
|
|
39608
|
+
const [dateRanges, setDateRanges] = (0, import_react41.useState)({});
|
|
39609
|
+
const [pivotError, setPivotError] = (0, import_react41.useState)("");
|
|
39610
|
+
const [limitInput, setLimitInput] = (0, import_react41.useState)(
|
|
39491
39611
|
pivotLimit?.toString() ?? "100"
|
|
39492
39612
|
);
|
|
39493
|
-
const [sortFieldInput, setSortFieldInput] = (0,
|
|
39613
|
+
const [sortFieldInput, setSortFieldInput] = (0, import_react41.useState)(
|
|
39494
39614
|
pivotSort?.sortField ?? ""
|
|
39495
39615
|
);
|
|
39496
|
-
const [sortDirectionInput, setSortDirectionInput] = (0,
|
|
39616
|
+
const [sortDirectionInput, setSortDirectionInput] = (0, import_react41.useState)(
|
|
39497
39617
|
pivotSort?.sortDirection ?? "ASC"
|
|
39498
39618
|
);
|
|
39499
|
-
const [showLimitInput, setShowLimitInput] = (0,
|
|
39500
|
-
const [showSortInput, setShowSortInput] = (0,
|
|
39501
|
-
const [availableHeight, setAvailableHeight] = (0,
|
|
39502
|
-
const [pivotModalTopHeight, setPivotModalTopHeight] = (0,
|
|
39503
|
-
const [popoverPosition, setPopoverPosition] = (0,
|
|
39619
|
+
const [showLimitInput, setShowLimitInput] = (0, import_react41.useState)(!!pivotLimit);
|
|
39620
|
+
const [showSortInput, setShowSortInput] = (0, import_react41.useState)(!!pivotSort);
|
|
39621
|
+
const [availableHeight, setAvailableHeight] = (0, import_react41.useState)(0);
|
|
39622
|
+
const [pivotModalTopHeight, setPivotModalTopHeight] = (0, import_react41.useState)(450);
|
|
39623
|
+
const [popoverPosition, setPopoverPosition] = (0, import_react41.useState)(
|
|
39504
39624
|
"bottom"
|
|
39505
39625
|
);
|
|
39506
|
-
const popoverRef = (0,
|
|
39626
|
+
const popoverRef = (0, import_react41.useRef)(null);
|
|
39507
39627
|
const getDistinctValues = async (fetchDistinct) => {
|
|
39508
39628
|
if (!client) {
|
|
39509
39629
|
return {
|
|
@@ -39590,7 +39710,7 @@ var PivotModal = ({
|
|
|
39590
39710
|
setDateRanges(dateRangeByColumn || {});
|
|
39591
39711
|
}
|
|
39592
39712
|
};
|
|
39593
|
-
(0,
|
|
39713
|
+
(0, import_react41.useEffect)(() => {
|
|
39594
39714
|
const calculatePivotCardSize = () => {
|
|
39595
39715
|
if (rowFieldRef.current && colFieldRef.current) {
|
|
39596
39716
|
const rowFieldSize = rowFieldRef.current?.getBoundingClientRect();
|
|
@@ -39611,7 +39731,7 @@ var PivotModal = ({
|
|
|
39611
39731
|
}, 500);
|
|
39612
39732
|
}
|
|
39613
39733
|
}, [showUpdatePivot, isOpen]);
|
|
39614
|
-
(0,
|
|
39734
|
+
(0, import_react41.useEffect)(() => {
|
|
39615
39735
|
const fetchPivotData = async () => {
|
|
39616
39736
|
if (pivotRowField && data && columns && pivotAggregations?.every((p) => p?.valueField && p?.aggregationType)) {
|
|
39617
39737
|
const pivot = {
|
|
@@ -39757,7 +39877,7 @@ var PivotModal = ({
|
|
|
39757
39877
|
};
|
|
39758
39878
|
fetchPivotData();
|
|
39759
39879
|
}, [initialSelectedPivotTable]);
|
|
39760
|
-
(0,
|
|
39880
|
+
(0, import_react41.useEffect)(() => {
|
|
39761
39881
|
if (pivotRowField && data && columns) {
|
|
39762
39882
|
getDistinctValues();
|
|
39763
39883
|
getAllDateRangesByColumn();
|
|
@@ -39765,7 +39885,7 @@ var PivotModal = ({
|
|
|
39765
39885
|
getDistinctValues();
|
|
39766
39886
|
}
|
|
39767
39887
|
}, [initialSelectedPivotTable, columns, data, pivotRowField]);
|
|
39768
|
-
(0,
|
|
39888
|
+
(0, import_react41.useEffect)(() => {
|
|
39769
39889
|
setAllowedFields(initialUniqueValues || {});
|
|
39770
39890
|
setUniqueValues(initialUniqueValues);
|
|
39771
39891
|
}, [initialUniqueValues, columns]);
|
|
@@ -39776,20 +39896,20 @@ var PivotModal = ({
|
|
|
39776
39896
|
setAllowedValueFields(possibleColumns.valueFields);
|
|
39777
39897
|
return possibleColumns;
|
|
39778
39898
|
};
|
|
39779
|
-
const columnsToShow = (0,
|
|
39899
|
+
const columnsToShow = (0, import_react41.useMemo)(() => {
|
|
39780
39900
|
return (columns || []).reduce((map, col) => {
|
|
39781
39901
|
map[col.field] = col.format;
|
|
39782
39902
|
return map;
|
|
39783
39903
|
}, {});
|
|
39784
39904
|
}, [columns]);
|
|
39785
|
-
const columnTypes = (0,
|
|
39905
|
+
const columnTypes = (0, import_react41.useMemo)(() => {
|
|
39786
39906
|
return (columns || []).reduce((map, col) => {
|
|
39787
39907
|
map[col.field] = col.jsType;
|
|
39788
39908
|
return map;
|
|
39789
39909
|
}, {});
|
|
39790
39910
|
}, [columns]);
|
|
39791
|
-
const [selectedPivotTable, setSelectedPivotTable] = (0,
|
|
39792
|
-
(0,
|
|
39911
|
+
const [selectedPivotTable, setSelectedPivotTable] = (0, import_react41.useState)(null);
|
|
39912
|
+
(0, import_react41.useEffect)(() => {
|
|
39793
39913
|
const fetchPivotTables = async () => {
|
|
39794
39914
|
if (selectedPivotIndex === -1) {
|
|
39795
39915
|
return null;
|
|
@@ -39841,8 +39961,8 @@ var PivotModal = ({
|
|
|
39841
39961
|
};
|
|
39842
39962
|
fetchPivotTables();
|
|
39843
39963
|
}, [selectedPivotIndex, data, dateRange, createdPivots]);
|
|
39844
|
-
const previousUniqueValuesRef = (0,
|
|
39845
|
-
(0,
|
|
39964
|
+
const previousUniqueValuesRef = (0, import_react41.useRef)();
|
|
39965
|
+
(0, import_react41.useEffect)(() => {
|
|
39846
39966
|
if (!uniqueValuesIsLoading && !(0, import_fast_deep_equal5.default)(uniqueValues, previousUniqueValuesRef.current)) {
|
|
39847
39967
|
previousUniqueValuesRef.current = uniqueValues;
|
|
39848
39968
|
setRecommendedPivotTables([]);
|
|
@@ -39879,7 +39999,7 @@ var PivotModal = ({
|
|
|
39879
39999
|
setIsOpen(false);
|
|
39880
40000
|
setPopUpTitle("Add pivot");
|
|
39881
40001
|
};
|
|
39882
|
-
const onCommitPivot = (0,
|
|
40002
|
+
const onCommitPivot = (0, import_react41.useCallback)(() => {
|
|
39883
40003
|
const errors2 = [];
|
|
39884
40004
|
if ((pivotAggregations?.length ?? 0) === 0) {
|
|
39885
40005
|
errors2.push("You must have at least one aggregation");
|
|
@@ -40021,7 +40141,7 @@ var PivotModal = ({
|
|
|
40021
40141
|
const onEditRecommendedPivot = (pivot) => {
|
|
40022
40142
|
onEditPivot(pivot, null);
|
|
40023
40143
|
};
|
|
40024
|
-
const refreshPivots = (0,
|
|
40144
|
+
const refreshPivots = (0, import_react41.useCallback)(async () => {
|
|
40025
40145
|
if (!client) {
|
|
40026
40146
|
return;
|
|
40027
40147
|
}
|
|
@@ -40317,11 +40437,11 @@ var PivotModal = ({
|
|
|
40317
40437
|
}
|
|
40318
40438
|
}, 500);
|
|
40319
40439
|
};
|
|
40320
|
-
const [recommendedPivotTables, setRecommendedPivotTables] = (0,
|
|
40440
|
+
const [recommendedPivotTables, setRecommendedPivotTables] = (0, import_react41.useState)(
|
|
40321
40441
|
[]
|
|
40322
40442
|
);
|
|
40323
|
-
const [createdPivotTables, setCreatedPivotTables] = (0,
|
|
40324
|
-
(0,
|
|
40443
|
+
const [createdPivotTables, setCreatedPivotTables] = (0, import_react41.useState)([]);
|
|
40444
|
+
(0, import_react41.useEffect)(() => {
|
|
40325
40445
|
const fetchPivotTables = async () => {
|
|
40326
40446
|
const pts = await Promise.all(
|
|
40327
40447
|
createdPivots.map(async (p) => {
|
|
@@ -40394,7 +40514,7 @@ var PivotModal = ({
|
|
|
40394
40514
|
setPopoverPosition("bottom");
|
|
40395
40515
|
}
|
|
40396
40516
|
};
|
|
40397
|
-
(0,
|
|
40517
|
+
(0, import_react41.useEffect)(() => {
|
|
40398
40518
|
handleResize();
|
|
40399
40519
|
window.addEventListener("resize", handleResize);
|
|
40400
40520
|
const parentElement = parentRef?.current;
|
|
@@ -41219,7 +41339,7 @@ var validateReport = (formData, dashboardData, defaultDateFilter, allTables) =>
|
|
|
41219
41339
|
};
|
|
41220
41340
|
|
|
41221
41341
|
// src/components/Chart/InternalChart.tsx
|
|
41222
|
-
var
|
|
41342
|
+
var import_react42 = require("react");
|
|
41223
41343
|
var import_date_fns15 = require("date-fns");
|
|
41224
41344
|
init_Filter();
|
|
41225
41345
|
init_filterProcessing();
|
|
@@ -41333,10 +41453,10 @@ function InternalChart({
|
|
|
41333
41453
|
filterToggleDisabled,
|
|
41334
41454
|
layoutChanged
|
|
41335
41455
|
}) {
|
|
41336
|
-
const { reportFilters } = (0,
|
|
41337
|
-
const { dashboardConfig } = (0,
|
|
41338
|
-
const { eventTracking } = (0,
|
|
41339
|
-
const currentReportFilters = (0,
|
|
41456
|
+
const { reportFilters } = (0, import_react42.useContext)(ReportFiltersContext);
|
|
41457
|
+
const { dashboardConfig } = (0, import_react42.useContext)(DashboardConfigContext);
|
|
41458
|
+
const { eventTracking } = (0, import_react42.useContext)(EventTrackingContext);
|
|
41459
|
+
const currentReportFilters = (0, import_react42.useMemo)(() => {
|
|
41340
41460
|
const dashFilters = dashboardConfig[report?.dashboardName ?? ""]?.config.filters;
|
|
41341
41461
|
if (!dashFilters)
|
|
41342
41462
|
return Object.values(reportFilters[report?.id ?? TEMP_REPORT_ID] ?? {});
|
|
@@ -41352,19 +41472,19 @@ function InternalChart({
|
|
|
41352
41472
|
}
|
|
41353
41473
|
});
|
|
41354
41474
|
}, [reportFilters, report?.id]);
|
|
41355
|
-
const reportDateFilter = (0,
|
|
41475
|
+
const reportDateFilter = (0, import_react42.useMemo)(() => {
|
|
41356
41476
|
return Object.values(
|
|
41357
41477
|
reportFilters[report?.id ?? TEMP_REPORT_ID] ?? {}
|
|
41358
41478
|
).find((f) => f.filter.filterType === "date_range")?.filter;
|
|
41359
41479
|
}, [reportFilters, report?.id]);
|
|
41360
|
-
const presetOptions = (0,
|
|
41480
|
+
const presetOptions = (0, import_react42.useMemo)(() => {
|
|
41361
41481
|
return reportDateFilter ? convertPresetOptionsToSelectableList(
|
|
41362
41482
|
reportDateFilter.presetOptions ?? [],
|
|
41363
41483
|
reportDateFilter.defaultPresetRanges ?? []
|
|
41364
41484
|
) : defaultOptionsV2;
|
|
41365
41485
|
}, [reportDateFilter]);
|
|
41366
|
-
const [filterValues, setFilterValues] = (0,
|
|
41367
|
-
(0,
|
|
41486
|
+
const [filterValues, setFilterValues] = (0, import_react42.useState)({});
|
|
41487
|
+
(0, import_react42.useEffect)(() => {
|
|
41368
41488
|
if (reportDateFilter) {
|
|
41369
41489
|
const customDateFilter = filters?.find(
|
|
41370
41490
|
(f) => f.filterType === "date" /* Date */
|
|
@@ -41389,8 +41509,8 @@ function InternalChart({
|
|
|
41389
41509
|
}));
|
|
41390
41510
|
}
|
|
41391
41511
|
}, [filters]);
|
|
41392
|
-
const [theme] = (0,
|
|
41393
|
-
const colorMap = (0,
|
|
41512
|
+
const [theme] = (0, import_react42.useContext)(ThemeContext);
|
|
41513
|
+
const colorMap = (0, import_react42.useMemo)(() => {
|
|
41394
41514
|
if (mapColorsToFields && report && theme) {
|
|
41395
41515
|
return mapColorsToFields(report, theme);
|
|
41396
41516
|
}
|
|
@@ -41472,10 +41592,10 @@ function InternalChart({
|
|
|
41472
41592
|
}));
|
|
41473
41593
|
onDashboardFilterChange(filter.label, filterValue);
|
|
41474
41594
|
};
|
|
41475
|
-
const [filtersExpanded, setFiltersExpanded] = (0,
|
|
41476
|
-
const filtersContainerRef = (0,
|
|
41477
|
-
const [visibleFilters, setVisibleFilters] = (0,
|
|
41478
|
-
const filtersOverflowing = (0,
|
|
41595
|
+
const [filtersExpanded, setFiltersExpanded] = (0, import_react42.useState)(false);
|
|
41596
|
+
const filtersContainerRef = (0, import_react42.useRef)(null);
|
|
41597
|
+
const [visibleFilters, setVisibleFilters] = (0, import_react42.useState)([]);
|
|
41598
|
+
const filtersOverflowing = (0, import_react42.useMemo)(() => {
|
|
41479
41599
|
return visibleFilters.some((visible) => visible);
|
|
41480
41600
|
}, [visibleFilters]);
|
|
41481
41601
|
const measureItems = () => {
|
|
@@ -41490,7 +41610,7 @@ function InternalChart({
|
|
|
41490
41610
|
});
|
|
41491
41611
|
setVisibleFilters(newVisibleItems);
|
|
41492
41612
|
};
|
|
41493
|
-
(0,
|
|
41613
|
+
(0, import_react42.useLayoutEffect)(() => {
|
|
41494
41614
|
requestAnimationFrame(() => measureItems());
|
|
41495
41615
|
const handleResize = () => {
|
|
41496
41616
|
measureItems();
|
|
@@ -41769,7 +41889,7 @@ init_dataFetcher();
|
|
|
41769
41889
|
init_dates();
|
|
41770
41890
|
|
|
41771
41891
|
// src/components/QuillMultiSelectSectionList.tsx
|
|
41772
|
-
var
|
|
41892
|
+
var import_react43 = __toESM(require("react"), 1);
|
|
41773
41893
|
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
41774
41894
|
function QuillMultiSelectSectionList({
|
|
41775
41895
|
options,
|
|
@@ -41785,12 +41905,12 @@ function QuillMultiSelectSectionList({
|
|
|
41785
41905
|
style: style2,
|
|
41786
41906
|
owner
|
|
41787
41907
|
}) {
|
|
41788
|
-
const [theme] = (0,
|
|
41789
|
-
const [showModal, setShowModal] = (0,
|
|
41790
|
-
const modalRef = (0,
|
|
41791
|
-
const buttonRef = (0,
|
|
41792
|
-
const debounceTimeoutId = (0,
|
|
41793
|
-
const [searchQuery, setSearchQuery] =
|
|
41908
|
+
const [theme] = (0, import_react43.useContext)(ThemeContext);
|
|
41909
|
+
const [showModal, setShowModal] = (0, import_react43.useState)(false);
|
|
41910
|
+
const modalRef = (0, import_react43.useRef)(null);
|
|
41911
|
+
const buttonRef = (0, import_react43.useRef)(null);
|
|
41912
|
+
const debounceTimeoutId = (0, import_react43.useRef)(null);
|
|
41913
|
+
const [searchQuery, setSearchQuery] = import_react43.default.useState("");
|
|
41794
41914
|
useOnClickOutside_default(
|
|
41795
41915
|
modalRef,
|
|
41796
41916
|
(event) => {
|
|
@@ -41807,10 +41927,10 @@ function QuillMultiSelectSectionList({
|
|
|
41807
41927
|
onChange(updatedChangeEvent);
|
|
41808
41928
|
}, 200);
|
|
41809
41929
|
};
|
|
41810
|
-
const optionsLength =
|
|
41930
|
+
const optionsLength = import_react43.default.useMemo(() => {
|
|
41811
41931
|
return Object.values(options).reduce((a, b) => a + b.length, 0);
|
|
41812
41932
|
}, [options]);
|
|
41813
|
-
const filteredItems =
|
|
41933
|
+
const filteredItems = import_react43.default.useMemo(() => {
|
|
41814
41934
|
const uuidRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[1-5][0-9a-fA-F]{3}-[89abAB][0-9a-fA-F]{3}-[0-9a-fA-F]{12}$/;
|
|
41815
41935
|
const sample = Object.values(options).find((arr) => arr.length > 0)?.[0];
|
|
41816
41936
|
if (!sample) {
|
|
@@ -41837,10 +41957,10 @@ function QuillMultiSelectSectionList({
|
|
|
41837
41957
|
Object.entries(filteredOptions).filter(([, value2]) => !!value2?.length).sort(([key]) => key === owner ? -1 : 1)
|
|
41838
41958
|
);
|
|
41839
41959
|
}, [options, searchQuery]);
|
|
41840
|
-
const filteredLength =
|
|
41960
|
+
const filteredLength = import_react43.default.useMemo(() => {
|
|
41841
41961
|
return Object.values(filteredItems).reduce((a, b) => a + b.length, 0);
|
|
41842
41962
|
}, [filteredItems]);
|
|
41843
|
-
const selectedOptionsLabel = (0,
|
|
41963
|
+
const selectedOptionsLabel = (0, import_react43.useMemo)(() => {
|
|
41844
41964
|
const valuesLength = Object.values(value).reduce((a, b) => a + b.length, 0);
|
|
41845
41965
|
if (!valuesLength) {
|
|
41846
41966
|
return "Select";
|
|
@@ -42222,7 +42342,7 @@ var ListboxTextInput2 = ({
|
|
|
42222
42342
|
onChange,
|
|
42223
42343
|
placeholder
|
|
42224
42344
|
}) => {
|
|
42225
|
-
const [theme] = (0,
|
|
42345
|
+
const [theme] = (0, import_react43.useContext)(ThemeContext);
|
|
42226
42346
|
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
|
|
42227
42347
|
"div",
|
|
42228
42348
|
{
|
|
@@ -42571,18 +42691,18 @@ function createReportFromForm(formData, report, eventTracking, selectedPivotTabl
|
|
|
42571
42691
|
return newReport;
|
|
42572
42692
|
}
|
|
42573
42693
|
function ChartBuilderWithModal(props) {
|
|
42574
|
-
const parentRef = (0,
|
|
42575
|
-
const [modalWidth, setModalWidth] = (0,
|
|
42576
|
-
const [modalHeight, setModalHeight] = (0,
|
|
42694
|
+
const parentRef = (0, import_react44.useRef)(null);
|
|
42695
|
+
const [modalWidth, setModalWidth] = (0, import_react44.useState)(200);
|
|
42696
|
+
const [modalHeight, setModalHeight] = (0, import_react44.useState)(200);
|
|
42577
42697
|
const { isOpen, setIsOpen, title, isHorizontalView } = props;
|
|
42578
42698
|
const Modal = props.ModalComponent ?? MemoizedModal;
|
|
42579
42699
|
const { dashboardReports: dashboard } = useDashboardReports(
|
|
42580
42700
|
props.destinationDashboard
|
|
42581
42701
|
);
|
|
42582
|
-
const [filtersEnabledState, setFiltersEnabledState] = (0,
|
|
42702
|
+
const [filtersEnabledState, setFiltersEnabledState] = (0, import_react44.useState)(
|
|
42583
42703
|
!!props.reportId
|
|
42584
42704
|
);
|
|
42585
|
-
(0,
|
|
42705
|
+
(0, import_react44.useEffect)(() => {
|
|
42586
42706
|
function handleResize() {
|
|
42587
42707
|
const screenSize = window.innerWidth;
|
|
42588
42708
|
if (screenSize >= 1200) {
|
|
@@ -42687,33 +42807,33 @@ function ChartBuilder({
|
|
|
42687
42807
|
disableSort = true,
|
|
42688
42808
|
runQueryOnMount = false
|
|
42689
42809
|
}) {
|
|
42690
|
-
const [client] = (0,
|
|
42691
|
-
const [theme] = (0,
|
|
42692
|
-
const [schemaData] = (0,
|
|
42693
|
-
const { getToken, quillFetchWithToken } = (0,
|
|
42694
|
-
const { eventTracking } = (0,
|
|
42810
|
+
const [client] = (0, import_react44.useContext)(ClientContext);
|
|
42811
|
+
const [theme] = (0, import_react44.useContext)(ThemeContext);
|
|
42812
|
+
const [schemaData] = (0, import_react44.useContext)(SchemaDataContext);
|
|
42813
|
+
const { getToken, quillFetchWithToken } = (0, import_react44.useContext)(FetchContext);
|
|
42814
|
+
const { eventTracking } = (0, import_react44.useContext)(EventTrackingContext);
|
|
42695
42815
|
const { addReport } = useDashboardReports(destinationDashboard);
|
|
42696
42816
|
const { reload: reloadDashboard } = useDashboardInternal(destinationDashboard);
|
|
42697
42817
|
const { allReportsById } = useAllReports();
|
|
42698
|
-
const { dashboardConfig } = (0,
|
|
42699
|
-
const { tenants, flags } = (0,
|
|
42700
|
-
const report = (0,
|
|
42818
|
+
const { dashboardConfig } = (0, import_react44.useContext)(DashboardConfigContext);
|
|
42819
|
+
const { tenants, flags } = (0, import_react44.useContext)(TenantContext);
|
|
42820
|
+
const report = (0, import_react44.useMemo)(() => {
|
|
42701
42821
|
const resolvedReport = reportId && !tempReport ? allReportsById[reportId] : tempReport;
|
|
42702
42822
|
return resolvedReport;
|
|
42703
42823
|
}, [reportId, tempReport, allReportsById]);
|
|
42704
|
-
const [windowWidth, setWindowWidth] = (0,
|
|
42705
|
-
const [rows, setRows] = (0,
|
|
42706
|
-
const [itemQuery, setItemQuery] = (0,
|
|
42707
|
-
const [rowCount, setRowCount] = (0,
|
|
42708
|
-
const [maxPage, setMaxPage] = (0,
|
|
42709
|
-
const [isLoading, setIsLoading] = (0,
|
|
42710
|
-
const [rowCountIsLoading, setRowCountIsLoading] = (0,
|
|
42711
|
-
const [isSubmitting, setIsSubmitting] = (0,
|
|
42712
|
-
const MIN_FORM_WIDTH =
|
|
42713
|
-
const [pivotCardWidth, setPivotCardWidth] = (0,
|
|
42714
|
-
const [formWidth, setFormWidth] = (0,
|
|
42715
|
-
const inputRef = (0,
|
|
42716
|
-
const selectRef = (0,
|
|
42824
|
+
const [windowWidth, setWindowWidth] = (0, import_react44.useState)(1200);
|
|
42825
|
+
const [rows, setRows] = (0, import_react44.useState)(report?.rows ?? []);
|
|
42826
|
+
const [itemQuery, setItemQuery] = (0, import_react44.useState)(report?.itemQuery);
|
|
42827
|
+
const [rowCount, setRowCount] = (0, import_react44.useState)(report?.rowCount ?? 0);
|
|
42828
|
+
const [maxPage, setMaxPage] = (0, import_react44.useState)(0);
|
|
42829
|
+
const [isLoading, setIsLoading] = (0, import_react44.useState)(false);
|
|
42830
|
+
const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react44.useState)(false);
|
|
42831
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react44.useState)(false);
|
|
42832
|
+
const MIN_FORM_WIDTH = 700;
|
|
42833
|
+
const [pivotCardWidth, setPivotCardWidth] = (0, import_react44.useState)(MIN_FORM_WIDTH);
|
|
42834
|
+
const [formWidth, setFormWidth] = (0, import_react44.useState)(MIN_FORM_WIDTH);
|
|
42835
|
+
const inputRef = (0, import_react44.useRef)(null);
|
|
42836
|
+
const selectRef = (0, import_react44.useRef)(null);
|
|
42717
42837
|
const processColumns = (columns2) => {
|
|
42718
42838
|
if (schemaData.schemaWithCustomFields) {
|
|
42719
42839
|
const newProcessedColumns = columns2?.map((col) => {
|
|
@@ -42743,16 +42863,16 @@ function ChartBuilder({
|
|
|
42743
42863
|
}
|
|
42744
42864
|
return columns2;
|
|
42745
42865
|
};
|
|
42746
|
-
const [processedColumns, setProcessedColumns] = (0,
|
|
42866
|
+
const [processedColumns, setProcessedColumns] = (0, import_react44.useState)(
|
|
42747
42867
|
processColumns(report?.columnInternal ?? [])
|
|
42748
42868
|
);
|
|
42749
|
-
const [currentPage, setCurrentPage] = (0,
|
|
42750
|
-
const parentRef = (0,
|
|
42751
|
-
const deleteRef = (0,
|
|
42869
|
+
const [currentPage, setCurrentPage] = (0, import_react44.useState)(0);
|
|
42870
|
+
const parentRef = (0, import_react44.useRef)(null);
|
|
42871
|
+
const deleteRef = (0, import_react44.useRef)(null);
|
|
42752
42872
|
const modalPadding = 20;
|
|
42753
42873
|
const deleteButtonMargin = -12;
|
|
42754
|
-
const { dashboardFilters } = (0,
|
|
42755
|
-
const specificDashboardFilters = (0,
|
|
42874
|
+
const { dashboardFilters } = (0, import_react44.useContext)(DashboardFiltersContext);
|
|
42875
|
+
const specificDashboardFilters = (0, import_react44.useMemo)(() => {
|
|
42756
42876
|
return Object.values(
|
|
42757
42877
|
dashboardFilters[report?.dashboardName ?? ""] ?? {}
|
|
42758
42878
|
).map((f) => f.filter);
|
|
@@ -42770,7 +42890,7 @@ function ChartBuilder({
|
|
|
42770
42890
|
setFilterIssues([]);
|
|
42771
42891
|
}
|
|
42772
42892
|
};
|
|
42773
|
-
(0,
|
|
42893
|
+
(0, import_react44.useEffect)(() => {
|
|
42774
42894
|
const handleResize = () => {
|
|
42775
42895
|
setWindowWidth(window.innerWidth);
|
|
42776
42896
|
if (inputRef.current && selectRef.current) {
|
|
@@ -42793,17 +42913,17 @@ function ChartBuilder({
|
|
|
42793
42913
|
window.removeEventListener("resize", handleResize);
|
|
42794
42914
|
};
|
|
42795
42915
|
}, [isOpen]);
|
|
42796
|
-
const [dashboardOptions, setDashboardOptions] = (0,
|
|
42916
|
+
const [dashboardOptions, setDashboardOptions] = (0, import_react44.useState)([]);
|
|
42797
42917
|
const {
|
|
42798
42918
|
reportFilters,
|
|
42799
42919
|
loadFiltersForReport,
|
|
42800
42920
|
reportFiltersDispatch,
|
|
42801
42921
|
abortLoadingFilters
|
|
42802
|
-
} = (0,
|
|
42803
|
-
const { reportsDispatch } = (0,
|
|
42804
|
-
const initialFilters = (0,
|
|
42805
|
-
const [reportFiltersLoaded, setReportFiltersLoaded] = (0,
|
|
42806
|
-
(0,
|
|
42922
|
+
} = (0, import_react44.useContext)(ReportFiltersContext);
|
|
42923
|
+
const { reportsDispatch } = (0, import_react44.useContext)(ReportsContext);
|
|
42924
|
+
const initialFilters = (0, import_react44.useRef)(reportFilters[report?.id ?? TEMP_REPORT_ID]);
|
|
42925
|
+
const [reportFiltersLoaded, setReportFiltersLoaded] = (0, import_react44.useState)(!filtersEnabled);
|
|
42926
|
+
(0, import_react44.useEffect)(() => {
|
|
42807
42927
|
if (!reportFilters[report?.id ?? TEMP_REPORT_ID]) {
|
|
42808
42928
|
loadFiltersForReport(
|
|
42809
42929
|
report?.id ?? TEMP_REPORT_ID,
|
|
@@ -42831,25 +42951,25 @@ function ChartBuilder({
|
|
|
42831
42951
|
}
|
|
42832
42952
|
};
|
|
42833
42953
|
}, []);
|
|
42834
|
-
const currentDashboardFilters = (0,
|
|
42954
|
+
const currentDashboardFilters = (0, import_react44.useMemo)(() => {
|
|
42835
42955
|
return Object.values(reportFilters[report?.id ?? TEMP_REPORT_ID] ?? {}).map(
|
|
42836
42956
|
(f) => f.filter
|
|
42837
42957
|
);
|
|
42838
42958
|
}, [reportFilters, report?.id]);
|
|
42839
|
-
const [showFilterModal, setShowFilterModal] = (0,
|
|
42840
|
-
const [filterIssues, setFilterIssues] = (0,
|
|
42841
|
-
const [showPivotPopover, setShowPivotPopover] = (0,
|
|
42842
|
-
const [isEdittingPivot, setIsEdittingPivot] = (0,
|
|
42843
|
-
const [selectedPivotIndex, setSelectedPivotIndex] = (0,
|
|
42844
|
-
const [tableName, setTableName] = (0,
|
|
42845
|
-
const [includeCustomFields, setIncludeCustomFields] = (0,
|
|
42959
|
+
const [showFilterModal, setShowFilterModal] = (0, import_react44.useState)(false);
|
|
42960
|
+
const [filterIssues, setFilterIssues] = (0, import_react44.useState)([]);
|
|
42961
|
+
const [showPivotPopover, setShowPivotPopover] = (0, import_react44.useState)(false);
|
|
42962
|
+
const [isEdittingPivot, setIsEdittingPivot] = (0, import_react44.useState)(false);
|
|
42963
|
+
const [selectedPivotIndex, setSelectedPivotIndex] = (0, import_react44.useState)(-1);
|
|
42964
|
+
const [tableName, setTableName] = (0, import_react44.useState)(void 0);
|
|
42965
|
+
const [includeCustomFields, setIncludeCustomFields] = (0, import_react44.useState)(
|
|
42846
42966
|
report ? !!report.includeCustomFields : !!client?.featureFlags?.customFieldsEnabled
|
|
42847
42967
|
);
|
|
42848
42968
|
const selectedTable = schemaData.schema?.find(
|
|
42849
42969
|
(t) => t.displayName === tableName
|
|
42850
42970
|
);
|
|
42851
|
-
const [pivotPopUpTitle, setPivotPopUpTitle] = (0,
|
|
42852
|
-
const [pivotError, setPivotError] = (0,
|
|
42971
|
+
const [pivotPopUpTitle, setPivotPopUpTitle] = (0, import_react44.useState)("Add pivot");
|
|
42972
|
+
const [pivotError, setPivotError] = (0, import_react44.useState)(void 0);
|
|
42853
42973
|
const pivotData = report?.pivotRows && report?.pivotColumns ? {
|
|
42854
42974
|
rows: report.pivotRows,
|
|
42855
42975
|
columns: report.pivotColumns,
|
|
@@ -42860,19 +42980,19 @@ function ChartBuilder({
|
|
|
42860
42980
|
const columns = report?.columnInternal ?? [];
|
|
42861
42981
|
const destinationDashboardName = report?.dashboardName || destinationDashboard;
|
|
42862
42982
|
const query = report?.queryString;
|
|
42863
|
-
const [loadingFormData, setLoadingFormData] = (0,
|
|
42864
|
-
const [triggeredEditChart, setTriggeredEditChart] = (0,
|
|
42865
|
-
const [createdPivots, setCreatedPivots] = (0,
|
|
42983
|
+
const [loadingFormData, setLoadingFormData] = (0, import_react44.useState)(false);
|
|
42984
|
+
const [triggeredEditChart, setTriggeredEditChart] = (0, import_react44.useState)(false);
|
|
42985
|
+
const [createdPivots, setCreatedPivots] = (0, import_react44.useState)(
|
|
42866
42986
|
report?.pivot ? [report.pivot] : cp
|
|
42867
42987
|
);
|
|
42868
|
-
const [recommendedPivots, setRecommendedPivots] = (0,
|
|
42869
|
-
const [pivotRowField, setPivotRowField] = (0,
|
|
42988
|
+
const [recommendedPivots, setRecommendedPivots] = (0, import_react44.useState)(rp);
|
|
42989
|
+
const [pivotRowField, setPivotRowField] = (0, import_react44.useState)(
|
|
42870
42990
|
report?.pivot?.rowField
|
|
42871
42991
|
);
|
|
42872
|
-
const [pivotColumnField, setPivotColumnField] = (0,
|
|
42992
|
+
const [pivotColumnField, setPivotColumnField] = (0, import_react44.useState)(
|
|
42873
42993
|
report?.pivot?.columnField
|
|
42874
42994
|
);
|
|
42875
|
-
const [pivotAggregations, setPivotAggregations] = (0,
|
|
42995
|
+
const [pivotAggregations, setPivotAggregations] = (0, import_react44.useState)(
|
|
42876
42996
|
report?.pivot?.aggregations ?? [
|
|
42877
42997
|
{
|
|
42878
42998
|
valueField: report?.pivot?.valueField,
|
|
@@ -42881,10 +43001,10 @@ function ChartBuilder({
|
|
|
42881
43001
|
}
|
|
42882
43002
|
]
|
|
42883
43003
|
);
|
|
42884
|
-
const [pivotLimit, setPivotLimit] = (0,
|
|
43004
|
+
const [pivotLimit, setPivotLimit] = (0, import_react44.useState)(
|
|
42885
43005
|
report?.pivot?.rowLimit
|
|
42886
43006
|
);
|
|
42887
|
-
const [pivotSort, setPivotSort] = (0,
|
|
43007
|
+
const [pivotSort, setPivotSort] = (0, import_react44.useState)(
|
|
42888
43008
|
report?.pivot?.sort && report?.pivot?.sortDirection && report?.pivot?.sortField ? {
|
|
42889
43009
|
sortField: report.pivot.sortField,
|
|
42890
43010
|
sortDirection: report.pivot.sortDirection
|
|
@@ -42897,27 +43017,28 @@ function ChartBuilder({
|
|
|
42897
43017
|
rowsPerRequest: report?.chartType === "table" ? 50 : 500
|
|
42898
43018
|
}
|
|
42899
43019
|
};
|
|
42900
|
-
const [currentProcessing, setCurrentProcessing] = (0,
|
|
42901
|
-
const [customTenantAccess, setCustomTenantAccess] = (0,
|
|
43020
|
+
const [currentProcessing, setCurrentProcessing] = (0, import_react44.useState)(baseProcessing);
|
|
43021
|
+
const [customTenantAccess, setCustomTenantAccess] = (0, import_react44.useState)(
|
|
42902
43022
|
report?.flags === null ? false : !!Object.values(report?.flags ?? {}).length
|
|
42903
43023
|
);
|
|
42904
|
-
const [dateFieldOptions, setDateFieldOptions] = (0,
|
|
42905
|
-
const [allTables, setAllTables] = (0,
|
|
42906
|
-
const [customFieldTableRef, setCustomFieldTableRef] = (0,
|
|
42907
|
-
const [referencedColumns, setReferencedColumns] = (0,
|
|
42908
|
-
const [referencedColumnsWithoutStar, setReferencedColumnsWithoutStar] = (0,
|
|
42909
|
-
const [
|
|
42910
|
-
const
|
|
43024
|
+
const [dateFieldOptions, setDateFieldOptions] = (0, import_react44.useState)([]);
|
|
43025
|
+
const [allTables, setAllTables] = (0, import_react44.useState)([]);
|
|
43026
|
+
const [customFieldTableRef, setCustomFieldTableRef] = (0, import_react44.useState)(false);
|
|
43027
|
+
const [referencedColumns, setReferencedColumns] = (0, import_react44.useState)({});
|
|
43028
|
+
const [referencedColumnsWithoutStar, setReferencedColumnsWithoutStar] = (0, import_react44.useState)({});
|
|
43029
|
+
const [referencedTablesLoaded, setReferencedTablesLoaded] = (0, import_react44.useState)(false);
|
|
43030
|
+
const [filterMap, setFilterMap] = (0, import_react44.useState)(report?.filterMap ?? {});
|
|
43031
|
+
const canonicalFilterMap = (0, import_react44.useMemo)(() => {
|
|
42911
43032
|
return Object.fromEntries(
|
|
42912
43033
|
Object.entries(filterMap).filter(
|
|
42913
43034
|
(f) => f[1].table !== void 0 && f[1].field !== void 0
|
|
42914
43035
|
)
|
|
42915
43036
|
);
|
|
42916
43037
|
}, [filterMap]);
|
|
42917
|
-
const validFilter = (0,
|
|
43038
|
+
const validFilter = (0, import_react44.useMemo)(() => {
|
|
42918
43039
|
return specificDashboardFilters.reduce(
|
|
42919
43040
|
(acc, filter) => {
|
|
42920
|
-
if (filter.filterType === "date_range" || filter.filterType === "tenant") {
|
|
43041
|
+
if (filter.filterType === "date_range" || filter.filterType === "tenant" || !referencedTablesLoaded) {
|
|
42921
43042
|
acc[filter.label] = true;
|
|
42922
43043
|
return acc;
|
|
42923
43044
|
}
|
|
@@ -42932,8 +43053,8 @@ function ChartBuilder({
|
|
|
42932
43053
|
},
|
|
42933
43054
|
{}
|
|
42934
43055
|
);
|
|
42935
|
-
}, [specificDashboardFilters, filterMap, allTables]);
|
|
42936
|
-
const [formFlags, setFormFlags] = (0,
|
|
43056
|
+
}, [specificDashboardFilters, filterMap, allTables, referencedTablesLoaded]);
|
|
43057
|
+
const [formFlags, setFormFlags] = (0, import_react44.useState)(
|
|
42937
43058
|
report?.flags ? Object.fromEntries(
|
|
42938
43059
|
Object.entries(report.flags).map(([key, value]) => {
|
|
42939
43060
|
if (value === ALL_TENANTS) {
|
|
@@ -42950,7 +43071,7 @@ function ChartBuilder({
|
|
|
42950
43071
|
})
|
|
42951
43072
|
) : void 0
|
|
42952
43073
|
);
|
|
42953
|
-
const [defaultDateField, setDefaultDateField] = (0,
|
|
43074
|
+
const [defaultDateField, setDefaultDateField] = (0, import_react44.useState)({
|
|
42954
43075
|
table: dateFieldOptions[0]?.name || "",
|
|
42955
43076
|
field: dateFieldOptions[0]?.columns[0]?.field || ""
|
|
42956
43077
|
});
|
|
@@ -43129,15 +43250,15 @@ function ChartBuilder({
|
|
|
43129
43250
|
}
|
|
43130
43251
|
return chartBuilderData;
|
|
43131
43252
|
};
|
|
43132
|
-
const [formData, setFormData] = (0,
|
|
43253
|
+
const [formData, setFormData] = (0, import_react44.useState)(
|
|
43133
43254
|
formFormDataFromReport(report, destinationSection ?? getCurrentSection())
|
|
43134
43255
|
);
|
|
43135
|
-
const reportCustomFields = (0,
|
|
43256
|
+
const reportCustomFields = (0, import_react44.useMemo)(() => {
|
|
43136
43257
|
return report?.columnsWithCustomFields?.filter(
|
|
43137
43258
|
(col) => !report?.columns?.some((c) => col.field === c.field)
|
|
43138
43259
|
) ?? [];
|
|
43139
43260
|
}, [report?.columnsWithCustomFields, report?.columns]);
|
|
43140
|
-
const referenceLineQueryResults = (0,
|
|
43261
|
+
const referenceLineQueryResults = (0, import_react44.useMemo)(() => {
|
|
43141
43262
|
return formData?.referenceLines?.map((line) => {
|
|
43142
43263
|
if (line.label === REFERENCE_LINE) {
|
|
43143
43264
|
return [Number(line.y1) || 0, Number(line.y2) || 0];
|
|
@@ -43151,10 +43272,10 @@ function ChartBuilder({
|
|
|
43151
43272
|
);
|
|
43152
43273
|
});
|
|
43153
43274
|
}, [formData?.referenceLines]);
|
|
43154
|
-
const currentDashboard = (0,
|
|
43275
|
+
const currentDashboard = (0, import_react44.useMemo)(() => {
|
|
43155
43276
|
return dashboardConfig[formData.dashboardName ?? report?.dashboardName ?? ""]?.config;
|
|
43156
43277
|
}, [dashboardConfig, formData.dashboardName, report?.dashboardName]);
|
|
43157
|
-
const currentDashboardTenants = (0,
|
|
43278
|
+
const currentDashboardTenants = (0, import_react44.useMemo)(() => {
|
|
43158
43279
|
return currentDashboard?.tenantKeys?.map(
|
|
43159
43280
|
(tenantKey) => client?.allTenantTypes?.find(
|
|
43160
43281
|
(t) => t.tenantField === tenantKey
|
|
@@ -43162,7 +43283,7 @@ function ChartBuilder({
|
|
|
43162
43283
|
) ?? [];
|
|
43163
43284
|
}, [client?.allTenantTypes, currentDashboard?.tenantKeys]);
|
|
43164
43285
|
const dashboardOwner = currentDashboardTenants?.[0];
|
|
43165
|
-
const currentTenantAsFormFlags = (0,
|
|
43286
|
+
const currentTenantAsFormFlags = (0, import_react44.useMemo)(() => {
|
|
43166
43287
|
if (!tenants || !tenants.length) {
|
|
43167
43288
|
return void 0;
|
|
43168
43289
|
}
|
|
@@ -43173,7 +43294,7 @@ function ChartBuilder({
|
|
|
43173
43294
|
const tenantIds = typeof tenants[0] !== "object" ? tenants : tenants[0]?.tenantIds;
|
|
43174
43295
|
return { [tenantField]: tenantIds };
|
|
43175
43296
|
}, [tenants, dashboardOwner]);
|
|
43176
|
-
const invalidColumns = (0,
|
|
43297
|
+
const invalidColumns = (0, import_react44.useMemo)(() => {
|
|
43177
43298
|
if (!rows || !rows.length) {
|
|
43178
43299
|
return [];
|
|
43179
43300
|
}
|
|
@@ -43183,7 +43304,7 @@ function ChartBuilder({
|
|
|
43183
43304
|
const columnsObservedInRows = rows[0] ? Object.keys(rows[0]) : [];
|
|
43184
43305
|
return columns.filter((col) => !columnsObservedInRows.includes(col.field));
|
|
43185
43306
|
}, [rows]);
|
|
43186
|
-
const [chartTypes, setChartTypes] = (0,
|
|
43307
|
+
const [chartTypes, setChartTypes] = (0, import_react44.useState)(
|
|
43187
43308
|
(() => {
|
|
43188
43309
|
const data = formFormDataFromReport(
|
|
43189
43310
|
report,
|
|
@@ -43195,7 +43316,7 @@ function ChartBuilder({
|
|
|
43195
43316
|
);
|
|
43196
43317
|
})()
|
|
43197
43318
|
);
|
|
43198
|
-
const reportContainsCustomFields = (0,
|
|
43319
|
+
const reportContainsCustomFields = (0, import_react44.useMemo)(() => {
|
|
43199
43320
|
const customFieldsMap = schemaData.customFields;
|
|
43200
43321
|
const reportQueryContainsCustomFields = allTables.some((table) => {
|
|
43201
43322
|
const tableColumns = referencedColumnsWithoutStar[table] ?? [];
|
|
@@ -43206,7 +43327,7 @@ function ChartBuilder({
|
|
|
43206
43327
|
});
|
|
43207
43328
|
return reportQueryContainsCustomFields;
|
|
43208
43329
|
}, [allTables, referencedColumnsWithoutStar]);
|
|
43209
|
-
const chartBuilderFormDataContainsCustomFields = (0,
|
|
43330
|
+
const chartBuilderFormDataContainsCustomFields = (0, import_react44.useMemo)(() => {
|
|
43210
43331
|
const customFields = allTables.map((table) => schemaData.customFields?.[table] ?? []).flat();
|
|
43211
43332
|
const customFieldsMap = schemaData.customFields;
|
|
43212
43333
|
const pivotContainsCustomFields = customFields.some(
|
|
@@ -43239,25 +43360,25 @@ function ChartBuilder({
|
|
|
43239
43360
|
formData.dateField,
|
|
43240
43361
|
canonicalFilterMap
|
|
43241
43362
|
]);
|
|
43242
|
-
const customFieldsInTabularColumns = (0,
|
|
43363
|
+
const customFieldsInTabularColumns = (0, import_react44.useMemo)(() => {
|
|
43243
43364
|
const customFields = allTables.map((table) => schemaData.customFields?.[table] ?? []).flat();
|
|
43244
43365
|
return formData.columns.some((col) => {
|
|
43245
43366
|
return customFields.some((field) => field.field === col.field);
|
|
43246
43367
|
});
|
|
43247
43368
|
}, [allTables, formData.columns]);
|
|
43248
|
-
const containsCustomFields = (0,
|
|
43369
|
+
const containsCustomFields = (0, import_react44.useMemo)(() => {
|
|
43249
43370
|
return reportContainsCustomFields || customFieldsInTabularColumns || chartBuilderFormDataContainsCustomFields;
|
|
43250
43371
|
}, [
|
|
43251
43372
|
reportContainsCustomFields,
|
|
43252
43373
|
customFieldsInTabularColumns,
|
|
43253
43374
|
chartBuilderFormDataContainsCustomFields
|
|
43254
43375
|
]);
|
|
43255
|
-
(0,
|
|
43376
|
+
(0, import_react44.useEffect)(() => {
|
|
43256
43377
|
if (!loadingFormData && triggeredEditChart) {
|
|
43257
43378
|
editChart();
|
|
43258
43379
|
}
|
|
43259
43380
|
}, [loadingFormData]);
|
|
43260
|
-
(0,
|
|
43381
|
+
(0, import_react44.useEffect)(() => {
|
|
43261
43382
|
async function getFormData() {
|
|
43262
43383
|
if (!client) {
|
|
43263
43384
|
return;
|
|
@@ -43298,6 +43419,7 @@ function ChartBuilder({
|
|
|
43298
43419
|
setLoadingFormData(false);
|
|
43299
43420
|
return;
|
|
43300
43421
|
}
|
|
43422
|
+
setReferencedTablesLoaded(false);
|
|
43301
43423
|
const result = await getReferencedTables(
|
|
43302
43424
|
client,
|
|
43303
43425
|
curSchemaData,
|
|
@@ -43375,18 +43497,19 @@ function ChartBuilder({
|
|
|
43375
43497
|
curFormData.dateField ?? dateField,
|
|
43376
43498
|
tableNames
|
|
43377
43499
|
);
|
|
43500
|
+
setReferencedTablesLoaded(true);
|
|
43378
43501
|
setLoadingFormData(false);
|
|
43379
43502
|
}
|
|
43380
43503
|
getFormData();
|
|
43381
43504
|
}, []);
|
|
43382
|
-
const ranMountQuery = (0,
|
|
43383
|
-
(0,
|
|
43505
|
+
const ranMountQuery = (0, import_react44.useRef)(false);
|
|
43506
|
+
(0, import_react44.useEffect)(() => {
|
|
43384
43507
|
if (runQueryOnMount && reportFiltersLoaded && filtersEnabled && !ranMountQuery.current) {
|
|
43385
43508
|
ranMountQuery.current = true;
|
|
43386
43509
|
handleRunQuery(baseProcessing, currentDashboardFilters);
|
|
43387
43510
|
}
|
|
43388
43511
|
}, [runQueryOnMount, reportFiltersLoaded, filtersEnabled]);
|
|
43389
|
-
const allTenantMap = (0,
|
|
43512
|
+
const allTenantMap = (0, import_react44.useMemo)(() => {
|
|
43390
43513
|
return client?.allTenantTypes?.reduce(
|
|
43391
43514
|
(acc, tenantType) => {
|
|
43392
43515
|
if (tenantType.scope === "database") {
|
|
@@ -43405,15 +43528,15 @@ function ChartBuilder({
|
|
|
43405
43528
|
{}
|
|
43406
43529
|
) ?? {};
|
|
43407
43530
|
}, [client?.allTenantTypes]);
|
|
43408
|
-
const [selectedPivotTable, setSelectedPivotTable] = (0,
|
|
43409
|
-
const pivotCardTable = (0,
|
|
43531
|
+
const [selectedPivotTable, setSelectedPivotTable] = (0, import_react44.useState)(pivotData);
|
|
43532
|
+
const pivotCardTable = (0, import_react44.useMemo)(() => {
|
|
43410
43533
|
return {
|
|
43411
43534
|
pivot: formData.pivot,
|
|
43412
43535
|
rows: selectedPivotTable?.rows ?? [],
|
|
43413
43536
|
columns: selectedPivotTable?.columns ?? []
|
|
43414
43537
|
};
|
|
43415
43538
|
}, [selectedPivotTable, formData.pivot]);
|
|
43416
|
-
const chartData = (0,
|
|
43539
|
+
const chartData = (0, import_react44.useMemo)(() => {
|
|
43417
43540
|
const data = createReportFromForm(
|
|
43418
43541
|
formData,
|
|
43419
43542
|
report ? { ...report, rowCount } : tempReport,
|
|
@@ -43435,7 +43558,7 @@ function ChartBuilder({
|
|
|
43435
43558
|
rowCount,
|
|
43436
43559
|
currentDashboardFilters
|
|
43437
43560
|
]);
|
|
43438
|
-
const xAxisFormatOptions = (0,
|
|
43561
|
+
const xAxisFormatOptions = (0, import_react44.useMemo)(() => {
|
|
43439
43562
|
return chartData?.chartType === "gauge" ? [
|
|
43440
43563
|
{ value: "whole_number", label: "whole number" },
|
|
43441
43564
|
{ value: "two_decimal_places", label: "two decimal places" },
|
|
@@ -43495,7 +43618,7 @@ function ChartBuilder({
|
|
|
43495
43618
|
setSelectedPivotTable(void 0);
|
|
43496
43619
|
}
|
|
43497
43620
|
};
|
|
43498
|
-
const formattedRows = (0,
|
|
43621
|
+
const formattedRows = (0, import_react44.useMemo)(() => {
|
|
43499
43622
|
if (selectedPivotTable && selectedPivotTable.columns && formData.chartType === "table") {
|
|
43500
43623
|
const columns2 = selectedPivotTable.columns;
|
|
43501
43624
|
columns2.forEach((col, index) => {
|
|
@@ -43590,8 +43713,8 @@ function ChartBuilder({
|
|
|
43590
43713
|
handleRunQuery(baseProcessing, updatedFilters);
|
|
43591
43714
|
});
|
|
43592
43715
|
};
|
|
43593
|
-
const filtersEnabledRef = (0,
|
|
43594
|
-
(0,
|
|
43716
|
+
const filtersEnabledRef = (0, import_react44.useRef)(filtersEnabled);
|
|
43717
|
+
(0, import_react44.useEffect)(() => {
|
|
43595
43718
|
if (filtersEnabledRef.current !== filtersEnabled) {
|
|
43596
43719
|
filtersEnabledRef.current = filtersEnabled;
|
|
43597
43720
|
setCurrentPage(0);
|
|
@@ -44153,7 +44276,7 @@ function ChartBuilder({
|
|
|
44153
44276
|
setIsSubmitting(false);
|
|
44154
44277
|
setTriggeredEditChart(false);
|
|
44155
44278
|
};
|
|
44156
|
-
const memoizedTooltipText = (0,
|
|
44279
|
+
const memoizedTooltipText = (0, import_react44.useMemo)(() => {
|
|
44157
44280
|
const getTooltipText = () => {
|
|
44158
44281
|
if (formData.name === "") {
|
|
44159
44282
|
return "Please enter a name for the chart";
|
|
@@ -45334,16 +45457,22 @@ function ChartBuilder({
|
|
|
45334
45457
|
)
|
|
45335
45458
|
}
|
|
45336
45459
|
),
|
|
45337
|
-
(!formData.dateField?.table || !formData.dateField?.field) && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45338
|
-
|
|
45460
|
+
referencedTablesLoaded && (!formData.dateField?.table || !formData.dateField?.field) && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45461
|
+
"div",
|
|
45339
45462
|
{
|
|
45340
|
-
|
|
45341
|
-
|
|
45342
|
-
|
|
45343
|
-
|
|
45344
|
-
|
|
45463
|
+
style: { marginBottom: 8, marginTop: "auto" },
|
|
45464
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45465
|
+
ExclamationFilledIcon_default,
|
|
45466
|
+
{
|
|
45467
|
+
height: 28,
|
|
45468
|
+
width: 28,
|
|
45469
|
+
style: {
|
|
45470
|
+
color: "#dc143c"
|
|
45471
|
+
}
|
|
45472
|
+
}
|
|
45473
|
+
)
|
|
45345
45474
|
}
|
|
45346
|
-
)
|
|
45475
|
+
)
|
|
45347
45476
|
] }),
|
|
45348
45477
|
specificDashboardFilters.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45349
45478
|
"div",
|
|
@@ -45414,10 +45543,13 @@ function ChartBuilder({
|
|
|
45414
45543
|
hideEmptyOption: true
|
|
45415
45544
|
}
|
|
45416
45545
|
),
|
|
45417
|
-
!validFilter[filter.label] && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45546
|
+
referencedTablesLoaded && !validFilter[filter.label] && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45418
45547
|
"div",
|
|
45419
45548
|
{
|
|
45420
|
-
style: {
|
|
45549
|
+
style: {
|
|
45550
|
+
marginBottom: 8,
|
|
45551
|
+
marginTop: "auto"
|
|
45552
|
+
},
|
|
45421
45553
|
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
45422
45554
|
ExclamationFilledIcon_default,
|
|
45423
45555
|
{
|
|
@@ -45706,21 +45838,6 @@ function DashboardFilterModal({
|
|
|
45706
45838
|
);
|
|
45707
45839
|
}
|
|
45708
45840
|
|
|
45709
|
-
// src/utils/width.ts
|
|
45710
|
-
var updateFirstChildWidth = (containerRef, setState, options = { gap: 0 }) => {
|
|
45711
|
-
if (containerRef.current) {
|
|
45712
|
-
const element = containerRef.current;
|
|
45713
|
-
const totalWidth = element.getBoundingClientRect().width;
|
|
45714
|
-
const gapWidth = options.gap * (element.childElementCount - 1);
|
|
45715
|
-
let siblingsWidth = 0;
|
|
45716
|
-
const children = Array.from(containerRef.current.children);
|
|
45717
|
-
for (let i = 1; i < children.length; i++) {
|
|
45718
|
-
siblingsWidth += children[i].getBoundingClientRect().width;
|
|
45719
|
-
}
|
|
45720
|
-
setState(totalWidth - siblingsWidth - gapWidth);
|
|
45721
|
-
}
|
|
45722
|
-
};
|
|
45723
|
-
|
|
45724
45841
|
// src/SQLEditor.tsx
|
|
45725
45842
|
init_tableProcessing();
|
|
45726
45843
|
init_queryConstructor();
|
|
@@ -46064,7 +46181,7 @@ init_astProcessing();
|
|
|
46064
46181
|
init_constants();
|
|
46065
46182
|
|
|
46066
46183
|
// src/hooks/useLongLoading.tsx
|
|
46067
|
-
var
|
|
46184
|
+
var import_react45 = require("react");
|
|
46068
46185
|
function useLongLoading(isLoading, meta) {
|
|
46069
46186
|
const {
|
|
46070
46187
|
origin,
|
|
@@ -46072,10 +46189,10 @@ function useLongLoading(isLoading, meta) {
|
|
|
46072
46189
|
abnormalLoadTime = 15e3,
|
|
46073
46190
|
loadDescription
|
|
46074
46191
|
} = meta;
|
|
46075
|
-
const [isLongLoading, setIsLongLoading] = (0,
|
|
46076
|
-
const [isAbnormalLoading, setIsAbnormalLoading] = (0,
|
|
46077
|
-
const { eventTracking } = (0,
|
|
46078
|
-
(0,
|
|
46192
|
+
const [isLongLoading, setIsLongLoading] = (0, import_react45.useState)(false);
|
|
46193
|
+
const [isAbnormalLoading, setIsAbnormalLoading] = (0, import_react45.useState)(false);
|
|
46194
|
+
const { eventTracking } = (0, import_react45.useContext)(EventTrackingContext);
|
|
46195
|
+
(0, import_react45.useEffect)(() => {
|
|
46079
46196
|
let longTimer = null;
|
|
46080
46197
|
let abnormalTimer = null;
|
|
46081
46198
|
if (isLoading) {
|
|
@@ -46237,7 +46354,7 @@ function SQLEditor({
|
|
|
46237
46354
|
onDiscardChanges,
|
|
46238
46355
|
onSaveChanges,
|
|
46239
46356
|
onCloseChartBuilder,
|
|
46240
|
-
isChartBuilderEnabled =
|
|
46357
|
+
isChartBuilderEnabled = true,
|
|
46241
46358
|
isAdminEnabled = false,
|
|
46242
46359
|
chartBuilderOptions,
|
|
46243
46360
|
chartBuilderTitle,
|
|
@@ -46257,67 +46374,69 @@ function SQLEditor({
|
|
|
46257
46374
|
onRequestAddVirtualTable
|
|
46258
46375
|
}) {
|
|
46259
46376
|
const computedButtonLabel = addToDashboardButtonLabel === "Add to dashboard" ? reportId || report?.id ? "Save changes" : "Add to dashboard" : addToDashboardButtonLabel;
|
|
46260
|
-
const [sqlPrompt, setSqlPrompt] = (0,
|
|
46261
|
-
const
|
|
46262
|
-
const
|
|
46263
|
-
|
|
46377
|
+
const [sqlPrompt, setSqlPrompt] = (0, import_react46.useState)("");
|
|
46378
|
+
const sqlPromptFormRef = (0, import_react46.useRef)(null);
|
|
46379
|
+
const sqlPromptInputWidth = useResponsiveFirstChildWidth_default(sqlPromptFormRef, {
|
|
46380
|
+
gap: 12,
|
|
46381
|
+
initialWidth: 320,
|
|
46382
|
+
minWidth: 160
|
|
46383
|
+
});
|
|
46384
|
+
const normalizedSqlPromptWidth = sqlPromptInputWidth > 0 ? sqlPromptInputWidth : 160;
|
|
46385
|
+
const [client] = (0, import_react46.useContext)(ClientContext);
|
|
46386
|
+
const [theme] = (0, import_react46.useContext)(ThemeContext);
|
|
46387
|
+
const { tenants, flags } = (0, import_react46.useContext)(TenantContext);
|
|
46264
46388
|
const { dashboards } = useDashboards();
|
|
46265
46389
|
const {
|
|
46266
46390
|
data,
|
|
46267
46391
|
isLoading: dashboardIsLoading,
|
|
46268
46392
|
reload
|
|
46269
46393
|
} = useDashboardInternal(destinationDashboard);
|
|
46270
|
-
const { getToken, quillFetchWithToken } = (0,
|
|
46271
|
-
const { eventTracking } = (0,
|
|
46394
|
+
const { getToken, quillFetchWithToken } = (0, import_react46.useContext)(FetchContext);
|
|
46395
|
+
const { eventTracking } = (0, import_react46.useContext)(EventTrackingContext);
|
|
46272
46396
|
const { allReportsById } = useAllReports();
|
|
46273
|
-
const destinationDashboardConfig = (0,
|
|
46397
|
+
const destinationDashboardConfig = (0, import_react46.useMemo)(() => {
|
|
46274
46398
|
return dashboards?.find((d) => d.name === destinationDashboard);
|
|
46275
46399
|
}, [dashboards, destinationDashboard]);
|
|
46276
|
-
const [query, setQuery] = (0,
|
|
46277
|
-
const [rows, setRows] = (0,
|
|
46278
|
-
const [columns, setColumns] = (0,
|
|
46279
|
-
const [schemaData] = (0,
|
|
46280
|
-
const { dashboardFilters } = (0,
|
|
46281
|
-
const specificDashboardFilters = (0,
|
|
46400
|
+
const [query, setQuery] = (0, import_react46.useState)(defaultQuery);
|
|
46401
|
+
const [rows, setRows] = (0, import_react46.useState)([]);
|
|
46402
|
+
const [columns, setColumns] = (0, import_react46.useState)([]);
|
|
46403
|
+
const [schemaData] = (0, import_react46.useContext)(SchemaDataContext);
|
|
46404
|
+
const { dashboardFilters } = (0, import_react46.useContext)(DashboardFiltersContext);
|
|
46405
|
+
const specificDashboardFilters = (0, import_react46.useMemo)(() => {
|
|
46282
46406
|
return Object.values(
|
|
46283
46407
|
dashboardFilters[report?.dashboardName ?? destinationDashboard ?? ""] ?? {}
|
|
46284
46408
|
).map((f) => f.filter);
|
|
46285
46409
|
}, [dashboardFilters, destinationDashboard]);
|
|
46286
|
-
const [errorMessage, setErrorMessage] = (0,
|
|
46287
|
-
const [sqlResponseLoading, setSqlResponseLoading] = (0,
|
|
46410
|
+
const [errorMessage, setErrorMessage] = (0, import_react46.useState)("");
|
|
46411
|
+
const [sqlResponseLoading, setSqlResponseLoading] = (0, import_react46.useState)(false);
|
|
46288
46412
|
useLongLoading(sqlResponseLoading, {
|
|
46289
46413
|
origin: "SQLEditor",
|
|
46290
46414
|
loadDescription: "Loading SQL response"
|
|
46291
46415
|
});
|
|
46292
|
-
const [sqlQueryLoading, setSqlQueryLoading] = (0,
|
|
46416
|
+
const [sqlQueryLoading, setSqlQueryLoading] = (0, import_react46.useState)(false);
|
|
46293
46417
|
useLongLoading(sqlQueryLoading, {
|
|
46294
46418
|
origin: "SQLEditor",
|
|
46295
46419
|
loadDescription: "Loading SQL query"
|
|
46296
46420
|
});
|
|
46297
|
-
const [isChartBuilderOpen, setIsChartBuilderOpen] = (0,
|
|
46298
|
-
const [displayTable, setDisplayTable] = (0,
|
|
46299
|
-
const [formattedRows, setFormattedRows] = (0,
|
|
46300
|
-
const
|
|
46301
|
-
const
|
|
46302
|
-
const [
|
|
46303
|
-
const [
|
|
46304
|
-
const [
|
|
46305
|
-
const [
|
|
46306
|
-
const [
|
|
46307
|
-
const [maxPage, setMaxPage] = (0, import_react45.useState)(1);
|
|
46308
|
-
const [tableSearchQuery, setTableSearchQuery] = (0, import_react45.useState)("");
|
|
46309
|
-
const [lastSuccessfulQuery, setLastSuccessfulQuery] = (0, import_react45.useState)("");
|
|
46310
|
-
const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react45.useState)(false);
|
|
46311
|
-
const [tempReport, setTempReport] = (0, import_react45.useState)({
|
|
46421
|
+
const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, import_react46.useState)(false);
|
|
46422
|
+
const [displayTable, setDisplayTable] = (0, import_react46.useState)(false);
|
|
46423
|
+
const [formattedRows, setFormattedRows] = (0, import_react46.useState)([]);
|
|
46424
|
+
const [rowCount, setRowCount] = (0, import_react46.useState)(void 0);
|
|
46425
|
+
const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react46.useState)(false);
|
|
46426
|
+
const [maxPage, setMaxPage] = (0, import_react46.useState)(1);
|
|
46427
|
+
const [tableSearchQuery, setTableSearchQuery] = (0, import_react46.useState)("");
|
|
46428
|
+
const [lastSuccessfulQuery, setLastSuccessfulQuery] = (0, import_react46.useState)("");
|
|
46429
|
+
const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react46.useState)(false);
|
|
46430
|
+
const [tempReport, setTempReport] = (0, import_react46.useState)({
|
|
46312
46431
|
...EMPTY_INTERNAL_REPORT,
|
|
46313
46432
|
...report
|
|
46314
46433
|
});
|
|
46315
|
-
const tableRef = (0,
|
|
46316
|
-
const [cachedHeight, setCachedHeight] = (0,
|
|
46434
|
+
const tableRef = (0, import_react46.useRef)(null);
|
|
46435
|
+
const [cachedHeight, setCachedHeight] = (0, import_react46.useState)(0);
|
|
46317
46436
|
const DEFAULT_ROWS_PER_PAGE = 5;
|
|
46318
46437
|
const ROW_HEIGHT = 37;
|
|
46319
46438
|
const TABLE_TAB_HEIGHT = 75;
|
|
46320
|
-
const filteredSchema = (0,
|
|
46439
|
+
const filteredSchema = (0, import_react46.useMemo)(() => {
|
|
46321
46440
|
return schemaData.schemaWithCustomFields?.filter((table) => {
|
|
46322
46441
|
return destinationDashboardConfig?.tenantKeys?.[0] === SINGLE_TENANT || !table.ownerTenantFields || table.ownerTenantFields?.length === 0 || table.ownerTenantFields?.includes(
|
|
46323
46442
|
destinationDashboardConfig?.tenantKeys?.[0] ?? ""
|
|
@@ -46327,17 +46446,17 @@ function SQLEditor({
|
|
|
46327
46446
|
schemaData.schemaWithCustomFields,
|
|
46328
46447
|
destinationDashboardConfig?.tenantKeys
|
|
46329
46448
|
]);
|
|
46330
|
-
(0,
|
|
46449
|
+
(0, import_react46.useEffect)(() => {
|
|
46331
46450
|
if (tableRef.current) {
|
|
46332
46451
|
setCachedHeight(tableRef.current.clientHeight);
|
|
46333
46452
|
}
|
|
46334
46453
|
}, [tableRef.current?.clientHeight]);
|
|
46335
|
-
(0,
|
|
46454
|
+
(0, import_react46.useEffect)(() => {
|
|
46336
46455
|
if (!data && !dashboardIsLoading) {
|
|
46337
46456
|
reload();
|
|
46338
46457
|
}
|
|
46339
46458
|
}, [data, dashboardIsLoading]);
|
|
46340
|
-
(0,
|
|
46459
|
+
(0, import_react46.useEffect)(() => {
|
|
46341
46460
|
const loadReport = async () => {
|
|
46342
46461
|
let reportToLoad;
|
|
46343
46462
|
if (!client) {
|
|
@@ -46390,9 +46509,9 @@ function SQLEditor({
|
|
|
46390
46509
|
rowsPerPage * 10
|
|
46391
46510
|
)
|
|
46392
46511
|
};
|
|
46393
|
-
const [currentPage, setCurrentPage] = (0,
|
|
46394
|
-
const [currentSort, setCurrentSort] = (0,
|
|
46395
|
-
const currentProcessing = (0,
|
|
46512
|
+
const [currentPage, setCurrentPage] = (0, import_react46.useState)(0);
|
|
46513
|
+
const [currentSort, setCurrentSort] = (0, import_react46.useState)(void 0);
|
|
46514
|
+
const currentProcessing = (0, import_react46.useMemo)(() => {
|
|
46396
46515
|
return {
|
|
46397
46516
|
page: {
|
|
46398
46517
|
currentPage,
|
|
@@ -46405,41 +46524,26 @@ function SQLEditor({
|
|
|
46405
46524
|
sort: currentSort
|
|
46406
46525
|
};
|
|
46407
46526
|
}, [currentPage, rowsPerPage, currentSort]);
|
|
46408
|
-
const displayedTableData = (0,
|
|
46527
|
+
const displayedTableData = (0, import_react46.useMemo)(() => {
|
|
46409
46528
|
return filteredSchema?.filter((table) => {
|
|
46410
46529
|
return table.name?.toLowerCase()?.includes(tableSearchQuery.toLowerCase().trim()) || table.columns.some(
|
|
46411
46530
|
(col) => col.field?.toLowerCase()?.includes(tableSearchQuery.toLowerCase().trim())
|
|
46412
46531
|
);
|
|
46413
46532
|
}) ?? [];
|
|
46414
46533
|
}, [tableSearchQuery, schemaData.schemaWithCustomFields]);
|
|
46415
|
-
(0,
|
|
46416
|
-
function handleResize() {
|
|
46417
|
-
updateFirstChildWidth(formRef, setSearchBarWidth, { gap: 12 });
|
|
46418
|
-
updateFirstChildWidth(sidebarRef, setFilterBarWidth, { gap: 12 });
|
|
46419
|
-
setShowSearchBar(true);
|
|
46420
|
-
}
|
|
46421
|
-
(async () => {
|
|
46422
|
-
await new Promise((resolve) => setTimeout(resolve, 30));
|
|
46423
|
-
handleResize();
|
|
46424
|
-
})();
|
|
46425
|
-
window.addEventListener("resize", handleResize);
|
|
46426
|
-
return () => {
|
|
46427
|
-
window.removeEventListener("resize", handleResize);
|
|
46428
|
-
};
|
|
46429
|
-
}, []);
|
|
46430
|
-
(0, import_react45.useEffect)(() => {
|
|
46534
|
+
(0, import_react46.useEffect)(() => {
|
|
46431
46535
|
if (client) {
|
|
46432
46536
|
setRows([]);
|
|
46433
46537
|
setColumns([]);
|
|
46434
46538
|
setDisplayTable(false);
|
|
46435
46539
|
}
|
|
46436
46540
|
}, [client?.publicKey]);
|
|
46437
|
-
(0,
|
|
46541
|
+
(0, import_react46.useEffect)(() => {
|
|
46438
46542
|
if (isChartBuilderOpen === false) {
|
|
46439
46543
|
onCloseChartBuilder && onCloseChartBuilder();
|
|
46440
46544
|
}
|
|
46441
46545
|
}, [isChartBuilderOpen]);
|
|
46442
|
-
const handleRunSqlPrompt = (0,
|
|
46546
|
+
const handleRunSqlPrompt = (0, import_react46.useCallback)(async () => {
|
|
46443
46547
|
if (!client || sqlResponseLoading) {
|
|
46444
46548
|
return;
|
|
46445
46549
|
}
|
|
@@ -46458,7 +46562,7 @@ function SQLEditor({
|
|
|
46458
46562
|
setQuery(resp.message);
|
|
46459
46563
|
setSqlResponseLoading(false);
|
|
46460
46564
|
}, [sqlPrompt, sqlResponseLoading]);
|
|
46461
|
-
const debounceRunSqlPrompt = (0,
|
|
46565
|
+
const debounceRunSqlPrompt = (0, import_react46.useCallback)(
|
|
46462
46566
|
createDebounce(handleRunSqlPrompt, 500),
|
|
46463
46567
|
[handleRunSqlPrompt]
|
|
46464
46568
|
);
|
|
@@ -46695,7 +46799,7 @@ function SQLEditor({
|
|
|
46695
46799
|
}
|
|
46696
46800
|
return getTablesHelper(getSelectFromAST(resp.ast), dbTables, skipStar);
|
|
46697
46801
|
};
|
|
46698
|
-
(0,
|
|
46802
|
+
(0, import_react46.useEffect)(() => {
|
|
46699
46803
|
if (onChangeQuery) {
|
|
46700
46804
|
onChangeQuery(query || "");
|
|
46701
46805
|
}
|
|
@@ -46752,7 +46856,11 @@ function SQLEditor({
|
|
|
46752
46856
|
style: {
|
|
46753
46857
|
paddingTop: 16,
|
|
46754
46858
|
paddingLeft: "20px",
|
|
46755
|
-
paddingRight: "30px"
|
|
46859
|
+
paddingRight: "30px",
|
|
46860
|
+
width: "100%",
|
|
46861
|
+
maxWidth: 350,
|
|
46862
|
+
minWidth: 250,
|
|
46863
|
+
boxSizing: "border-box"
|
|
46756
46864
|
},
|
|
46757
46865
|
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46758
46866
|
TextInputComponent,
|
|
@@ -46763,7 +46871,7 @@ function SQLEditor({
|
|
|
46763
46871
|
},
|
|
46764
46872
|
value: tableSearchQuery,
|
|
46765
46873
|
id: "edit-name",
|
|
46766
|
-
width:
|
|
46874
|
+
width: "100%"
|
|
46767
46875
|
}
|
|
46768
46876
|
)
|
|
46769
46877
|
}
|
|
@@ -46783,7 +46891,7 @@ function SQLEditor({
|
|
|
46783
46891
|
]
|
|
46784
46892
|
}
|
|
46785
46893
|
),
|
|
46786
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.
|
|
46894
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46787
46895
|
"div",
|
|
46788
46896
|
{
|
|
46789
46897
|
style: {
|
|
@@ -46795,391 +46903,385 @@ function SQLEditor({
|
|
|
46795
46903
|
height: "100%",
|
|
46796
46904
|
overflowX: "hidden"
|
|
46797
46905
|
},
|
|
46798
|
-
children:
|
|
46799
|
-
|
|
46800
|
-
|
|
46801
|
-
{
|
|
46802
|
-
|
|
46803
|
-
|
|
46804
|
-
|
|
46805
|
-
|
|
46806
|
-
|
|
46807
|
-
|
|
46808
|
-
|
|
46809
|
-
|
|
46810
|
-
|
|
46811
|
-
|
|
46812
|
-
|
|
46813
|
-
|
|
46814
|
-
|
|
46815
|
-
|
|
46816
|
-
|
|
46817
|
-
|
|
46818
|
-
|
|
46819
|
-
|
|
46820
|
-
|
|
46821
|
-
|
|
46822
|
-
|
|
46823
|
-
|
|
46824
|
-
|
|
46825
|
-
|
|
46826
|
-
|
|
46827
|
-
|
|
46828
|
-
|
|
46829
|
-
|
|
46830
|
-
|
|
46831
|
-
|
|
46832
|
-
id: "ai-search",
|
|
46833
|
-
value: sqlPrompt,
|
|
46834
|
-
width: searchBarWidth,
|
|
46835
|
-
onChange: (e) => setSqlPrompt(e.target.value),
|
|
46836
|
-
placeholder: "Ask a question..."
|
|
46837
|
-
}
|
|
46838
|
-
),
|
|
46839
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46840
|
-
QuillToolTip,
|
|
46841
|
-
{
|
|
46842
|
-
text: "Prompt must be less than 500 characters",
|
|
46843
|
-
enabled: sqlPrompt.trim().length > 500,
|
|
46844
|
-
displayBelow: true,
|
|
46845
|
-
textStyle: {
|
|
46846
|
-
maxWidth: "77px",
|
|
46847
|
-
whiteSpace: "normal"
|
|
46848
|
-
},
|
|
46849
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46850
|
-
ButtonComponent,
|
|
46851
|
-
{
|
|
46852
|
-
onClick: debounceRunSqlPrompt,
|
|
46853
|
-
label: "Ask AI",
|
|
46854
|
-
isLoading: sqlResponseLoading,
|
|
46855
|
-
disabled: sqlPrompt.trim().length > 500
|
|
46856
|
-
}
|
|
46857
|
-
)
|
|
46858
|
-
}
|
|
46859
|
-
)
|
|
46860
|
-
]
|
|
46861
|
-
}
|
|
46862
|
-
),
|
|
46863
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46864
|
-
"div",
|
|
46865
|
-
{
|
|
46866
|
-
style: {
|
|
46867
|
-
minHeight: "max(210px, 20vh)",
|
|
46868
|
-
maxHeight: "30%",
|
|
46869
|
-
height: "20vh"
|
|
46870
|
-
},
|
|
46871
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46872
|
-
SQLEditorComponent,
|
|
46906
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46907
|
+
"div",
|
|
46908
|
+
{
|
|
46909
|
+
style: {
|
|
46910
|
+
display: "flex",
|
|
46911
|
+
flexDirection: "column",
|
|
46912
|
+
overflow: addToDashboardButtonLabel === "Add to dashboard" ? "visible" : "auto",
|
|
46913
|
+
height: "100%"
|
|
46914
|
+
},
|
|
46915
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(OverflowContainer, { children: [
|
|
46916
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
46917
|
+
"form",
|
|
46918
|
+
{
|
|
46919
|
+
ref: sqlPromptFormRef,
|
|
46920
|
+
onSubmit: (e) => {
|
|
46921
|
+
e.preventDefault();
|
|
46922
|
+
if (sqlPrompt.trim().length > 500) {
|
|
46923
|
+
return;
|
|
46924
|
+
}
|
|
46925
|
+
debounceRunSqlPrompt();
|
|
46926
|
+
},
|
|
46927
|
+
style: {
|
|
46928
|
+
display: "flex",
|
|
46929
|
+
flexDirection: "row",
|
|
46930
|
+
gap: 12,
|
|
46931
|
+
paddingTop: 16,
|
|
46932
|
+
paddingBottom: 16,
|
|
46933
|
+
flexWrap: "wrap",
|
|
46934
|
+
alignItems: "stretch",
|
|
46935
|
+
visibility: normalizedSqlPromptWidth > 0 ? "visible" : "hidden"
|
|
46936
|
+
},
|
|
46937
|
+
children: [
|
|
46938
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46939
|
+
TextInputComponent,
|
|
46873
46940
|
{
|
|
46874
|
-
|
|
46875
|
-
|
|
46876
|
-
|
|
46877
|
-
|
|
46878
|
-
|
|
46879
|
-
handleRunQuery: () => {
|
|
46880
|
-
handleRunQuery(currentProcessing, true);
|
|
46881
|
-
},
|
|
46882
|
-
handleFixWithAI,
|
|
46883
|
-
isNewQueryEnabled,
|
|
46884
|
-
runQueryOnMount,
|
|
46885
|
-
handleClearQuery,
|
|
46886
|
-
theme,
|
|
46887
|
-
defineEditorTheme,
|
|
46888
|
-
setEditorTheme,
|
|
46889
|
-
setEditorMounted: () => {
|
|
46890
|
-
},
|
|
46891
|
-
ButtonComponent,
|
|
46892
|
-
SecondaryButtonComponent,
|
|
46893
|
-
loading: sqlResponseLoading && schemaData.isSchemaLoading && dashboardIsLoading,
|
|
46894
|
-
LoadingComponent
|
|
46941
|
+
id: "ai-search",
|
|
46942
|
+
value: sqlPrompt,
|
|
46943
|
+
width: normalizedSqlPromptWidth,
|
|
46944
|
+
onChange: (e) => setSqlPrompt(e.target.value),
|
|
46945
|
+
placeholder: "Ask a question..."
|
|
46895
46946
|
}
|
|
46896
|
-
)
|
|
46897
|
-
|
|
46898
|
-
|
|
46899
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46900
|
-
"div",
|
|
46901
|
-
{
|
|
46902
|
-
style: {
|
|
46903
|
-
display: "flex",
|
|
46904
|
-
flexDirection: "row",
|
|
46905
|
-
width: "100%",
|
|
46906
|
-
justifyContent: addToDashboardButtonLabel === "Add to dashboard" ? "flex-end" : "flex-start"
|
|
46907
|
-
},
|
|
46908
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46909
|
-
"div",
|
|
46947
|
+
),
|
|
46948
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46949
|
+
QuillToolTip,
|
|
46910
46950
|
{
|
|
46911
|
-
|
|
46912
|
-
|
|
46913
|
-
|
|
46914
|
-
|
|
46915
|
-
|
|
46951
|
+
text: "Prompt must be less than 500 characters",
|
|
46952
|
+
enabled: sqlPrompt.trim().length > 500,
|
|
46953
|
+
displayBelow: true,
|
|
46954
|
+
textStyle: {
|
|
46955
|
+
maxWidth: "77px",
|
|
46956
|
+
whiteSpace: "normal"
|
|
46916
46957
|
},
|
|
46917
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime66.
|
|
46918
|
-
|
|
46919
|
-
|
|
46920
|
-
|
|
46921
|
-
|
|
46922
|
-
|
|
46923
|
-
|
|
46924
|
-
|
|
46925
|
-
|
|
46926
|
-
},
|
|
46927
|
-
true,
|
|
46928
|
-
false,
|
|
46929
|
-
true
|
|
46930
|
-
);
|
|
46931
|
-
},
|
|
46932
|
-
label: "Run query"
|
|
46933
|
-
}
|
|
46934
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46935
|
-
ButtonComponent,
|
|
46936
|
-
{
|
|
46937
|
-
onClick: () => {
|
|
46938
|
-
handleRunQuery(
|
|
46939
|
-
{
|
|
46940
|
-
page: pagination,
|
|
46941
|
-
sort: void 0
|
|
46942
|
-
},
|
|
46943
|
-
true,
|
|
46944
|
-
false,
|
|
46945
|
-
true
|
|
46946
|
-
);
|
|
46947
|
-
},
|
|
46948
|
-
label: "Run query"
|
|
46949
|
-
}
|
|
46950
|
-
),
|
|
46951
|
-
isAdminEnabled && !report && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46952
|
-
SecondaryButtonComponent,
|
|
46953
|
-
{
|
|
46954
|
-
disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
|
|
46955
|
-
onClick: async () => {
|
|
46956
|
-
const isSelectStar = isSimpleSelectStarQuery(
|
|
46957
|
-
query ?? ""
|
|
46958
|
-
);
|
|
46959
|
-
let tables = [];
|
|
46960
|
-
let customFieldColumns = [];
|
|
46961
|
-
if (client && isSelectStar && schemaData.customFields) {
|
|
46962
|
-
const { referencedTablesAndColumns } = await getReferencedTables(
|
|
46963
|
-
client,
|
|
46964
|
-
query ?? "",
|
|
46965
|
-
schemaData.schemaWithCustomFields,
|
|
46966
|
-
isSelectStar
|
|
46967
|
-
);
|
|
46968
|
-
tables = referencedTablesAndColumns.map(
|
|
46969
|
-
(ref) => ref.name
|
|
46970
|
-
);
|
|
46971
|
-
customFieldColumns = tables.map((table) => {
|
|
46972
|
-
return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
|
|
46973
|
-
}).flat();
|
|
46974
|
-
}
|
|
46975
|
-
setTempReport({
|
|
46976
|
-
...tempReport,
|
|
46977
|
-
id: TEMP_REPORT_ID,
|
|
46978
|
-
rows,
|
|
46979
|
-
columns: isSelectStar ? (
|
|
46980
|
-
// so Automatic Custom Fields can be applied
|
|
46981
|
-
columns.filter(
|
|
46982
|
-
(col) => {
|
|
46983
|
-
return !customFieldColumns.includes(
|
|
46984
|
-
col.field
|
|
46985
|
-
);
|
|
46986
|
-
}
|
|
46987
|
-
)
|
|
46988
|
-
) : columns,
|
|
46989
|
-
includeCustomFields: isSelectStar,
|
|
46990
|
-
columnInternal: columns,
|
|
46991
|
-
rowCount: rowCount ?? 0,
|
|
46992
|
-
queryString: query ?? "",
|
|
46993
|
-
chartType: "table",
|
|
46994
|
-
dashboardName: destinationDashboard
|
|
46995
|
-
});
|
|
46996
|
-
setIsSaveQueryModalOpen(true);
|
|
46997
|
-
},
|
|
46998
|
-
label: "Save query"
|
|
46999
|
-
}
|
|
47000
|
-
),
|
|
47001
|
-
isNewQueryEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47002
|
-
SecondaryButtonComponent,
|
|
47003
|
-
{
|
|
47004
|
-
onClick: handleClearQuery,
|
|
47005
|
-
label: "Clear query"
|
|
47006
|
-
}
|
|
47007
|
-
),
|
|
47008
|
-
computedButtonLabel === "Add to dashboard" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47009
|
-
ButtonComponent,
|
|
47010
|
-
{
|
|
47011
|
-
onClick: async () => {
|
|
47012
|
-
onSaveChanges && onSaveChanges();
|
|
47013
|
-
const isSelectStar = isSimpleSelectStarQuery(
|
|
47014
|
-
query ?? ""
|
|
47015
|
-
);
|
|
47016
|
-
let tables = [];
|
|
47017
|
-
let customFieldColumns = [];
|
|
47018
|
-
if (client && isSelectStar && schemaData.customFields) {
|
|
47019
|
-
const { referencedTablesAndColumns } = await getReferencedTables(
|
|
47020
|
-
client,
|
|
47021
|
-
query ?? "",
|
|
47022
|
-
filteredSchema,
|
|
47023
|
-
isSelectStar
|
|
47024
|
-
);
|
|
47025
|
-
tables = referencedTablesAndColumns.map(
|
|
47026
|
-
(ref) => ref.name
|
|
47027
|
-
);
|
|
47028
|
-
customFieldColumns = tables.map((table) => {
|
|
47029
|
-
return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
|
|
47030
|
-
}).flat();
|
|
47031
|
-
}
|
|
47032
|
-
const newTempReport = {
|
|
47033
|
-
...tempReport,
|
|
47034
|
-
id: reportId || report?.id || TEMP_REPORT_ID,
|
|
47035
|
-
rows,
|
|
47036
|
-
columns: isSelectStar ? (
|
|
47037
|
-
// so Automatic Custom Fields can be applied
|
|
47038
|
-
columns.filter(
|
|
47039
|
-
(col) => {
|
|
47040
|
-
return !customFieldColumns.includes(
|
|
47041
|
-
col.field
|
|
47042
|
-
);
|
|
47043
|
-
}
|
|
47044
|
-
)
|
|
47045
|
-
) : columns,
|
|
47046
|
-
includeCustomFields: isSelectStar,
|
|
47047
|
-
columnInternal: columns,
|
|
47048
|
-
rowCount: rowCount ?? 0,
|
|
47049
|
-
queryString: query ?? "",
|
|
47050
|
-
dashboardName: report?.dashboardName ?? destinationDashboard
|
|
47051
|
-
};
|
|
47052
|
-
setTempReport(newTempReport);
|
|
47053
|
-
setIsChartBuilderOpen(true);
|
|
47054
|
-
},
|
|
47055
|
-
label: computedButtonLabel,
|
|
47056
|
-
disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
|
|
47057
|
-
tooltipText: !!errorMessage || !(lastSuccessfulQuery === query) ? "Please run a query" : ""
|
|
47058
|
-
}
|
|
47059
|
-
)
|
|
47060
|
-
] })
|
|
46958
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46959
|
+
ButtonComponent,
|
|
46960
|
+
{
|
|
46961
|
+
onClick: debounceRunSqlPrompt,
|
|
46962
|
+
label: "Ask AI",
|
|
46963
|
+
isLoading: sqlResponseLoading,
|
|
46964
|
+
disabled: sqlPrompt.trim().length > 500
|
|
46965
|
+
}
|
|
46966
|
+
)
|
|
47061
46967
|
}
|
|
47062
46968
|
)
|
|
47063
|
-
|
|
47064
|
-
|
|
47065
|
-
|
|
47066
|
-
|
|
47067
|
-
|
|
47068
|
-
|
|
47069
|
-
|
|
47070
|
-
|
|
47071
|
-
|
|
47072
|
-
|
|
47073
|
-
|
|
47074
|
-
|
|
47075
|
-
|
|
47076
|
-
|
|
47077
|
-
|
|
47078
|
-
|
|
46969
|
+
]
|
|
46970
|
+
}
|
|
46971
|
+
),
|
|
46972
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46973
|
+
"div",
|
|
46974
|
+
{
|
|
46975
|
+
style: {
|
|
46976
|
+
minHeight: "max(210px, 20vh)",
|
|
46977
|
+
maxHeight: "30%",
|
|
46978
|
+
height: "20vh"
|
|
46979
|
+
},
|
|
46980
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
46981
|
+
SQLEditorComponent,
|
|
46982
|
+
{
|
|
46983
|
+
query: query || "",
|
|
46984
|
+
schema: filteredSchema,
|
|
46985
|
+
databaseType: client?.databaseType ?? "postgresql",
|
|
46986
|
+
clientName: client?.publicKey || "",
|
|
46987
|
+
setQuery,
|
|
46988
|
+
handleRunQuery: () => {
|
|
46989
|
+
handleRunQuery(currentProcessing, true);
|
|
46990
|
+
},
|
|
46991
|
+
handleFixWithAI,
|
|
46992
|
+
isNewQueryEnabled,
|
|
46993
|
+
runQueryOnMount,
|
|
46994
|
+
handleClearQuery,
|
|
46995
|
+
theme,
|
|
46996
|
+
defineEditorTheme,
|
|
46997
|
+
setEditorTheme,
|
|
46998
|
+
setEditorMounted: () => {
|
|
46999
|
+
},
|
|
47000
|
+
ButtonComponent,
|
|
47001
|
+
SecondaryButtonComponent,
|
|
47002
|
+
loading: sqlResponseLoading && schemaData.isSchemaLoading && dashboardIsLoading,
|
|
47003
|
+
LoadingComponent
|
|
47004
|
+
}
|
|
47005
|
+
)
|
|
47006
|
+
}
|
|
47007
|
+
),
|
|
47008
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47009
|
+
"div",
|
|
47010
|
+
{
|
|
47011
|
+
style: {
|
|
47012
|
+
display: "flex",
|
|
47013
|
+
flexDirection: "row",
|
|
47014
|
+
width: "100%",
|
|
47015
|
+
justifyContent: addToDashboardButtonLabel === "Add to dashboard" ? "flex-end" : "flex-start"
|
|
47016
|
+
},
|
|
47017
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47018
|
+
"div",
|
|
47019
|
+
{
|
|
47020
|
+
style: {
|
|
47021
|
+
display: "flex",
|
|
47022
|
+
flexDirection: "row",
|
|
47023
|
+
alignItems: "center",
|
|
47024
|
+
height: 70
|
|
47025
|
+
},
|
|
47026
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
47079
47027
|
"div",
|
|
47080
47028
|
{
|
|
47081
47029
|
style: {
|
|
47082
|
-
|
|
47083
|
-
|
|
47084
|
-
fontSize: 15,
|
|
47085
|
-
fontWeight: "400",
|
|
47086
|
-
width: "100%"
|
|
47030
|
+
display: "flex",
|
|
47031
|
+
gap: 12
|
|
47087
47032
|
},
|
|
47088
|
-
children:
|
|
47089
|
-
"
|
|
47090
|
-
|
|
47091
|
-
|
|
47092
|
-
|
|
47093
|
-
|
|
47094
|
-
|
|
47095
|
-
|
|
47096
|
-
|
|
47097
|
-
|
|
47098
|
-
|
|
47099
|
-
|
|
47100
|
-
|
|
47101
|
-
|
|
47102
|
-
|
|
47103
|
-
|
|
47104
|
-
|
|
47105
|
-
|
|
47106
|
-
|
|
47107
|
-
|
|
47108
|
-
|
|
47109
|
-
|
|
47033
|
+
children: [
|
|
47034
|
+
computedButtonLabel === "Add to dashboard" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47035
|
+
SecondaryButtonComponent,
|
|
47036
|
+
{
|
|
47037
|
+
onClick: () => {
|
|
47038
|
+
handleRunQuery(
|
|
47039
|
+
{
|
|
47040
|
+
page: pagination,
|
|
47041
|
+
sort: void 0
|
|
47042
|
+
},
|
|
47043
|
+
true,
|
|
47044
|
+
false,
|
|
47045
|
+
true
|
|
47046
|
+
);
|
|
47047
|
+
},
|
|
47048
|
+
label: "Run query"
|
|
47049
|
+
}
|
|
47050
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47051
|
+
SecondaryButtonComponent,
|
|
47052
|
+
{
|
|
47053
|
+
onClick: () => {
|
|
47054
|
+
handleRunQuery(
|
|
47055
|
+
{
|
|
47056
|
+
page: pagination,
|
|
47057
|
+
sort: void 0
|
|
47058
|
+
},
|
|
47059
|
+
true,
|
|
47060
|
+
false,
|
|
47061
|
+
true
|
|
47062
|
+
);
|
|
47063
|
+
},
|
|
47064
|
+
label: "Run query"
|
|
47065
|
+
}
|
|
47066
|
+
),
|
|
47067
|
+
isChartBuilderEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47068
|
+
"div",
|
|
47069
|
+
{
|
|
47070
|
+
style: {
|
|
47071
|
+
display: "flex",
|
|
47072
|
+
flexDirection: "row",
|
|
47073
|
+
alignItems: "center",
|
|
47074
|
+
justifyContent: "flex-end",
|
|
47075
|
+
width: "100%"
|
|
47076
|
+
},
|
|
47077
|
+
children: computedButtonLabel !== "Add to dashboard" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47078
|
+
ButtonComponent,
|
|
47110
47079
|
{
|
|
47111
|
-
onClick:
|
|
47112
|
-
|
|
47080
|
+
onClick: async () => {
|
|
47081
|
+
onSaveChanges && onSaveChanges();
|
|
47082
|
+
setIsChartBuilderOpen(true);
|
|
47083
|
+
},
|
|
47084
|
+
label: computedButtonLabel,
|
|
47085
|
+
disabled: !!errorMessage || !(lastSuccessfulQuery === query)
|
|
47086
|
+
}
|
|
47087
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47088
|
+
ButtonComponent,
|
|
47089
|
+
{
|
|
47090
|
+
onClick: async () => {
|
|
47091
|
+
onSaveChanges && onSaveChanges();
|
|
47092
|
+
const isSelectStar = isSimpleSelectStarQuery(query ?? "");
|
|
47093
|
+
let tables = [];
|
|
47094
|
+
let customFieldColumns = [];
|
|
47095
|
+
if (client && isSelectStar && schemaData.customFields) {
|
|
47096
|
+
const { referencedTablesAndColumns } = await getReferencedTables(
|
|
47097
|
+
client,
|
|
47098
|
+
query ?? "",
|
|
47099
|
+
filteredSchema,
|
|
47100
|
+
isSelectStar
|
|
47101
|
+
);
|
|
47102
|
+
tables = referencedTablesAndColumns.map(
|
|
47103
|
+
(ref) => ref.name
|
|
47104
|
+
);
|
|
47105
|
+
customFieldColumns = tables.map((table) => {
|
|
47106
|
+
return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
|
|
47107
|
+
}).flat();
|
|
47108
|
+
}
|
|
47109
|
+
const newTempReport = {
|
|
47110
|
+
...tempReport,
|
|
47111
|
+
id: reportId || report?.id || TEMP_REPORT_ID,
|
|
47112
|
+
rows,
|
|
47113
|
+
columns: isSelectStar ? (
|
|
47114
|
+
// so Automatic Custom Fields can be applied
|
|
47115
|
+
columns.filter(
|
|
47116
|
+
(col) => {
|
|
47117
|
+
return !customFieldColumns.includes(
|
|
47118
|
+
col.field
|
|
47119
|
+
);
|
|
47120
|
+
}
|
|
47121
|
+
)
|
|
47122
|
+
) : columns,
|
|
47123
|
+
includeCustomFields: isSelectStar,
|
|
47124
|
+
columnInternal: columns,
|
|
47125
|
+
rowCount: rowCount ?? 0,
|
|
47126
|
+
queryString: query ?? "",
|
|
47127
|
+
dashboardName: report?.dashboardName ?? destinationDashboard
|
|
47128
|
+
};
|
|
47129
|
+
setTempReport(newTempReport);
|
|
47130
|
+
setIsChartBuilderOpen(true);
|
|
47131
|
+
},
|
|
47132
|
+
label: computedButtonLabel,
|
|
47133
|
+
disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
|
|
47134
|
+
tooltipText: !!errorMessage || !(lastSuccessfulQuery === query) ? "Please run a query" : ""
|
|
47113
47135
|
}
|
|
47114
47136
|
)
|
|
47115
|
-
|
|
47116
|
-
|
|
47117
|
-
|
|
47118
|
-
|
|
47119
|
-
|
|
47120
|
-
|
|
47121
|
-
|
|
47122
|
-
|
|
47123
|
-
|
|
47124
|
-
|
|
47125
|
-
|
|
47126
|
-
|
|
47127
|
-
|
|
47128
|
-
|
|
47129
|
-
|
|
47130
|
-
|
|
47131
|
-
|
|
47132
|
-
|
|
47133
|
-
|
|
47134
|
-
|
|
47135
|
-
|
|
47136
|
-
|
|
47137
|
-
|
|
47138
|
-
|
|
47137
|
+
}
|
|
47138
|
+
),
|
|
47139
|
+
isAdminEnabled && !report && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47140
|
+
SecondaryButtonComponent,
|
|
47141
|
+
{
|
|
47142
|
+
disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
|
|
47143
|
+
onClick: async () => {
|
|
47144
|
+
const isSelectStar = isSimpleSelectStarQuery(
|
|
47145
|
+
query ?? ""
|
|
47146
|
+
);
|
|
47147
|
+
let tables = [];
|
|
47148
|
+
let customFieldColumns = [];
|
|
47149
|
+
if (client && isSelectStar && schemaData.customFields) {
|
|
47150
|
+
const { referencedTablesAndColumns } = await getReferencedTables(
|
|
47151
|
+
client,
|
|
47152
|
+
query ?? "",
|
|
47153
|
+
schemaData.schemaWithCustomFields,
|
|
47154
|
+
isSelectStar
|
|
47155
|
+
);
|
|
47156
|
+
tables = referencedTablesAndColumns.map(
|
|
47157
|
+
(ref) => ref.name
|
|
47158
|
+
);
|
|
47159
|
+
customFieldColumns = tables.map((table) => {
|
|
47160
|
+
return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
|
|
47161
|
+
}).flat();
|
|
47162
|
+
}
|
|
47163
|
+
setTempReport({
|
|
47164
|
+
...tempReport,
|
|
47165
|
+
id: TEMP_REPORT_ID,
|
|
47166
|
+
rows,
|
|
47167
|
+
columns: isSelectStar ? (
|
|
47168
|
+
// so Automatic Custom Fields can be applied
|
|
47169
|
+
columns.filter(
|
|
47170
|
+
(col) => {
|
|
47171
|
+
return !customFieldColumns.includes(
|
|
47172
|
+
col.field
|
|
47173
|
+
);
|
|
47174
|
+
}
|
|
47175
|
+
)
|
|
47176
|
+
) : columns,
|
|
47177
|
+
includeCustomFields: isSelectStar,
|
|
47178
|
+
columnInternal: columns,
|
|
47179
|
+
rowCount: rowCount ?? 0,
|
|
47180
|
+
queryString: query ?? "",
|
|
47181
|
+
chartType: "table",
|
|
47182
|
+
dashboardName: destinationDashboard
|
|
47183
|
+
});
|
|
47184
|
+
setIsSaveQueryModalOpen(true);
|
|
47185
|
+
},
|
|
47186
|
+
label: "Save query"
|
|
47187
|
+
}
|
|
47188
|
+
),
|
|
47189
|
+
isNewQueryEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47190
|
+
SecondaryButtonComponent,
|
|
47191
|
+
{
|
|
47192
|
+
onClick: handleClearQuery,
|
|
47193
|
+
label: "Clear query"
|
|
47194
|
+
}
|
|
47195
|
+
)
|
|
47196
|
+
]
|
|
47139
47197
|
}
|
|
47140
|
-
)
|
|
47141
|
-
|
|
47142
|
-
|
|
47143
|
-
|
|
47144
|
-
|
|
47145
|
-
|
|
47146
|
-
|
|
47147
|
-
|
|
47148
|
-
|
|
47149
|
-
|
|
47150
|
-
|
|
47151
|
-
|
|
47152
|
-
|
|
47153
|
-
|
|
47154
|
-
|
|
47155
|
-
|
|
47156
|
-
|
|
47157
|
-
|
|
47158
|
-
|
|
47159
|
-
|
|
47160
|
-
|
|
47161
|
-
|
|
47162
|
-
|
|
47163
|
-
|
|
47164
|
-
|
|
47165
|
-
|
|
47166
|
-
|
|
47167
|
-
|
|
47168
|
-
|
|
47169
|
-
|
|
47170
|
-
|
|
47171
|
-
|
|
47172
|
-
|
|
47173
|
-
|
|
47174
|
-
|
|
47175
|
-
|
|
47176
|
-
|
|
47177
|
-
|
|
47178
|
-
|
|
47179
|
-
|
|
47180
|
-
|
|
47181
|
-
|
|
47182
|
-
|
|
47198
|
+
)
|
|
47199
|
+
}
|
|
47200
|
+
)
|
|
47201
|
+
}
|
|
47202
|
+
),
|
|
47203
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
47204
|
+
"div",
|
|
47205
|
+
{
|
|
47206
|
+
style: {
|
|
47207
|
+
display: "flex",
|
|
47208
|
+
flexDirection: "column",
|
|
47209
|
+
// height: '100%',
|
|
47210
|
+
padding: 0,
|
|
47211
|
+
margin: 0,
|
|
47212
|
+
border: "none",
|
|
47213
|
+
outline: "none"
|
|
47214
|
+
},
|
|
47215
|
+
children: [
|
|
47216
|
+
errorMessage && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47217
|
+
"div",
|
|
47218
|
+
{
|
|
47219
|
+
style: {
|
|
47220
|
+
fontFamily: theme?.fontFamily,
|
|
47221
|
+
color: theme?.primaryTextColor,
|
|
47222
|
+
fontSize: 15,
|
|
47223
|
+
fontWeight: "400",
|
|
47224
|
+
width: "100%"
|
|
47225
|
+
},
|
|
47226
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
47227
|
+
"div",
|
|
47228
|
+
{
|
|
47229
|
+
style: {
|
|
47230
|
+
display: "flex",
|
|
47231
|
+
flexDirection: "row",
|
|
47232
|
+
justifyContent: "space-between",
|
|
47233
|
+
gap: 12,
|
|
47234
|
+
background: "rgba(0,0,0,0.02)",
|
|
47235
|
+
// TODO: change color
|
|
47236
|
+
color: theme?.primaryTextColor,
|
|
47237
|
+
fontFamily: theme?.fontFamily,
|
|
47238
|
+
borderRadius: 6,
|
|
47239
|
+
padding: 20,
|
|
47240
|
+
marginBottom: 15,
|
|
47241
|
+
width: "100%",
|
|
47242
|
+
alignItems: "center"
|
|
47243
|
+
},
|
|
47244
|
+
children: [
|
|
47245
|
+
errorMessage,
|
|
47246
|
+
errorMessage !== "No data found" && errorMessage !== "No query found" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47247
|
+
SecondaryButtonComponent,
|
|
47248
|
+
{
|
|
47249
|
+
onClick: handleFixWithAI,
|
|
47250
|
+
label: "Fix with AI"
|
|
47251
|
+
}
|
|
47252
|
+
)
|
|
47253
|
+
]
|
|
47254
|
+
}
|
|
47255
|
+
)
|
|
47256
|
+
}
|
|
47257
|
+
),
|
|
47258
|
+
errorMessage || !displayTable ? null : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { ref: tableRef, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47259
|
+
TableComponent,
|
|
47260
|
+
{
|
|
47261
|
+
isLoading: sqlQueryLoading,
|
|
47262
|
+
rows: formattedRows,
|
|
47263
|
+
columns,
|
|
47264
|
+
rowCount,
|
|
47265
|
+
rowsPerPage,
|
|
47266
|
+
rowCountIsLoading,
|
|
47267
|
+
onPageChange,
|
|
47268
|
+
onSortChange,
|
|
47269
|
+
containerStyle: {
|
|
47270
|
+
height: "calc(100vh - max(210px, 20vh) - 310px)",
|
|
47271
|
+
minHeight: `calc(${DEFAULT_ROWS_PER_PAGE} * ${ROW_HEIGHT}px + ${TABLE_TAB_HEIGHT}px)`,
|
|
47272
|
+
// at least 10 rows tall
|
|
47273
|
+
maxHeight: "calc(100vh - max(210px, 20vh) - 310px)"
|
|
47274
|
+
},
|
|
47275
|
+
currentPage,
|
|
47276
|
+
setCurrentPage
|
|
47277
|
+
}
|
|
47278
|
+
) })
|
|
47279
|
+
]
|
|
47280
|
+
}
|
|
47281
|
+
)
|
|
47282
|
+
] })
|
|
47283
|
+
}
|
|
47284
|
+
)
|
|
47183
47285
|
}
|
|
47184
47286
|
)
|
|
47185
47287
|
]
|
|
@@ -47323,10 +47425,10 @@ var SQLEditorComponent = ({
|
|
|
47323
47425
|
loading,
|
|
47324
47426
|
LoadingComponent = QuillLoadingComponent
|
|
47325
47427
|
}) => {
|
|
47326
|
-
const [editorKey, setEditorKey] = (0,
|
|
47327
|
-
const { eventTracking } = (0,
|
|
47328
|
-
const currentProvider = (0,
|
|
47329
|
-
(0,
|
|
47428
|
+
const [editorKey, setEditorKey] = (0, import_react46.useState)(0);
|
|
47429
|
+
const { eventTracking } = (0, import_react46.useContext)(EventTrackingContext);
|
|
47430
|
+
const currentProvider = (0, import_react46.useRef)(null);
|
|
47431
|
+
(0, import_react46.useEffect)(() => {
|
|
47330
47432
|
if (currentProvider.current) {
|
|
47331
47433
|
currentProvider.current.dispose();
|
|
47332
47434
|
if (schema && schema.length !== 0) {
|
|
@@ -47370,7 +47472,7 @@ var SQLEditorComponent = ({
|
|
|
47370
47472
|
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(LoadingComponent, {})
|
|
47371
47473
|
}
|
|
47372
47474
|
) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
47373
|
-
|
|
47475
|
+
import_react47.default,
|
|
47374
47476
|
{
|
|
47375
47477
|
height: "100%",
|
|
47376
47478
|
width: "100%",
|
|
@@ -47567,7 +47669,7 @@ function SchemaItem({
|
|
|
47567
47669
|
index,
|
|
47568
47670
|
onClick
|
|
47569
47671
|
}) {
|
|
47570
|
-
const [isOpen, setIsOpen] = (0,
|
|
47672
|
+
const [isOpen, setIsOpen] = (0, import_react46.useState)(index === 0);
|
|
47571
47673
|
const schemaContainerStyle = {
|
|
47572
47674
|
display: "flex",
|
|
47573
47675
|
flexDirection: "column"
|
|
@@ -47794,11 +47896,11 @@ function SchemaItem({
|
|
|
47794
47896
|
}
|
|
47795
47897
|
|
|
47796
47898
|
// src/ReportBuilder.tsx
|
|
47797
|
-
var
|
|
47899
|
+
var import_react54 = require("react");
|
|
47798
47900
|
init_constants();
|
|
47799
47901
|
|
|
47800
47902
|
// src/hooks/useReportBuilder.tsx
|
|
47801
|
-
var
|
|
47903
|
+
var import_react48 = require("react");
|
|
47802
47904
|
init_tableProcessing();
|
|
47803
47905
|
init_ReportBuilder();
|
|
47804
47906
|
init_constants();
|
|
@@ -47818,19 +47920,19 @@ var useReportBuilderInternal = ({
|
|
|
47818
47920
|
rowsPerRequest
|
|
47819
47921
|
}) => {
|
|
47820
47922
|
const { allReportsById } = useAllReports();
|
|
47821
|
-
const [schemaData] = (0,
|
|
47923
|
+
const [schemaData] = (0, import_react48.useContext)(SchemaDataContext);
|
|
47822
47924
|
const { dashboards } = useDashboards();
|
|
47823
47925
|
const {
|
|
47824
47926
|
data,
|
|
47825
47927
|
isLoading: dashboardIsLoading,
|
|
47826
47928
|
reload
|
|
47827
47929
|
} = useDashboardInternal(destinationDashboard);
|
|
47828
|
-
const { getToken } = (0,
|
|
47829
|
-
const { eventTracking } = (0,
|
|
47830
|
-
const destinationDashboardConfig = (0,
|
|
47930
|
+
const { getToken } = (0, import_react48.useContext)(FetchContext);
|
|
47931
|
+
const { eventTracking } = (0, import_react48.useContext)(EventTrackingContext);
|
|
47932
|
+
const destinationDashboardConfig = (0, import_react48.useMemo)(() => {
|
|
47831
47933
|
return dashboards?.find((d) => d.name === destinationDashboard);
|
|
47832
47934
|
}, [dashboards, destinationDashboard]);
|
|
47833
|
-
const filteredSchema = (0,
|
|
47935
|
+
const filteredSchema = (0, import_react48.useMemo)(() => {
|
|
47834
47936
|
return schemaData.schemaWithCustomFields?.filter((table) => {
|
|
47835
47937
|
return destinationDashboardConfig?.tenantKeys?.[0] === SINGLE_TENANT || !table.ownerTenantFields || table.ownerTenantFields?.length === 0 || table.ownerTenantFields?.includes(
|
|
47836
47938
|
destinationDashboardConfig?.tenantKeys?.[0] ?? ""
|
|
@@ -47840,8 +47942,8 @@ var useReportBuilderInternal = ({
|
|
|
47840
47942
|
schemaData.schemaWithCustomFields,
|
|
47841
47943
|
destinationDashboardConfig?.tenantKeys
|
|
47842
47944
|
]);
|
|
47843
|
-
const { tenants } = (0,
|
|
47844
|
-
const [client] = (0,
|
|
47945
|
+
const { tenants } = (0, import_react48.useContext)(TenantContext);
|
|
47946
|
+
const [client] = (0, import_react48.useContext)(ClientContext);
|
|
47845
47947
|
const _rowsPerRequest = rowsPerRequest ?? 100;
|
|
47846
47948
|
const _rowsPerPage = Math.min(rowsPerPage ?? 20, _rowsPerRequest);
|
|
47847
47949
|
const REPORT_BUILDER_PAGINATION = {
|
|
@@ -47849,19 +47951,19 @@ var useReportBuilderInternal = ({
|
|
|
47849
47951
|
rowsPerPage: _rowsPerPage,
|
|
47850
47952
|
rowsPerRequest: _rowsPerRequest
|
|
47851
47953
|
};
|
|
47852
|
-
const [openPopover, setOpenPopover] = (0,
|
|
47853
|
-
const [aiPrompt, setAiPrompt] = (0,
|
|
47854
|
-
const [reportBuilderLoading, setReportBuilderLoading] = (0,
|
|
47855
|
-
const [tableLoading, setTableLoading] = (0,
|
|
47856
|
-
const [errorMessage, setErrorMessage] = (0,
|
|
47857
|
-
const [unresolvedReportMessage, setUnresolvedReportMessage] = (0,
|
|
47858
|
-
const [tables, setTables] = (0,
|
|
47859
|
-
const [columns, setColumns] = (0,
|
|
47860
|
-
const [filterStack, setFilterStack] = (0,
|
|
47861
|
-
const [pivot, setPivot] = (0,
|
|
47862
|
-
const [sort, setSort] = (0,
|
|
47863
|
-
const [limit, setLimit] = (0,
|
|
47864
|
-
const reportBuilderState = (0,
|
|
47954
|
+
const [openPopover, setOpenPopover] = (0, import_react48.useState)(null);
|
|
47955
|
+
const [aiPrompt, setAiPrompt] = (0, import_react48.useState)("");
|
|
47956
|
+
const [reportBuilderLoading, setReportBuilderLoading] = (0, import_react48.useState)(false);
|
|
47957
|
+
const [tableLoading, setTableLoading] = (0, import_react48.useState)(false);
|
|
47958
|
+
const [errorMessage, setErrorMessage] = (0, import_react48.useState)("");
|
|
47959
|
+
const [unresolvedReportMessage, setUnresolvedReportMessage] = (0, import_react48.useState)("");
|
|
47960
|
+
const [tables, setTables] = (0, import_react48.useState)([]);
|
|
47961
|
+
const [columns, setColumns] = (0, import_react48.useState)([]);
|
|
47962
|
+
const [filterStack, setFilterStack] = (0, import_react48.useState)([]);
|
|
47963
|
+
const [pivot, setPivot] = (0, import_react48.useState)(null);
|
|
47964
|
+
const [sort, setSort] = (0, import_react48.useState)([]);
|
|
47965
|
+
const [limit, setLimit] = (0, import_react48.useState)(null);
|
|
47966
|
+
const reportBuilderState = (0, import_react48.useMemo)(() => {
|
|
47865
47967
|
return {
|
|
47866
47968
|
tables,
|
|
47867
47969
|
columns,
|
|
@@ -47871,29 +47973,29 @@ var useReportBuilderInternal = ({
|
|
|
47871
47973
|
limit
|
|
47872
47974
|
};
|
|
47873
47975
|
}, [columns, filterStack, limit, pivot, sort, tables]);
|
|
47874
|
-
const [stateStack, setStateStack] = (0,
|
|
47875
|
-
const [poppedStateStack, setPoppedStateStack] = (0,
|
|
47876
|
-
const [unfilteredUniqueValues, setUnfilteredUniqueValues] = (0,
|
|
47877
|
-
const [unfilteredUniqueValuesIsLoading, setUnfilteredUniqueValuesIsLoading] = (0,
|
|
47878
|
-
const [filteredUniqueValues, setFilteredUniqueValues] = (0,
|
|
47879
|
-
const [filteredUniqueValuesIsLoading, setFilteredUniqueValuesIsLoading] = (0,
|
|
47880
|
-
const [columnUniqueValues, setColumnUniqueValues] = (0,
|
|
47881
|
-
const [dateRanges, setDateRanges] = (0,
|
|
47882
|
-
const [tempReport, setTempReport] = (0,
|
|
47976
|
+
const [stateStack, setStateStack] = (0, import_react48.useState)([]);
|
|
47977
|
+
const [poppedStateStack, setPoppedStateStack] = (0, import_react48.useState)([]);
|
|
47978
|
+
const [unfilteredUniqueValues, setUnfilteredUniqueValues] = (0, import_react48.useState)({});
|
|
47979
|
+
const [unfilteredUniqueValuesIsLoading, setUnfilteredUniqueValuesIsLoading] = (0, import_react48.useState)(false);
|
|
47980
|
+
const [filteredUniqueValues, setFilteredUniqueValues] = (0, import_react48.useState)(null);
|
|
47981
|
+
const [filteredUniqueValuesIsLoading, setFilteredUniqueValuesIsLoading] = (0, import_react48.useState)(false);
|
|
47982
|
+
const [columnUniqueValues, setColumnUniqueValues] = (0, import_react48.useState)({});
|
|
47983
|
+
const [dateRanges, setDateRanges] = (0, import_react48.useState)(null);
|
|
47984
|
+
const [tempReport, setTempReport] = (0, import_react48.useState)({
|
|
47883
47985
|
...EMPTY_INTERNAL_REPORT,
|
|
47884
47986
|
pagination: REPORT_BUILDER_PAGINATION
|
|
47885
47987
|
});
|
|
47886
|
-
const [currentProcessing, setCurrentProcessing] = (0,
|
|
47988
|
+
const [currentProcessing, setCurrentProcessing] = (0, import_react48.useState)({
|
|
47887
47989
|
page: REPORT_BUILDER_PAGINATION
|
|
47888
47990
|
});
|
|
47889
|
-
const [previousPage, setPreviousPage] = (0,
|
|
47890
|
-
const [reportColumns, setReportColumns] = (0,
|
|
47891
|
-
const [reportRows, setReportRows] = (0,
|
|
47892
|
-
const [formattedRows, setFormattedRows] = (0,
|
|
47893
|
-
const [pivotData, setPivotData] = (0,
|
|
47894
|
-
const [numberOfRows, setNumberOfRows] = (0,
|
|
47895
|
-
const [rowCountIsLoading, setRowCountIsLoading] = (0,
|
|
47896
|
-
const reportColumnsToStateColumns = (0,
|
|
47991
|
+
const [previousPage, setPreviousPage] = (0, import_react48.useState)(0);
|
|
47992
|
+
const [reportColumns, setReportColumns] = (0, import_react48.useState)([]);
|
|
47993
|
+
const [reportRows, setReportRows] = (0, import_react48.useState)([]);
|
|
47994
|
+
const [formattedRows, setFormattedRows] = (0, import_react48.useState)([]);
|
|
47995
|
+
const [pivotData, setPivotData] = (0, import_react48.useState)(null);
|
|
47996
|
+
const [numberOfRows, setNumberOfRows] = (0, import_react48.useState)(0);
|
|
47997
|
+
const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react48.useState)(false);
|
|
47998
|
+
const reportColumnsToStateColumns = (0, import_react48.useMemo)(() => {
|
|
47897
47999
|
const positionMap = {};
|
|
47898
48000
|
columns.forEach((column, index) => {
|
|
47899
48001
|
positionMap[column.field] = index;
|
|
@@ -47911,28 +48013,28 @@ var useReportBuilderInternal = ({
|
|
|
47911
48013
|
}
|
|
47912
48014
|
});
|
|
47913
48015
|
}, [columns, reportColumns]);
|
|
47914
|
-
const [pivotRowField, setPivotRowField] = (0,
|
|
48016
|
+
const [pivotRowField, setPivotRowField] = (0, import_react48.useState)(
|
|
47915
48017
|
void 0
|
|
47916
48018
|
);
|
|
47917
|
-
const [pivotColumnField, setPivotColumnField] = (0,
|
|
48019
|
+
const [pivotColumnField, setPivotColumnField] = (0, import_react48.useState)(
|
|
47918
48020
|
void 0
|
|
47919
48021
|
);
|
|
47920
|
-
const [pivotAggregations, setPivotAggregations] = (0,
|
|
47921
|
-
const [pivotLimit, setPivotLimit] = (0,
|
|
47922
|
-
const [pivotSort, setPivotSort] = (0,
|
|
47923
|
-
const [pivotHint, setPivotHint] = (0,
|
|
47924
|
-
const [pivotError, setPivotError] = (0,
|
|
47925
|
-
const [createdPivots, setCreatedPivots] = (0,
|
|
47926
|
-
const [recommendedPivots, setRecommendedPivots] = (0,
|
|
47927
|
-
const [pivotPopUpTitle, setPivotPopUpTitle] = (0,
|
|
47928
|
-
const [showPivotPopover, setShowPivotPopover] = (0,
|
|
47929
|
-
const [isEditingPivot, setIsEditingPivot] = (0,
|
|
47930
|
-
const [selectedPivotIndex, setSelectedPivotIndex] = (0,
|
|
48022
|
+
const [pivotAggregations, setPivotAggregations] = (0, import_react48.useState)([]);
|
|
48023
|
+
const [pivotLimit, setPivotLimit] = (0, import_react48.useState)(void 0);
|
|
48024
|
+
const [pivotSort, setPivotSort] = (0, import_react48.useState)(void 0);
|
|
48025
|
+
const [pivotHint, setPivotHint] = (0, import_react48.useState)("");
|
|
48026
|
+
const [pivotError, setPivotError] = (0, import_react48.useState)("");
|
|
48027
|
+
const [createdPivots, setCreatedPivots] = (0, import_react48.useState)([]);
|
|
48028
|
+
const [recommendedPivots, setRecommendedPivots] = (0, import_react48.useState)([]);
|
|
48029
|
+
const [pivotPopUpTitle, setPivotPopUpTitle] = (0, import_react48.useState)("Add pivot");
|
|
48030
|
+
const [showPivotPopover, setShowPivotPopover] = (0, import_react48.useState)(false);
|
|
48031
|
+
const [isEditingPivot, setIsEditingPivot] = (0, import_react48.useState)(false);
|
|
48032
|
+
const [selectedPivotIndex, setSelectedPivotIndex] = (0, import_react48.useState)(-1);
|
|
47931
48033
|
const [
|
|
47932
48034
|
pivotRecommendationsEnabledState,
|
|
47933
48035
|
setPivotRecommendationsEnabledState
|
|
47934
|
-
] = (0,
|
|
47935
|
-
const [askAILoading, setAskAILoading] = (0,
|
|
48036
|
+
] = (0, import_react48.useState)(pivotRecommendationsEnabled);
|
|
48037
|
+
const [askAILoading, setAskAILoading] = (0, import_react48.useState)(false);
|
|
47936
48038
|
const loading = reportBuilderLoading || tableLoading;
|
|
47937
48039
|
useLongLoading(reportBuilderLoading, {
|
|
47938
48040
|
origin: "ReportBuilder",
|
|
@@ -47946,7 +48048,7 @@ var useReportBuilderInternal = ({
|
|
|
47946
48048
|
origin: "ReportBuilder",
|
|
47947
48049
|
loadDescription: "Loading ask AI"
|
|
47948
48050
|
});
|
|
47949
|
-
const isSelectStar = (0,
|
|
48051
|
+
const isSelectStar = (0, import_react48.useMemo)(() => {
|
|
47950
48052
|
if (tables.length === 1) {
|
|
47951
48053
|
const totalColumnLength = tables.reduce((acc, table) => {
|
|
47952
48054
|
const tableColumns = filteredSchema.find((t) => t.name === table.name)?.columns.length ?? 0;
|
|
@@ -47957,14 +48059,14 @@ var useReportBuilderInternal = ({
|
|
|
47957
48059
|
return false;
|
|
47958
48060
|
}
|
|
47959
48061
|
}, [tables, columns, filteredSchema]);
|
|
47960
|
-
const mssqlSortWarning = (0,
|
|
48062
|
+
const mssqlSortWarning = (0, import_react48.useMemo)(() => {
|
|
47961
48063
|
if (!client || client?.databaseType !== "mssql") {
|
|
47962
48064
|
return void 0;
|
|
47963
48065
|
} else if (!pivot && !limit) {
|
|
47964
48066
|
return "Please add a limit.";
|
|
47965
48067
|
}
|
|
47966
48068
|
}, [client, limit, pivot]);
|
|
47967
|
-
const foreignKeyMap = (0,
|
|
48069
|
+
const foreignKeyMap = (0, import_react48.useMemo)(() => {
|
|
47968
48070
|
return getSchemaForeignKeyMapping(filteredSchema);
|
|
47969
48071
|
}, [filteredSchema]);
|
|
47970
48072
|
const clearAllState = (resetStateStack = true) => {
|
|
@@ -49016,7 +49118,7 @@ var useReportBuilderInternal = ({
|
|
|
49016
49118
|
flags: tempReport?.flags
|
|
49017
49119
|
});
|
|
49018
49120
|
};
|
|
49019
|
-
(0,
|
|
49121
|
+
(0, import_react48.useEffect)(() => {
|
|
49020
49122
|
if (!client) {
|
|
49021
49123
|
return;
|
|
49022
49124
|
}
|
|
@@ -49029,7 +49131,7 @@ var useReportBuilderInternal = ({
|
|
|
49029
49131
|
clearAllState();
|
|
49030
49132
|
}
|
|
49031
49133
|
}, [client]);
|
|
49032
|
-
(0,
|
|
49134
|
+
(0, import_react48.useEffect)(() => {
|
|
49033
49135
|
const loadChart = async () => {
|
|
49034
49136
|
let report;
|
|
49035
49137
|
if (!client) {
|
|
@@ -49086,7 +49188,7 @@ var useReportBuilderInternal = ({
|
|
|
49086
49188
|
loadChart();
|
|
49087
49189
|
}
|
|
49088
49190
|
}, [allReportsById[reportId || ""], client]);
|
|
49089
|
-
(0,
|
|
49191
|
+
(0, import_react48.useEffect)(() => {
|
|
49090
49192
|
if (initialTableName) {
|
|
49091
49193
|
const tableColumns = filteredSchema.find((table) => {
|
|
49092
49194
|
return table.name === initialTableName;
|
|
@@ -49106,7 +49208,7 @@ var useReportBuilderInternal = ({
|
|
|
49106
49208
|
}
|
|
49107
49209
|
}
|
|
49108
49210
|
}, [filteredSchema, initialTableName]);
|
|
49109
|
-
(0,
|
|
49211
|
+
(0, import_react48.useEffect)(() => {
|
|
49110
49212
|
if (!data && !dashboardIsLoading) {
|
|
49111
49213
|
reload();
|
|
49112
49214
|
}
|
|
@@ -49268,7 +49370,7 @@ var useReportBuilder = ({
|
|
|
49268
49370
|
reportBuilder.setAiPrompt(prompt);
|
|
49269
49371
|
await reportBuilder.fetchAstFromPromptHelper(prompt);
|
|
49270
49372
|
};
|
|
49271
|
-
const cleanedSchema = (0,
|
|
49373
|
+
const cleanedSchema = (0, import_react48.useMemo)(() => {
|
|
49272
49374
|
return reportBuilder.filteredSchema.reduce(
|
|
49273
49375
|
(acc, table) => {
|
|
49274
49376
|
acc[table.name] = table.columns;
|
|
@@ -49277,7 +49379,7 @@ var useReportBuilder = ({
|
|
|
49277
49379
|
{}
|
|
49278
49380
|
);
|
|
49279
49381
|
}, [reportBuilder.filteredSchema]);
|
|
49280
|
-
const cleanedFilterStack = (0,
|
|
49382
|
+
const cleanedFilterStack = (0, import_react48.useMemo)(() => {
|
|
49281
49383
|
return reportBuilder.filterStack.map((filter) => {
|
|
49282
49384
|
return filter.value ? convertInternalFilterToFilter(filter.value) : null;
|
|
49283
49385
|
}).filter((filter) => filter !== null);
|
|
@@ -49314,7 +49416,7 @@ var useReportBuilder = ({
|
|
|
49314
49416
|
init_ReportBuilder();
|
|
49315
49417
|
|
|
49316
49418
|
// src/components/ReportBuilder/AddColumnModal.tsx
|
|
49317
|
-
var
|
|
49419
|
+
var import_react49 = require("react");
|
|
49318
49420
|
var import_core2 = require("@dnd-kit/core");
|
|
49319
49421
|
var import_sortable2 = require("@dnd-kit/sortable");
|
|
49320
49422
|
var import_utilities2 = require("@dnd-kit/utilities");
|
|
@@ -49336,17 +49438,17 @@ function AddColumnModal({
|
|
|
49336
49438
|
LoadingComponent = QuillLoadingComponent,
|
|
49337
49439
|
onRequestAddVirtualTable
|
|
49338
49440
|
}) {
|
|
49339
|
-
const [primaryTable, setPrimaryTable] = (0,
|
|
49441
|
+
const [primaryTable, setPrimaryTable] = (0, import_react49.useState)(
|
|
49340
49442
|
selectedTables[0]?.name
|
|
49341
49443
|
);
|
|
49342
|
-
const [theme] = (0,
|
|
49343
|
-
const [search, setSearch] = (0,
|
|
49344
|
-
const [initialLoad, setInitialLoad] = (0,
|
|
49345
|
-
const textInputContainerRef = (0,
|
|
49346
|
-
const [modalSelectedColumns, setModalSelectedColumns] = (0,
|
|
49444
|
+
const [theme] = (0, import_react49.useContext)(ThemeContext);
|
|
49445
|
+
const [search, setSearch] = (0, import_react49.useState)("");
|
|
49446
|
+
const [initialLoad, setInitialLoad] = (0, import_react49.useState)(true);
|
|
49447
|
+
const textInputContainerRef = (0, import_react49.useRef)(null);
|
|
49448
|
+
const [modalSelectedColumns, setModalSelectedColumns] = (0, import_react49.useState)(
|
|
49347
49449
|
selectedColumns.map((col) => `${col.table}.${col.field}`)
|
|
49348
49450
|
);
|
|
49349
|
-
const columnOptions = (0,
|
|
49451
|
+
const columnOptions = (0, import_react49.useMemo)(() => {
|
|
49350
49452
|
return schema.filter((table) => {
|
|
49351
49453
|
if (!primaryTable) return true;
|
|
49352
49454
|
return table.name === primaryTable || foreignKeyMap[primaryTable]?.some(
|
|
@@ -49370,20 +49472,20 @@ function AddColumnModal({
|
|
|
49370
49472
|
})
|
|
49371
49473
|
);
|
|
49372
49474
|
}, [schema, primaryTable]);
|
|
49373
|
-
const [orderedColumnNames, setOrderedColumnNames] = (0,
|
|
49475
|
+
const [orderedColumnNames, setOrderedColumnNames] = (0, import_react49.useState)([]);
|
|
49374
49476
|
const isSelectedAllColumns = columnOptions.length === modalSelectedColumns.length;
|
|
49375
|
-
const searchResults = (0,
|
|
49477
|
+
const searchResults = (0, import_react49.useMemo)(() => {
|
|
49376
49478
|
return orderedColumnNames.filter((column) => {
|
|
49377
49479
|
return columnOptions.includes(column) && (search.length === 0 || column.toLowerCase().includes(search.toLowerCase()) || snakeAndCamelCaseToTitleCase(column).toLowerCase().includes(search.toLowerCase()));
|
|
49378
49480
|
});
|
|
49379
49481
|
}, [search, columnOptions, orderedColumnNames]);
|
|
49380
|
-
(0,
|
|
49482
|
+
(0, import_react49.useEffect)(() => {
|
|
49381
49483
|
const remainingColumns = columnOptions.filter(
|
|
49382
49484
|
(col) => !modalSelectedColumns.includes(col)
|
|
49383
49485
|
);
|
|
49384
49486
|
setOrderedColumnNames([...modalSelectedColumns, ...remainingColumns]);
|
|
49385
49487
|
}, [columnOptions]);
|
|
49386
|
-
(0,
|
|
49488
|
+
(0, import_react49.useEffect)(() => {
|
|
49387
49489
|
if (!schemaLoading && initialLoad) {
|
|
49388
49490
|
setTimeout(() => setInitialLoad(false), 200);
|
|
49389
49491
|
}
|
|
@@ -49735,7 +49837,7 @@ function DraggableItem({
|
|
|
49735
49837
|
|
|
49736
49838
|
// src/components/ReportBuilder/DraggableColumns.tsx
|
|
49737
49839
|
var import_sortable4 = require("@dnd-kit/sortable");
|
|
49738
|
-
var
|
|
49840
|
+
var import_react50 = require("react");
|
|
49739
49841
|
init_textProcessing();
|
|
49740
49842
|
var import_jsx_runtime69 = require("react/jsx-runtime");
|
|
49741
49843
|
function DraggableColumns({
|
|
@@ -49750,7 +49852,7 @@ function DraggableColumns({
|
|
|
49750
49852
|
coordinateGetter: import_sortable4.sortableKeyboardCoordinates
|
|
49751
49853
|
})
|
|
49752
49854
|
);
|
|
49753
|
-
const columnNames = (0,
|
|
49855
|
+
const columnNames = (0, import_react50.useMemo)(() => {
|
|
49754
49856
|
return columns.map(
|
|
49755
49857
|
(col) => `${col.table}.${col.alias ?? col.field}`
|
|
49756
49858
|
);
|
|
@@ -50254,7 +50356,7 @@ var AddFilters = ({
|
|
|
50254
50356
|
};
|
|
50255
50357
|
|
|
50256
50358
|
// src/internals/ReportBuilder/PivotForm.tsx
|
|
50257
|
-
var
|
|
50359
|
+
var import_react51 = require("react");
|
|
50258
50360
|
init_textProcessing();
|
|
50259
50361
|
init_pivotProcessing();
|
|
50260
50362
|
var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
@@ -50283,22 +50385,22 @@ function PivotForm({
|
|
|
50283
50385
|
isLoading,
|
|
50284
50386
|
pivotHint
|
|
50285
50387
|
}) {
|
|
50286
|
-
const [allowedColumnFields, setAllowedColumnFields] = (0,
|
|
50287
|
-
const [allowedRowFields, setAllowedRowFields] = (0,
|
|
50288
|
-
const [allowedValueFields, setAllowedValueFields] = (0,
|
|
50289
|
-
const [theme] = (0,
|
|
50290
|
-
const [limitInput, setLimitInput] = (0,
|
|
50388
|
+
const [allowedColumnFields, setAllowedColumnFields] = (0, import_react51.useState)([]);
|
|
50389
|
+
const [allowedRowFields, setAllowedRowFields] = (0, import_react51.useState)([]);
|
|
50390
|
+
const [allowedValueFields, setAllowedValueFields] = (0, import_react51.useState)([]);
|
|
50391
|
+
const [theme] = (0, import_react51.useContext)(ThemeContext);
|
|
50392
|
+
const [limitInput, setLimitInput] = (0, import_react51.useState)(
|
|
50291
50393
|
pivotLimit?.toString() ?? ""
|
|
50292
50394
|
);
|
|
50293
|
-
const [sortFieldInput, setSortFieldInput] = (0,
|
|
50395
|
+
const [sortFieldInput, setSortFieldInput] = (0, import_react51.useState)(
|
|
50294
50396
|
pivotSort?.sortField ?? ""
|
|
50295
50397
|
);
|
|
50296
|
-
const [sortDirectionInput, setSortDirectionInput] = (0,
|
|
50398
|
+
const [sortDirectionInput, setSortDirectionInput] = (0, import_react51.useState)(
|
|
50297
50399
|
pivotSort?.sortDirection ?? ""
|
|
50298
50400
|
);
|
|
50299
|
-
const [showLimitInput, setShowLimitInput] = (0,
|
|
50300
|
-
const [showSortInput, setShowSortInput] = (0,
|
|
50301
|
-
(0,
|
|
50401
|
+
const [showLimitInput, setShowLimitInput] = (0, import_react51.useState)(!!pivotLimit);
|
|
50402
|
+
const [showSortInput, setShowSortInput] = (0, import_react51.useState)(!!pivotSort);
|
|
50403
|
+
(0, import_react51.useEffect)(() => {
|
|
50302
50404
|
if (uniqueValues) {
|
|
50303
50405
|
const possibleColumns = getPossiblePivotFieldOptions(
|
|
50304
50406
|
columns,
|
|
@@ -50309,12 +50411,12 @@ function PivotForm({
|
|
|
50309
50411
|
setAllowedValueFields(possibleColumns.valueFields);
|
|
50310
50412
|
}
|
|
50311
50413
|
}, [columns, uniqueValues]);
|
|
50312
|
-
(0,
|
|
50414
|
+
(0, import_react51.useEffect)(() => {
|
|
50313
50415
|
setSortFieldInput(pivotSort?.sortField ?? "");
|
|
50314
50416
|
setSortDirectionInput(pivotSort?.sortDirection ?? "");
|
|
50315
50417
|
setShowSortInput(!!pivotSort);
|
|
50316
50418
|
}, [pivotSort]);
|
|
50317
|
-
(0,
|
|
50419
|
+
(0, import_react51.useEffect)(() => {
|
|
50318
50420
|
setLimitInput(pivotLimit?.toString() ?? "");
|
|
50319
50421
|
setShowLimitInput(!!pivotLimit);
|
|
50320
50422
|
}, [pivotLimit]);
|
|
@@ -50926,7 +51028,7 @@ var AddPivot = ({
|
|
|
50926
51028
|
};
|
|
50927
51029
|
|
|
50928
51030
|
// src/components/ReportBuilder/AddLimitPopover.tsx
|
|
50929
|
-
var
|
|
51031
|
+
var import_react52 = require("react");
|
|
50930
51032
|
var import_jsx_runtime75 = require("react/jsx-runtime");
|
|
50931
51033
|
var LimitSentence = ({
|
|
50932
51034
|
limit,
|
|
@@ -50941,7 +51043,7 @@ var LimitSentence = ({
|
|
|
50941
51043
|
SecondaryButton = MemoizedSecondaryButton,
|
|
50942
51044
|
disabled = false
|
|
50943
51045
|
}) => {
|
|
50944
|
-
const [isOpen, setIsOpen] = (0,
|
|
51046
|
+
const [isOpen, setIsOpen] = (0, import_react52.useState)(false);
|
|
50945
51047
|
const handleClickDelete = () => {
|
|
50946
51048
|
setOpenPopover(null);
|
|
50947
51049
|
handleDelete();
|
|
@@ -50983,7 +51085,7 @@ var AddLimitPopover = ({
|
|
|
50983
51085
|
Button = MemoizedButton,
|
|
50984
51086
|
SecondaryButton = MemoizedSecondaryButton
|
|
50985
51087
|
}) => {
|
|
50986
|
-
const [limit, setLimit] = (0,
|
|
51088
|
+
const [limit, setLimit] = (0, import_react52.useState)(initialLimit.toString());
|
|
50987
51089
|
const MAX_LIMIT = 2147483647;
|
|
50988
51090
|
return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [
|
|
50989
51091
|
/* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
@@ -51224,7 +51326,7 @@ var AddLimit = ({
|
|
|
51224
51326
|
};
|
|
51225
51327
|
|
|
51226
51328
|
// src/components/ReportBuilder/AddSortPopover.tsx
|
|
51227
|
-
var
|
|
51329
|
+
var import_react53 = require("react");
|
|
51228
51330
|
init_textProcessing();
|
|
51229
51331
|
var import_jsx_runtime77 = require("react/jsx-runtime");
|
|
51230
51332
|
var SORT_VALUE_TO_LABEL = {
|
|
@@ -51248,7 +51350,7 @@ var SortSentence = ({
|
|
|
51248
51350
|
SecondaryButton = MemoizedSecondaryButton,
|
|
51249
51351
|
disabled = false
|
|
51250
51352
|
}) => {
|
|
51251
|
-
const [isOpen, setIsOpen] = (0,
|
|
51353
|
+
const [isOpen, setIsOpen] = (0, import_react53.useState)(false);
|
|
51252
51354
|
const handleSetIsOpen = (isOpen2) => {
|
|
51253
51355
|
setIsOpen(isOpen2);
|
|
51254
51356
|
};
|
|
@@ -51300,8 +51402,8 @@ var AddSortPopover = ({
|
|
|
51300
51402
|
Button = MemoizedButton,
|
|
51301
51403
|
SecondaryButton = MemoizedSecondaryButton
|
|
51302
51404
|
}) => {
|
|
51303
|
-
const [sortColumn, setSortColumn] = (0,
|
|
51304
|
-
const [sortDirection, setSortDirection] = (0,
|
|
51405
|
+
const [sortColumn, setSortColumn] = (0, import_react53.useState)(column || "");
|
|
51406
|
+
const [sortDirection, setSortDirection] = (0, import_react53.useState)(
|
|
51305
51407
|
direction || "ASC"
|
|
51306
51408
|
);
|
|
51307
51409
|
return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [
|
|
@@ -51779,15 +51881,14 @@ function ReportBuilder({
|
|
|
51779
51881
|
onRequestAddVirtualTable,
|
|
51780
51882
|
submitButtonLabel
|
|
51781
51883
|
}) {
|
|
51782
|
-
const [theme] = (0,
|
|
51783
|
-
const [client] = (0,
|
|
51784
|
-
const { getToken } = (0,
|
|
51785
|
-
const parentRef = (0,
|
|
51786
|
-
const
|
|
51787
|
-
const [
|
|
51788
|
-
const [
|
|
51789
|
-
const [
|
|
51790
|
-
const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react53.useState)(false);
|
|
51884
|
+
const [theme] = (0, import_react54.useContext)(ThemeContext);
|
|
51885
|
+
const [client] = (0, import_react54.useContext)(ClientContext);
|
|
51886
|
+
const { getToken } = (0, import_react54.useContext)(FetchContext);
|
|
51887
|
+
const parentRef = (0, import_react54.useRef)(null);
|
|
51888
|
+
const askAIFormRef = (0, import_react54.useRef)(null);
|
|
51889
|
+
const [isCopying, setIsCopying] = (0, import_react54.useState)(false);
|
|
51890
|
+
const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, import_react54.useState)(false);
|
|
51891
|
+
const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react54.useState)(false);
|
|
51791
51892
|
const reportBuilder = useReportBuilderInternal({
|
|
51792
51893
|
reportId,
|
|
51793
51894
|
initialTableName,
|
|
@@ -51827,6 +51928,12 @@ function ReportBuilder({
|
|
|
51827
51928
|
onSaveQuery,
|
|
51828
51929
|
onSaveReport
|
|
51829
51930
|
} = reportBuilder;
|
|
51931
|
+
const askAIInputWidth = useResponsiveFirstChildWidth_default(askAIFormRef, {
|
|
51932
|
+
gap: 12,
|
|
51933
|
+
initialWidth: 320,
|
|
51934
|
+
minWidth: 160
|
|
51935
|
+
});
|
|
51936
|
+
const normalizedAskAIInputWidth = askAIInputWidth > 0 ? askAIInputWidth : 160;
|
|
51830
51937
|
const copySQLToClipboard = async () => {
|
|
51831
51938
|
let query = "";
|
|
51832
51939
|
if (pivot && pivotData) {
|
|
@@ -51849,17 +51956,7 @@ function ReportBuilder({
|
|
|
51849
51956
|
setTimeout(() => setIsCopying(false), 800);
|
|
51850
51957
|
}
|
|
51851
51958
|
};
|
|
51852
|
-
(0,
|
|
51853
|
-
function handleResize() {
|
|
51854
|
-
updateFirstChildWidth(askAIContainerRef, setAskAIInputWidth, { gap: 12 });
|
|
51855
|
-
}
|
|
51856
|
-
handleResize();
|
|
51857
|
-
window.addEventListener("resize", handleResize);
|
|
51858
|
-
return () => {
|
|
51859
|
-
window.removeEventListener("resize", handleResize);
|
|
51860
|
-
};
|
|
51861
|
-
}, []);
|
|
51862
|
-
(0, import_react53.useEffect)(() => {
|
|
51959
|
+
(0, import_react54.useEffect)(() => {
|
|
51863
51960
|
if (isChartBuilderOpen === false) {
|
|
51864
51961
|
onCloseChartBuilder && onCloseChartBuilder();
|
|
51865
51962
|
}
|
|
@@ -51977,10 +52074,10 @@ function ReportBuilder({
|
|
|
51977
52074
|
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { style: { width: "100%", minHeight: "30vh" } })
|
|
51978
52075
|
] }),
|
|
51979
52076
|
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(ContainerComponent, { children: [
|
|
51980
|
-
isAIEnabled && /* @__PURE__ */ (0, import_jsx_runtime81.
|
|
52077
|
+
isAIEnabled && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
|
|
51981
52078
|
"form",
|
|
51982
52079
|
{
|
|
51983
|
-
ref:
|
|
52080
|
+
ref: askAIFormRef,
|
|
51984
52081
|
onSubmit: (event) => {
|
|
51985
52082
|
event.preventDefault();
|
|
51986
52083
|
},
|
|
@@ -51988,15 +52085,17 @@ function ReportBuilder({
|
|
|
51988
52085
|
display: "flex",
|
|
51989
52086
|
flexDirection: "row",
|
|
51990
52087
|
gap: 12,
|
|
51991
|
-
|
|
52088
|
+
flexWrap: "wrap",
|
|
52089
|
+
alignItems: "stretch",
|
|
52090
|
+
visibility: normalizedAskAIInputWidth > 0 ? "visible" : "hidden"
|
|
51992
52091
|
},
|
|
51993
|
-
children:
|
|
52092
|
+
children: [
|
|
51994
52093
|
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
51995
52094
|
TextInputComponent,
|
|
51996
52095
|
{
|
|
51997
52096
|
id: "ask_ai_input_bar",
|
|
51998
52097
|
value: aiPrompt,
|
|
51999
|
-
width:
|
|
52098
|
+
width: normalizedAskAIInputWidth,
|
|
52000
52099
|
onChange: (e) => setAiPrompt(e.target.value),
|
|
52001
52100
|
placeholder: "Ask a question..."
|
|
52002
52101
|
}
|
|
@@ -52034,7 +52133,7 @@ function ReportBuilder({
|
|
|
52034
52133
|
disabled: columns.length === 0 || loading
|
|
52035
52134
|
}
|
|
52036
52135
|
)
|
|
52037
|
-
]
|
|
52136
|
+
]
|
|
52038
52137
|
}
|
|
52039
52138
|
),
|
|
52040
52139
|
columns.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
@@ -52289,7 +52388,7 @@ function ReportBuilder({
|
|
|
52289
52388
|
}
|
|
52290
52389
|
|
|
52291
52390
|
// src/ChartEditor.tsx
|
|
52292
|
-
var
|
|
52391
|
+
var import_react55 = require("react");
|
|
52293
52392
|
var import_jsx_runtime82 = require("react/jsx-runtime");
|
|
52294
52393
|
function ChartEditor({
|
|
52295
52394
|
isOpen,
|
|
@@ -52336,19 +52435,19 @@ function ChartEditor({
|
|
|
52336
52435
|
onClickChartElement,
|
|
52337
52436
|
onClickChartError
|
|
52338
52437
|
}) {
|
|
52339
|
-
const parentRef = (0,
|
|
52340
|
-
const [modalWidth, setModalWidth] = (0,
|
|
52341
|
-
const [modalHeight, setModalHeight] = (0,
|
|
52438
|
+
const parentRef = (0, import_react55.useRef)(null);
|
|
52439
|
+
const [modalWidth, setModalWidth] = (0, import_react55.useState)(200);
|
|
52440
|
+
const [modalHeight, setModalHeight] = (0, import_react55.useState)(200);
|
|
52342
52441
|
const { addReport } = useDashboardReports(destinationDashboard);
|
|
52343
52442
|
const { allReportsById } = useAllReports();
|
|
52344
|
-
const { tenants, flags } = (0,
|
|
52345
|
-
const { getToken } = (0,
|
|
52443
|
+
const { tenants, flags } = (0, import_react55.useContext)(TenantContext);
|
|
52444
|
+
const { getToken } = (0, import_react55.useContext)(FetchContext);
|
|
52346
52445
|
const report = allReportsById[reportId];
|
|
52347
|
-
const [client, isClientLoading] = (0,
|
|
52348
|
-
const [schemaData] = (0,
|
|
52349
|
-
const { dashboardFilters } = (0,
|
|
52350
|
-
const { eventTracking } = (0,
|
|
52351
|
-
const specificDashboardFilters = (0,
|
|
52446
|
+
const [client, isClientLoading] = (0, import_react55.useContext)(ClientContext);
|
|
52447
|
+
const [schemaData] = (0, import_react55.useContext)(SchemaDataContext);
|
|
52448
|
+
const { dashboardFilters } = (0, import_react55.useContext)(DashboardFiltersContext);
|
|
52449
|
+
const { eventTracking } = (0, import_react55.useContext)(EventTrackingContext);
|
|
52450
|
+
const specificDashboardFilters = (0, import_react55.useMemo)(() => {
|
|
52352
52451
|
if (!report) {
|
|
52353
52452
|
return [];
|
|
52354
52453
|
}
|
|
@@ -52356,15 +52455,15 @@ function ChartEditor({
|
|
|
52356
52455
|
(f) => f.filter
|
|
52357
52456
|
);
|
|
52358
52457
|
}, [dashboardFilters]);
|
|
52359
|
-
const [filtersEnabled, setFiltersEnabled] = (0,
|
|
52360
|
-
const [chartBuilderKey, setChartBuilderKey] = (0,
|
|
52458
|
+
const [filtersEnabled, setFiltersEnabled] = (0, import_react55.useState)(true);
|
|
52459
|
+
const [chartBuilderKey, setChartBuilderKey] = (0, import_react55.useState)(0);
|
|
52361
52460
|
const dateFilter = Object.values(specificDashboardFilters).find(
|
|
52362
52461
|
(filter) => filter.filterType === "date_range"
|
|
52363
52462
|
);
|
|
52364
|
-
const dateRange = (0,
|
|
52463
|
+
const dateRange = (0, import_react55.useMemo)(() => {
|
|
52365
52464
|
return dateFilter?.startDate ? { start: dateFilter.startDate, end: dateFilter.endDate } : void 0;
|
|
52366
52465
|
}, [dateFilter]);
|
|
52367
|
-
(0,
|
|
52466
|
+
(0, import_react55.useEffect)(() => {
|
|
52368
52467
|
function handleResize() {
|
|
52369
52468
|
const screenSize = window.innerWidth;
|
|
52370
52469
|
if (screenSize >= 1200) {
|
|
@@ -52412,7 +52511,7 @@ function ChartEditor({
|
|
|
52412
52511
|
}
|
|
52413
52512
|
addReport(report2);
|
|
52414
52513
|
};
|
|
52415
|
-
(0,
|
|
52514
|
+
(0, import_react55.useEffect)(() => {
|
|
52416
52515
|
if (!isClientLoading && !report) {
|
|
52417
52516
|
fetchReportHelper();
|
|
52418
52517
|
}
|
|
@@ -52560,7 +52659,7 @@ function StaticChart({
|
|
|
52560
52659
|
init_valueFormatter();
|
|
52561
52660
|
|
|
52562
52661
|
// src/hooks/useTenants.ts
|
|
52563
|
-
var
|
|
52662
|
+
var import_react56 = require("react");
|
|
52564
52663
|
var useTenants = (dashboardName) => {
|
|
52565
52664
|
const {
|
|
52566
52665
|
tenants,
|
|
@@ -52573,13 +52672,13 @@ var useTenants = (dashboardName) => {
|
|
|
52573
52672
|
fetchMappedTenantsForDashboard,
|
|
52574
52673
|
getMappedTenantsForDashboard,
|
|
52575
52674
|
getViewerTenantsByOwner
|
|
52576
|
-
} = (0,
|
|
52577
|
-
(0,
|
|
52675
|
+
} = (0, import_react56.useContext)(TenantContext);
|
|
52676
|
+
(0, import_react56.useEffect)(() => {
|
|
52578
52677
|
if (dashboardName) {
|
|
52579
52678
|
fetchViewerTenantsForDashboard(dashboardName);
|
|
52580
52679
|
}
|
|
52581
52680
|
}, [dashboardName, fetchViewerTenantsForDashboard]);
|
|
52582
|
-
(0,
|
|
52681
|
+
(0, import_react56.useEffect)(() => {
|
|
52583
52682
|
if (dashboardName) {
|
|
52584
52683
|
fetchMappedTenantsForDashboard(dashboardName);
|
|
52585
52684
|
}
|
|
@@ -52598,33 +52697,33 @@ var useTenants = (dashboardName) => {
|
|
|
52598
52697
|
};
|
|
52599
52698
|
|
|
52600
52699
|
// src/hooks/useQuill.ts
|
|
52601
|
-
var
|
|
52700
|
+
var import_react57 = require("react");
|
|
52602
52701
|
init_paginationProcessing();
|
|
52603
52702
|
init_tableProcessing();
|
|
52604
52703
|
init_dataProcessing();
|
|
52605
52704
|
var useQuill = (reportId, pagination) => {
|
|
52606
|
-
const { reports, reportsDispatch, fetchIndividualReport } = (0,
|
|
52705
|
+
const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react57.useContext)(ReportsContext);
|
|
52607
52706
|
const { allReportsById } = useAllReports();
|
|
52608
|
-
const { getToken } = (0,
|
|
52609
|
-
const dashboardReport = (0,
|
|
52707
|
+
const { getToken } = (0, import_react57.useContext)(FetchContext);
|
|
52708
|
+
const dashboardReport = (0, import_react57.useMemo)(() => {
|
|
52610
52709
|
return allReportsById[reportId ?? ""];
|
|
52611
52710
|
}, [allReportsById[reportId ?? ""]]);
|
|
52612
|
-
const { dashboardFilters, dashboardCustomFilters } = (0,
|
|
52711
|
+
const { dashboardFilters, dashboardCustomFilters } = (0, import_react57.useContext)(
|
|
52613
52712
|
DashboardFiltersContext
|
|
52614
52713
|
);
|
|
52615
|
-
const { reportFilters, customReportFilters, reportFiltersDispatch } = (0,
|
|
52616
|
-
const specificReportFilters = (0,
|
|
52714
|
+
const { reportFilters, customReportFilters, reportFiltersDispatch } = (0, import_react57.useContext)(ReportFiltersContext);
|
|
52715
|
+
const specificReportFilters = (0, import_react57.useMemo)(() => {
|
|
52617
52716
|
if (!reportId) return null;
|
|
52618
52717
|
return Object.values(reportFilters[reportId] ?? []).map((f) => f.filter);
|
|
52619
52718
|
}, [reportFilters, reportId]);
|
|
52620
|
-
const [schemaData] = (0,
|
|
52621
|
-
const [client, isClientLoading] = (0,
|
|
52622
|
-
const { tenants } = (0,
|
|
52623
|
-
const { eventTracking } = (0,
|
|
52624
|
-
const [loading, setLoading] = (0,
|
|
52625
|
-
const [error, setError] = (0,
|
|
52626
|
-
const [previousPage, setPreviousPage] = (0,
|
|
52627
|
-
const processedReport = (0,
|
|
52719
|
+
const [schemaData] = (0, import_react57.useContext)(SchemaDataContext);
|
|
52720
|
+
const [client, isClientLoading] = (0, import_react57.useContext)(ClientContext);
|
|
52721
|
+
const { tenants } = (0, import_react57.useContext)(TenantContext);
|
|
52722
|
+
const { eventTracking } = (0, import_react57.useContext)(EventTrackingContext);
|
|
52723
|
+
const [loading, setLoading] = (0, import_react57.useState)(true);
|
|
52724
|
+
const [error, setError] = (0, import_react57.useState)(void 0);
|
|
52725
|
+
const [previousPage, setPreviousPage] = (0, import_react57.useState)(0);
|
|
52726
|
+
const processedReport = (0, import_react57.useMemo)(() => {
|
|
52628
52727
|
return reportId && allReportsById[reportId] ? convertInternalReportToReport(
|
|
52629
52728
|
mergeComparisonRange(allReportsById[reportId]),
|
|
52630
52729
|
specificReportFilters ?? [],
|
|
@@ -52632,7 +52731,7 @@ var useQuill = (reportId, pagination) => {
|
|
|
52632
52731
|
"useQuill"
|
|
52633
52732
|
) : void 0;
|
|
52634
52733
|
}, [reportId, reportId && allReportsById[reportId], specificReportFilters]);
|
|
52635
|
-
const [additionalProcessing, setAdditionProcessing] = (0,
|
|
52734
|
+
const [additionalProcessing, setAdditionProcessing] = (0, import_react57.useState)(
|
|
52636
52735
|
pagination ? {
|
|
52637
52736
|
page: pagination
|
|
52638
52737
|
} : void 0
|
|
@@ -52781,7 +52880,7 @@ var useQuill = (reportId, pagination) => {
|
|
|
52781
52880
|
setLoading(false);
|
|
52782
52881
|
}
|
|
52783
52882
|
};
|
|
52784
|
-
(0,
|
|
52883
|
+
(0, import_react57.useEffect)(() => {
|
|
52785
52884
|
if (isClientLoading) return;
|
|
52786
52885
|
if (reportId && specificReportFilters) {
|
|
52787
52886
|
fetchReportHelper(reportId, {
|
|
@@ -52821,10 +52920,10 @@ var useQuill = (reportId, pagination) => {
|
|
|
52821
52920
|
|
|
52822
52921
|
// src/hooks/useFormat.ts
|
|
52823
52922
|
init_valueFormatter();
|
|
52824
|
-
var
|
|
52923
|
+
var import_react58 = require("react");
|
|
52825
52924
|
var useMemoizedRows = (reportId) => {
|
|
52826
52925
|
const { data } = useQuill(reportId);
|
|
52827
|
-
const formattedRows = (0,
|
|
52926
|
+
const formattedRows = (0, import_react58.useMemo)(() => {
|
|
52828
52927
|
if (!data || !data.rows || !data.columns)
|
|
52829
52928
|
return { rows: [], loading: true };
|
|
52830
52929
|
return {
|
|
@@ -52848,7 +52947,7 @@ var useMemoizedRows = (reportId) => {
|
|
|
52848
52947
|
};
|
|
52849
52948
|
|
|
52850
52949
|
// src/hooks/useAskQuill.tsx
|
|
52851
|
-
var
|
|
52950
|
+
var import_react59 = require("react");
|
|
52852
52951
|
init_astProcessing();
|
|
52853
52952
|
init_astFilterProcessing();
|
|
52854
52953
|
init_pivotProcessing();
|
|
@@ -52876,13 +52975,13 @@ function convertColumnInternalToAskQuillColumn(columns) {
|
|
|
52876
52975
|
});
|
|
52877
52976
|
}
|
|
52878
52977
|
var useAskQuill = (dashboardName) => {
|
|
52879
|
-
const [client] = (0,
|
|
52880
|
-
const [schemaData] = (0,
|
|
52881
|
-
const { tenants } = (0,
|
|
52882
|
-
const { getToken } = (0,
|
|
52883
|
-
const { eventTracking } = (0,
|
|
52884
|
-
const [astInfo, setAstInfo] = (0,
|
|
52885
|
-
const [data, setData] = (0,
|
|
52978
|
+
const [client] = (0, import_react59.useContext)(ClientContext);
|
|
52979
|
+
const [schemaData] = (0, import_react59.useContext)(SchemaDataContext);
|
|
52980
|
+
const { tenants } = (0, import_react59.useContext)(TenantContext);
|
|
52981
|
+
const { getToken } = (0, import_react59.useContext)(FetchContext);
|
|
52982
|
+
const { eventTracking } = (0, import_react59.useContext)(EventTrackingContext);
|
|
52983
|
+
const [astInfo, setAstInfo] = (0, import_react59.useState)(void 0);
|
|
52984
|
+
const [data, setData] = (0, import_react59.useState)({
|
|
52886
52985
|
rows: [],
|
|
52887
52986
|
columns: [],
|
|
52888
52987
|
pivot: null,
|
|
@@ -52892,9 +52991,9 @@ var useAskQuill = (dashboardName) => {
|
|
|
52892
52991
|
pivotColumnFields: [],
|
|
52893
52992
|
pivotValueFields: []
|
|
52894
52993
|
});
|
|
52895
|
-
const [loading, setLoading] = (0,
|
|
52896
|
-
const [error, setError] = (0,
|
|
52897
|
-
const [ask, setAsk] = (0,
|
|
52994
|
+
const [loading, setLoading] = (0, import_react59.useState)(false);
|
|
52995
|
+
const [error, setError] = (0, import_react59.useState)(void 0);
|
|
52996
|
+
const [ask, setAsk] = (0, import_react59.useState)(
|
|
52898
52997
|
async () => void 0
|
|
52899
52998
|
);
|
|
52900
52999
|
const askHelper = async (query) => {
|
|
@@ -53094,7 +53193,7 @@ var useAskQuill = (dashboardName) => {
|
|
|
53094
53193
|
});
|
|
53095
53194
|
setLoading(false);
|
|
53096
53195
|
};
|
|
53097
|
-
(0,
|
|
53196
|
+
(0, import_react59.useEffect)(() => {
|
|
53098
53197
|
setAsk(() => askHelper);
|
|
53099
53198
|
}, [schemaData.schema]);
|
|
53100
53199
|
return {
|
|
@@ -53108,13 +53207,13 @@ var useAskQuill = (dashboardName) => {
|
|
|
53108
53207
|
};
|
|
53109
53208
|
|
|
53110
53209
|
// src/hooks/useVirtualTables.tsx
|
|
53111
|
-
var
|
|
53210
|
+
var import_react60 = require("react");
|
|
53112
53211
|
var useVirtualTables = () => {
|
|
53113
|
-
const [schemaData, setSchemaData] = (0,
|
|
53114
|
-
const { tenants } = (0,
|
|
53115
|
-
const { getToken, quillFetchWithToken } = (0,
|
|
53116
|
-
const { eventTracking } = (0,
|
|
53117
|
-
const [loadingTables, setLoadingTables] = (0,
|
|
53212
|
+
const [schemaData, setSchemaData] = (0, import_react60.useContext)(SchemaDataContext);
|
|
53213
|
+
const { tenants } = (0, import_react60.useContext)(TenantContext);
|
|
53214
|
+
const { getToken, quillFetchWithToken } = (0, import_react60.useContext)(FetchContext);
|
|
53215
|
+
const { eventTracking } = (0, import_react60.useContext)(EventTrackingContext);
|
|
53216
|
+
const [loadingTables, setLoadingTables] = (0, import_react60.useState)({});
|
|
53118
53217
|
const handleReload = async (client, caller) => {
|
|
53119
53218
|
setSchemaData({ ...schemaData, isSchemaLoading: true });
|
|
53120
53219
|
setLoadingTables(
|