@quillsql/react 2.12.29 → 2.12.31

package/dist/cjs/components/Dashboard/DataLoader.js

@@ -5,246 +5,189 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const Chart_1 = require("../../Chart");
 const Context_1 = require("../../Context");
-const hooks_1 = require("../../hooks");
-const dataFetcher_1 = require("../../utils/dataFetcher");
-const merge_1 = require("../../utils/merge");
-const errorProcessing_1 = require("../../utils/errorProcessing");
-const dashboard_1 = require("../../utils/dashboard");
-const logging_1 = require("../../utils/logging");
-const constants_1 = require("../../utils/constants");
-function DataLoader({ id, children, filters, }) {
-    const [client, _] = (0, react_1.useContext)(Context_1.ClientContext);
-    const { dispatch, dashboard } = (0, react_1.useContext)(Context_1.DashboardContext);
-    // const { dashboardFilters } = useContext(DashboardFiltersContext);
+const report_1 = require("../../utils/report");
+const paginationProcessing_1 = require("../../utils/paginationProcessing");
+const tableProcessing_1 = require("../../utils/tableProcessing");
+const constructReportFromItem = (item) => {
+    return {
+        ...report_1.EMPTY_REPORT,
+        id: item._id,
+        name: item.name,
+        dashboardName: item.dashboardName,
+        rows: [],
+        columns: [],
+        chartType: item.chartType,
+        dateField: item.dateField,
+        pivot: item.pivot,
+        xAxisLabel: item.xAxisLabel,
+        xAxisField: item.xAxisField,
+        xAxisFormat: item.xAxisFormat,
+        yAxisFields: item.yAxisFields,
+        order: item.order,
+        compareRows: item.compareRows,
+        filtersApplied: item.filtersApplied,
+    };
+};
+function DataLoader({ item, children, filters, }) {
+    const [client] = (0, react_1.useContext)(Context_1.ClientContext);
+    const [dashboard, dispatch] = (0, react_1.useContext)(Context_1.DashboardContext);
     const [customFields] = (0, react_1.useContext)(Context_1.CustomFieldContext);
-    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
-    const [isPaginationLoading, setIsPaginationLoading] = (0, react_1.useState)(true);
+    const [loading, setLoading] = (0, react_1.useState)(false);
     const [error, setError] = (0, react_1.useState)(undefined);
     const [previousPage, setPreviousPage] = (0, react_1.useState)(0);
-    const [report, setReport] = (0, react_1.useState)(dashboard[id]);
+    const [report, setReport] = (0, react_1.useState)(dashboard[item._id] ?? constructReportFromItem(item));
     const [additionalProcessing, setAdditionProcessing] = (0, react_1.useState)({
-        page: 0,
+        page: paginationProcessing_1.DEFAULT_PAGINATION,
     });
     const onPageChange = (page) => {
-        if ((previousPage < page.currentPage &&
-            (page.currentPage * page.rowsPerPage) % constants_1.MAX_COLUMN_ROWS_LIMIT === 0) ||
-            (previousPage > page.currentPage &&
-                (previousPage * page.rowsPerPage) % constants_1.MAX_COLUMN_ROWS_LIMIT === 0)) {
-            getChartOptions(true, { page });
+        if (additionalProcessing &&
+            additionalProcessing.page &&
+            (0, paginationProcessing_1.shouldFetchMore)(paginationProcessing_1.DEFAULT_PAGINATION, page, previousPage)) {
+            const newPagination = { ...additionalProcessing.page, page };
+            const updatedProcessing = {
+                ...additionalProcessing,
+                page: newPagination,
+            };
+            setAdditionProcessing(updatedProcessing);
+            updateTableRows(updatedProcessing);
+        }
+        if (page > previousPage) {
+            setPreviousPage(page);
         }
-        setPreviousPage(page.currentPage);
     };
     const onSortChange = (sort) => {
-        getChartOptions(true, { sort });
-        setPreviousPage(0);
-    };
-    const getChartOptions = async (useReportTask = true, processing) => {
-        if (!(0, Chart_1.didFiltersChange)(dashboard[id], filters) &&
-            !isLoading &&
-            !dashboard[id].triggerReload &&
-            !processing) {
-            setIsLoading(false);
-            setReport(dashboard[id]);
+        if ((0, paginationProcessing_1.shouldSortInMemory)(paginationProcessing_1.DEFAULT_PAGINATION, report.rowCount, !!report.pivot)) {
             return;
         }
-        setIsLoading(true);
-        try {
-            let updatedProcessing = { ...additionalProcessing, ...processing };
-            if (processing && processing.sort) {
-                if (!updatedProcessing.page) {
-                    updatedProcessing.page = {};
+        const updatedProcessing = { page: paginationProcessing_1.DEFAULT_PAGINATION, sort };
+        fetchReportHelper(true, additionalProcessing);
+        updateTableRows(updatedProcessing, true);
+        setPreviousPage(0);
+    };
+    const updateTableRows = async (processing, resetRows = false) => {
+        if (!loading) {
+            setLoading(true);
+            try {
+                const updatedProcessing = { ...additionalProcessing, ...processing };
+                const paginatedRows = await (0, tableProcessing_1.fetchTableByReport)(report.id, client, updatedProcessing, filters, customFields);
+                if (paginatedRows.error) {
+                    throw new Error('Error fetching chart');
                 }
-                updatedProcessing.page.currentPage = 0;
-            }
-            // Remove extra fields on each filter so we don't confuse the backend.
-            const minimalFilters = Object.values(filters).length
-                ? Object.values(filters).map((filter) => {
-                    const newFilter = { ...filter };
-                    if (newFilter.filterType === 'date_range') {
-                        delete newFilter['field'];
-                        delete newFilter['options'];
-                        delete newFilter['selectedValue'];
-                    }
-                    return newFilter;
-                })
-                : [];
-            const hostedBody = {
-                metadata: {
-                    reportId: id,
-                    dashboardItemId: id,
-                    orgId: client.customerId || '*',
-                    clientId: client.publicKey,
-                    task: useReportTask ? 'report' : 'item',
-                    databaseType: client.databaseType,
-                    filters: minimalFilters,
-                    customFields,
-                    paginateTable: true,
-                    additionalProcessing: updatedProcessing,
-                },
-            };
-            const cloudBody = {
-                id: id,
-                filters: minimalFilters,
-            };
-            const resp = await (0, dataFetcher_1.getData)(client, 'itempost', 'omit', hostedBody, cloudBody, 'POST', 'fetch-data');
-            (0, errorProcessing_1.processFilterErrorList)(resp);
-            if (resp && resp.name !== 'error' && !resp.errorMessage) {
-                if (resp.compareRows) {
-                    (0, merge_1.mergeComparisonRange)(resp);
+                let tempRows = [...report.rows, ...paginatedRows.rows];
+                if (resetRows) {
+                    tempRows = paginatedRows.rows;
                 }
-                const dashboardItem = { ...resp, filtersApplied: filters };
-                const cleanedReport = await (0, dashboard_1.cleanDashboardItem)(dashboardItem, filters, client);
-                dispatch({
-                    type: 'UPDATE_DASHBOARD_ITEM',
-                    id: id,
-                    data: { ...cleanedReport, triggerReload: false },
+                const convertedReport = (0, report_1.convertInternalReportToReport)({
+                    ...report,
+                    rows: tempRows,
                 });
-                setReport(cleanedReport);
+                setReport(convertedReport);
+                setAdditionProcessing(updatedProcessing);
+                setTimeout(() => {
+                    setLoading(false);
+                }, 200);
             }
-            else {
-                if (useReportTask) {
-                    throw new Error(resp?.errorMessage);
-                }
-                setError(resp?.errorMessage);
+            catch (e) {
+                console.log(e);
+                setLoading(false);
             }
-            setAdditionProcessing(updatedProcessing);
-            setTimeout(() => {
-                setIsLoading(false);
-            }, 200);
         }
-        catch (e) {
-            if (useReportTask) {
-                (0, logging_1.internalLog)('USING ITEM AS BACKUP');
-                getChartOptions(false, processing);
-            }
-            else {
-                console.log('Error fetching chart: ', e);
-                setError(e.message);
-            }
+    };
+    const fetchReportHelper = async (useReportTask = true, processing) => {
+        if (dashboard[item._id] &&
+            !(0, Chart_1.didFiltersChange)(dashboard[item._id], filters) &&
+            !loading &&
+            // @ts-ignore
+            !dashboard[item._id].triggerReload) {
+            setLoading(false);
+            const convertedReport = (0, report_1.convertInternalReportToReport)(
+            // @ts-ignore
+            dashboard[item._id]);
+            setReport(convertedReport);
+            return;
         }
+        setLoading(true);
+        const { report, error } = await (0, report_1.fetchReport)(item._id, client, useReportTask, filters, processing, undefined, customFields);
+        dispatch({
+            type: 'UPDATE_DASHBOARD_ITEM',
+            id: item._id,
+            data: { ...report, triggerReload: false },
+        });
+        const convertedReport = (0, report_1.convertInternalReportToReport)(report);
+        setReport(convertedReport);
+        setAdditionProcessing(processing);
+        setError(error);
+        setLoading(false);
     };
     (0, react_1.useEffect)(() => {
-        getChartOptions();
-    }, [filters, id]);
+        fetchReportHelper(true, additionalProcessing);
+    }, [filters, item._id]);
     (0, react_1.useEffect)(() => {
-        if (dashboard[id] && dashboard[id].triggerReload) {
-            getChartOptions();
+        // @ts-ignore
+        if (dashboard[item._id] && dashboard[item._id].triggerReload) {
+            fetchReportHelper(true, additionalProcessing);
         }
-    }, [dashboard[id]]);
+    }, [dashboard[item._id]]);
     return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children({
-            isLoading,
+            isLoading: loading,
             error,
             onPageChange,
             onSortChange,
-            data: report ?? undefined,
+            data: report,
         }) }));
 }
 exports.default = DataLoader;
 // The same data-loader pattern as above, but with special logic for charts
 // At some point these may be able to get merged into one function.
-const ChartDataLoader = ({ id, children, hideDateRangeFilter = false, dateBucket, additionalProcessing, filters, }) => {
-    const { dispatch, dashboard } = (0, react_1.useContext)(Context_1.DashboardContext);
+const ChartDataLoader = ({ item, children, dateBucket, additionalProcessing, filters, }) => {
+    const [dashboard, dispatch] = (0, react_1.useContext)(Context_1.DashboardContext);
     const [initialLoad, setInitialLoad] = (0, react_1.useState)(true);
     const [loading, setLoading] = (0, react_1.useState)(false);
     const [error, setError] = (0, react_1.useState)(undefined);
     const [localDateBucket, setLocalDateBucket] = (0, react_1.useState)(undefined);
     const [localAdditionalProcessing, setLocalAdditionalProcessing] = (0, react_1.useState)();
-    const [isComparison, setIsComparison] = (0, react_1.useState)(false);
-    const [report, setReport] = (0, react_1.useState)(dashboard[id]);
-    const [client, _] = (0, react_1.useContext)(Context_1.ClientContext);
+    const [report, setReport] = (0, react_1.useState)(dashboard[item._id] ?? constructReportFromItem(item));
+    const [client] = (0, react_1.useContext)(Context_1.ClientContext);
     const [customFields] = (0, react_1.useContext)(Context_1.CustomFieldContext);
-    const theme = (0, hooks_1.useTheme)();
-    const getChartOptions = async (useReportTask = true) => {
-        try {
-            // Remove extra fields on each filter so we don't confuse the backend.
-            if (!(0, Chart_1.didFiltersChange)(dashboard[id], filters) &&
-                !loading &&
-                !dashboard[id].triggerReload &&
-                dateBucket === localDateBucket &&
-                additionalProcessing?.last === localAdditionalProcessing?.last) {
-                setLoading(false);
-                setReport(dashboard[id]);
-                return;
-            }
-            setLoading(true);
-            setLocalDateBucket(dateBucket);
-            setLocalAdditionalProcessing(additionalProcessing);
-            const hostedBody = {
-                metadata: {
-                    reportId: id,
-                    dashboardItemId: id,
-                    orgId: client.customerId || '*',
-                    clientId: client.publicKey,
-                    task: useReportTask ? 'report' : 'item',
-                    databaseType: client.databaseType,
-                    filters: filters,
-                    customFields,
-                    additionalProcessing,
-                },
-            };
-            const cloudBody = {
-                id: id,
-                filters: filters,
-            };
-            setError(undefined);
-            const resp = await (0, dataFetcher_1.getData)(client, 'itempost', 'omit', hostedBody, cloudBody, 'POST', 'fetch-data');
-            (0, errorProcessing_1.processFilterErrorList)(resp);
-            if (resp && resp.name !== 'error' && !resp.errorMessage) {
-                setIsComparison(!!resp.compareRows?.length);
-                if (resp.compareRows) {
-                    (0, merge_1.mergeComparisonRange)(resp);
-                }
-                const dashboardItem = { ...resp, filtersApplied: filters };
-                const cleanedReport = await (0, dashboard_1.cleanDashboardItem)(dashboardItem, filters, client, dateBucket);
-                setReport(cleanedReport);
-                dispatch({
-                    type: 'UPDATE_DASHBOARD_ITEM',
-                    id: id,
-                    data: {
-                        ...cleanedReport,
-                        triggerReload: false,
-                    },
-                });
-            }
-            else {
-                if (useReportTask) {
-                    throw new Error(resp?.errorMessage);
-                }
-                setError(resp?.errorMessage);
-            }
-            setLoading(false);
-        }
-        catch (e) {
-            if (useReportTask) {
-                (0, logging_1.internalLog)('USING ITEM AS BACKUP');
-                getChartOptions(false);
-            }
-            else {
-                console.log('Error fetching chart: ', e);
-                setError(e.message);
-            }
-        }
-    };
-    (0, react_1.useEffect)(() => {
-        if (dashboard[id] &&
-            !(0, Chart_1.didFiltersChange)(dashboard[id], filters) &&
+    const fetchReportHelper = async (useReportTask = true) => {
+        const tempReport = dashboard[item._id];
+        if (tempReport &&
+            !(0, Chart_1.didFiltersChange)(tempReport, filters) &&
+            !tempReport.triggerReload &&
             dateBucket === localDateBucket &&
             additionalProcessing?.last === localAdditionalProcessing?.last) {
-            setReport(dashboard[id]);
-            setInitialLoad(false);
+            setLoading(false);
+            const convertedReport = (0, report_1.convertInternalReportToReport)(tempReport);
+            setReport(convertedReport);
             return;
         }
+        setLoading(true);
+        const { report, error } = await (0, report_1.fetchReport)(item._id, client, useReportTask, filters, additionalProcessing, dateBucket, customFields);
+        dispatch({
+            type: 'UPDATE_DASHBOARD_ITEM',
+            id: item._id,
+            data: { ...report, triggerReload: false },
+        });
+        const convertedReport = (0, report_1.convertInternalReportToReport)(report);
+        setReport(convertedReport);
+        setLocalDateBucket(dateBucket);
+        setLocalAdditionalProcessing(additionalProcessing);
+        setError(error);
+        setLoading(false);
+    };
+    (0, react_1.useEffect)(() => {
         setInitialLoad(false);
-        getChartOptions();
-    }, [filters, id, dateBucket, additionalProcessing]);
+        fetchReportHelper();
+    }, [filters, item._id, dateBucket, additionalProcessing]);
     (0, react_1.useEffect)(() => {
-        if (dashboard[id] && dashboard[id].triggerReload) {
-            getChartOptions();
+        const tempReport = dashboard[item._id];
+        if (tempReport && tempReport.triggerReload) {
+            fetchReportHelper();
         }
-    }, [dashboard[id]]);
+    }, [dashboard[item._id]]);
     return children({
         isLoading: loading || initialLoad,
-        data: report ?? undefined,
+        data: report,
         error,
         dateBucket,
     });

package/dist/cjs/components/Dashboard/MetricComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AASnD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,GACV,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA4PhC"}
+{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAMnD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,GACV,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CAgOhC"}

package/dist/cjs/components/Dashboard/MetricComponent.js

@@ -4,29 +4,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
 const dateRangePickerUtils_1 = require("../../DateRangePicker/dateRangePickerUtils");
-const valueFormatter_1 = require("../../utils/valueFormatter");
 const ChartError_1 = __importDefault(require("../Chart/ChartError"));
 const ChartSkeleton_1 = __importDefault(require("../Chart/ChartSkeleton"));
 const hooks_1 = require("../../hooks");
-const useQuill_1 = require("../../hooks/useQuill");
 function QuillMetricComponent({ report, onClick, error, isLoading, }) {
     const theme = (0, hooks_1.useTheme)();
     const dateFilter = report?.filtersApplied?.find((filter) => filter.filterType == 'date_range');
-    const [rows, setRows] = (0, react_1.useState)(report?.rows ?? []);
-    const pivotData = (0, useQuill_1.usePivot)(report.id);
-    (0, react_1.useEffect)(() => {
-        if (pivotData.data) {
-            setRows(pivotData.data.rows);
-        }
-        else if (report?.rows) {
-            setRows(report.rows);
-        }
-        else {
-            setRows([]);
-        }
-    }, [pivotData?.data?.rows, report?.rows]);
     const primaryMetricLabel = report?.filtersApplied?.date_range?.preset?.label;
     const comparisonKey = report?.filtersApplied?.date_range?.comparisonRange?.value;
     const comparisonLabel = dateRangePickerUtils_1.COMPARISON_OPTIONS.find((opt) => opt.value === comparisonKey)?.text;
@@ -35,6 +19,7 @@ function QuillMetricComponent({ report, onClick, error, isLoading, }) {
             boxSizing: 'content-box',
             borderRadius: 8,
             paddingBottom: isLoading ? 0 : 30,
+            width: '100%',
         }, children: (0, jsx_runtime_1.jsx)("div", { style: {
                 width: '100%',
                 height: '100%',
@@ -55,7 +40,7 @@ function QuillMetricComponent({ report, onClick, error, isLoading, }) {
                                 justifyContent: 'space-between',
                                 boxSizing: 'content-box',
                                 paddingBottom: 5,
-                            }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                            }, children: [onClick && ((0, jsx_runtime_1.jsx)("div", { style: {
                                         fontFamily: theme.fontFamily,
                                         color: theme.primaryTextColor,
                                         boxSizing: 'content-box',
@@ -67,7 +52,7 @@ function QuillMetricComponent({ report, onClick, error, isLoading, }) {
                                         display: 'block',
                                         maxWidth: '100%',
                                         overflow: 'hidden',
-                                    }, children: report?.name }), onClick && report?.name ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                                    }, children: report?.name })), onClick && report?.name ? ((0, jsx_runtime_1.jsx)("div", { style: {
                                         fontFamily: theme.fontFamily,
                                         color: theme.primaryTextColor,
                                         boxSizing: 'content-box',
@@ -80,7 +65,8 @@ function QuillMetricComponent({ report, onClick, error, isLoading, }) {
                                     }, children: 'view report →' })) : null] }), isLoading ? ((0, jsx_runtime_1.jsx)(ChartSkeleton_1.default, { containerStyle: {
                                 maxHeight: '78px',
                                 height: '100%',
-                            } })) : error ? ((0, jsx_runtime_1.jsx)(ChartError_1.default, {})) : rows?.length === 0 || rows[0][report.xAxisField] === null ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                            } })) : error ? ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ChartError_1.default, { errorMessage: error }) })) : report.rows?.length === 0 ||
+                            report.rows[0][report.xAxisField] === null ? ((0, jsx_runtime_1.jsx)("div", { style: {
                                 display: 'flex',
                                 flex: '1 0 auto',
                                 height: '100%',
@@ -117,19 +103,9 @@ function QuillMetricComponent({ report, onClick, error, isLoading, }) {
                                             gap: 4,
                                             alignItems: 'baseline',
                                             marginRight: 'auto',
-                                        }, children: [(0, jsx_runtime_1.jsx)("span", { children: rows.length > 0 &&
-                                                    (0, valueFormatter_1.valueFormatter)({
-                                                        value: rows[0][report.xAxisField] ?? 0,
-                                                        field: report.xAxisField,
-                                                        fields: [
-                                                            {
-                                                                field: report.xAxisField,
-                                                                format: report.xAxisFormat,
-                                                                label: report.xAxisLabel,
-                                                                _id: report.id || 'dummy',
-                                                            },
-                                                        ],
-                                                    }) }), dateFilter?.comparison && ((0, jsx_runtime_1.jsx)("span", { style: {
+                                        }, children: [(0, jsx_runtime_1.jsx)("span", { children: (report.rows.length > 0 &&
+                                                    report.rows[0][report.xAxisField]) ??
+                                                    0 }), dateFilter?.comparison && ((0, jsx_runtime_1.jsx)("span", { style: {
                                                     fontSize: 13,
                                                     fontWeight: '500',
                                                     fontFamily: theme?.fontFamily,
@@ -148,19 +124,9 @@ function QuillMetricComponent({ report, onClick, error, isLoading, }) {
                                                     fontWeight: '500',
                                                     fontFamily: theme?.fontFamily,
                                                     color: theme?.secondaryTextColor,
-                                                }, children: rows.length > 0 &&
-                                                    (0, valueFormatter_1.valueFormatter)({
-                                                        value: rows[0][`comparison_${report.xAxisField}`] ?? 0,
-                                                        field: report.xAxisField,
-                                                        fields: [
-                                                            {
-                                                                field: report.xAxisField,
-                                                                format: report.xAxisFormat,
-                                                                label: report.xAxisLabel,
-                                                                _id: report.id || 'dummy',
-                                                            },
-                                                        ],
-                                                    }) }), (0, jsx_runtime_1.jsx)("span", { style: {
+                                                }, children: (report.rows.length > 0 &&
+                                                    report.rows[0][`comparison_${report.xAxisField}`]) ??
+                                                    0 }), (0, jsx_runtime_1.jsx)("span", { style: {
                                                     fontSize: 13,
                                                     fontWeight: '500',
                                                     fontFamily: theme?.fontFamily,

package/dist/cjs/components/Dashboard/TableComponent.d.ts

@@ -1,15 +1,12 @@
 /// <reference types="react" />
-import { QuillReport } from '../../Dashboard';
+import { QuillReport } from '../../models/Report';
 export default function QuillTableComponent({ report, onClick, isLoading, error, rowCount, onPageChange, onSortChange, }: {
     report: QuillReport;
     onClick?: (report: QuillReport) => void;
     isLoading?: boolean;
     error?: string;
     rowCount?: number;
-    onPageChange?: (page: {
-        currentPage: number;
-        rowsPerPage: number;
-    }) => void;
+    onPageChange?: (page: number) => void;
     onSortChange?: (sort: {
         field: string;
         direction: string;

package/dist/cjs/components/Dashboard/TableComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,WAAW,EAAoB,MAAM,iBAAiB,CAAC;AAKhE,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,MAAM,EACN,OAAO,EACP,SAAS,EACT,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,YAAY,GACb,EAAE;IACD,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,WAAW,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC5E,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CACrE,GAAG,GAAG,CAAC,OAAO,CAuId"}
+{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAIlD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,MAAM,EACN,OAAO,EACP,SAAS,EACT,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,YAAY,GACb,EAAE;IACD,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CACrE,GAAG,GAAG,CAAC,OAAO,CAwGd"}

package/dist/cjs/components/Dashboard/TableComponent.js

@@ -6,48 +6,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const QuillTable_1 = __importDefault(require("../QuillTable"));
-const valueFormatter_1 = require("../../utils/valueFormatter");
 const ChartSkeleton_1 = __importDefault(require("../Chart/ChartSkeleton"));
 const ChartError_1 = __importDefault(require("../Chart/ChartError"));
 const hooks_1 = require("../../hooks");
 const useExport_1 = require("../../hooks/useExport");
-const useQuill_1 = require("../../hooks/useQuill");
 function QuillTableComponent({ report, onClick, isLoading, error, rowCount, onPageChange, onSortChange, }) {
     const theme = (0, hooks_1.useTheme)();
     const [initialLoad, setInitialLoad] = (0, react_1.useState)(true);
     const { downloadCSV } = (0, useExport_1.useExport)(report?.id);
-    const pivotData = (0, useQuill_1.usePivot)(report.id);
-    const [rows, setRows] = (0, react_1.useState)(report?.rows ?? []);
-    const [columns, setColumns] = (0, react_1.useState)(report?.columns ?? report?.yAxisFields ?? []);
-    (0, react_1.useEffect)(() => {
-        if (!report.rows || !report.columns) {
-            return;
-        }
-        if (report.pivot !== null && pivotData.data) {
-            setRows(pivotData.data.rows);
-            setColumns(pivotData.data.columns);
-        }
-        else {
-            setRows(report?.rows ?? []);
-            setColumns(report?.columns ?? report?.yAxisFields ?? []);
-        }
-    }, [pivotData, report]);
     (0, react_1.useEffect)(() => {
         if (!isLoading) {
             setInitialLoad(false);
         }
     }, [isLoading]);
-    const formattedRows = rows.map((row) => {
-        return columns.reduce((formattedRow, column) => {
-            // Apply the format function to each field in the row
-            const formattedValue = (0, valueFormatter_1.quillFormat)({
-                value: row[column.field],
-                format: column.format,
-            });
-            formattedRow[column.field] = formattedValue;
-            return formattedRow;
-        }, {});
-    });
     return ((0, jsx_runtime_1.jsxs)("div", { style: { cursor: 'pointer' }, onClick: () => onClick && onClick(report), children: [(0, jsx_runtime_1.jsxs)("div", { style: {
                     display: 'flex',
                     flexDirection: 'row',
@@ -80,10 +51,10 @@ function QuillTableComponent({ report, onClick, isLoading, error, rowCount, onPa
                         }, children: 'view report →' })) : null] }), initialLoad ? ((0, jsx_runtime_1.jsx)(ChartSkeleton_1.default, { containerStyle: {
                     width: '100%',
                     height: '400px',
-                } })) : error ? ((0, jsx_runtime_1.jsx)(ChartError_1.default, { containerStyle: {
+                } })) : error ? ((0, jsx_runtime_1.jsx)("div", { style: {
                     width: '100%',
                     height: '400px',
-                } })) : ((0, jsx_runtime_1.jsx)(QuillTable_1.default, { isLoading: isLoading, rows: formattedRows ?? [], rowCount: rowCount, columns: columns, rowsPerPage: 10, containerStyle: {
+                }, children: (0, jsx_runtime_1.jsx)(ChartError_1.default, { errorMessage: error }) })) : ((0, jsx_runtime_1.jsx)(QuillTable_1.default, { isLoading: isLoading, rows: report.rows ?? [], rowCount: rowCount, columns: report.columns, rowsPerPage: 10, containerStyle: {
                     width: '100%',
                     height: '400px',
                 }, downloadCSV: () => {
@@ -92,6 +63,6 @@ function QuillTableComponent({ report, onClick, isLoading, error, rowCount, onPa
                     onPageChange && onPageChange(page);
                 }, onSortChange: (sort) => {
                     onSortChange && onSortChange(sort);
-                }, currentPage: report?.page, sort: report?.sort }))] }, report?.name));
+                }, currentPage: report?.pagination?.page, sort: report?.sort }))] }, report?.name));
 }
 exports.default = QuillTableComponent;

package/dist/cjs/components/Dropdown/Dropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AACA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAahD,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC;IACxC,QAAQ,EAAE,KAAK,CAAC,YAAY,EAAE,GAAG,KAAK,CAAC,YAAY,CAAC;IACpD,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,QAAA,MAAM,QAAQ,sFA6Ib,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAahD,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC;IACxC,QAAQ,EAAE,KAAK,CAAC,YAAY,EAAE,GAAG,KAAK,CAAC,YAAY,CAAC;IACpD,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,QAAA,MAAM,QAAQ,sFA4Ib,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/cjs/components/Dropdown/Dropdown.js

@@ -27,7 +27,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable react/display-name */
 const react_1 = __importStar(require("react"));
 const contexts_1 = require("../../contexts");
 const hooks_1 = require("../../hooks");
@@ -49,8 +48,7 @@ const Dropdown = react_1.default.forwardRef((props, ref) => {
         onValueChange?.(value);
     };
     const [hoveredValue, handleKeyDown] = (0, hooks_1.useSelectOnKeyDown)(handleValueChange, optionValues, isFocused, setIsFocused, selectedValue);
-    const hasSelection = (0, selectUtils_1.hasValue)(selectedValue);
-    return ((0, jsx_runtime_1.jsxs)("div", { ref: (0, lib_1.mergeRefs)([dropdownRef, ref]), onKeyDown: handleKeyDown, style: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: className, ref: (0, lib_1.mergeRefs)([dropdownRef, ref]), onKeyDown: handleKeyDown, style: {
             position: 'relative',
             width: '100%',
             minWidth: '10rem',

package/dist/cjs/components/Dropdown/DropdownItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/DropdownItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,MAAM,WAAW,iBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACzB,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,YAAY,6FAsDjB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"DropdownItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/DropdownItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,MAAM,WAAW,iBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACzB,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,YAAY,6FAkDjB,CAAC;AAEF,eAAe,YAAY,CAAC"}