@quillsql/react 2.10.14 → 2.10.15
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/cjs/Chart.d.ts +1 -0
- package/dist/cjs/Chart.d.ts.map +1 -1
- package/dist/cjs/Chart.js +2 -0
- package/dist/cjs/Dashboard.d.ts +5 -3
- package/dist/cjs/Dashboard.d.ts.map +1 -1
- package/dist/cjs/Dashboard.js +25 -20
- package/dist/cjs/components/Dashboard/{DashboardItem.d.ts → ChartComponent.d.ts} +1 -1
- package/dist/cjs/components/Dashboard/ChartComponent.d.ts.map +1 -0
- package/dist/cjs/components/Dashboard/DashboardSection.d.ts.map +1 -1
- package/dist/cjs/components/Dashboard/DashboardSection.js +1 -0
- package/dist/cjs/components/Dashboard/DataLoader.d.ts +3 -0
- package/dist/cjs/components/Dashboard/DataLoader.d.ts.map +1 -0
- package/dist/cjs/components/Dashboard/DataLoader.js +68 -0
- package/dist/cjs/components/Dashboard/MetricComponent.d.ts +3 -0
- package/dist/cjs/components/Dashboard/MetricComponent.d.ts.map +1 -0
- package/dist/cjs/components/Dashboard/MetricComponent.js +64 -0
- package/dist/{esm/components/Dashboard/DashboardItem.d.ts → cjs/components/Dashboard/TableComponent.d.ts} +1 -1
- package/dist/cjs/components/Dashboard/TableComponent.d.ts.map +1 -0
- package/dist/cjs/components/Dashboard/TableComponent.js +64 -0
- package/dist/esm/Chart.d.ts +1 -0
- package/dist/esm/Chart.d.ts.map +1 -1
- package/dist/esm/Chart.js +1 -1
- package/dist/esm/Dashboard.d.ts +5 -3
- package/dist/esm/Dashboard.d.ts.map +1 -1
- package/dist/esm/Dashboard.js +25 -20
- package/dist/esm/components/Dashboard/ChartComponent.d.ts +3 -0
- package/dist/esm/components/Dashboard/ChartComponent.d.ts.map +1 -0
- package/dist/esm/components/Dashboard/DashboardSection.d.ts.map +1 -1
- package/dist/esm/components/Dashboard/DashboardSection.js +1 -0
- package/dist/esm/components/Dashboard/DataLoader.d.ts +3 -0
- package/dist/esm/components/Dashboard/DataLoader.d.ts.map +1 -0
- package/dist/esm/components/Dashboard/DataLoader.js +65 -0
- package/dist/esm/components/Dashboard/MetricComponent.d.ts +3 -0
- package/dist/esm/components/Dashboard/MetricComponent.d.ts.map +1 -0
- package/dist/esm/components/Dashboard/MetricComponent.js +61 -0
- package/dist/esm/components/Dashboard/TableComponent.d.ts +3 -0
- package/dist/esm/components/Dashboard/TableComponent.d.ts.map +1 -0
- package/dist/esm/components/Dashboard/TableComponent.js +61 -0
- package/package.json +1 -1
- package/dist/cjs/components/Dashboard/DashboardItem.d.ts.map +0 -1
- package/dist/esm/components/Dashboard/DashboardItem.d.ts.map +0 -1
- /package/dist/cjs/components/Dashboard/{DashboardItem.js → ChartComponent.js} +0 -0
- /package/dist/esm/components/Dashboard/{DashboardItem.js → ChartComponent.js} +0 -0
package/dist/cjs/Chart.d.ts
CHANGED
|
@@ -35,6 +35,7 @@ interface WithConfig extends BaseChartProps {
|
|
|
35
35
|
config: DashboardItem | any;
|
|
36
36
|
}
|
|
37
37
|
type ChartProps = WithChartId | WithConfig;
|
|
38
|
+
export declare function didFiltersChange(dashboardItem: any, filters: any): boolean;
|
|
38
39
|
declare const Chart: ({ chartId, config, colors, containerStyle, query, SelectComponent, dateRangeFilterDisabled, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, }: ChartProps) => import("react/jsx-runtime").JSX.Element;
|
|
39
40
|
export default Chart;
|
|
40
41
|
//# sourceMappingURL=Chart.d.ts.map
|
package/dist/cjs/Chart.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../src/Chart.tsx"],"names":[],"mappings":";AA2BA,UAAU,cAAc;IACtB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,UAAU,WAAY,SAAQ,cAAc;IAC1C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,WAAW,GACnB,cAAc,GACd,mBAAmB,GACnB,oBAAoB,GACpB,eAAe,GACf,cAAc,GACd,UAAU,GACV,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,UAAU,GACV,SAAS,GACT,QAAQ,CAAC;AAEb,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,UAAU,UAAW,SAAQ,cAAc;IACzC,MAAM,EAAE,aAAa,GAAG,GAAG,CAAC;CAC7B;AAED,KAAK,UAAU,GAAG,WAAW,GAAG,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../src/Chart.tsx"],"names":[],"mappings":";AA2BA,UAAU,cAAc;IACtB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,UAAU,WAAY,SAAQ,cAAc;IAC1C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,WAAW,GACnB,cAAc,GACd,mBAAmB,GACnB,oBAAoB,GACpB,eAAe,GACf,cAAc,GACd,UAAU,GACV,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,UAAU,GACV,SAAS,GACT,QAAQ,CAAC;AAEb,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,UAAU,UAAW,SAAQ,cAAc;IACzC,MAAM,EAAE,aAAa,GAAG,GAAG,CAAC;CAC7B;AAED,KAAK,UAAU,GAAG,WAAW,GAAG,UAAU,CAAC;AA4D3C,wBAAgB,gBAAgB,CAAC,aAAa,KAAA,EAAE,OAAO,KAAA,WAQtD;AAKD,QAAA,MAAM,KAAK,8JAYR,UAAU,4CAkCZ,CAAC;AAieF,eAAe,KAAK,CAAC"}
|
package/dist/cjs/Chart.js
CHANGED
|
@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.didFiltersChange = void 0;
|
|
6
7
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
7
8
|
// @ts-nocheck
|
|
8
9
|
const react_1 = require("react");
|
|
@@ -74,6 +75,7 @@ function didFiltersChange(dashboardItem, filters) {
|
|
|
74
75
|
}
|
|
75
76
|
return !isEquivalent(dashboardItem.filtersApplied, filters);
|
|
76
77
|
}
|
|
78
|
+
exports.didFiltersChange = didFiltersChange;
|
|
77
79
|
const Chart = ({ chartId, config, colors, containerStyle, query, SelectComponent, dateRangeFilterDisabled = false, isAnimationActive = true, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, }) => {
|
|
78
80
|
const { dispatch, dashboard } = (0, react_1.useContext)(Context_1.DashboardContext);
|
|
79
81
|
const { dashboardFilters } = (0, react_1.useContext)(Context_1.DashboardFiltersContext);
|
package/dist/cjs/Dashboard.d.ts
CHANGED
|
@@ -115,7 +115,7 @@ export interface DashboardItemData {
|
|
|
115
115
|
export interface DashboardItemProps {
|
|
116
116
|
dashboardItem: Partial<DashboardItemData> | undefined;
|
|
117
117
|
onClickDashboardItem?: any;
|
|
118
|
-
children
|
|
118
|
+
children?: any;
|
|
119
119
|
theme?: any;
|
|
120
120
|
style?: any;
|
|
121
121
|
}
|
|
@@ -139,7 +139,9 @@ export interface DashboardProps {
|
|
|
139
139
|
dateRangeFilterDisabled?: boolean;
|
|
140
140
|
EmptyDashboardComponent?: () => JSX.Element;
|
|
141
141
|
SelectComponent?: (_: SelectComponentProps) => JSX.Element;
|
|
142
|
-
|
|
142
|
+
MetricComponent?: (_: DashboardItemProps) => JSX.Element;
|
|
143
|
+
ChartComponent?: (_: DashboardItemProps) => JSX.Element;
|
|
144
|
+
TableComponent?: (_: DashboardItemProps) => JSX.Element;
|
|
143
145
|
DateRangePickerComponent?: (_: DateRangePickerComponentProps) => JSX.Element;
|
|
144
146
|
FilterButtonComponent?: (_: FilterButtonComponentProps) => JSX.Element;
|
|
145
147
|
FilterModalComponent?: (_: ModalComponentProps) => JSX.Element;
|
|
@@ -161,6 +163,6 @@ export declare const QuillDateRangePicker: ({ label, dateRange, onChangeDateRang
|
|
|
161
163
|
/**
|
|
162
164
|
* Quill Dashboard.
|
|
163
165
|
*/
|
|
164
|
-
export default function Dashboard({ name, containerStyle, chartContainerStyle, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled, SelectComponent, EmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading,
|
|
166
|
+
export default function Dashboard({ name, containerStyle, chartContainerStyle, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled, SelectComponent, EmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading, MetricComponent, ChartComponent, TableComponent, DashboardSectionContainerComponent, DashboardSectionComponent, hideXAxis, hideYAxis, hideCartesianGrid, }: DashboardProps): import("react/jsx-runtime").JSX.Element | null;
|
|
165
167
|
export {};
|
|
166
168
|
//# sourceMappingURL=Dashboard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dashboard.d.ts","sourceRoot":"","sources":["../../src/Dashboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAQN,MAAM,OAAO,CAAC;AA+Cf,OAAO,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"Dashboard.d.ts","sourceRoot":"","sources":["../../src/Dashboard.tsx"],"names":[],"mappings":"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"}
|
package/dist/cjs/Dashboard.js
CHANGED
|
@@ -16,10 +16,13 @@ const locale_1 = require("date-fns/locale");
|
|
|
16
16
|
const useDashboard_1 = require("./hooks/useDashboard");
|
|
17
17
|
const crypto_1 = require("./utils/crypto");
|
|
18
18
|
const DashboardSectionContainer_1 = __importDefault(require("./components/Dashboard/DashboardSectionContainer"));
|
|
19
|
-
const
|
|
19
|
+
const MetricComponent_1 = __importDefault(require("./components/Dashboard/MetricComponent"));
|
|
20
|
+
const TableComponent_1 = __importDefault(require("./components/Dashboard/TableComponent"));
|
|
21
|
+
const ChartComponent_1 = __importDefault(require("./components/Dashboard/ChartComponent"));
|
|
20
22
|
const DashboardSection_1 = __importDefault(require("./components/Dashboard/DashboardSection"));
|
|
21
23
|
const styles_1 = require("./utils/styles");
|
|
22
24
|
const dashboard_1 = require("./utils/dashboard");
|
|
25
|
+
const DataLoader_1 = __importDefault(require("./components/Dashboard/DataLoader"));
|
|
23
26
|
exports.COMPARISON_OPTIONS = [
|
|
24
27
|
{
|
|
25
28
|
value: 'PREV_PERIOD',
|
|
@@ -552,7 +555,7 @@ const defaultChartContainerStyles = {
|
|
|
552
555
|
/**
|
|
553
556
|
* Quill Dashboard.
|
|
554
557
|
*/
|
|
555
|
-
function Dashboard({ name, containerStyle, chartContainerStyle = defaultChartContainerStyles, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled = false, SelectComponent, EmptyDashboardComponent = QuillEmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading,
|
|
558
|
+
function Dashboard({ name, containerStyle, chartContainerStyle = defaultChartContainerStyles, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled = false, SelectComponent, EmptyDashboardComponent = QuillEmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading, MetricComponent = MetricComponent_1.default, ChartComponent = ChartComponent_1.default, TableComponent = TableComponent_1.default, DashboardSectionContainerComponent = DashboardSectionContainer_1.default, DashboardSectionComponent = DashboardSection_1.default, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, }) {
|
|
556
559
|
const { dateFilter } = (0, Context_1.useDateFilter)();
|
|
557
560
|
const { dispatch } = (0, react_1.useContext)(Context_1.DashboardContext);
|
|
558
561
|
const { isLoading: isDataLoading, data, reload, } = (0, useDashboard_1.useDashboard)(name);
|
|
@@ -851,15 +854,17 @@ function Dashboard({ name, containerStyle, chartContainerStyle = defaultChartCon
|
|
|
851
854
|
marginBottom: 16,
|
|
852
855
|
textAlign: 'left',
|
|
853
856
|
marginTop: 12,
|
|
854
|
-
}, children: section })] })), metrics(section).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { children: metrics(section).map((item, index) =>
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
857
|
+
}, children: section })] })), metrics(section).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { children: metrics(section).map((item, index) => {
|
|
858
|
+
return ((0, jsx_runtime_1.jsx)(MetricComponent, { style: { minHeight: '180px' }, theme: theme, dashboardItem: (0, dashboard_1.cleanDashboardItem)(dashboard[item._id] ?? item, dashboardFilters), onClickDashboardItem: onClickDashboardItem
|
|
859
|
+
? () => handleOnClickDashboardItem(item)
|
|
860
|
+
: void null, children: (0, jsx_runtime_1.jsx)(Chart_1.default, { containerStyle: {
|
|
861
|
+
display: 'flex',
|
|
862
|
+
width: '100%',
|
|
863
|
+
// height: '100%',
|
|
864
|
+
}, chartId: item._id, colors: theme.chartColors?.length
|
|
865
|
+
? theme.chartColors
|
|
866
|
+
: undefined, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }) }, item.name + '' + index));
|
|
867
|
+
}) })), charts(section).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { children: charts(section).map((item, index) => ((0, jsx_runtime_1.jsx)(ChartComponent, { theme: theme, dashboardItem: (0, dashboard_1.cleanDashboardItem)(dashboard[item._id] ?? item, dashboardFilters), onClickDashboardItem: onClickDashboardItem
|
|
863
868
|
? () => handleOnClickDashboardItem(item)
|
|
864
869
|
: void null, children: (0, jsx_runtime_1.jsx)(Chart_1.default, { containerStyle: chartContainerStyle, chartId: item._id, colors: theme.chartColors?.length
|
|
865
870
|
? theme.chartColors
|
|
@@ -869,15 +874,15 @@ function Dashboard({ name, containerStyle, chartContainerStyle = defaultChartCon
|
|
|
869
874
|
gap: 20,
|
|
870
875
|
display: 'flex',
|
|
871
876
|
flexDirection: 'column',
|
|
872
|
-
}, children: tables(section).map((item, index) => ((0, jsx_runtime_1.jsx)(
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
877
|
+
}, children: tables(section).map((item, index) => ((0, jsx_runtime_1.jsx)(DataLoader_1.default, { id: item._id, children: (0, jsx_runtime_1.jsx)(TableComponent, { theme: theme, dashboardItem: dashboard[item._id], onClickDashboardItem: onClickDashboardItem
|
|
878
|
+
? () => handleOnClickDashboardItem(item)
|
|
879
|
+
: void null, children: (0, jsx_runtime_1.jsx)(Chart_1.default, { containerStyle: {
|
|
880
|
+
display: 'flex',
|
|
881
|
+
width: '100%',
|
|
882
|
+
height: '400px',
|
|
883
|
+
}, chartId: item._id, colors: theme.chartColors?.length
|
|
884
|
+
? theme.chartColors
|
|
885
|
+
: undefined, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }) }, `${item.name}${index}`) }))) }))] }, section + '' + sectionIndex));
|
|
881
886
|
})] }));
|
|
882
887
|
}
|
|
883
888
|
exports.default = Dashboard;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/ChartComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DashboardSection.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardSection.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"DashboardSection.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardSection.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAmBnB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":";AAUA,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqErE"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const Chart_1 = require("../../Chart");
|
|
6
|
+
const Context_1 = require("../../Context");
|
|
7
|
+
const dataFetcher_1 = require("../../utils/dataFetcher");
|
|
8
|
+
const merge_1 = require("../../utils/merge");
|
|
9
|
+
function DataLoader({ id, children }) {
|
|
10
|
+
const [client, _] = (0, react_1.useContext)(Context_1.ClientContext);
|
|
11
|
+
const { dispatch, dashboard } = (0, react_1.useContext)(Context_1.DashboardContext);
|
|
12
|
+
const { dashboardFilters } = (0, react_1.useContext)(Context_1.DashboardFiltersContext);
|
|
13
|
+
(0, react_1.useEffect)(() => {
|
|
14
|
+
async function getChartOptions() {
|
|
15
|
+
if (!(0, Chart_1.didFiltersChange)(dashboard[id], dashboardFilters)) {
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
try {
|
|
19
|
+
// Remove extra fields on each filter so we don't confuse the backend.
|
|
20
|
+
const minimalFilters = Object.values(dashboardFilters).length
|
|
21
|
+
? Object.values(dashboardFilters).map((filter) => {
|
|
22
|
+
const newFilter = { ...filter };
|
|
23
|
+
if (newFilter.filterType === 'date_range') {
|
|
24
|
+
delete newFilter['field'];
|
|
25
|
+
delete newFilter['options'];
|
|
26
|
+
delete newFilter['selectedValue'];
|
|
27
|
+
}
|
|
28
|
+
return newFilter;
|
|
29
|
+
})
|
|
30
|
+
: [];
|
|
31
|
+
const hostedBody = {
|
|
32
|
+
metadata: {
|
|
33
|
+
dashboardItemId: id,
|
|
34
|
+
...(client.customerId && { orgId: client.customerId }),
|
|
35
|
+
clientId: client.publicKey,
|
|
36
|
+
task: 'item',
|
|
37
|
+
databaseType: client.databaseType,
|
|
38
|
+
filters: minimalFilters,
|
|
39
|
+
},
|
|
40
|
+
};
|
|
41
|
+
const cloudBody = {
|
|
42
|
+
id: id,
|
|
43
|
+
filters: minimalFilters,
|
|
44
|
+
};
|
|
45
|
+
const resp = await (0, dataFetcher_1.getData)(client, 'itempost', 'omit', hostedBody, cloudBody);
|
|
46
|
+
if (resp && resp.name !== 'error') {
|
|
47
|
+
if (resp.compareRows) {
|
|
48
|
+
(0, merge_1.mergeComparisonRange)(resp);
|
|
49
|
+
}
|
|
50
|
+
dispatch({
|
|
51
|
+
type: 'UPDATE_DASHBOARD_ITEM',
|
|
52
|
+
id: id,
|
|
53
|
+
data: {
|
|
54
|
+
...resp,
|
|
55
|
+
filtersApplied: dashboardFilters,
|
|
56
|
+
},
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
catch (e) {
|
|
61
|
+
console.log('Error fetching chart: ', e);
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
getChartOptions();
|
|
65
|
+
}, [dashboardFilters, client, id]);
|
|
66
|
+
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
|
|
67
|
+
}
|
|
68
|
+
exports.default = DataLoader;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
function DashboardItem({ dashboardItem, onClickDashboardItem, theme, style, children, }) {
|
|
5
|
+
return ((0, jsx_runtime_1.jsx)("div", { onClick: onClickDashboardItem
|
|
6
|
+
? () => onClickDashboardItem(dashboardItem)
|
|
7
|
+
: () => { }, style: {
|
|
8
|
+
height: '100%',
|
|
9
|
+
cursor: 'pointer',
|
|
10
|
+
boxSizing: 'content-box',
|
|
11
|
+
paddingRight: 25,
|
|
12
|
+
minHeight: 400,
|
|
13
|
+
borderRadius: 8,
|
|
14
|
+
paddingTop: 20,
|
|
15
|
+
...style,
|
|
16
|
+
}, children: (0, jsx_runtime_1.jsx)("div", { style: {
|
|
17
|
+
width: '100%',
|
|
18
|
+
height: '100%',
|
|
19
|
+
boxSizing: 'content-box',
|
|
20
|
+
}, children: (0, jsx_runtime_1.jsx)("div", { style: {
|
|
21
|
+
width: '100%',
|
|
22
|
+
height: '100%',
|
|
23
|
+
boxSizing: 'content-box',
|
|
24
|
+
}, children: (0, jsx_runtime_1.jsxs)("div", { style: {
|
|
25
|
+
display: 'flex',
|
|
26
|
+
flexDirection: 'column',
|
|
27
|
+
justifyContent: 'space-between',
|
|
28
|
+
height: '100%',
|
|
29
|
+
boxSizing: 'content-box',
|
|
30
|
+
}, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
|
|
31
|
+
display: 'flex',
|
|
32
|
+
flexDirection: 'row',
|
|
33
|
+
justifyContent: 'space-between',
|
|
34
|
+
boxSizing: 'content-box',
|
|
35
|
+
paddingBottom: 20,
|
|
36
|
+
}, children: [(0, jsx_runtime_1.jsx)("div", { style: {
|
|
37
|
+
fontFamily: theme.fontFamily,
|
|
38
|
+
color: theme.primaryTextColor,
|
|
39
|
+
boxSizing: 'content-box',
|
|
40
|
+
fontSize: 18,
|
|
41
|
+
fontWeight: '500',
|
|
42
|
+
textOverflow: 'ellipsis',
|
|
43
|
+
padding: 0,
|
|
44
|
+
whiteSpace: 'nowrap',
|
|
45
|
+
display: 'block',
|
|
46
|
+
maxWidth: '100%',
|
|
47
|
+
overflow: 'hidden',
|
|
48
|
+
}, children: dashboardItem?.name }), onClickDashboardItem ? ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
49
|
+
fontFamily: theme.fontFamily,
|
|
50
|
+
color: theme.primaryTextColor,
|
|
51
|
+
boxSizing: 'content-box',
|
|
52
|
+
fontWeight: '500',
|
|
53
|
+
fontSize: 14,
|
|
54
|
+
minWidth: 14 * 7,
|
|
55
|
+
display: 'flex',
|
|
56
|
+
alignItems: 'center',
|
|
57
|
+
justifyContent: 'flex-end',
|
|
58
|
+
}, children: 'view report →' })) : null] }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
59
|
+
padding: 0,
|
|
60
|
+
height: '100%',
|
|
61
|
+
boxSizing: 'content-box',
|
|
62
|
+
}, children: children })] }) }) }) }, dashboardItem?.name));
|
|
63
|
+
}
|
|
64
|
+
exports.default = DashboardItem;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
function DashboardItem({ dashboardItem, onClickDashboardItem, theme, style, children, }) {
|
|
5
|
+
return ((0, jsx_runtime_1.jsx)("div", { onClick: onClickDashboardItem
|
|
6
|
+
? () => onClickDashboardItem(dashboardItem)
|
|
7
|
+
: () => { }, style: {
|
|
8
|
+
height: '100%',
|
|
9
|
+
cursor: 'pointer',
|
|
10
|
+
boxSizing: 'content-box',
|
|
11
|
+
paddingRight: 25,
|
|
12
|
+
minHeight: 400,
|
|
13
|
+
borderRadius: 8,
|
|
14
|
+
paddingTop: 20,
|
|
15
|
+
...style,
|
|
16
|
+
}, children: (0, jsx_runtime_1.jsx)("div", { style: {
|
|
17
|
+
width: '100%',
|
|
18
|
+
height: '100%',
|
|
19
|
+
boxSizing: 'content-box',
|
|
20
|
+
}, children: (0, jsx_runtime_1.jsx)("div", { style: {
|
|
21
|
+
width: '100%',
|
|
22
|
+
height: '100%',
|
|
23
|
+
boxSizing: 'content-box',
|
|
24
|
+
}, children: (0, jsx_runtime_1.jsxs)("div", { style: {
|
|
25
|
+
display: 'flex',
|
|
26
|
+
flexDirection: 'column',
|
|
27
|
+
justifyContent: 'space-between',
|
|
28
|
+
height: '100%',
|
|
29
|
+
boxSizing: 'content-box',
|
|
30
|
+
}, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
|
|
31
|
+
display: 'flex',
|
|
32
|
+
flexDirection: 'row',
|
|
33
|
+
justifyContent: 'space-between',
|
|
34
|
+
boxSizing: 'content-box',
|
|
35
|
+
paddingBottom: 20,
|
|
36
|
+
}, children: [(0, jsx_runtime_1.jsx)("div", { style: {
|
|
37
|
+
fontFamily: theme.fontFamily,
|
|
38
|
+
color: theme.primaryTextColor,
|
|
39
|
+
boxSizing: 'content-box',
|
|
40
|
+
fontSize: 18,
|
|
41
|
+
fontWeight: '500',
|
|
42
|
+
textOverflow: 'ellipsis',
|
|
43
|
+
padding: 0,
|
|
44
|
+
whiteSpace: 'nowrap',
|
|
45
|
+
display: 'block',
|
|
46
|
+
maxWidth: '100%',
|
|
47
|
+
overflow: 'hidden',
|
|
48
|
+
}, children: dashboardItem?.name }), onClickDashboardItem ? ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
49
|
+
fontFamily: theme.fontFamily,
|
|
50
|
+
color: theme.primaryTextColor,
|
|
51
|
+
boxSizing: 'content-box',
|
|
52
|
+
fontWeight: '500',
|
|
53
|
+
fontSize: 14,
|
|
54
|
+
minWidth: 14 * 7,
|
|
55
|
+
display: 'flex',
|
|
56
|
+
alignItems: 'center',
|
|
57
|
+
justifyContent: 'flex-end',
|
|
58
|
+
}, children: 'view report →' })) : null] }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
59
|
+
padding: 0,
|
|
60
|
+
height: '100%',
|
|
61
|
+
boxSizing: 'content-box',
|
|
62
|
+
}, children: children })] }) }) }) }, dashboardItem?.name));
|
|
63
|
+
}
|
|
64
|
+
exports.default = DashboardItem;
|
package/dist/esm/Chart.d.ts
CHANGED
|
@@ -35,6 +35,7 @@ interface WithConfig extends BaseChartProps {
|
|
|
35
35
|
config: DashboardItem | any;
|
|
36
36
|
}
|
|
37
37
|
type ChartProps = WithChartId | WithConfig;
|
|
38
|
+
export declare function didFiltersChange(dashboardItem: any, filters: any): boolean;
|
|
38
39
|
declare const Chart: ({ chartId, config, colors, containerStyle, query, SelectComponent, dateRangeFilterDisabled, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, }: ChartProps) => import("react/jsx-runtime").JSX.Element;
|
|
39
40
|
export default Chart;
|
|
40
41
|
//# sourceMappingURL=Chart.d.ts.map
|
package/dist/esm/Chart.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../src/Chart.tsx"],"names":[],"mappings":";AA2BA,UAAU,cAAc;IACtB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,UAAU,WAAY,SAAQ,cAAc;IAC1C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,WAAW,GACnB,cAAc,GACd,mBAAmB,GACnB,oBAAoB,GACpB,eAAe,GACf,cAAc,GACd,UAAU,GACV,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,UAAU,GACV,SAAS,GACT,QAAQ,CAAC;AAEb,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,UAAU,UAAW,SAAQ,cAAc;IACzC,MAAM,EAAE,aAAa,GAAG,GAAG,CAAC;CAC7B;AAED,KAAK,UAAU,GAAG,WAAW,GAAG,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../src/Chart.tsx"],"names":[],"mappings":";AA2BA,UAAU,cAAc;IACtB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,UAAU,WAAY,SAAQ,cAAc;IAC1C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,WAAW,GACnB,cAAc,GACd,mBAAmB,GACnB,oBAAoB,GACpB,eAAe,GACf,cAAc,GACd,UAAU,GACV,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,UAAU,GACV,SAAS,GACT,QAAQ,CAAC;AAEb,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,UAAU,UAAW,SAAQ,cAAc;IACzC,MAAM,EAAE,aAAa,GAAG,GAAG,CAAC;CAC7B;AAED,KAAK,UAAU,GAAG,WAAW,GAAG,UAAU,CAAC;AA4D3C,wBAAgB,gBAAgB,CAAC,aAAa,KAAA,EAAE,OAAO,KAAA,WAQtD;AAKD,QAAA,MAAM,KAAK,8JAYR,UAAU,4CAkCZ,CAAC;AAieF,eAAe,KAAK,CAAC"}
|
package/dist/esm/Chart.js
CHANGED
|
@@ -60,7 +60,7 @@ function isEquivalent(filters1, filters2) {
|
|
|
60
60
|
}
|
|
61
61
|
return true;
|
|
62
62
|
}
|
|
63
|
-
function didFiltersChange(dashboardItem, filters) {
|
|
63
|
+
export function didFiltersChange(dashboardItem, filters) {
|
|
64
64
|
if (!dashboardItem?.filtersApplied || !filters) {
|
|
65
65
|
return true;
|
|
66
66
|
}
|
package/dist/esm/Dashboard.d.ts
CHANGED
|
@@ -115,7 +115,7 @@ export interface DashboardItemData {
|
|
|
115
115
|
export interface DashboardItemProps {
|
|
116
116
|
dashboardItem: Partial<DashboardItemData> | undefined;
|
|
117
117
|
onClickDashboardItem?: any;
|
|
118
|
-
children
|
|
118
|
+
children?: any;
|
|
119
119
|
theme?: any;
|
|
120
120
|
style?: any;
|
|
121
121
|
}
|
|
@@ -139,7 +139,9 @@ export interface DashboardProps {
|
|
|
139
139
|
dateRangeFilterDisabled?: boolean;
|
|
140
140
|
EmptyDashboardComponent?: () => JSX.Element;
|
|
141
141
|
SelectComponent?: (_: SelectComponentProps) => JSX.Element;
|
|
142
|
-
|
|
142
|
+
MetricComponent?: (_: DashboardItemProps) => JSX.Element;
|
|
143
|
+
ChartComponent?: (_: DashboardItemProps) => JSX.Element;
|
|
144
|
+
TableComponent?: (_: DashboardItemProps) => JSX.Element;
|
|
143
145
|
DateRangePickerComponent?: (_: DateRangePickerComponentProps) => JSX.Element;
|
|
144
146
|
FilterButtonComponent?: (_: FilterButtonComponentProps) => JSX.Element;
|
|
145
147
|
FilterModalComponent?: (_: ModalComponentProps) => JSX.Element;
|
|
@@ -161,6 +163,6 @@ export declare const QuillDateRangePicker: ({ label, dateRange, onChangeDateRang
|
|
|
161
163
|
/**
|
|
162
164
|
* Quill Dashboard.
|
|
163
165
|
*/
|
|
164
|
-
export default function Dashboard({ name, containerStyle, chartContainerStyle, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled, SelectComponent, EmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading,
|
|
166
|
+
export default function Dashboard({ name, containerStyle, chartContainerStyle, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled, SelectComponent, EmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading, MetricComponent, ChartComponent, TableComponent, DashboardSectionContainerComponent, DashboardSectionComponent, hideXAxis, hideYAxis, hideCartesianGrid, }: DashboardProps): import("react/jsx-runtime").JSX.Element | null;
|
|
165
167
|
export {};
|
|
166
168
|
//# sourceMappingURL=Dashboard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dashboard.d.ts","sourceRoot":"","sources":["../../src/Dashboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAQN,MAAM,OAAO,CAAC;AA+Cf,OAAO,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"Dashboard.d.ts","sourceRoot":"","sources":["../../src/Dashboard.tsx"],"names":[],"mappings":"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"}
|
package/dist/esm/Dashboard.js
CHANGED
|
@@ -10,10 +10,13 @@ import { enUS } from 'date-fns/locale';
|
|
|
10
10
|
import { useDashboard } from './hooks/useDashboard';
|
|
11
11
|
import { hashCode } from './utils/crypto';
|
|
12
12
|
import DashboardSectionContainer from './components/Dashboard/DashboardSectionContainer';
|
|
13
|
-
import
|
|
13
|
+
import QuillMetricComponent from './components/Dashboard/MetricComponent';
|
|
14
|
+
import QuillTableComponent from './components/Dashboard/TableComponent';
|
|
15
|
+
import QuillChartComponent from './components/Dashboard/ChartComponent';
|
|
14
16
|
import DashboardSection from './components/Dashboard/DashboardSection';
|
|
15
17
|
import { styleToProps } from './utils/styles';
|
|
16
18
|
import { cleanDashboardItem } from './utils/dashboard';
|
|
19
|
+
import DataLoader from './components/Dashboard/DataLoader';
|
|
17
20
|
export const COMPARISON_OPTIONS = [
|
|
18
21
|
{
|
|
19
22
|
value: 'PREV_PERIOD',
|
|
@@ -544,7 +547,7 @@ const defaultChartContainerStyles = {
|
|
|
544
547
|
/**
|
|
545
548
|
* Quill Dashboard.
|
|
546
549
|
*/
|
|
547
|
-
export default function Dashboard({ name, containerStyle, chartContainerStyle = defaultChartContainerStyles, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled = false, SelectComponent, EmptyDashboardComponent = QuillEmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading,
|
|
550
|
+
export default function Dashboard({ name, containerStyle, chartContainerStyle = defaultChartContainerStyles, metricContainerStyle, maxColumnWidth, rowHeight, onClickDashboardItem, hideFilters, dateRangeFilterDisabled = false, SelectComponent, EmptyDashboardComponent = QuillEmptyDashboardComponent, DateRangePickerComponent, FilterButtonComponent, FilterModalComponent, onChangeLoading, MetricComponent = QuillMetricComponent, ChartComponent = QuillChartComponent, TableComponent = QuillTableComponent, DashboardSectionContainerComponent = DashboardSectionContainer, DashboardSectionComponent = DashboardSection, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, }) {
|
|
548
551
|
const { dateFilter } = useDateFilter();
|
|
549
552
|
const { dispatch } = useContext(DashboardContext);
|
|
550
553
|
const { isLoading: isDataLoading, data, reload, } = useDashboard(name);
|
|
@@ -843,15 +846,17 @@ export default function Dashboard({ name, containerStyle, chartContainerStyle =
|
|
|
843
846
|
marginBottom: 16,
|
|
844
847
|
textAlign: 'left',
|
|
845
848
|
marginTop: 12,
|
|
846
|
-
}, children: section })] })), metrics(section).length > 0 && (_jsx(DashboardSectionComponent, { children: metrics(section).map((item, index) =>
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
849
|
+
}, children: section })] })), metrics(section).length > 0 && (_jsx(DashboardSectionComponent, { children: metrics(section).map((item, index) => {
|
|
850
|
+
return (_jsx(MetricComponent, { style: { minHeight: '180px' }, theme: theme, dashboardItem: cleanDashboardItem(dashboard[item._id] ?? item, dashboardFilters), onClickDashboardItem: onClickDashboardItem
|
|
851
|
+
? () => handleOnClickDashboardItem(item)
|
|
852
|
+
: void null, children: _jsx(Chart, { containerStyle: {
|
|
853
|
+
display: 'flex',
|
|
854
|
+
width: '100%',
|
|
855
|
+
// height: '100%',
|
|
856
|
+
}, chartId: item._id, colors: theme.chartColors?.length
|
|
857
|
+
? theme.chartColors
|
|
858
|
+
: undefined, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }) }, item.name + '' + index));
|
|
859
|
+
}) })), charts(section).length > 0 && (_jsx(DashboardSectionComponent, { children: charts(section).map((item, index) => (_jsx(ChartComponent, { theme: theme, dashboardItem: cleanDashboardItem(dashboard[item._id] ?? item, dashboardFilters), onClickDashboardItem: onClickDashboardItem
|
|
855
860
|
? () => handleOnClickDashboardItem(item)
|
|
856
861
|
: void null, children: _jsx(Chart, { containerStyle: chartContainerStyle, chartId: item._id, colors: theme.chartColors?.length
|
|
857
862
|
? theme.chartColors
|
|
@@ -861,14 +866,14 @@ export default function Dashboard({ name, containerStyle, chartContainerStyle =
|
|
|
861
866
|
gap: 20,
|
|
862
867
|
display: 'flex',
|
|
863
868
|
flexDirection: 'column',
|
|
864
|
-
}, children: tables(section).map((item, index) => (_jsx(
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
869
|
+
}, children: tables(section).map((item, index) => (_jsx(DataLoader, { id: item._id, children: _jsx(TableComponent, { theme: theme, dashboardItem: dashboard[item._id], onClickDashboardItem: onClickDashboardItem
|
|
870
|
+
? () => handleOnClickDashboardItem(item)
|
|
871
|
+
: void null, children: _jsx(Chart, { containerStyle: {
|
|
872
|
+
display: 'flex',
|
|
873
|
+
width: '100%',
|
|
874
|
+
height: '400px',
|
|
875
|
+
}, chartId: item._id, colors: theme.chartColors?.length
|
|
876
|
+
? theme.chartColors
|
|
877
|
+
: undefined, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }) }, `${item.name}${index}`) }))) }))] }, section + '' + sectionIndex));
|
|
873
878
|
})] }));
|
|
874
879
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/ChartComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DashboardSection.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardSection.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"DashboardSection.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardSection.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAmBnB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":";AAUA,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqErE"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useContext, useEffect } from 'react';
|
|
3
|
+
import { didFiltersChange } from '../../Chart';
|
|
4
|
+
import { ClientContext, DashboardContext, DashboardFiltersContext, } from '../../Context';
|
|
5
|
+
import { getData } from '../../utils/dataFetcher';
|
|
6
|
+
import { mergeComparisonRange } from '../../utils/merge';
|
|
7
|
+
export default function DataLoader({ id, children }) {
|
|
8
|
+
const [client, _] = useContext(ClientContext);
|
|
9
|
+
const { dispatch, dashboard } = useContext(DashboardContext);
|
|
10
|
+
const { dashboardFilters } = useContext(DashboardFiltersContext);
|
|
11
|
+
useEffect(() => {
|
|
12
|
+
async function getChartOptions() {
|
|
13
|
+
if (!didFiltersChange(dashboard[id], dashboardFilters)) {
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
try {
|
|
17
|
+
// Remove extra fields on each filter so we don't confuse the backend.
|
|
18
|
+
const minimalFilters = Object.values(dashboardFilters).length
|
|
19
|
+
? Object.values(dashboardFilters).map((filter) => {
|
|
20
|
+
const newFilter = { ...filter };
|
|
21
|
+
if (newFilter.filterType === 'date_range') {
|
|
22
|
+
delete newFilter['field'];
|
|
23
|
+
delete newFilter['options'];
|
|
24
|
+
delete newFilter['selectedValue'];
|
|
25
|
+
}
|
|
26
|
+
return newFilter;
|
|
27
|
+
})
|
|
28
|
+
: [];
|
|
29
|
+
const hostedBody = {
|
|
30
|
+
metadata: {
|
|
31
|
+
dashboardItemId: id,
|
|
32
|
+
...(client.customerId && { orgId: client.customerId }),
|
|
33
|
+
clientId: client.publicKey,
|
|
34
|
+
task: 'item',
|
|
35
|
+
databaseType: client.databaseType,
|
|
36
|
+
filters: minimalFilters,
|
|
37
|
+
},
|
|
38
|
+
};
|
|
39
|
+
const cloudBody = {
|
|
40
|
+
id: id,
|
|
41
|
+
filters: minimalFilters,
|
|
42
|
+
};
|
|
43
|
+
const resp = await getData(client, 'itempost', 'omit', hostedBody, cloudBody);
|
|
44
|
+
if (resp && resp.name !== 'error') {
|
|
45
|
+
if (resp.compareRows) {
|
|
46
|
+
mergeComparisonRange(resp);
|
|
47
|
+
}
|
|
48
|
+
dispatch({
|
|
49
|
+
type: 'UPDATE_DASHBOARD_ITEM',
|
|
50
|
+
id: id,
|
|
51
|
+
data: {
|
|
52
|
+
...resp,
|
|
53
|
+
filtersApplied: dashboardFilters,
|
|
54
|
+
},
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
catch (e) {
|
|
59
|
+
console.log('Error fetching chart: ', e);
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
getChartOptions();
|
|
63
|
+
}, [dashboardFilters, client, id]);
|
|
64
|
+
return _jsx(_Fragment, { children: children });
|
|
65
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export default function DashboardItem({ dashboardItem, onClickDashboardItem, theme, style, children, }) {
|
|
3
|
+
return (_jsx("div", { onClick: onClickDashboardItem
|
|
4
|
+
? () => onClickDashboardItem(dashboardItem)
|
|
5
|
+
: () => { }, style: {
|
|
6
|
+
height: '100%',
|
|
7
|
+
cursor: 'pointer',
|
|
8
|
+
boxSizing: 'content-box',
|
|
9
|
+
paddingRight: 25,
|
|
10
|
+
minHeight: 400,
|
|
11
|
+
borderRadius: 8,
|
|
12
|
+
paddingTop: 20,
|
|
13
|
+
...style,
|
|
14
|
+
}, children: _jsx("div", { style: {
|
|
15
|
+
width: '100%',
|
|
16
|
+
height: '100%',
|
|
17
|
+
boxSizing: 'content-box',
|
|
18
|
+
}, children: _jsx("div", { style: {
|
|
19
|
+
width: '100%',
|
|
20
|
+
height: '100%',
|
|
21
|
+
boxSizing: 'content-box',
|
|
22
|
+
}, children: _jsxs("div", { style: {
|
|
23
|
+
display: 'flex',
|
|
24
|
+
flexDirection: 'column',
|
|
25
|
+
justifyContent: 'space-between',
|
|
26
|
+
height: '100%',
|
|
27
|
+
boxSizing: 'content-box',
|
|
28
|
+
}, children: [_jsxs("div", { style: {
|
|
29
|
+
display: 'flex',
|
|
30
|
+
flexDirection: 'row',
|
|
31
|
+
justifyContent: 'space-between',
|
|
32
|
+
boxSizing: 'content-box',
|
|
33
|
+
paddingBottom: 20,
|
|
34
|
+
}, children: [_jsx("div", { style: {
|
|
35
|
+
fontFamily: theme.fontFamily,
|
|
36
|
+
color: theme.primaryTextColor,
|
|
37
|
+
boxSizing: 'content-box',
|
|
38
|
+
fontSize: 18,
|
|
39
|
+
fontWeight: '500',
|
|
40
|
+
textOverflow: 'ellipsis',
|
|
41
|
+
padding: 0,
|
|
42
|
+
whiteSpace: 'nowrap',
|
|
43
|
+
display: 'block',
|
|
44
|
+
maxWidth: '100%',
|
|
45
|
+
overflow: 'hidden',
|
|
46
|
+
}, children: dashboardItem?.name }), onClickDashboardItem ? (_jsx("div", { style: {
|
|
47
|
+
fontFamily: theme.fontFamily,
|
|
48
|
+
color: theme.primaryTextColor,
|
|
49
|
+
boxSizing: 'content-box',
|
|
50
|
+
fontWeight: '500',
|
|
51
|
+
fontSize: 14,
|
|
52
|
+
minWidth: 14 * 7,
|
|
53
|
+
display: 'flex',
|
|
54
|
+
alignItems: 'center',
|
|
55
|
+
justifyContent: 'flex-end',
|
|
56
|
+
}, children: 'view report →' })) : null] }), _jsx("div", { style: {
|
|
57
|
+
padding: 0,
|
|
58
|
+
height: '100%',
|
|
59
|
+
boxSizing: 'content-box',
|
|
60
|
+
}, children: children })] }) }) }) }, dashboardItem?.name));
|
|
61
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export default function DashboardItem({ dashboardItem, onClickDashboardItem, theme, style, children, }) {
|
|
3
|
+
return (_jsx("div", { onClick: onClickDashboardItem
|
|
4
|
+
? () => onClickDashboardItem(dashboardItem)
|
|
5
|
+
: () => { }, style: {
|
|
6
|
+
height: '100%',
|
|
7
|
+
cursor: 'pointer',
|
|
8
|
+
boxSizing: 'content-box',
|
|
9
|
+
paddingRight: 25,
|
|
10
|
+
minHeight: 400,
|
|
11
|
+
borderRadius: 8,
|
|
12
|
+
paddingTop: 20,
|
|
13
|
+
...style,
|
|
14
|
+
}, children: _jsx("div", { style: {
|
|
15
|
+
width: '100%',
|
|
16
|
+
height: '100%',
|
|
17
|
+
boxSizing: 'content-box',
|
|
18
|
+
}, children: _jsx("div", { style: {
|
|
19
|
+
width: '100%',
|
|
20
|
+
height: '100%',
|
|
21
|
+
boxSizing: 'content-box',
|
|
22
|
+
}, children: _jsxs("div", { style: {
|
|
23
|
+
display: 'flex',
|
|
24
|
+
flexDirection: 'column',
|
|
25
|
+
justifyContent: 'space-between',
|
|
26
|
+
height: '100%',
|
|
27
|
+
boxSizing: 'content-box',
|
|
28
|
+
}, children: [_jsxs("div", { style: {
|
|
29
|
+
display: 'flex',
|
|
30
|
+
flexDirection: 'row',
|
|
31
|
+
justifyContent: 'space-between',
|
|
32
|
+
boxSizing: 'content-box',
|
|
33
|
+
paddingBottom: 20,
|
|
34
|
+
}, children: [_jsx("div", { style: {
|
|
35
|
+
fontFamily: theme.fontFamily,
|
|
36
|
+
color: theme.primaryTextColor,
|
|
37
|
+
boxSizing: 'content-box',
|
|
38
|
+
fontSize: 18,
|
|
39
|
+
fontWeight: '500',
|
|
40
|
+
textOverflow: 'ellipsis',
|
|
41
|
+
padding: 0,
|
|
42
|
+
whiteSpace: 'nowrap',
|
|
43
|
+
display: 'block',
|
|
44
|
+
maxWidth: '100%',
|
|
45
|
+
overflow: 'hidden',
|
|
46
|
+
}, children: dashboardItem?.name }), onClickDashboardItem ? (_jsx("div", { style: {
|
|
47
|
+
fontFamily: theme.fontFamily,
|
|
48
|
+
color: theme.primaryTextColor,
|
|
49
|
+
boxSizing: 'content-box',
|
|
50
|
+
fontWeight: '500',
|
|
51
|
+
fontSize: 14,
|
|
52
|
+
minWidth: 14 * 7,
|
|
53
|
+
display: 'flex',
|
|
54
|
+
alignItems: 'center',
|
|
55
|
+
justifyContent: 'flex-end',
|
|
56
|
+
}, children: 'view report →' })) : null] }), _jsx("div", { style: {
|
|
57
|
+
padding: 0,
|
|
58
|
+
height: '100%',
|
|
59
|
+
boxSizing: 'content-box',
|
|
60
|
+
}, children: children })] }) }) }) }, dashboardItem?.name));
|
|
61
|
+
}
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DashboardItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardItem.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DashboardItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardItem.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}
|
|
File without changes
|
|
File without changes
|