npm - @hisptz/dhis2-analytics - Versions diffs - 2.0.33 → 2.0.35 - Mend

@hisptz/dhis2-analytics 2.0.33 → 2.0.35

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.

Files changed (105) hide show

package/dist/esm/components/Scorecard/components/ScorecardTable/components/DataRow.js CHANGED Viewed

@@ -6,7 +6,11 @@ import styles from '../ScorecardTable.module.css';
 import { ExpandedScorecardTable } from './ExpandedScorecardTable';
 import { useTransition, useMemo, Fragment } from 'react';
-function TableRowComponent({ row }) {
+function TableRowComponent({
+  row,
+  virtualRow,
+  virtualizer
+}) {
   const [isPending, startTransition] = useTransition();
   const orgUnit = useMemo(() => {
     const dataCell = row.getVisibleCells().find((cell) => {
@@ -23,6 +27,8 @@ function TableRowComponent({ row }) {
   return /* @__PURE__ */ jsx(
     DataTableRow,
     {
+      "data-index": virtualRow ? virtualRow.index : void 0,
+      ref: virtualizer ? (node) => virtualizer.measureElement(node) : void 0,
       className: styles.expandCell,
       onExpandToggle: canExpand ? ({ expanded }) => {
         startTransition(() => {

package/dist/esm/components/Scorecard/components/ScorecardTable/components/DataRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/DataRow.tsx"],"names":[],"mappings":"~~AA0CK~~;~~AA1CL~~,SAAS,kBAA4B;AAKrC,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,OAAO,YAAY;AACnB,SAAS,8BAA8B;AACvC,SAAS,UAAU,SAAS,qBAAqB;~~AAEjD~~,SAAS,kBAAkB,~~EAAE~~,~~IAAI~~,~~GAAqC~~;~~AACrE~~,QAAM,CAAC,WAAW,eAAe,IAAI,cAAc;AACnD,QAAM,UAAU,QAAQ,MAAM;AAC7B,UAAM,WAAW,IAAI,gBAAgB,EAAE,KAAK,CAAC,SAAS;AACrD,YAAM,OAAO,KAAK,SAAS;AAC3B,aAAO,CAAC,CAAC,MAAM;AAAA,IAChB,CAAC;AACD,WAAQ,UAAU,SAAS,GAAgC;AAAA,EAC5D,GAAG,CAAC,GAAG,CAAC;AAER,QAAM,eAAe,QAAQ,MAAM;AAClC,UAAM,aAAa,KAAK,IAAI,gBAAgB,CAAC;AAC7C,WAAQ,YAAY,SAAS,KAAiB;AAAA,EAC/C,GAAG,CAAC,GAAG,CAAC;AAER,QAAM,YAAY,WAAW;AAE7B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAW,OAAO;AAAA,MAClB,gBACC,YACG,CAAC,EAAE,SAAS,MAAM;AAClB,wBAAgB,MAAM;AACrB,cAAI,eAAe,QAAQ;AAAA,QAC5B,CAAC;AAAA,MACF,IACC;AAAA,MAEJ,mBACC,WAAW,eACV;AAAA,QAAC;AAAA;AAAA,UACA,SAAS;AAAA,UACT;AAAA;AAAA,MACD,IACG;AAAA,MAEL,UAAU,aAAa,IAAI,cAAc;AAAA,MAGxC,cAAI,gBAAgB,EAAE,IAAI,CAAC,SAAS;AACpC,eACC,oBAAC,YACC;AAAA,UACA,KAAK,OAAO,UAAU;AAAA,UACtB,KAAK,WAAW;AAAA,QACjB,KAJc,KAAK,EAKpB;AAAA,MAEF,CAAC;AAAA;AAAA,IAXI,IAAI;AAAA,EAYV;AAEF;AAEO,MAAM,WAAW","sourcesContent":["import { flexRender, type Row } from \"@tanstack/react-table\";\nimport type {\n\tScorecardTableCellConfig,\n\tScorecardTableData,\n} from \"../../../schemas/config\";\nimport { head } from \"lodash\";\nimport { DataTableRow } from \"@dhis2/ui\";\nimport styles from \"../ScorecardTable.module.css\";\nimport { ExpandedScorecardTable } from \"./ExpandedScorecardTable\";\nimport { Fragment, useMemo, useTransition } from \"react\";\n\nfunction TableRowComponent({ ~~row~~ }: { ~~row~~: Row<ScorecardTableData> }) {\n\tconst [isPending, startTransition] = useTransition();\n\tconst orgUnit = useMemo(() => {\n\t\tconst dataCell = row.getVisibleCells().find((cell) => {\n\t\t\tconst data = cell.getValue() as ScorecardTableCellConfig;\n\t\t\treturn !!data?.orgUnit;\n\t\t});\n\t\treturn (dataCell?.getValue() as ScorecardTableCellConfig)?.orgUnit;\n\t}, [row]);\n\n\tconst shouldExpand = useMemo(() => {\n\t\tconst expandCell = head(row.getVisibleCells());\n\t\treturn (expandCell?.getValue() as boolean) ?? false;\n\t}, [row]);\n\n\tconst canExpand = orgUnit && shouldExpand;\n\n\treturn (\n\t\t<DataTableRow\n\t\t\tclassName={styles.expandCell}\n\t\t\tonExpandToggle={\n\t\t\t\tcanExpand\n\t\t\t\t\t? ({ expanded }) => {\n\t\t\t\t\t\t\tstartTransition(() => {\n\t\t\t\t\t\t\t\trow.toggleExpanded(expanded);\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\texpandableContent={\n\t\t\t\torgUnit && shouldExpand ? (\n\t\t\t\t\t<ExpandedScorecardTable\n\t\t\t\t\t\tpending={isPending}\n\t\t\t\t\t\torgUnit={orgUnit}\n\t\t\t\t\t/>\n\t\t\t\t) : undefined\n\t\t\t}\n\t\t\texpanded={canExpand && row.getIsExpanded()}\n\t\t\tkey={row.id}\n\t\t>\n\t\t\t{row.getVisibleCells().map((cell) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Fragment key={cell.id}>\n\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\tcell.getContext(),\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Fragment>\n\t\t\t\t);\n\t\t\t})}\n\t\t</DataTableRow>\n\t);\n}\n\nexport const TableRow = TableRowComponent;\n"]}
1	+ {"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/DataRow.tsx"],"names":[],"mappings":"AA2DK;AA3DL,SAAS,kBAA4B;AAKrC,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,OAAO,YAAY;AACnB,SAAS,8BAA8B;AACvC,SAAS,UAAU,SAAS,qBAAqB;AAGjD,SAAS,kBAAkB;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AACD,GAIG;AACF,QAAM,CAAC,WAAW,eAAe,IAAI,cAAc;AACnD,QAAM,UAAU,QAAQ,MAAM;AAC7B,UAAM,WAAW,IAAI,gBAAgB,EAAE,KAAK,CAAC,SAAS;AACrD,YAAM,OAAO,KAAK,SAAS;AAC3B,aAAO,CAAC,CAAC,MAAM;AAAA,IAChB,CAAC;AACD,WAAQ,UAAU,SAAS,GAAgC;AAAA,EAC5D,GAAG,CAAC,GAAG,CAAC;AAER,QAAM,eAAe,QAAQ,MAAM;AAClC,UAAM,aAAa,KAAK,IAAI,gBAAgB,CAAC;AAC7C,WAAQ,YAAY,SAAS,KAAiB;AAAA,EAC/C,GAAG,CAAC,GAAG,CAAC;AAER,QAAM,YAAY,WAAW;AAE7B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,cAAY,aAAa,WAAW,QAAQ;AAAA,MAG5C,KACC,cACG,CAAC,SAAc,YAAY,eAAe,IAAI,IAC9C;AAAA,MAEJ,WAAW,OAAO;AAAA,MAClB,gBACC,YACG,CAAC,EAAE,SAAS,MAAM;AAClB,wBAAgB,MAAM;AACrB,cAAI,eAAe,QAAQ;AAAA,QAC5B,CAAC;AAAA,MACF,IACC;AAAA,MAEJ,mBACC,WAAW,eACV;AAAA,QAAC;AAAA;AAAA,UACA,SAAS;AAAA,UACT;AAAA;AAAA,MACD,IACG;AAAA,MAEL,UAAU,aAAa,IAAI,cAAc;AAAA,MAGxC,cAAI,gBAAgB,EAAE,IAAI,CAAC,SAAS;AACpC,eACC,oBAAC,YACC;AAAA,UACA,KAAK,OAAO,UAAU;AAAA,UACtB,KAAK,WAAW;AAAA,QACjB,KAJc,KAAK,EAKpB;AAAA,MAEF,CAAC;AAAA;AAAA,IAXI,IAAI;AAAA,EAYV;AAEF;AAEO,MAAM,WAAW","sourcesContent":["import { flexRender, type Row } from \"@tanstack/react-table\";\nimport type {\n\tScorecardTableCellConfig,\n\tScorecardTableData,\n} from \"../../../schemas/config\";\nimport { head } from \"lodash\";\nimport { DataTableRow } from \"@dhis2/ui\";\nimport styles from \"../ScorecardTable.module.css\";\nimport { ExpandedScorecardTable } from \"./ExpandedScorecardTable\";\nimport { Fragment, useMemo, useTransition } from \"react\";\nimport type { VirtualItem, Virtualizer } from \"@tanstack/react-virtual\";\n\nfunction TableRowComponent({\n\trow,\n\tvirtualRow,\n\tvirtualizer,\n}: {\n\trow: Row<ScorecardTableData>;\n\tvirtualRow?: VirtualItem;\n\tvirtualizer?: Virtualizer<HTMLDivElement, any>;\n}) {\n\tconst [isPending, startTransition] = useTransition();\n\tconst orgUnit = useMemo(() => {\n\t\tconst dataCell = row.getVisibleCells().find((cell) => {\n\t\t\tconst data = cell.getValue() as ScorecardTableCellConfig;\n\t\t\treturn !!data?.orgUnit;\n\t\t});\n\t\treturn (dataCell?.getValue() as ScorecardTableCellConfig)?.orgUnit;\n\t}, [row]);\n\n\tconst shouldExpand = useMemo(() => {\n\t\tconst expandCell = head(row.getVisibleCells());\n\t\treturn (expandCell?.getValue() as boolean) ?? false;\n\t}, [row]);\n\n\tconst canExpand = orgUnit && shouldExpand;\n\n\treturn (\n\t\t<DataTableRow\n\t\t\tdata-index={virtualRow ? virtualRow.index : undefined}\n\t\t\t/\n // @ts-ignore /\n\t\t\tref={\n\t\t\t\tvirtualizer\n\t\t\t\t\t? (node: any) => virtualizer.measureElement(node)\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\tclassName={styles.expandCell}\n\t\t\tonExpandToggle={\n\t\t\t\tcanExpand\n\t\t\t\t\t? ({ expanded }) => {\n\t\t\t\t\t\t\tstartTransition(() => {\n\t\t\t\t\t\t\t\trow.toggleExpanded(expanded);\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\texpandableContent={\n\t\t\t\torgUnit && shouldExpand ? (\n\t\t\t\t\t<ExpandedScorecardTable\n\t\t\t\t\t\tpending={isPending}\n\t\t\t\t\t\torgUnit={orgUnit}\n\t\t\t\t\t/>\n\t\t\t\t) : undefined\n\t\t\t}\n\t\t\texpanded={canExpand && row.getIsExpanded()}\n\t\t\tkey={row.id}\n\t\t>\n\t\t\t{row.getVisibleCells().map((cell) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Fragment key={cell.id}>\n\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\tcell.getContext(),\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Fragment>\n\t\t\t\t);\n\t\t\t})}\n\t\t</DataTableRow>\n\t);\n}\n\nexport const TableRow = TableRowComponent;\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.js CHANGED Viewed

@@ -8,7 +8,20 @@ function MetaFooterCell() {
     "options",
     "itemNumber"
   ]);
-  return /* @__PURE__ */ jsx(DataTableCell, { align: "center", colSpan: itemNumber ? "3" : "2", fixed: true, children: /* @__PURE__ */ jsx("b", { style: { padding: "8px 0" }, children: i18n.t("Average") }) });
+  return /* @__PURE__ */ jsx(
+    DataTableCell,
+    {
+      style: {
+        width: "fit-content",
+        minWidth: 300
+      },
+      align: "center",
+      colSpan: itemNumber ? "3" : "2",
+      fixed: true,
+      left: "0",
+      children: /* @__PURE__ */ jsx("b", { style: { padding: "8px 0" }, children: i18n.t("Average") })
+    }
+  );
 }
 export { MetaFooterCell };

package/dist/esm/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.tsx"],"names":[],"mappings":"~~AAYG~~;~~AAZH~~,SAAS,qBAAqB;AAC9B,OAAO,UAAU;AACjB,SAAS,iCAAiC;AAEnC,SAAS,iBAAiB;AAChC,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,SACC,~~oBAAC~~,~~iBAAc~~,OAAM,~~UAAS~~,SAAS,aAAa,MAAM,~~KAAK~~,OAAK,~~MACnE~~,8BAAC,OAAE,OAAO,EAAE,SAAS,QAAQ,GAAI,eAAK,EAAE,SAAS,GAAE,~~GACpD~~;AAEF","sourcesContent":["import { DataTableCell } from \"@dhis2/ui\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useScorecardStateSelector } from \"../../StateProvider\";\n\nexport function MetaFooterCell() {\n\tconst itemNumber = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"itemNumber\",\n\t]);\n\n\treturn (\n\t\t<DataTableCell ~~align~~=\"center\" ~~colSpan~~={itemNumber ? \"3\" : \"2\"} ~~fixed~~>\n\t\t\t<b style={{ padding: \"8px 0\" }}>{i18n.t(\"Average\")}</b>\n\t\t</DataTableCell>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.tsx"],"names":[],"mappings":"AAuBG;AAvBH,SAAS,qBAAqB;AAC9B,OAAO,UAAU;AACjB,SAAS,iCAAiC;AAEnC,SAAS,iBAAiB;AAChC,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,MACX;AAAA,MACA,OAAM;AAAA,MACN,SAAS,aAAa,MAAM;AAAA,MAC5B,OAAK;AAAA,MAGL,MAAK;AAAA,MAEL,8BAAC,OAAE,OAAO,EAAE,SAAS,QAAQ,GAAI,eAAK,EAAE,SAAS,GAAE;AAAA;AAAA,EACpD;AAEF","sourcesContent":["import { DataTableCell } from \"@dhis2/ui\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useScorecardStateSelector } from \"../../StateProvider\";\n\nexport function MetaFooterCell() {\n\tconst itemNumber = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"itemNumber\",\n\t]);\n\n\treturn (\n\t\t<DataTableCell\n\t\t\tstyle={{\n\t\t\t\twidth: \"fit-content\",\n\t\t\t\tminWidth: 300,\n\t\t\t}}\n\t\t\talign=\"center\"\n\t\t\tcolSpan={itemNumber ? \"3\" : \"2\"}\n\t\t\tfixed\n\t\t\t/\n // @ts-ignore /\n\t\t\tleft=\"0\"\n\t\t>\n\t\t\t<b style={{ padding: \"8px 0\" }}>{i18n.t(\"Average\")}</b>\n\t\t</DataTableCell>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableBody.js CHANGED Viewed

@@ -3,13 +3,30 @@ import { DataTableBody } from '@dhis2/ui';
 import { useTableState } from '../../TableStateProvider';
 import { TableRow } from './DataRow';
 import { LoadingIndicator } from '../../LoadingIndicator';
-import { memo } from 'react';
+import { memo, useMemo } from 'react';
+import { ScorecardDataFetchProgressProvider } from '../../DataProvider';
+import { useVirtualizer } from '@tanstack/react-virtual';
-const TableBody = memo(function TableBody2() {
+const TableBody = memo(function TableBody2({
+  tableRef
+}) {
   const table = useTableState();
+  const rows = useMemo(
+    () => table.getRowModel().rows,
+    [table.getRowModel().rows]
+  );
+  const enabled = false;
+  useVirtualizer({
+    count: rows.length,
+    getScrollElement: () => tableRef.current?.parentElement ?? null,
+    enabled,
+    overscan: 5,
+    measureElement: typeof window !== "undefined" && navigator.userAgent.indexOf("Firefox") === -1 ? (element) => element?.getBoundingClientRect().height : void 0,
+    estimateSize: () => 60
+  });
   return /* @__PURE__ */ jsxs(DataTableBody, { children: [
-    /* @__PURE__ */ jsx(LoadingIndicator, {}),
-    table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx(TableRow, { row }, row.id))
+    /* @__PURE__ */ jsx(ScorecardDataFetchProgressProvider, { children: /* @__PURE__ */ jsx(LoadingIndicator, { tableRef }) }),
+    rows.map((row) => /* @__PURE__ */ jsx(TableRow, { row }, row.id))
   ] });
 });

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableBody.tsx"],"names":["TableBody"],"mappings":"~~AASE~~,~~SACC~~,~~KADD~~;~~AATF~~,SAAS,qBAAqB;AAC9B,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,~~YAAY~~;~~AAEd~~,MAAM,YAAY,KAAK,SAASA,~~aAAY~~;~~AAClD~~,QAAM,QAAQ,cAAc;AAC5B,SACC,qBAAC,iBACA;AAAA,wBAAC,oBAAiB;AAAA,~~IACjB~~,~~MAAM~~,YAAY,EAAE,KAAK,IAAI,CAAC,~~QAC9B~~,oBAAC,YAAsB,OAAR,IAAI,EAAc,~~CACjC~~;AAAA,~~KACF~~;AAEF,CAAC","sourcesContent":["import { DataTableBody } from \"@dhis2/ui\";\nimport { useTableState } from \"../../TableStateProvider\";\nimport { TableRow } from \"./DataRow\";\nimport { LoadingIndicator } from \"../../LoadingIndicator\";\nimport { memo } from \"react\";\n\nexport const TableBody = memo(function TableBody() {\n\tconst table = useTableState();\n\treturn (\n\t\t<DataTableBody>\n\t\t\t<LoadingIndicator />\n\t\t\t{~~table~~.~~getRowModel~~().~~rows.~~map((~~row~~) => (\n\t\t\t\t<TableRow ~~key~~={row.id} ~~row~~={row} />\n\t\t\t))}\n\t\t</DataTableBody>\n\t);\n});\n"]}
1	+ {"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableBody.tsx"],"names":["TableBody"],"mappings":"AAoCE,SAEE,KAFF;AApCF,SAAS,qBAAqB;AAC9B,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,MAAsB,eAAe;AAC9C,SAAS,0CAA0C;AACnD,SAAS,sBAAsB;AAExB,MAAM,YAAY,KAAK,SAASA,WAAU;AAAA,EAChD;AACD,GAEG;AACF,QAAM,QAAQ,cAAc;AAC5B,QAAM,OAAO;AAAA,IACZ,MAAM,MAAM,YAAY,EAAE;AAAA,IAC1B,CAAC,MAAM,YAAY,EAAE,IAAI;AAAA,EAC1B;AAEA,QAAM,UAAU;AAEhB,QAAM,cAAc,eAAe;AAAA,IAClC,OAAO,KAAK;AAAA,IACZ,kBAAkB,MAChB,SAAS,SAAS,iBAAoC;AAAA,IACxD;AAAA,IACA,UAAU;AAAA,IACV,gBACC,OAAO,WAAW,eAClB,UAAU,UAAU,QAAQ,SAAS,MAAM,KACxC,CAAC,YAAY,SAAS,sBAAsB,EAAE,SAC9C;AAAA,IACJ,cAAc,MAAM;AAAA,EACrB,CAAC;AAED,SACC,qBAAC,iBACA;AAAA,wBAAC,sCACA,8BAAC,oBAAiB,UAAoB,GACvC;AAAA,IACC,UACE,YAAY,gBAAgB,EAAE,IAAI,CAAC,eAAe;AAClD,YAAM,MAAM,KAAK,WAAW,KAAK;AACjC,aACC;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA;AAAA,UAEA;AAAA;AAAA,QADK,IAAI;AAAA,MAEV;AAAA,IAEF,CAAC,IACA,KAAK,IAAI,CAAC,QAAQ,oBAAC,YAAsB,OAAR,IAAI,EAAc,CAAE;AAAA,KACzD;AAEF,CAAC","sourcesContent":["import { DataTableBody } from \"@dhis2/ui\";\nimport { useTableState } from \"../../TableStateProvider\";\nimport { TableRow } from \"./DataRow\";\nimport { LoadingIndicator } from \"../../LoadingIndicator\";\nimport { memo, type RefObject, useMemo } from \"react\";\nimport { ScorecardDataFetchProgressProvider } from \"../../DataProvider\";\nimport { useVirtualizer } from \"@tanstack/react-virtual\";\n\nexport const TableBody = memo(function TableBody({\n\ttableRef,\n}: {\n\ttableRef: RefObject<HTMLTableElement>;\n}) {\n\tconst table = useTableState();\n\tconst rows = useMemo(\n\t\t() => table.getRowModel().rows,\n\t\t[table.getRowModel().rows],\n\t);\n\n\tconst enabled = false; //TODO: Work for smooth scroll first\n\n\tconst virtualizer = useVirtualizer({\n\t\tcount: rows.length,\n\t\tgetScrollElement: () =>\n\t\t\t(tableRef.current?.parentElement as HTMLDivElement) ?? null,\n\t\tenabled,\n\t\toverscan: 5,\n\t\tmeasureElement:\n\t\t\ttypeof window !== \"undefined\" &&\n\t\t\tnavigator.userAgent.indexOf(\"Firefox\") === -1\n\t\t\t\t? (element) => element?.getBoundingClientRect().height\n\t\t\t\t: undefined,\n\t\testimateSize: () => 60,\n\t});\n\n\treturn (\n\t\t<DataTableBody>\n\t\t\t<ScorecardDataFetchProgressProvider>\n\t\t\t\t<LoadingIndicator tableRef={tableRef} />\n\t\t\t</ScorecardDataFetchProgressProvider>\n\t\t\t{enabled\n\t\t\t\t? virtualizer.getVirtualItems().map((virtualRow) => {\n\t\t\t\t\t\tconst row = rows[virtualRow.index];\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\tvirtualizer={virtualizer}\n\t\t\t\t\t\t\t\tvirtualRow={virtualRow}\n\t\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\t\trow={row}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t})\n\t\t\t\t: rows.map((row) => <TableRow key={row.id} row={row} />)}\n\t\t</DataTableBody>\n\t);\n});\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.js CHANGED Viewed

@@ -3,10 +3,11 @@ import { useTableState } from '../../../TableStateProvider';
 import { DataTableHead, DataTableRow } from '@dhis2/ui';
 import { flexRender } from '@tanstack/react-table';
 import { memo, Fragment } from 'react';
+import styles from './TableHeader.module.css';
 const TableHeader = memo(function TableHeaderComponent() {
   const table = useTableState();
-  return /* @__PURE__ */ jsx(DataTableHead, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(DataTableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(Fragment, { children: flexRender(
+  return /* @__PURE__ */ jsx(DataTableHead, { className: styles["sticky-header"], children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(DataTableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(Fragment, { children: flexRender(
     header.column.columnDef.header,
     header.getContext()
   ) }, `${header.id}-fragment`)) }, headerGroup.id)) });

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.tsx"],"names":[],"mappings":"~~AAaM~~;~~AAbN~~,SAAS,qBAAqB;AAC9B,SAAS,eAAe,oBAAoB;AAC5C,SAAS,kBAAkB;AAC3B,SAAS,UAAU,YAAY;~~AAExB~~,MAAM,cAAc,KAAK,SAAS,uBAAuB;AAC/D,QAAM,QAAQ,cAAc;AAE5B,SACC,oBAAC,~~iBACC~~,gBAAM,gBAAgB,EAAE,IAAI,CAAC,gBAC7B,oBAAC,gBACC,sBAAY,QAAQ,IAAI,CAAC,WACzB,oBAAC,YACC;AAAA,IACA,OAAO,OAAO,UAAU;AAAA,IACxB,OAAO,WAAW;AAAA,EACnB,KAJc,GAAG,OAAO,EAAE,WAK3B,CACA,KARiB,YAAY,EAS/B,CACA,GACF;AAEF,CAAC","sourcesContent":["import { useTableState } from \"../../../TableStateProvider\";\nimport { DataTableHead, DataTableRow } from \"@dhis2/ui\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { Fragment, memo } from \"react\";\n\nexport const TableHeader = memo(function TableHeaderComponent() {\n\tconst table = useTableState();\n\n\treturn (\n\t\t<DataTableHead>\n\t\t\t{table.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t<DataTableRow key={headerGroup.id}>\n\t\t\t\t\t{headerGroup.headers.map((header) => (\n\t\t\t\t\t\t<Fragment key={`${header.id}-fragment`}>\n\t\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t))}\n\t\t\t\t</DataTableRow>\n\t\t\t))}\n\t\t</DataTableHead>\n\t);\n});\n"]}
1	+ {"version":3,"sources":["../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.tsx"],"names":[],"mappings":"AAcM;AAdN,SAAS,qBAAqB;AAC9B,SAAS,eAAe,oBAAoB;AAC5C,SAAS,kBAAkB;AAC3B,SAAS,UAAU,YAAY;AAC/B,OAAO,YAAY;AAEZ,MAAM,cAAc,KAAK,SAAS,uBAAuB;AAC/D,QAAM,QAAQ,cAAc;AAE5B,SACC,oBAAC,iBAAc,WAAW,OAAO,eAAe,GAC9C,gBAAM,gBAAgB,EAAE,IAAI,CAAC,gBAC7B,oBAAC,gBACC,sBAAY,QAAQ,IAAI,CAAC,WACzB,oBAAC,YACC;AAAA,IACA,OAAO,OAAO,UAAU;AAAA,IACxB,OAAO,WAAW;AAAA,EACnB,KAJc,GAAG,OAAO,EAAE,WAK3B,CACA,KARiB,YAAY,EAS/B,CACA,GACF;AAEF,CAAC","sourcesContent":["import { useTableState } from \"../../../TableStateProvider\";\nimport { DataTableHead, DataTableRow } from \"@dhis2/ui\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { Fragment, memo } from \"react\";\nimport styles from \"./TableHeader.module.css\";\n\nexport const TableHeader = memo(function TableHeaderComponent() {\n\tconst table = useTableState();\n\n\treturn (\n\t\t<DataTableHead className={styles[\"sticky-header\"]}>\n\t\t\t{table.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t<DataTableRow key={headerGroup.id}>\n\t\t\t\t\t{headerGroup.headers.map((header) => (\n\t\t\t\t\t\t<Fragment key={`${header.id}-fragment`}>\n\t\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t))}\n\t\t\t\t</DataTableRow>\n\t\t\t))}\n\t\t</DataTableHead>\n\t);\n});\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.module.css CHANGED Viewed

@@ -1,12 +1,32 @@
+.metaHeader {
+  align-items: center !important;
+}
 .metaHeader > span {
   min-height: 100% !important;
   width: 100% !important;
+  height: 100% !important;
   padding: 16px !important;
 }
+.metaHeader > span > span {
+  width: 100% !important;
+}
+.metaHeader > span > span > span:first-child {
+  flex: 1;
+  width: 100% !important;
+}
+.filter-input {
+  width: 100%;
+}
 .iconButton {
   all: unset;
 }
 .iconButton:hover {
   opacity: 0.8;
 }
+.sticky-header {
+  position: sticky !important;
+  top: 0;
+  left: 0;
+  z-index: 2 !important;
+}
 /*# sourceMappingURL=TableHeader.module.css.map */

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.module.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.module.css"],"sourcesContent":["\n.metaHeader > span {\n min-height: 100% !important;\n width: 100% !important;\n padding: 16px !important;\n}\n\n.iconButton {\n all: unset;\n}\n\n.iconButton:hover {\n opacity: 0.8;\n}\n"],"mappings":"AACA,CAAC,~~WAAW~~,EAAE;AACV,cAAY;AACZ,SAAO;AACP,WAAS;AACb;AAEA,CAAC;AACG,OAAK;AACT;AAEA,CAJC,UAIU;AACP,WAAS;AACb;","names":[]}
1	+ {"version":3,"sources":["../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/TableHeader.module.css"],"sourcesContent":["\n.metaHeader{\n align-items: center !important;\n}\n\n.metaHeader > span {\n min-height: 100% !important;\n width: 100% !important;\n height: 100% !important;\n padding: 16px !important;\n}\n\n.metaHeader > span > span {\n width: 100% !important;\n}\n\n.metaHeader > span > span > span:first-child {\n flex: 1;\n width: 100% !important;\n}\n\n.filter-input {\n width: 100%;\n}\n\n.iconButton {\n all: unset;\n}\n\n.iconButton:hover {\n opacity: 0.8;\n}\n\n.sticky-header {\n position: sticky !important;\n top: 0;\n left: 0;\n z-index: 2 !important;\n}\n"],"mappings":"AACA,CAAC;AACG,eAAa;AACjB;AAEA,CAJC,WAIW,EAAE;AACV,cAAY;AACZ,SAAO;AACP,UAAQ;AACR,WAAS;AACb;AAEA,CAXC,WAWW,EAAE,KAAK,EAAE;AACjB,SAAO;AACX;AAEA,CAfC,WAeW,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI;AAC5B,QAAM;AACN,SAAO;AACX;AAEA,CAAC;AACG,SAAO;AACX;AAEA,CAAC;AACG,OAAK;AACT;AAEA,CAJC,UAIU;AACP,WAAS;AACb;AAEA,CAAC;AACG,YAAU;AACV,OAAK;AACL,QAAM;AACN,WAAS;AACb;","names":[]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/ExpandCell.js CHANGED Viewed

@@ -4,7 +4,15 @@ import { DataTableCell } from '@dhis2/ui';
 function ExpandCell(props) {
   const data = props.getValue();
   if (!data) {
-    return /* @__PURE__ */ jsx(DataTableCell, { fixed: true }, props.cell.id);
+    return /* @__PURE__ */ jsx(
+      DataTableCell,
+      {
+        style: { width: 48, maxWidth: 48, minWidth: 48 },
+        fixed: true,
+        left: "0"
+      },
+      props.cell.id
+    );
   }
   return null;
 }

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/ExpandCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/ExpandCell.tsx"],"names":[],"mappings":"~~AAQS~~;~~AANT~~,SAAS,qBAAqB;AAEvB,SAAS,WAAW,OAAiD;AAC3E,QAAM,OAAO,MAAM,SAAS;AAE5B,MAAI,CAAC,MAAM;AACV,~~WAAO~~,~~oBAAC~~,~~iBAAkC~~,OAAK,~~QAApB~~,MAAM,KAAK,~~EAAU~~;AAAA,~~EACjD~~;AAEA,SAAO;AACR","sourcesContent":["import type { CellContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport { DataTableCell } from \"@dhis2/ui\";\n\nexport function ExpandCell(props: CellContext<ScorecardTableData, boolean>) {\n\tconst data = props.getValue();\n\n\tif (!data) {\n\t\treturn <DataTableCell ~~key~~={props.cell.id} ~~fixed~~ ~~/>;\~~n\t}\n\n\treturn null;\n}\n"]}
1	+ {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/ExpandCell.tsx"],"names":[],"mappings":"AASG;AAPH,SAAS,qBAAqB;AAEvB,SAAS,WAAW,OAAiD;AAC3E,QAAM,OAAO,MAAM,SAAS;AAE5B,MAAI,CAAC,MAAM;AACV,WACC;AAAA,MAAC;AAAA;AAAA,QACA,OAAO,EAAE,OAAO,IAAI,UAAU,IAAI,UAAU,GAAG;AAAA,QAE/C,OAAK;AAAA,QAGL,MAAK;AAAA;AAAA,MAJA,MAAM,KAAK;AAAA,IAKjB;AAAA,EAEF;AAEA,SAAO;AACR","sourcesContent":["import type { CellContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport { DataTableCell } from \"@dhis2/ui\";\n\nexport function ExpandCell(props: CellContext<ScorecardTableData, boolean>) {\n\tconst data = props.getValue();\n\n\tif (!data) {\n\t\treturn (\n\t\t\t<DataTableCell\n\t\t\t\tstyle={{ width: 48, maxWidth: 48, minWidth: 48 }}\n\t\t\t\tkey={props.cell.id}\n\t\t\t\tfixed\n\t\t\t\t/\n // @ts-ignore /\n\t\t\t\tleft=\"0\"\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn null;\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/FilterArea.js CHANGED Viewed

@@ -2,6 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import i18n from '@dhis2/d2-i18n';
 import { useScorecardStateSelector } from '../../../../StateProvider';
 import { InputField } from '@dhis2/ui';
+import styles from '../TableHeader.module.css';
 import { useState, useEffect } from 'react';
 function FilterArea({ column }) {
@@ -21,6 +22,7 @@ function FilterArea({ column }) {
   return /* @__PURE__ */ jsx(
     InputField,
     {
+      className: styles["filter-input"],
       value: text,
       onChange: ({ value }) => setText(value),
       placeholder: searchPlaceholder

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/FilterArea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/FilterArea.tsx"],"names":[],"mappings":"~~AA+BE~~;~~AA7BF~~,OAAO,UAAU;AACjB,SAAS,iCAAiC;AAC1C,SAAS,kBAAkB;AAC3B,SAAS,WAAW,gBAAgB;AAM7B,SAAS,WAAW,EAAE,OAAO,GAAoB;AACvD,QAAM,eAAe,OAAO,eAAe;AAC3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAA6B,YAAY;AACjE,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AACD,QAAM,oBAAoB,aACvB,KAAK,EAAE,mBAAmB,IAC1B,KAAK,EAAE,2BAA2B;AAErC,YAAU,MAAM;AACf,UAAM,UAAU,WAAW,MAAM;AAChC,aAAO,eAAe,IAAI;AAAA,IAC3B,GAAG,GAAG;AAEN,WAAO,MAAM,aAAa,OAAO;AAAA,EAClC,GAAG,CAAC,IAAI,CAAC;AAET,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO;AAAA,MACP,UAAU,CAAC,EAAE,MAAM,MAAM,QAAQ,KAAK;AAAA,MACtC,aAAa;AAAA;AAAA,EACd;AAEF","sourcesContent":["import type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport type { Column } from \"@tanstack/react-table\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useScorecardStateSelector } from \"../../../../StateProvider\";\nimport { InputField } from \"@dhis2/ui\";\nimport { useEffect, useState } from \"react\";\n\nexport interface FilterAreaProps {\n\tcolumn: Column<ScorecardTableData, any>;\n}\n\nexport function FilterArea({ column }: FilterAreaProps) {\n\tconst defaultValue = column.getFilterValue() as string \| undefined;\n\tconst [text, setText] = useState<string \| undefined>(defaultValue);\n\tconst dataInRows = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"showDataInRows\",\n\t]);\n\tconst searchPlaceholder = dataInRows\n\t\t? i18n.t(\"Search data items\")\n\t\t: i18n.t(\"Search organisation units\");\n\n\tuseEffect(() => {\n\t\tconst timeout = setTimeout(() => {\n\t\t\tcolumn.setFilterValue(text);\n\t\t}, 700);\n\n\t\treturn () => clearTimeout(timeout);\n\t}, [text]);\n\n\treturn (\n\t\t<InputField\n\t\t\tvalue={text}\n\t\t\tonChange={({ value }) => setText(value)}\n\t\t\tplaceholder={searchPlaceholder}\n\t\t/>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/FilterArea.tsx"],"names":[],"mappings":"AAgCE;AA9BF,OAAO,UAAU;AACjB,SAAS,iCAAiC;AAC1C,SAAS,kBAAkB;AAC3B,OAAO,YAAY;AACnB,SAAS,WAAW,gBAAgB;AAM7B,SAAS,WAAW,EAAE,OAAO,GAAoB;AACvD,QAAM,eAAe,OAAO,eAAe;AAC3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAA6B,YAAY;AACjE,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AACD,QAAM,oBAAoB,aACvB,KAAK,EAAE,mBAAmB,IAC1B,KAAK,EAAE,2BAA2B;AAErC,YAAU,MAAM;AACf,UAAM,UAAU,WAAW,MAAM;AAChC,aAAO,eAAe,IAAI;AAAA,IAC3B,GAAG,GAAG;AAEN,WAAO,MAAM,aAAa,OAAO;AAAA,EAClC,GAAG,CAAC,IAAI,CAAC;AAET,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAW,OAAO,cAAc;AAAA,MAChC,OAAO;AAAA,MACP,UAAU,CAAC,EAAE,MAAM,MAAM,QAAQ,KAAK;AAAA,MACtC,aAAa;AAAA;AAAA,EACd;AAEF","sourcesContent":["import type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport type { Column } from \"@tanstack/react-table\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useScorecardStateSelector } from \"../../../../StateProvider\";\nimport { InputField } from \"@dhis2/ui\";\nimport styles from \"../TableHeader.module.css\";\nimport { useEffect, useState } from \"react\";\n\nexport interface FilterAreaProps {\n\tcolumn: Column<ScorecardTableData, any>;\n}\n\nexport function FilterArea({ column }: FilterAreaProps) {\n\tconst defaultValue = column.getFilterValue() as string \| undefined;\n\tconst [text, setText] = useState<string \| undefined>(defaultValue);\n\tconst dataInRows = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"showDataInRows\",\n\t]);\n\tconst searchPlaceholder = dataInRows\n\t\t? i18n.t(\"Search data items\")\n\t\t: i18n.t(\"Search organisation units\");\n\n\tuseEffect(() => {\n\t\tconst timeout = setTimeout(() => {\n\t\t\tcolumn.setFilterValue(text);\n\t\t}, 700);\n\n\t\treturn () => clearTimeout(timeout);\n\t}, [text]);\n\n\treturn (\n\t\t<InputField\n\t\t\tclassName={styles[\"filter-input\"]}\n\t\t\tvalue={text}\n\t\t\tonChange={({ value }) => setText(value)}\n\t\t\tplaceholder={searchPlaceholder}\n\t\t/>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/LabelCell.js CHANGED Viewed

@@ -4,7 +4,8 @@ import { DataTableCell } from '@dhis2/ui';
 import DroppableCell from '../../DroppableCell';
 import { DraggableCell } from '../../DraggableCell';
 import { useScorecardStateSelector } from '../../../../StateProvider';
-import { memo } from 'react';
+import { memo, useMemo } from 'react';
+import { head } from 'lodash';
 function LabelCellComponent(props) {
   const data = props.getValue().toString();
@@ -12,14 +13,30 @@ function LabelCellComponent(props) {
     "options",
     "showDataInRows"
   ]);
+  const itemNumber = useScorecardStateSelector([
+    "options",
+    "itemNumber"
+  ]);
+  const canExpand = useMemo(() => {
+    const expandCell = head(props.row.getVisibleCells());
+    return expandCell?.getValue() ?? false;
+  }, []);
+  const left = useMemo(() => {
+    let left2 = 1;
+    if (itemNumber) {
+      left2++;
+    }
+    return left2 * 48;
+  }, [canExpand, itemNumber]);
   return /* @__PURE__ */ jsx(
     DataTableCell,
     {
       style: {
         width: "fit-content",
-        minWidth: 200
+        minWidth: 300
       },
       fixed: true,
+      left: `${left}px`,
       bordered: true,
       children: /* @__PURE__ */ jsx(
         DroppableCell,

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/LabelCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/LabelCell.tsx"],"names":[],"mappings":"~~AAoCI~~;~~AAnCJ~~;AAAA,EACC;AAAA,OAEM;AACP,SAAS,qBAAqB;AAC9B,OAAO,mBAAmB;AAC1B,SAAS,qBAAqB;AAC9B,SAAS,iCAAiC;AAC1C,SAAS,YAAY;AAEd,SAAS,mBACf,OACC;AACD,QAAM,OAAO,MAAM,SAAS,EAAE,SAAS;AACvC,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,MACX;AAAA,MACA,OAAK;AAAA,~~MACL~~,UAAQ;AAAA,MAER;AAAA,QAAC;AAAA;AAAA,UACA,QACC,aACG,CAAC,wBAAwB,EAAE,IAC3B,CAAC,wBAAwB,IAAI;AAAA,UAGjC;AAAA,YAAC;AAAA;AAAA,cACA,MACC,aACG,wBAAwB,OACxB,wBAAwB;AAAA,cAG3B;AAAA;AAAA,UACF;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;AAEO,MAAM,YAAY,KAAK,kBAAkB","sourcesContent":["import type { CellContext } from \"@tanstack/react-table\";\nimport {\n\tScorecardDraggableItems,\n\ttype ScorecardTableData,\n} from \"../../../../../schemas/config\";\nimport { DataTableCell } from \"@dhis2/ui\";\nimport DroppableCell from \"../../DroppableCell\";\nimport { DraggableCell } from \"../../DraggableCell\";\nimport { useScorecardStateSelector } from \"../../../../StateProvider\";\nimport { memo } from \"react\";\n\nexport function LabelCellComponent(\n\tprops: CellContext<ScorecardTableData, string \| number>,\n) {\n\tconst data = props.getValue().toString();\n\tconst dataInRows = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"showDataInRows\",\n\t]);\n\n\treturn (\n\t\t<DataTableCell\n\t\t\tstyle={{\n\t\t\t\twidth: \"fit-content\",\n\t\t\t\tminWidth: ~~200~~,\n\t\t\t}}\n\t\t\tfixed\n\t\t\tbordered\n\t\t>\n\t\t\t<DroppableCell\n\t\t\t\taccept={\n\t\t\t\t\tdataInRows\n\t\t\t\t\t\t? [ScorecardDraggableItems.ou]\n\t\t\t\t\t\t: [ScorecardDraggableItems.data]\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<DraggableCell\n\t\t\t\t\ttype={\n\t\t\t\t\t\tdataInRows\n\t\t\t\t\t\t\t? ScorecardDraggableItems.data\n\t\t\t\t\t\t\t: ScorecardDraggableItems.ou\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{data}\n\t\t\t\t</DraggableCell>\n\t\t\t</DroppableCell>\n\t\t</DataTableCell>\n\t);\n}\n\nexport const LabelCell = memo(LabelCellComponent);\n"]}
1	+ {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/LabelCell.tsx"],"names":["left"],"mappings":"AA0DI;AAzDJ;AAAA,EACC;AAAA,OAEM;AACP,SAAS,qBAAqB;AAC9B,OAAO,mBAAmB;AAC1B,SAAS,qBAAqB;AAC9B,SAAS,iCAAiC;AAC1C,SAAS,MAAM,eAAe;AAC9B,SAAS,YAAY;AAEd,SAAS,mBACf,OACC;AACD,QAAM,OAAO,MAAM,SAAS,EAAE,SAAS;AACvC,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,QAAM,YAAY,QAAQ,MAAM;AAC/B,UAAM,aAAa,KAAK,MAAM,IAAI,gBAAgB,CAAC;AACnD,WAAQ,YAAY,SAAS,KAAiB;AAAA,EAC/C,GAAG,CAAC,CAAC;AAEL,QAAM,OAAO,QAAQ,MAAM;AAC1B,QAAIA,QAAO;AACX,QAAI,YAAY;AACf,MAAAA;AAAA,IACD;AACA,WAAOA,QAAO;AAAA,EACf,GAAG,CAAC,WAAW,UAAU,CAAC;AAE1B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,MACX;AAAA,MACA,OAAK;AAAA,MAGL,MAAM,GAAG,IAAI;AAAA,MACb,UAAQ;AAAA,MAER;AAAA,QAAC;AAAA;AAAA,UACA,QACC,aACG,CAAC,wBAAwB,EAAE,IAC3B,CAAC,wBAAwB,IAAI;AAAA,UAGjC;AAAA,YAAC;AAAA;AAAA,cACA,MACC,aACG,wBAAwB,OACxB,wBAAwB;AAAA,cAG3B;AAAA;AAAA,UACF;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;AAEO,MAAM,YAAY,KAAK,kBAAkB","sourcesContent":["import type { CellContext } from \"@tanstack/react-table\";\nimport {\n\tScorecardDraggableItems,\n\ttype ScorecardTableData,\n} from \"../../../../../schemas/config\";\nimport { DataTableCell } from \"@dhis2/ui\";\nimport DroppableCell from \"../../DroppableCell\";\nimport { DraggableCell } from \"../../DraggableCell\";\nimport { useScorecardStateSelector } from \"../../../../StateProvider\";\nimport { memo, useMemo } from \"react\";\nimport { head } from \"lodash\";\n\nexport function LabelCellComponent(\n\tprops: CellContext<ScorecardTableData, string \| number>,\n) {\n\tconst data = props.getValue().toString();\n\tconst dataInRows = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"showDataInRows\",\n\t]);\n\n\tconst itemNumber = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"itemNumber\",\n\t]);\n\n\tconst canExpand = useMemo(() => {\n\t\tconst expandCell = head(props.row.getVisibleCells());\n\t\treturn (expandCell?.getValue() as boolean) ?? false;\n\t}, []);\n\n\tconst left = useMemo(() => {\n\t\tlet left = 1;\n\t\tif (itemNumber) {\n\t\t\tleft++;\n\t\t}\n\t\treturn left * 48;\n\t}, [canExpand, itemNumber]);\n\n\treturn (\n\t\t<DataTableCell\n\t\t\tstyle={{\n\t\t\t\twidth: \"fit-content\",\n\t\t\t\tminWidth: 300,\n\t\t\t}}\n\t\t\tfixed\n\t\t\t/\n // @ts-ignore /\n\t\t\tleft={`${left}px`}\n\t\t\tbordered\n\t\t>\n\t\t\t<DroppableCell\n\t\t\t\taccept={\n\t\t\t\t\tdataInRows\n\t\t\t\t\t\t? [ScorecardDraggableItems.ou]\n\t\t\t\t\t\t: [ScorecardDraggableItems.data]\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<DraggableCell\n\t\t\t\t\ttype={\n\t\t\t\t\t\tdataInRows\n\t\t\t\t\t\t\t? ScorecardDraggableItems.data\n\t\t\t\t\t\t\t: ScorecardDraggableItems.ou\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{data}\n\t\t\t\t</DraggableCell>\n\t\t\t</DroppableCell>\n\t\t</DataTableCell>\n\t);\n}\n\nexport const LabelCell = memo(LabelCellComponent);\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/MetaHeaderCell.js CHANGED Viewed

@@ -25,7 +25,7 @@ function MetaHeaderCellComponent({
   return /* @__PURE__ */ jsx(
     DataTableColumnHeader,
     {
-      align: "right",
+      align: "center",
       sortIconTitle: i18n.t("Sort {{nextSortType}}", { nextSortType }),
       onSortIconClick: (_, e) => {
         const sort = filterColumn.getToggleSortingHandler();
@@ -33,6 +33,8 @@ function MetaHeaderCellComponent({
           sort(e);
         }
       },
+      fixed: true,
+      left: "0",
       sortDirection,
       colSpan: header.colSpan.toString(),
       rowSpan,

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/MetaHeaderCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/MetaHeaderCell.tsx"],"names":["header"],"mappings":"~~AA4DI~~;~~AA1DJ~~,SAAS,6BAA0D;AACnE,SAAS,iCAAiC;AAC1C,OAAO,UAAU;AACjB,OAAO,YAAY;AACnB,SAAS,kBAAkB;AAC3B,SAAS,WAAW;AACpB,SAAS,MAAM,cAAc;AAE7B,SAAS,wBAAwB;AAAA,EAChC;AACD,GAA2C;AAC1C,QAAM,WAAW,OAAe,IAAI,CAAC;AAErC,QAAM,eAAe,0BAA0B,CAAC,cAAc,CAAC;AAC/D,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,QAAM,UAAU,aACb,eACC,MACA,MACD,eACC,MACA;AAEJ,QAAM,eAAe,OAAO,WAAW;AAAA,IAAK,CAACA,YAC5CA,QAAO,OAAO,aAAa;AAAA,EAC5B,GAAG;AAEH,QAAM,gBAAgB,CAAC,cAAc,YAAY,IAC9C,YACC,aAAc,YAAY;AAC9B,QAAM,eACL,cAAc,oBAAoB,MAAM,QACrC,KAAK,EAAE,oBAAoB,IAC3B,cAAc,oBAAoB,MAAM,SACvC,KAAK,EAAE,qBAAqB,IAC5B,KAAK,EAAE,SAAS;AAErB,SACC;AAAA,IAAC;AAAA;AAAA,MAEA,OAAM;AAAA,MACN,eAAe,KAAK,EAAE,yBAAyB,EAAE,aAAa,CAAC;AAAA,MAC/D,iBAAiB,CAAC,GAAG,MAAM;AAC1B,cAAM,OAAO,aAAc,wBAAwB;AACnD,YAAI,MAAM;AACT,eAAK,CAAC;AAAA,QACP;AAAA,MACD;AAAA,MACA;AAAA,MACA,SAAS,OAAO,QAAQ,SAAS;AAAA,MACjC;AAAA,MACA,WAAW,OAAO;AAAA,MAEjB,WAAC,CAAC,gBACF;AAAA,QAAC;AAAA;AAAA,UAEA,QAAQ;AAAA;AAAA,QADH,GAAG,OAAO,EAAE;AAAA,MAElB;AAAA;AAAA,~~IAlBI~~,GAAG,OAAO,EAAE,IAAI,SAAS,OAAO;AAAA,~~EAoBtC~~;AAEF;AAEO,MAAM,iBAAiB,KAAK,uBAAuB","sourcesContent":["import type { HeaderContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport { DataTableColumnHeader, type DataTableSortDirection } from \"@dhis2/ui\";\nimport { useScorecardStateSelector } from \"../../../../StateProvider\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport styles from \"../TableHeader.module.css\";\nimport { FilterArea } from \"./FilterArea\";\nimport { uid } from \"@hisptz/dhis2-utils\";\nimport { memo, useRef } from \"react\";\n\nfunction MetaHeaderCellComponent({\n\theader,\n}: HeaderContext<ScorecardTableData, any>) {\n\tconst randomId = useRef<string>(uid());\n\n\tconst hasOnePeriod = useScorecardStateSelector([\"hasOnePeriod\"]);\n\tconst dataInRows = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"showDataInRows\",\n\t]);\n\n\tconst rowSpan = dataInRows\n\t\t? hasOnePeriod\n\t\t\t? \"2\"\n\t\t\t: \"2\"\n\t\t: hasOnePeriod\n\t\t\t? \"2\"\n\t\t\t: \"3\";\n\n\tconst filterColumn = header.subHeaders.find((header) =>\n\t\theader.column.getCanFilter(),\n\t)?.column;\n\n\tconst sortDirection = !filterColumn?.getIsSorted()\n\t\t? \"default\"\n\t\t: (filterColumn!.getIsSorted() as DataTableSortDirection);\n\tconst nextSortType =\n\t\tfilterColumn?.getNextSortingOrder() === \"asc\"\n\t\t\t? i18n.t(\"in ascending order\")\n\t\t\t: filterColumn?.getNextSortingOrder() === \"desc\"\n\t\t\t\t? i18n.t(\"in descending order\")\n\t\t\t\t: i18n.t(\"disable\");\n\n\treturn (\n\t\t<DataTableColumnHeader\n\t\t\tkey={`${header.id}-${randomId.current}`}\n\t\t\talign=\"~~right~~\"\n\t\t\tsortIconTitle={i18n.t(\"Sort {{nextSortType}}\", { nextSortType })}\n\t\t\tonSortIconClick={(_, e) => {\n\t\t\t\tconst sort = filterColumn!.getToggleSortingHandler();\n\t\t\t\tif (sort) {\n\t\t\t\t\tsort(e);\n\t\t\t\t}\n\t\t\t}}\n\t\t\tsortDirection={sortDirection}\n\t\t\tcolSpan={header.colSpan.toString()}\n\t\t\trowSpan={rowSpan}\n\t\t\tclassName={styles.metaHeader}\n\t\t>\n\t\t\t{!!filterColumn && (\n\t\t\t\t<FilterArea\n\t\t\t\t\tkey={`${header.id}-filter-area`}\n\t\t\t\t\tcolumn={filterColumn}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</DataTableColumnHeader>\n\t);\n}\n\nexport const MetaHeaderCell = memo(MetaHeaderCellComponent);\n"]}
1	+ {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/MetaHeaderCell.tsx"],"names":["header"],"mappings":"AAgEI;AA9DJ,SAAS,6BAA0D;AACnE,SAAS,iCAAiC;AAC1C,OAAO,UAAU;AACjB,OAAO,YAAY;AACnB,SAAS,kBAAkB;AAC3B,SAAS,WAAW;AACpB,SAAS,MAAM,cAAc;AAE7B,SAAS,wBAAwB;AAAA,EAChC;AACD,GAA2C;AAC1C,QAAM,WAAW,OAAe,IAAI,CAAC;AAErC,QAAM,eAAe,0BAA0B,CAAC,cAAc,CAAC;AAC/D,QAAM,aAAa,0BAAmC;AAAA,IACrD;AAAA,IACA;AAAA,EACD,CAAC;AAED,QAAM,UAAU,aACb,eACC,MACA,MACD,eACC,MACA;AAEJ,QAAM,eAAe,OAAO,WAAW;AAAA,IAAK,CAACA,YAC5CA,QAAO,OAAO,aAAa;AAAA,EAC5B,GAAG;AAEH,QAAM,gBAAgB,CAAC,cAAc,YAAY,IAC9C,YACC,aAAc,YAAY;AAC9B,QAAM,eACL,cAAc,oBAAoB,MAAM,QACrC,KAAK,EAAE,oBAAoB,IAC3B,cAAc,oBAAoB,MAAM,SACvC,KAAK,EAAE,qBAAqB,IAC5B,KAAK,EAAE,SAAS;AAErB,SACC;AAAA,IAAC;AAAA;AAAA,MAEA,OAAM;AAAA,MACN,eAAe,KAAK,EAAE,yBAAyB,EAAE,aAAa,CAAC;AAAA,MAC/D,iBAAiB,CAAC,GAAG,MAAM;AAC1B,cAAM,OAAO,aAAc,wBAAwB;AACnD,YAAI,MAAM;AACT,eAAK,CAAC;AAAA,QACP;AAAA,MACD;AAAA,MACA,OAAK;AAAA,MAGL,MAAK;AAAA,MACL;AAAA,MACA,SAAS,OAAO,QAAQ,SAAS;AAAA,MACjC;AAAA,MACA,WAAW,OAAO;AAAA,MAEjB,WAAC,CAAC,gBACF;AAAA,QAAC;AAAA;AAAA,UAEA,QAAQ;AAAA;AAAA,QADH,GAAG,OAAO,EAAE;AAAA,MAElB;AAAA;AAAA,IAtBI,GAAG,OAAO,EAAE,IAAI,SAAS,OAAO;AAAA,EAwBtC;AAEF;AAEO,MAAM,iBAAiB,KAAK,uBAAuB","sourcesContent":["import type { HeaderContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport { DataTableColumnHeader, type DataTableSortDirection } from \"@dhis2/ui\";\nimport { useScorecardStateSelector } from \"../../../../StateProvider\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport styles from \"../TableHeader.module.css\";\nimport { FilterArea } from \"./FilterArea\";\nimport { uid } from \"@hisptz/dhis2-utils\";\nimport { memo, useRef } from \"react\";\n\nfunction MetaHeaderCellComponent({\n\theader,\n}: HeaderContext<ScorecardTableData, any>) {\n\tconst randomId = useRef<string>(uid());\n\n\tconst hasOnePeriod = useScorecardStateSelector([\"hasOnePeriod\"]);\n\tconst dataInRows = useScorecardStateSelector<boolean>([\n\t\t\"options\",\n\t\t\"showDataInRows\",\n\t]);\n\n\tconst rowSpan = dataInRows\n\t\t? hasOnePeriod\n\t\t\t? \"2\"\n\t\t\t: \"2\"\n\t\t: hasOnePeriod\n\t\t\t? \"2\"\n\t\t\t: \"3\";\n\n\tconst filterColumn = header.subHeaders.find((header) =>\n\t\theader.column.getCanFilter(),\n\t)?.column;\n\n\tconst sortDirection = !filterColumn?.getIsSorted()\n\t\t? \"default\"\n\t\t: (filterColumn!.getIsSorted() as DataTableSortDirection);\n\tconst nextSortType =\n\t\tfilterColumn?.getNextSortingOrder() === \"asc\"\n\t\t\t? i18n.t(\"in ascending order\")\n\t\t\t: filterColumn?.getNextSortingOrder() === \"desc\"\n\t\t\t\t? i18n.t(\"in descending order\")\n\t\t\t\t: i18n.t(\"disable\");\n\n\treturn (\n\t\t<DataTableColumnHeader\n\t\t\tkey={`${header.id}-${randomId.current}`}\n\t\t\talign=\"center\"\n\t\t\tsortIconTitle={i18n.t(\"Sort {{nextSortType}}\", { nextSortType })}\n\t\t\tonSortIconClick={(_, e) => {\n\t\t\t\tconst sort = filterColumn!.getToggleSortingHandler();\n\t\t\t\tif (sort) {\n\t\t\t\t\tsort(e);\n\t\t\t\t}\n\t\t\t}}\n\t\t\tfixed\n\t\t\t/\n // @ts-ignore /\n\t\t\tleft=\"0\"\n\t\t\tsortDirection={sortDirection}\n\t\t\tcolSpan={header.colSpan.toString()}\n\t\t\trowSpan={rowSpan}\n\t\t\tclassName={styles.metaHeader}\n\t\t>\n\t\t\t{!!filterColumn && (\n\t\t\t\t<FilterArea\n\t\t\t\t\tkey={`${header.id}-filter-area`}\n\t\t\t\t\tcolumn={filterColumn}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</DataTableColumnHeader>\n\t);\n}\n\nexport const MetaHeaderCell = memo(MetaHeaderCellComponent);\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/NumberCell.js CHANGED Viewed

@@ -8,9 +8,12 @@ function NumberCellComponent(props) {
     DataTableCell,
     {
       style: {
-        width: "fit-content"
+        width: 48,
+        minWidth: 48,
+        maxWidth: 48
       },
       fixed: true,
+      left: "48px",
       children: data
     }
   );

package/dist/esm/components/Scorecard/components/ScorecardTable/components/TableHeader/components/NumberCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/NumberCell.tsx"],"names":[],"mappings":"AAWE;AATF,SAAS,qBAAqB;AAC9B,SAAS,YAAY;AAErB,SAAS,oBACR,OACC;AACD,QAAM,OAAO,MAAM,SAAS,EAAE,SAAS;AAEvC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO;AAAA,QACN,OAAO;AAAA,~~MACR~~;AAAA,MACA,OAAK;AAAA,MAEJ;AAAA;AAAA,EACF;AAEF;AAEO,MAAM,aAAa,KAAK,mBAAmB","sourcesContent":["import type { CellContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport { DataTableCell } from \"@dhis2/ui\";\nimport { memo } from \"react\";\n\nfunction NumberCellComponent(\n\tprops: CellContext<ScorecardTableData, string \| number>,\n) {\n\tconst data = props.getValue().toString();\n\n\treturn (\n\t\t<DataTableCell\n\t\t\tstyle={{\n\t\t\t\twidth: \~~"fit-content~~\",\n\t\t\t}}\n\t\t\tfixed\n\t\t>\n\t\t\t{data}\n\t\t</DataTableCell>\n\t);\n}\n\nexport const NumberCell = memo(NumberCellComponent);\n"]}
1	+ {"version":3,"sources":["../../../../../../../../../src/components/Scorecard/components/ScorecardTable/components/TableHeader/components/NumberCell.tsx"],"names":[],"mappings":"AAWE;AATF,SAAS,qBAAqB;AAC9B,SAAS,YAAY;AAErB,SAAS,oBACR,OACC;AACD,QAAM,OAAO,MAAM,SAAS,EAAE,SAAS;AAEvC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,QACV,UAAU;AAAA,MACX;AAAA,MACA,OAAK;AAAA,MAGL,MAAK;AAAA,MAEJ;AAAA;AAAA,EACF;AAEF;AAEO,MAAM,aAAa,KAAK,mBAAmB","sourcesContent":["import type { CellContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../../../schemas/config\";\nimport { DataTableCell } from \"@dhis2/ui\";\nimport { memo } from \"react\";\n\nfunction NumberCellComponent(\n\tprops: CellContext<ScorecardTableData, string \| number>,\n) {\n\tconst data = props.getValue().toString();\n\n\treturn (\n\t\t<DataTableCell\n\t\t\tstyle={{\n\t\t\t\twidth: 48,\n\t\t\t\tminWidth: 48,\n\t\t\t\tmaxWidth: 48,\n\t\t\t}}\n\t\t\tfixed\n\t\t\t/\n // @ts-ignore /\n\t\t\tleft=\"48px\"\n\t\t>\n\t\t\t{data}\n\t\t</DataTableCell>\n\t);\n}\n\nexport const NumberCell = memo(NumberCellComponent);\n"]}

package/dist/esm/components/Scorecard/components/TableStateProvider.js CHANGED Viewed

@@ -15,6 +15,7 @@ function useTableState() {
 }
 function TableStateProvider({ children }) {
   const options = useTableSetup();
+  console.log("Re-rendering table state");
   return /* @__PURE__ */ jsx(TableStateContext.Provider, { value: options, children });
 }

package/dist/esm/components/Scorecard/components/TableStateProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/Scorecard/components/TableStateProvider.tsx"],"names":[],"mappings":"~~AAyBE~~;~~AAzBF~~,SAAS,eAA+B,kBAAkB;AAC1D;AAAA,EACC;AAAA,EAEA;AAAA,OACM;AACP,SAAS,qBAAqB;AAG9B,MAAM,oBAAoB,cAAgD;AAAA,EACzE,OAAO,CAAC;AAAA,EACR,SAAS,CAAC;AAAA,EACV,iBAAiB,gBAAgB;AAAA,EACjC,MAAM,CAAC;AACR,CAAC;AAEM,SAAS,gBAAgB;AAC/B,QAAM,UAAU,WAAW,iBAAiB;AAC5C,SAAO,cAAkC,OAAO;AACjD;AAEO,SAAS,mBAAmB,EAAE,SAAS,GAA4B;AACzE,QAAM,UAAU,cAAc;AAE9B,SACC,oBAAC,kBAAkB,UAAlB,EAA2B,OAAO,SACjC,UACF;AAEF","sourcesContent":["import { createContext, type ReactNode, useContext } from \"react\";\nimport {\n\tgetCoreRowModel,\n\ttype TableOptions,\n\tuseReactTable,\n} from \"@tanstack/react-table\";\nimport { useTableSetup } from \"../hooks/table\";\nimport type { ScorecardTableData } from \"../schemas/config\";\n\nconst TableStateContext = createContext<TableOptions<ScorecardTableData>>({\n\tstate: {},\n\tcolumns: [],\n\tgetCoreRowModel: getCoreRowModel(),\n\tdata: [],\n});\n\nexport function useTableState() {\n\tconst context = useContext(TableStateContext);\n\treturn useReactTable<ScorecardTableData>(context);\n}\n\nexport function TableStateProvider({ children }: { children: ReactNode }) {\n\tconst options = useTableSetup();\n\n\treturn (\n\t\t<TableStateContext.Provider value={options}>\n\t\t\t{children}\n\t\t</TableStateContext.Provider>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["../../../../../src/components/Scorecard/components/TableStateProvider.tsx"],"names":[],"mappings":"AA2BE;AA3BF,SAAS,eAA+B,kBAAkB;AAC1D;AAAA,EACC;AAAA,EAEA;AAAA,OACM;AACP,SAAS,qBAAqB;AAG9B,MAAM,oBAAoB,cAAgD;AAAA,EACzE,OAAO,CAAC;AAAA,EACR,SAAS,CAAC;AAAA,EACV,iBAAiB,gBAAgB;AAAA,EACjC,MAAM,CAAC;AACR,CAAC;AAEM,SAAS,gBAAgB;AAC/B,QAAM,UAAU,WAAW,iBAAiB;AAC5C,SAAO,cAAkC,OAAO;AACjD;AAEO,SAAS,mBAAmB,EAAE,SAAS,GAA4B;AACzE,QAAM,UAAU,cAAc;AAE9B,UAAQ,IAAI,0BAA0B;AAEtC,SACC,oBAAC,kBAAkB,UAAlB,EAA2B,OAAO,SACjC,UACF;AAEF","sourcesContent":["import { createContext, type ReactNode, useContext } from \"react\";\nimport {\n\tgetCoreRowModel,\n\ttype TableOptions,\n\tuseReactTable,\n} from \"@tanstack/react-table\";\nimport { useTableSetup } from \"../hooks/table\";\nimport type { ScorecardTableData } from \"../schemas/config\";\n\nconst TableStateContext = createContext<TableOptions<ScorecardTableData>>({\n\tstate: {},\n\tcolumns: [],\n\tgetCoreRowModel: getCoreRowModel(),\n\tdata: [],\n});\n\nexport function useTableState() {\n\tconst context = useContext(TableStateContext);\n\treturn useReactTable<ScorecardTableData>(context);\n}\n\nexport function TableStateProvider({ children }: { children: ReactNode }) {\n\tconst options = useTableSetup();\n\n\tconsole.log(\"Re-rendering table state\");\n\n\treturn (\n\t\t<TableStateContext.Provider value={options}>\n\t\t\t{children}\n\t\t</TableStateContext.Provider>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/hooks/cellData.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/Scorecard/hooks/cellData.ts"],"names":[],"mappings":"~~AAIA~~,SAAS,~~0BAA0B;AACnC~~,~~SAAS,~~wBAAwB;~~AACjC~~,SAAS,eAAe;AACxB,SAAS,iBAAiB;AAGnB,SAAS,YAAY;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACD,GAIG;AACF,QAAM,SAAS,mBAAmB;AAClC,QAAM,OAAO,iBAAiB;AAE9B,QAAM,eAAe,YAAY,KAAK;AAEtC,QAAM,mBAAmB,QAAQ,MAAM;AACtC,QAAI,CAAC;AAAY;AACjB,WAAO,UAAU;AAAA,MAChB;AAAA,MACA,OAAO;AAAA,MACP,eAAe,KAAM;AAAA,MACrB;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IACX,CAAC;AAAA,EACF,GAAG,CAAC,YAAY,cAAc,MAAM,SAAS,MAAM,CAAC;AAEpD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD","sourcesContent":["import type {~~\n\tScorecardCellData,\n\tScorecardTableCellConfig,\n~~} from \"../schemas/config\";\nimport { useScorecardConfig ~~} from \"../components\";\nimport {~~ useScorecardMeta } from \"../components\";\nimport { useMemo } from \"react\";\nimport { getLegend } from \"../utils/legends\";\nimport type { ItemMeta } from \"./metadata\";\n\nexport function useCellData({\n\tdataSource,\n\torgUnit,\n\tperiod,\n}: {\n\tdataSource?: ScorecardCellData;\n\torgUnit: ItemMeta & { hierarchy: string };\n\tperiod: string;\n}) {\n\tconst config = useScorecardConfig();\n\tconst meta = useScorecardMeta();\n\n\tconst currentValue = dataSource?.data.current;\n\n\tconst legendDefinition = useMemo(() => {\n\t\tif (!dataSource) return;\n\t\treturn getLegend({\n\t\t\tdataSource,\n\t\t\tvalue: currentValue,\n\t\t\torgUnitLevels: meta!.orgUnitLevels,\n\t\t\tconfig: config!,\n\t\t\torgUnit,\n\t\t\tperiodId: period,\n\t\t});\n\t}, [dataSource, currentValue, meta, orgUnit, period]);\n\n\treturn {\n\t\tcurrentValue,\n\t\tlegendDefinition,\n\t};\n}\n"]}
1	+ {"version":3,"sources":["../../../../../src/components/Scorecard/hooks/cellData.ts"],"names":[],"mappings":"AACA,SAAS,oBAAoB,wBAAwB;AACrD,SAAS,eAAe;AACxB,SAAS,iBAAiB;AAGnB,SAAS,YAAY;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACD,GAIG;AACF,QAAM,SAAS,mBAAmB;AAClC,QAAM,OAAO,iBAAiB;AAE9B,QAAM,eAAe,YAAY,KAAK;AAEtC,QAAM,mBAAmB,QAAQ,MAAM;AACtC,QAAI,CAAC;AAAY;AACjB,WAAO,UAAU;AAAA,MAChB;AAAA,MACA,OAAO;AAAA,MACP,eAAe,KAAM;AAAA,MACrB;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IACX,CAAC;AAAA,EACF,GAAG,CAAC,YAAY,cAAc,MAAM,SAAS,MAAM,CAAC;AAEpD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD","sourcesContent":["import type { ScorecardCellData } from \"../schemas/config\";\nimport { useScorecardConfig, useScorecardMeta } from \"../components\";\nimport { useMemo } from \"react\";\nimport { getLegend } from \"../utils/legends\";\nimport type { ItemMeta } from \"./metadata\";\n\nexport function useCellData({\n\tdataSource,\n\torgUnit,\n\tperiod,\n}: {\n\tdataSource?: ScorecardCellData;\n\torgUnit: ItemMeta & { hierarchy: string };\n\tperiod: string;\n}) {\n\tconst config = useScorecardConfig();\n\tconst meta = useScorecardMeta();\n\n\tconst currentValue = dataSource?.data.current;\n\n\tconst legendDefinition = useMemo(() => {\n\t\tif (!dataSource) return;\n\t\treturn getLegend({\n\t\t\tdataSource,\n\t\t\tvalue: currentValue,\n\t\t\torgUnitLevels: meta!.orgUnitLevels,\n\t\t\tconfig: config!,\n\t\t\torgUnit,\n\t\t\tperiodId: period,\n\t\t});\n\t}, [dataSource, currentValue, meta, orgUnit, period]);\n\n\treturn {\n\t\tcurrentValue,\n\t\tlegendDefinition,\n\t};\n}\n"]}

package/dist/esm/components/Scorecard/hooks/data.js CHANGED Viewed

@@ -6,7 +6,6 @@ import { getAdjacentFixedPeriods, createFixedPeriodFromPeriodId } from '@dhis2/m
 import { uniq, maxBy, chunk } from 'lodash';
 import { sanitizeAnalyticsData } from '../utils/data';
 import { useCalendar } from './metadata';
-import { createScorecardDataEngine } from '../utils/dataEngine';
 import { queue } from 'async-es';
 import { asyncify } from 'async';
@@ -30,10 +29,9 @@ const query = {
   }
 };
 const chunkSize = 5;
-function useGetScorecardData() {
+function useGetScorecardData(dataEngine) {
   const [totalRequests, setTotalRequests] = useState(0);
   const [noOfCompleteRequests, setNoOfCompleteRequests] = useState(0);
-  const data = useRef(createScorecardDataEngine());
   const fetchData = async ({
     periods,
     dataItems,
@@ -47,7 +45,7 @@ function useGetScorecardData() {
     if (!rawAnalyticsData)
       return [];
     const tableData = getTableData(rawAnalyticsData);
-    data.current.updateData(tableData);
+    dataEngine.updateData(tableData);
     setNoOfCompleteRequests((prev) => prev + 1);
   };
   const dataFetchQueue = useRef(queue(asyncify(fetchData)));
@@ -79,17 +77,14 @@ function useGetScorecardData() {
     }).flat();
     return uniq([...periodsIds, ...pastPeriods]);
   }, [periodsIds]);
-  const { refetch, called } = useDataQuery(
-    query,
-    {
-      variables: {
-        periods: analyticsPeriod,
-        dataItems: dataItemsIds,
-        orgUnits: orgUnitsIds
-      },
-      lazy: true
-    }
-  );
+  const { refetch } = useDataQuery(query, {
+    variables: {
+      periods: analyticsPeriod,
+      dataItems: dataItemsIds,
+      orgUnits: orgUnitsIds
+    },
+    lazy: true
+  });
   const progress = useMemo(() => {
     return noOfCompleteRequests / totalRequests;
   }, [totalRequests, noOfCompleteRequests]);
@@ -120,7 +115,7 @@ function useGetScorecardData() {
           const dataItemChunks = chunk(dataItemsIds, chunkSize);
           setTotalRequests(dataItemChunks.length);
           for (const dataItemChunk of dataItemChunks) {
-            await dataFetchQueue.current.push({
+            dataFetchQueue.current.push({
               periods: analyticsPeriod,
               dataItems: dataItemChunk,
               orgUnits: orgUnitsIds
@@ -131,7 +126,7 @@ function useGetScorecardData() {
           const periodChunks = chunk(analyticsPeriod, chunkSize);
           setTotalRequests(periodChunks.length);
           for (const periodChunk of periodChunks) {
-            await dataFetchQueue.current.push({
+            dataFetchQueue.current.push({
               periods: periodChunk,
               dataItems: dataItemsIds,
               orgUnits: orgUnitsIds
@@ -142,7 +137,7 @@ function useGetScorecardData() {
           const orgUnitChunks = chunk(orgUnitsIds, chunkSize);
           setTotalRequests(orgUnitChunks.length);
           for (const orgUnitChunk of orgUnitChunks) {
-            await dataFetchQueue.current.push({
+            dataFetchQueue.current.push({
               periods: analyticsPeriod,
               dataItems: dataItemsIds,
               orgUnits: orgUnitChunk
@@ -154,7 +149,10 @@ function useGetScorecardData() {
     setTotalRequests(0);
     setNoOfCompleteRequests(0);
     dataFetchQueue.current.remove(() => true);
-    data.current.clear();
+    dataFetchQueue.current.drain(() => {
+      dataEngine.complete();
+    });
+    dataEngine.clear();
     if (analyticsPeriod.length <= 5 && dataItemsIds.length <= 5 && orgUnitsIds.length <= 5) {
       setTotalRequests(1);
       setNoOfCompleteRequests(0);
@@ -164,19 +162,17 @@ function useGetScorecardData() {
         orgUnits: orgUnitsIds
       });
       setNoOfCompleteRequests(1);
-      data.current.complete();
+      dataEngine.complete();
       return;
     }
     setNoOfCompleteRequests(0);
     const dimensionWithMaxItems = getTheLongestDimension();
     await getChunkedData(dimensionWithMaxItems);
-    data.current.complete();
   };
   useEffect(() => {
     initializeFetch();
   }, []);
   return {
-    data: data.current,
     rawData: [],
     progress
   };

package/dist/esm/components/Scorecard/hooks/data.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/Scorecard/hooks/data.ts"],"names":[],"mappings":"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","sourcesContent":["import { useScorecardConfig, useScorecardMeta } from \"../components\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { getDimensionsFromMeta } from \"../utils/analytics\";\nimport { useDataQuery } from \"@dhis2/app-runtime\";\nimport {\n\tcreateFixedPeriodFromPeriodId,\n\tgetAdjacentFixedPeriods,\n} from \"@dhis2/multi-calendar-dates\";\nimport { chunk, maxBy, uniq } from \"lodash\";\nimport { sanitizeAnalyticsData } from \"../utils/data\";\nimport { useCalendar } from \"./metadata\";\nimport {\n\tcreateScorecardDataEngine,\n\ttype ScorecardDataEngine,\n} from \"../utils/dataEngine\";\nimport { queue } from \"async-es\";\nimport { asyncify, type QueueObject } from \"async\";\n\nconst query: any = {\n\tdata: {\n\t\tresource: \"analytics\",\n\t\tparams: ({\n\t\t\tperiods,\n\t\t\torgUnits,\n\t\t\tdataItems,\n\t\t}: {\n\t\t\tperiods: string[];\n\t\t\torgUnits: string[];\n\t\t\tdataItems: string[];\n\t\t}) => {\n\t\t\treturn {\n\t\t\t\tskipMeta: true,\n\t\t\t\tdimension: [\n\t\t\t\t\t`pe:${periods.join(\";\")}`,\n\t\t\t\t\t`dx:${dataItems.join(\";\")}`,\n\t\t\t\t\t`ou:${orgUnits.join(\";\")}`,\n\t\t\t\t],\n\t\t\t};\n\t\t},\n\t},\n};\n\nexport interface ScorecardDataQueryResponse {\n\tdata: {\n\t\theaderWidth: number;\n\t\theaders: Array<{\n\t\t\tname: string;\n\t\t\thidden: boolean;\n\t\t\tmeta: boolean;\n\t\t\tcolumn: string;\n\t\t\tvalueType: string;\n\t\t}>;\n\t\trows: Array<Array<string>>;\n\t\theight: number;\n\t\twidth: number;\n\t};\n}\n\nconst chunkSize = 5;\n\nexport function useGetScorecardData() {\n\tconst [totalRequests, setTotalRequests] = useState<number>(0);\n\tconst [noOfCompleteRequests, setNoOfCompleteRequests] = useState<number>(0);\n\tconst data = useRef<ScorecardDataEngine>(createScorecardDataEngine());\n\tconst fetchData = async ({\n\t\tperiods,\n\t\tdataItems,\n\t\torgUnits,\n\t}: {\n\t\tperiods: string[];\n\t\torgUnits: string[];\n\t\tdataItems: string[];\n\t}) => {\n\t\tconst rawAnalyticsData = (await refetch({\n\t\t\tperiods,\n\t\t\tdataItems,\n\t\t\torgUnits,\n\t\t})) as unknown as ScorecardDataQueryResponse;\n\t\tif (!rawAnalyticsData) return [];\n\t\tconst tableData = getTableData(rawAnalyticsData);\n\t\tdata.current.updateData(tableData);\n\t\tsetNoOfCompleteRequests((prev) => prev + 1);\n\t};\n\tconst dataFetchQueue = useRef<QueueObject<any>>(queue(asyncify(fetchData)));\n\tconst config = useScorecardConfig();\n\tconst meta = useScorecardMeta();\n\tconst calendar = useCalendar();\n\tif (!config \|\| !meta) {\n\t\tthrow new Error(\n\t\t\t\"Invalid scorecard setup. Make sure the valid config and state props are passed.\",\n\t\t);\n\t}\n\tconst { dataItemsIds, orgUnitsIds, periodsIds } = useMemo(\n\t\t() =>\n\t\t\tgetDimensionsFromMeta({\n\t\t\t\tmeta,\n\t\t\t}),\n\t\t[meta],\n\t);\n\n\t//We need to make sure each period has a past period\n\tconst analyticsPeriod = useMemo(() => {\n\t\tconst pastPeriods = periodsIds\n\t\t\t.map((periodId) => {\n\t\t\t\tconst pe = getAdjacentFixedPeriods({\n\t\t\t\t\tcalendar,\n\t\t\t\t\tsteps: -1,\n\t\t\t\t\tperiod: createFixedPeriodFromPeriodId({\n\t\t\t\t\t\tcalendar,\n\t\t\t\t\t\tperiodId,\n\t\t\t\t\t}),\n\t\t\t\t});\n\t\t\t\treturn pe.map(({ id }) => id);\n\t\t\t})\n\t\t\t.flat();\n\n\t\treturn uniq([...periodsIds, ...pastPeriods]);\n\t}, [periodsIds]);\n\n\tconst { refetch, called } = useDataQuery<ScorecardDataQueryResponse>(\n\t\tquery,\n\t\t{\n\t\t\tvariables: {\n\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t},\n\t\t\tlazy: true,\n\t\t},\n\t);\n\n\tconst progress = useMemo(() => {\n\t\treturn noOfCompleteRequests / totalRequests;\n\t}, [totalRequests, noOfCompleteRequests]);\n\n\tconst getTableData = (rawAnalyticsData: ScorecardDataQueryResponse) => {\n\t\treturn sanitizeAnalyticsData(rawAnalyticsData);\n\t};\n\n\tconst initializeFetch = async () => {\n\t\tconst getTheLongestDimension = () => {\n\t\t\tconst dimensions = [\n\t\t\t\t{\n\t\t\t\t\tdimension: \"pe\",\n\t\t\t\t\tlength: analyticsPeriod.length,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tdimension: \"dx\",\n\t\t\t\t\tlength: dataItemsIds.length,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tdimension: \"ou\",\n\t\t\t\t\tlength: orgUnitsIds.length,\n\t\t\t\t},\n\t\t\t] as const;\n\n\t\t\treturn maxBy(dimensions, \"length\")!.dimension;\n\t\t};\n\n\t\tconst getChunkedData = async (maxItem: \"dx\" \| \"pe\" \| \"ou\") => {\n\t\t\tswitch (maxItem) {\n\t\t\t\tcase \"dx\":\n\t\t\t\t\tconst dataItemChunks = chunk(dataItemsIds, chunkSize);\n\t\t\t\t\tsetTotalRequests(dataItemChunks.length);\n\t\t\t\t\tfor (const dataItemChunk of dataItemChunks) {\n\t\t\t\t\t\tawait dataFetchQueue.current.push({\n\t\t\t\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\t\t\t\tdataItems: dataItemChunk,\n\t\t\t\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"pe\":\n\t\t\t\t\tconst periodChunks = chunk(analyticsPeriod, chunkSize);\n\t\t\t\t\tsetTotalRequests(periodChunks.length);\n\t\t\t\t\tfor (const periodChunk of periodChunks) {\n\t\t\t\t\t\tawait dataFetchQueue.current.push({\n\t\t\t\t\t\t\tperiods: periodChunk,\n\t\t\t\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"ou\":\n\t\t\t\t\tconst orgUnitChunks = chunk(orgUnitsIds, chunkSize);\n\t\t\t\t\tsetTotalRequests(orgUnitChunks.length);\n\t\t\t\t\tfor (const orgUnitChunk of orgUnitChunks) {\n\t\t\t\t\t\tawait dataFetchQueue.current.push({\n\t\t\t\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\t\t\t\torgUnits: orgUnitChunk,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t};\n\t\t//Here is where we need to paginate the requests.\n\t\t//First, Are there any dimensions greater than 5? if not then we can just call all the data\n\t\tsetTotalRequests(0);\n\t\tsetNoOfCompleteRequests(0);\n\t\tdataFetchQueue.current.remove(() => true);\n\t\tdata.current.clear();\n\t\tif (\n\t\t\tanalyticsPeriod.length <= 5 &&\n\t\t\tdataItemsIds.length <= 5 &&\n\t\t\torgUnitsIds.length <= 5\n\t\t) {\n\t\t\tsetTotalRequests(1);\n\t\t\tsetNoOfCompleteRequests(0);\n\t\t\tawait fetchData({\n\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t});\n\t\t\tsetNoOfCompleteRequests(1);\n\t\t\tdata.current.complete();\n\t\t\treturn;\n\t\t}\n\t\t//If not then let's figure out how to paginate one of the\n\t\tsetNoOfCompleteRequests(0);\n\t\tconst dimensionWithMaxItems = getTheLongestDimension();\n\t\tawait getChunkedData(dimensionWithMaxItems);\n\t\tdata.current.complete();\n\t};\n\n\tuseEffect(() => {\n\t\tinitializeFetch();\n\t}, []);\n\n\treturn {\n\t\tdata: data.current,\n\t\trawData: [],\n\t\tprogress,\n\t};\n}\n"]}
1	+ {"version":3,"sources":["../../../../../src/components/Scorecard/hooks/data.ts"],"names":[],"mappings":"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","sourcesContent":["import { useScorecardConfig, useScorecardMeta } from \"../components\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { getDimensionsFromMeta } from \"../utils/analytics\";\nimport { useDataQuery } from \"@dhis2/app-runtime\";\nimport {\n\tcreateFixedPeriodFromPeriodId,\n\tgetAdjacentFixedPeriods,\n} from \"@dhis2/multi-calendar-dates\";\nimport { chunk, maxBy, uniq } from \"lodash\";\nimport { sanitizeAnalyticsData } from \"../utils/data\";\nimport { useCalendar } from \"./metadata\";\nimport { queue } from \"async-es\";\nimport { asyncify, type QueueObject } from \"async\";\nimport type { ScorecardDataEngine } from \"../utils/dataEngine\";\n\nconst query: any = {\n\tdata: {\n\t\tresource: \"analytics\",\n\t\tparams: ({\n\t\t\tperiods,\n\t\t\torgUnits,\n\t\t\tdataItems,\n\t\t}: {\n\t\t\tperiods: string[];\n\t\t\torgUnits: string[];\n\t\t\tdataItems: string[];\n\t\t}) => {\n\t\t\treturn {\n\t\t\t\tskipMeta: true,\n\t\t\t\tdimension: [\n\t\t\t\t\t`pe:${periods.join(\";\")}`,\n\t\t\t\t\t`dx:${dataItems.join(\";\")}`,\n\t\t\t\t\t`ou:${orgUnits.join(\";\")}`,\n\t\t\t\t],\n\t\t\t};\n\t\t},\n\t},\n};\n\nexport interface ScorecardDataQueryResponse {\n\tdata: {\n\t\theaderWidth: number;\n\t\theaders: Array<{\n\t\t\tname: string;\n\t\t\thidden: boolean;\n\t\t\tmeta: boolean;\n\t\t\tcolumn: string;\n\t\t\tvalueType: string;\n\t\t}>;\n\t\trows: Array<Array<string>>;\n\t\theight: number;\n\t\twidth: number;\n\t};\n}\n\nconst chunkSize = 5;\n\nexport function useGetScorecardData(dataEngine: ScorecardDataEngine) {\n\tconst [totalRequests, setTotalRequests] = useState<number>(0);\n\tconst [noOfCompleteRequests, setNoOfCompleteRequests] = useState<number>(0);\n\tconst fetchData = async ({\n\t\tperiods,\n\t\tdataItems,\n\t\torgUnits,\n\t}: {\n\t\tperiods: string[];\n\t\torgUnits: string[];\n\t\tdataItems: string[];\n\t}) => {\n\t\tconst rawAnalyticsData = (await refetch({\n\t\t\tperiods,\n\t\t\tdataItems,\n\t\t\torgUnits,\n\t\t})) as unknown as ScorecardDataQueryResponse;\n\t\tif (!rawAnalyticsData) return [];\n\t\tconst tableData = getTableData(rawAnalyticsData);\n\t\tdataEngine.updateData(tableData);\n\t\tsetNoOfCompleteRequests((prev) => prev + 1);\n\t};\n\tconst dataFetchQueue = useRef<QueueObject<any>>(queue(asyncify(fetchData)));\n\tconst config = useScorecardConfig();\n\tconst meta = useScorecardMeta();\n\tconst calendar = useCalendar();\n\tif (!config \|\| !meta) {\n\t\tthrow new Error(\n\t\t\t\"Invalid scorecard setup. Make sure the valid config and state props are passed.\",\n\t\t);\n\t}\n\tconst { dataItemsIds, orgUnitsIds, periodsIds } = useMemo(\n\t\t() =>\n\t\t\tgetDimensionsFromMeta({\n\t\t\t\tmeta,\n\t\t\t}),\n\t\t[meta],\n\t);\n\n\t//We need to make sure each period has a past period\n\tconst analyticsPeriod = useMemo(() => {\n\t\tconst pastPeriods = periodsIds\n\t\t\t.map((periodId) => {\n\t\t\t\tconst pe = getAdjacentFixedPeriods({\n\t\t\t\t\tcalendar,\n\t\t\t\t\tsteps: -1,\n\t\t\t\t\tperiod: createFixedPeriodFromPeriodId({\n\t\t\t\t\t\tcalendar,\n\t\t\t\t\t\tperiodId,\n\t\t\t\t\t}),\n\t\t\t\t});\n\t\t\t\treturn pe.map(({ id }) => id);\n\t\t\t})\n\t\t\t.flat();\n\n\t\treturn uniq([...periodsIds, ...pastPeriods]);\n\t}, [periodsIds]);\n\n\tconst { refetch } = useDataQuery<ScorecardDataQueryResponse>(query, {\n\t\tvariables: {\n\t\t\tperiods: analyticsPeriod,\n\t\t\tdataItems: dataItemsIds,\n\t\t\torgUnits: orgUnitsIds,\n\t\t},\n\t\tlazy: true,\n\t});\n\n\tconst progress = useMemo(() => {\n\t\treturn noOfCompleteRequests / totalRequests;\n\t}, [totalRequests, noOfCompleteRequests]);\n\n\tconst getTableData = (rawAnalyticsData: ScorecardDataQueryResponse) => {\n\t\treturn sanitizeAnalyticsData(rawAnalyticsData);\n\t};\n\n\tconst initializeFetch = async () => {\n\t\tconst getTheLongestDimension = () => {\n\t\t\tconst dimensions = [\n\t\t\t\t{\n\t\t\t\t\tdimension: \"pe\",\n\t\t\t\t\tlength: analyticsPeriod.length,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tdimension: \"dx\",\n\t\t\t\t\tlength: dataItemsIds.length,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tdimension: \"ou\",\n\t\t\t\t\tlength: orgUnitsIds.length,\n\t\t\t\t},\n\t\t\t] as const;\n\n\t\t\treturn maxBy(dimensions, \"length\")!.dimension;\n\t\t};\n\n\t\tconst getChunkedData = async (maxItem: \"dx\" \| \"pe\" \| \"ou\") => {\n\t\t\tswitch (maxItem) {\n\t\t\t\tcase \"dx\":\n\t\t\t\t\tconst dataItemChunks = chunk(dataItemsIds, chunkSize);\n\t\t\t\t\tsetTotalRequests(dataItemChunks.length);\n\t\t\t\t\tfor (const dataItemChunk of dataItemChunks) {\n\t\t\t\t\t\tdataFetchQueue.current.push({\n\t\t\t\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\t\t\t\tdataItems: dataItemChunk,\n\t\t\t\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"pe\":\n\t\t\t\t\tconst periodChunks = chunk(analyticsPeriod, chunkSize);\n\t\t\t\t\tsetTotalRequests(periodChunks.length);\n\t\t\t\t\tfor (const periodChunk of periodChunks) {\n\t\t\t\t\t\tdataFetchQueue.current.push({\n\t\t\t\t\t\t\tperiods: periodChunk,\n\t\t\t\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"ou\":\n\t\t\t\t\tconst orgUnitChunks = chunk(orgUnitsIds, chunkSize);\n\t\t\t\t\tsetTotalRequests(orgUnitChunks.length);\n\t\t\t\t\tfor (const orgUnitChunk of orgUnitChunks) {\n\t\t\t\t\t\tdataFetchQueue.current.push({\n\t\t\t\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\t\t\t\torgUnits: orgUnitChunk,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t};\n\t\t//Here is where we need to paginate the requests.\n\t\t//First, Are there any dimensions greater than 5? if not then we can just call all the data\n\t\tsetTotalRequests(0);\n\t\tsetNoOfCompleteRequests(0);\n\t\tdataFetchQueue.current.remove(() => true);\n\t\tdataFetchQueue.current.drain(() => {\n\t\t\tdataEngine.complete();\n\t\t});\n\n\t\tdataEngine.clear();\n\t\tif (\n\t\t\tanalyticsPeriod.length <= 5 &&\n\t\t\tdataItemsIds.length <= 5 &&\n\t\t\torgUnitsIds.length <= 5\n\t\t) {\n\t\t\tsetTotalRequests(1);\n\t\t\tsetNoOfCompleteRequests(0);\n\t\t\tawait fetchData({\n\t\t\t\tperiods: analyticsPeriod,\n\t\t\t\tdataItems: dataItemsIds,\n\t\t\t\torgUnits: orgUnitsIds,\n\t\t\t});\n\t\t\tsetNoOfCompleteRequests(1);\n\t\t\tdataEngine.complete();\n\t\t\treturn;\n\t\t}\n\t\t//If not then let's figure out how to paginate one of the\n\t\tsetNoOfCompleteRequests(0);\n\t\tconst dimensionWithMaxItems = getTheLongestDimension();\n\t\tawait getChunkedData(dimensionWithMaxItems);\n\t};\n\n\tuseEffect(() => {\n\t\tinitializeFetch();\n\t}, []);\n\n\treturn {\n\t\trawData: [],\n\t\tprogress,\n\t};\n}\n"]}

package/dist/esm/components/Scorecard/hooks/dataEngine.js ADDED Viewed

@@ -0,0 +1,6 @@
+function useScorecardDataEngine() {
+}
+export { useScorecardDataEngine };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=dataEngine.js.map

package/dist/esm/components/Scorecard/hooks/dataEngine.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["../../../../../src/components/Scorecard/hooks/dataEngine.ts"],"names":[],"mappings":"AAAO,SAAS,yBAAyB;AAAC","sourcesContent":["export function useScorecardDataEngine() {}\n"]}