@natoora-libs/core 0.1.8-dev-doug-2 → 0.1.9-dev-doug-1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/index.cjs +978 -692
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.d.cts +1097 -0
- package/dist/components/index.d.ts +1097 -0
- package/dist/components/index.js +994 -711
- package/dist/components/index.js.map +1 -1
- package/dist/hooks/index.d.cts +7 -0
- package/dist/hooks/index.d.ts +7 -0
- package/dist/index.d.cts +3 -0
- package/dist/index.d.ts +3 -0
- package/dist/providers/index.d.cts +37 -0
- package/dist/providers/index.d.ts +37 -0
- package/package.json +1 -1
|
@@ -371,6 +371,7 @@ __export(components_exports, {
|
|
|
371
371
|
ScrollableDialog: () => ScrollableDialog_default,
|
|
372
372
|
SearchAndFilterHeader: () => SearchAndFilterHeader_default,
|
|
373
373
|
SearchAndFilterHeaderForTable: () => SearchAndFilterHeaderForTable_default,
|
|
374
|
+
SearchFieldDebounced: () => SearchFieldDebounced,
|
|
374
375
|
SearchWithFilters: () => SearchWithFilters_default,
|
|
375
376
|
SearchWithFiltersForTable: () => SearchWithFiltersForTable_default,
|
|
376
377
|
SectionName: () => SectionName_default,
|
|
@@ -382,6 +383,9 @@ __export(components_exports, {
|
|
|
382
383
|
Switch: () => Switch_default,
|
|
383
384
|
Table: () => Table_default,
|
|
384
385
|
TableDesktop: () => TableDesktop_default,
|
|
386
|
+
TableDesktopRowActions: () => TableDesktopRowActions,
|
|
387
|
+
TableDesktopRowCell: () => TableDesktopRowCell,
|
|
388
|
+
TableDesktopSmartSelect: () => TableDesktopSmartSelect,
|
|
385
389
|
TableEmptyResult: () => TableEmptyResult_default,
|
|
386
390
|
TableHeader: () => TableHeader_default,
|
|
387
391
|
TableLoading: () => TableLoading_default,
|
|
@@ -6496,11 +6500,60 @@ var SearchAndFilterHeaderForTable = (props) => {
|
|
|
6496
6500
|
};
|
|
6497
6501
|
var SearchAndFilterHeaderForTable_default = React4.memo(SearchAndFilterHeaderForTable);
|
|
6498
6502
|
|
|
6503
|
+
// src/components/SearchFieldDebounced/SearchFieldDebounced.tsx
|
|
6504
|
+
var import_react28 = require("react");
|
|
6505
|
+
var import_material53 = require("@mui/material");
|
|
6506
|
+
var import_Search = __toESM(require("@mui/icons-material/Search"), 1);
|
|
6507
|
+
var import_jsx_runtime104 = require("react/jsx-runtime");
|
|
6508
|
+
var SearchFieldDebounced = ({
|
|
6509
|
+
onSearch,
|
|
6510
|
+
initialValue = "",
|
|
6511
|
+
debounceMs = 500
|
|
6512
|
+
}) => {
|
|
6513
|
+
const [value, setValue] = (0, import_react28.useState)(initialValue);
|
|
6514
|
+
const debounceRef = (0, import_react28.useRef)(null);
|
|
6515
|
+
const handleChange = (e) => {
|
|
6516
|
+
setValue(e.target.value);
|
|
6517
|
+
if (debounceRef.current) {
|
|
6518
|
+
clearTimeout(debounceRef.current);
|
|
6519
|
+
}
|
|
6520
|
+
;
|
|
6521
|
+
debounceRef.current = window.setTimeout(() => {
|
|
6522
|
+
onSearch(e.target.value);
|
|
6523
|
+
}, debounceMs);
|
|
6524
|
+
};
|
|
6525
|
+
(0, import_react28.useEffect)(() => {
|
|
6526
|
+
return () => {
|
|
6527
|
+
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
6528
|
+
};
|
|
6529
|
+
}, []);
|
|
6530
|
+
return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.Box, { width: 285, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
6531
|
+
import_material53.TextField,
|
|
6532
|
+
{
|
|
6533
|
+
fullWidth: true,
|
|
6534
|
+
variant: "outlined",
|
|
6535
|
+
placeholder: "Search",
|
|
6536
|
+
value,
|
|
6537
|
+
onChange: handleChange,
|
|
6538
|
+
slotProps: {
|
|
6539
|
+
input: {
|
|
6540
|
+
sx: {
|
|
6541
|
+
maxHeight: 5,
|
|
6542
|
+
px: 2,
|
|
6543
|
+
py: 2.5
|
|
6544
|
+
},
|
|
6545
|
+
startAdornment: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.InputAdornment, { position: "start", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_Search.default, { fontSize: "small" }) })
|
|
6546
|
+
}
|
|
6547
|
+
}
|
|
6548
|
+
}
|
|
6549
|
+
) });
|
|
6550
|
+
};
|
|
6551
|
+
|
|
6499
6552
|
// src/components/SectionName/SectionName.tsx
|
|
6500
6553
|
var import_icons_material11 = require("@mui/icons-material");
|
|
6501
|
-
var
|
|
6554
|
+
var import_material54 = require("@mui/material");
|
|
6502
6555
|
var import_mui48 = require("tss-react/mui");
|
|
6503
|
-
var
|
|
6556
|
+
var import_jsx_runtime105 = require("react/jsx-runtime");
|
|
6504
6557
|
var useStyles43 = (0, import_mui48.makeStyles)()((theme) => ({
|
|
6505
6558
|
container: {
|
|
6506
6559
|
display: "flex",
|
|
@@ -6543,10 +6596,10 @@ var SectionName = ({
|
|
|
6543
6596
|
openHistoryLog
|
|
6544
6597
|
}) => {
|
|
6545
6598
|
const { classes } = useStyles43();
|
|
6546
|
-
return /* @__PURE__ */ (0,
|
|
6547
|
-
/* @__PURE__ */ (0,
|
|
6548
|
-
/* @__PURE__ */ (0,
|
|
6549
|
-
|
|
6599
|
+
return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_material54.Box, { className: classes.container, children: [
|
|
6600
|
+
/* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_material54.Box, { className: classes.titleContainer, children: [
|
|
6601
|
+
/* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
6602
|
+
import_material54.Typography,
|
|
6550
6603
|
{
|
|
6551
6604
|
variant: "h5",
|
|
6552
6605
|
component: "a",
|
|
@@ -6555,7 +6608,7 @@ var SectionName = ({
|
|
|
6555
6608
|
children: name
|
|
6556
6609
|
}
|
|
6557
6610
|
),
|
|
6558
|
-
tooltipDescription ? /* @__PURE__ */ (0,
|
|
6611
|
+
tooltipDescription ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.Tooltip, { title: tooltipDescription, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
6559
6612
|
import_icons_material11.Info,
|
|
6560
6613
|
{
|
|
6561
6614
|
fontSize: "small",
|
|
@@ -6564,8 +6617,8 @@ var SectionName = ({
|
|
|
6564
6617
|
}
|
|
6565
6618
|
) }) : null
|
|
6566
6619
|
] }),
|
|
6567
|
-
/* @__PURE__ */ (0,
|
|
6568
|
-
buttonText ? /* @__PURE__ */ (0,
|
|
6620
|
+
/* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_material54.Box, { className: classes.actionButtons, children: [
|
|
6621
|
+
buttonText ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
6569
6622
|
ExtendedButton_default,
|
|
6570
6623
|
{
|
|
6571
6624
|
type: buttonType,
|
|
@@ -6578,25 +6631,25 @@ var SectionName = ({
|
|
|
6578
6631
|
variant: "text"
|
|
6579
6632
|
}
|
|
6580
6633
|
) : null,
|
|
6581
|
-
openHistoryLog && buttonText && /* @__PURE__ */ (0,
|
|
6582
|
-
openHistoryLog && /* @__PURE__ */ (0,
|
|
6634
|
+
openHistoryLog && buttonText && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.Divider, { orientation: "vertical", sx: { height: "24px" } }),
|
|
6635
|
+
openHistoryLog && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.IconButton, { size: "small", onClick: () => openHistoryLog(), children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_icons_material11.History, {}) })
|
|
6583
6636
|
] })
|
|
6584
6637
|
] });
|
|
6585
6638
|
};
|
|
6586
6639
|
var SectionName_default = SectionName;
|
|
6587
6640
|
|
|
6588
6641
|
// src/components/SmartSelect/SmartSelect.tsx
|
|
6589
|
-
var
|
|
6590
|
-
var
|
|
6642
|
+
var import_react29 = require("react");
|
|
6643
|
+
var import_material55 = require("@mui/material");
|
|
6591
6644
|
var import_mui49 = require("tss-react/mui");
|
|
6592
|
-
var
|
|
6645
|
+
var import_jsx_runtime106 = require("react/jsx-runtime");
|
|
6593
6646
|
var useStyles44 = (0, import_mui49.makeStyles)()(() => ({
|
|
6594
6647
|
container: {
|
|
6595
6648
|
display: "flex",
|
|
6596
6649
|
flexDirection: "column"
|
|
6597
6650
|
}
|
|
6598
6651
|
}));
|
|
6599
|
-
var SmartSelect = (0,
|
|
6652
|
+
var SmartSelect = (0, import_react29.forwardRef)(
|
|
6600
6653
|
({
|
|
6601
6654
|
value,
|
|
6602
6655
|
defaultOption,
|
|
@@ -6615,9 +6668,9 @@ var SmartSelect = (0, import_react28.forwardRef)(
|
|
|
6615
6668
|
menuProps
|
|
6616
6669
|
}, ref) => {
|
|
6617
6670
|
const { classes } = useStyles44();
|
|
6618
|
-
const [open, setOpen] = (0,
|
|
6619
|
-
const [localOptions, setLocalOptions] = (0,
|
|
6620
|
-
(0,
|
|
6671
|
+
const [open, setOpen] = (0, import_react29.useState)(false);
|
|
6672
|
+
const [localOptions, setLocalOptions] = (0, import_react29.useState)(options || []);
|
|
6673
|
+
(0, import_react29.useEffect)(() => {
|
|
6621
6674
|
if (options) {
|
|
6622
6675
|
setLocalOptions(options);
|
|
6623
6676
|
}
|
|
@@ -6656,8 +6709,8 @@ var SmartSelect = (0, import_react28.forwardRef)(
|
|
|
6656
6709
|
onChange(selectedOption);
|
|
6657
6710
|
}
|
|
6658
6711
|
};
|
|
6659
|
-
return /* @__PURE__ */ (0,
|
|
6660
|
-
|
|
6712
|
+
return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
|
|
6713
|
+
import_material55.FormControl,
|
|
6661
6714
|
{
|
|
6662
6715
|
fullWidth: true,
|
|
6663
6716
|
className: classes.container,
|
|
@@ -6666,21 +6719,21 @@ var SmartSelect = (0, import_react28.forwardRef)(
|
|
|
6666
6719
|
"data-testid": dataTestId,
|
|
6667
6720
|
disabled,
|
|
6668
6721
|
children: [
|
|
6669
|
-
inputLabel && /* @__PURE__ */ (0,
|
|
6670
|
-
|
|
6722
|
+
inputLabel && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
|
|
6723
|
+
import_material55.InputLabel,
|
|
6671
6724
|
{
|
|
6672
6725
|
id: "smart-select-label",
|
|
6673
6726
|
"data-testid": `${dataTestId}-label`,
|
|
6674
6727
|
children: inputLabel
|
|
6675
6728
|
}
|
|
6676
6729
|
),
|
|
6677
|
-
/* @__PURE__ */ (0,
|
|
6678
|
-
|
|
6730
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
|
|
6731
|
+
import_material55.Select,
|
|
6679
6732
|
{
|
|
6680
6733
|
ref,
|
|
6681
6734
|
disabled,
|
|
6682
6735
|
labelId: "smart-select-label",
|
|
6683
|
-
value,
|
|
6736
|
+
value: value ?? "",
|
|
6684
6737
|
onChange: handleChange,
|
|
6685
6738
|
onOpen: handleOpen,
|
|
6686
6739
|
error,
|
|
@@ -6691,26 +6744,26 @@ var SmartSelect = (0, import_react28.forwardRef)(
|
|
|
6691
6744
|
MenuProps: menuProps,
|
|
6692
6745
|
label: inputLabel,
|
|
6693
6746
|
children: [
|
|
6694
|
-
isFetching && /* @__PURE__ */ (0,
|
|
6695
|
-
|
|
6747
|
+
isFetching && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
|
|
6748
|
+
import_material55.MenuItem,
|
|
6696
6749
|
{
|
|
6697
6750
|
disabled: true,
|
|
6698
6751
|
"data-testid": `${dataTestId}-loading`,
|
|
6699
6752
|
id: `${dataTestId}-loading`,
|
|
6700
|
-
children: /* @__PURE__ */ (0,
|
|
6753
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.CircularProgress, { size: 24 })
|
|
6701
6754
|
}
|
|
6702
6755
|
),
|
|
6703
|
-
(defaultOption === null || !defaultOptionLabelIsValid || !defaultOptionValueIsValid) && !isFetching && options?.length === 0 && /* @__PURE__ */ (0,
|
|
6704
|
-
localOptions.length === 0 && !isFetching && options?.length !== 0 && defaultOptionLabelIsValid && defaultOptionValueIsValid && /* @__PURE__ */ (0,
|
|
6705
|
-
|
|
6756
|
+
(defaultOption === null || !defaultOptionLabelIsValid || !defaultOptionValueIsValid) && !isFetching && options?.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.MenuItem, { disabled: true, "data-testid": `${dataTestId}-empty-message`, children: emptyMessage }),
|
|
6757
|
+
localOptions.length === 0 && !isFetching && options?.length !== 0 && defaultOptionLabelIsValid && defaultOptionValueIsValid && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
|
|
6758
|
+
import_material55.MenuItem,
|
|
6706
6759
|
{
|
|
6707
6760
|
value: defaultOption?.value,
|
|
6708
6761
|
"data-testid": `${dataTestId}-default-option`,
|
|
6709
6762
|
children: defaultOption?.label
|
|
6710
6763
|
}
|
|
6711
6764
|
),
|
|
6712
|
-
!isFetching && combinedOptions.length > 0 && combinedOptions.map((option) => /* @__PURE__ */ (0,
|
|
6713
|
-
|
|
6765
|
+
!isFetching && combinedOptions.length > 0 && combinedOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
|
|
6766
|
+
import_material55.MenuItem,
|
|
6714
6767
|
{
|
|
6715
6768
|
value: option?.value,
|
|
6716
6769
|
"data-testid": `${dataTestId}-option-${option?.value}`,
|
|
@@ -6722,7 +6775,7 @@ var SmartSelect = (0, import_react28.forwardRef)(
|
|
|
6722
6775
|
]
|
|
6723
6776
|
}
|
|
6724
6777
|
),
|
|
6725
|
-
helperText && /* @__PURE__ */ (0,
|
|
6778
|
+
helperText && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.FormHelperText, { "data-testid": `${dataTestId}-helper-text`, children: helperText })
|
|
6726
6779
|
]
|
|
6727
6780
|
}
|
|
6728
6781
|
);
|
|
@@ -6731,11 +6784,11 @@ var SmartSelect = (0, import_react28.forwardRef)(
|
|
|
6731
6784
|
var SmartSelect_default = SmartSelect;
|
|
6732
6785
|
|
|
6733
6786
|
// src/components/SquareLabel/SquareLabel.tsx
|
|
6734
|
-
var
|
|
6735
|
-
var
|
|
6787
|
+
var import_react30 = require("react");
|
|
6788
|
+
var import_material56 = require("@mui/material");
|
|
6736
6789
|
var import_red2 = __toESM(require("@mui/material/colors/red"), 1);
|
|
6737
6790
|
var import_mui50 = require("tss-react/mui");
|
|
6738
|
-
var
|
|
6791
|
+
var import_jsx_runtime107 = require("react/jsx-runtime");
|
|
6739
6792
|
var useStyles45 = (0, import_mui50.makeStyles)()((theme) => ({
|
|
6740
6793
|
red: {
|
|
6741
6794
|
backgroundColor: import_red2.default["50"],
|
|
@@ -6750,15 +6803,15 @@ var useStyles45 = (0, import_mui50.makeStyles)()((theme) => ({
|
|
|
6750
6803
|
}));
|
|
6751
6804
|
var SquareLabel = ({ color, copy }) => {
|
|
6752
6805
|
const { classes } = useStyles45();
|
|
6753
|
-
return /* @__PURE__ */ (0,
|
|
6806
|
+
return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_material56.Typography, { className: classes[color], children: copy });
|
|
6754
6807
|
};
|
|
6755
|
-
var SquareLabel_default = (0,
|
|
6808
|
+
var SquareLabel_default = (0, import_react30.memo)(SquareLabel);
|
|
6756
6809
|
|
|
6757
6810
|
// src/components/Switch/Switch.tsx
|
|
6758
|
-
var
|
|
6759
|
-
var
|
|
6811
|
+
var import_react31 = require("react");
|
|
6812
|
+
var import_material57 = require("@mui/material");
|
|
6760
6813
|
var import_mui51 = require("tss-react/mui");
|
|
6761
|
-
var
|
|
6814
|
+
var import_jsx_runtime108 = require("react/jsx-runtime");
|
|
6762
6815
|
var LSwitch = ({
|
|
6763
6816
|
checked,
|
|
6764
6817
|
labelOn,
|
|
@@ -6766,8 +6819,8 @@ var LSwitch = ({
|
|
|
6766
6819
|
handleChange,
|
|
6767
6820
|
classes,
|
|
6768
6821
|
disabled
|
|
6769
|
-
}) => /* @__PURE__ */ (0,
|
|
6770
|
-
|
|
6822
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: classes.c_switch, children: /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
|
|
6823
|
+
import_material57.Grid2,
|
|
6771
6824
|
{
|
|
6772
6825
|
component: "label",
|
|
6773
6826
|
container: true,
|
|
@@ -6776,9 +6829,9 @@ var LSwitch = ({
|
|
|
6776
6829
|
alignItems: "center"
|
|
6777
6830
|
},
|
|
6778
6831
|
children: [
|
|
6779
|
-
labelOff && /* @__PURE__ */ (0,
|
|
6780
|
-
/* @__PURE__ */ (0,
|
|
6781
|
-
|
|
6832
|
+
labelOff && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Grid2, { children: labelOff }),
|
|
6833
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Grid2, { children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6834
|
+
import_material57.Switch,
|
|
6782
6835
|
{
|
|
6783
6836
|
checked,
|
|
6784
6837
|
color: "primary",
|
|
@@ -6786,7 +6839,7 @@ var LSwitch = ({
|
|
|
6786
6839
|
disabled
|
|
6787
6840
|
}
|
|
6788
6841
|
) }),
|
|
6789
|
-
labelOn && /* @__PURE__ */ (0,
|
|
6842
|
+
labelOn && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Grid2, { children: labelOn })
|
|
6790
6843
|
]
|
|
6791
6844
|
}
|
|
6792
6845
|
) });
|
|
@@ -6808,245 +6861,26 @@ var LabelledSwitch = (0, import_mui51.withStyles)(LSwitch, (theme) => ({
|
|
|
6808
6861
|
fontSize: "1rem"
|
|
6809
6862
|
}
|
|
6810
6863
|
}));
|
|
6811
|
-
var Switch_default = (0,
|
|
6864
|
+
var Switch_default = (0, import_react31.memo)(LabelledSwitch);
|
|
6812
6865
|
|
|
6813
6866
|
// src/components/SmartTableHeaderFilterMenu/SmartTableHeaderFilterMenu.tsx
|
|
6814
|
-
var
|
|
6867
|
+
var import_react34 = require("react");
|
|
6815
6868
|
var import_Check = __toESM(require("@mui/icons-material/Check"), 1);
|
|
6816
|
-
var
|
|
6869
|
+
var import_material61 = require("@mui/material");
|
|
6817
6870
|
var import_classnames3 = __toESM(require("classnames"), 1);
|
|
6818
|
-
var
|
|
6819
|
-
|
|
6820
|
-
|
|
6821
|
-
|
|
6822
|
-
|
|
6823
|
-
|
|
6824
|
-
},
|
|
6825
|
-
filterOptions: {
|
|
6826
|
-
maxHeight: theme.spacing(62),
|
|
6827
|
-
overflowY: "auto",
|
|
6828
|
-
"&::-webkit-scrollbar": {
|
|
6829
|
-
width: "8px",
|
|
6830
|
-
height: "8px"
|
|
6831
|
-
},
|
|
6832
|
-
"&::-webkit-scrollbar-track": {
|
|
6833
|
-
backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[800] : theme.palette.grey[100]
|
|
6834
|
-
},
|
|
6835
|
-
"&::-webkit-scrollbar-thumb": {
|
|
6836
|
-
backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[900] : theme.palette.grey[400],
|
|
6837
|
-
borderRadius: "10px"
|
|
6838
|
-
},
|
|
6839
|
-
"&::-webkit-scrollbar-thumb:hover": {
|
|
6840
|
-
backgroundColor: theme.palette.mode === "dark" ? theme.palette.common.black : theme.palette.grey[500]
|
|
6841
|
-
}
|
|
6842
|
-
},
|
|
6843
|
-
filter: {
|
|
6844
|
-
display: "flex",
|
|
6845
|
-
alignItems: "center",
|
|
6846
|
-
justifyContent: "space-between",
|
|
6847
|
-
padding: theme.spacing(0, 3)
|
|
6848
|
-
},
|
|
6849
|
-
applyFilterButtonsContainer: {
|
|
6850
|
-
display: "flex",
|
|
6851
|
-
padding: theme.spacing(0, 1)
|
|
6852
|
-
},
|
|
6853
|
-
saveAsDefaultButton: {
|
|
6854
|
-
color: theme.palette.primary.main
|
|
6855
|
-
},
|
|
6856
|
-
skeleton: {
|
|
6857
|
-
height: theme.spacing(3),
|
|
6858
|
-
margin: theme.spacing(1)
|
|
6859
|
-
}
|
|
6860
|
-
}));
|
|
6861
|
-
var resolveFilterOption = (filterOption) => {
|
|
6862
|
-
if (typeof filterOption === "object") {
|
|
6863
|
-
return filterOption?.label || filterOption?.name || "";
|
|
6864
|
-
}
|
|
6865
|
-
return filterOption;
|
|
6866
|
-
};
|
|
6867
|
-
var findFilterIndex = (filters, filterOption) => filters.findIndex((item) => {
|
|
6868
|
-
if (typeof item === "string" && typeof filterOption === "string") {
|
|
6869
|
-
return item === filterOption;
|
|
6870
|
-
}
|
|
6871
|
-
if (typeof item === "object" && typeof filterOption === "object") {
|
|
6872
|
-
return item.id === filterOption.id;
|
|
6873
|
-
}
|
|
6874
|
-
return false;
|
|
6875
|
-
});
|
|
6876
|
-
var SmartTableHeaderFilterMenu = ({
|
|
6877
|
-
headCell,
|
|
6878
|
-
numActiveFilters,
|
|
6879
|
-
headerFilters,
|
|
6880
|
-
shouldShowCheckOnFilter,
|
|
6881
|
-
onApplyFilters
|
|
6882
|
-
}) => {
|
|
6883
|
-
const { classes } = useStyles46();
|
|
6884
|
-
const [anchorEl, setAnchorEl] = (0, import_react31.useState)(null);
|
|
6885
|
-
const [selectedFilters, setSelectedFilters] = (0, import_react31.useState)(
|
|
6886
|
-
headerFilters[headCell.id] ?? []
|
|
6887
|
-
);
|
|
6888
|
-
const filterOptions = headCell.filterOptionsQuery?.data ?? [];
|
|
6889
|
-
const numFilterOptions = filterOptions.length ?? 0;
|
|
6890
|
-
const numCurrentSelectedFilters = selectedFilters.length;
|
|
6891
|
-
const handleFilterMenuOpen = (event) => {
|
|
6892
|
-
if (!numFilterOptions) {
|
|
6893
|
-
headCell.filterOptionsQuery?.refetch();
|
|
6894
|
-
}
|
|
6895
|
-
setAnchorEl(event.currentTarget);
|
|
6896
|
-
};
|
|
6897
|
-
const handleFilterMenuClose = () => {
|
|
6898
|
-
setSelectedFilters(headerFilters[headCell.id]);
|
|
6899
|
-
setAnchorEl(null);
|
|
6900
|
-
};
|
|
6901
|
-
const handleFilterOptionClick = (option) => {
|
|
6902
|
-
const selectedIndex = findFilterIndex(selectedFilters, option);
|
|
6903
|
-
let newSelected;
|
|
6904
|
-
if (selectedIndex === -1) {
|
|
6905
|
-
if (typeof option === "string") {
|
|
6906
|
-
newSelected = [...selectedFilters, option];
|
|
6907
|
-
} else {
|
|
6908
|
-
newSelected = [...selectedFilters, option];
|
|
6909
|
-
}
|
|
6910
|
-
} else {
|
|
6911
|
-
newSelected = selectedFilters.filter(
|
|
6912
|
-
(_, index) => index !== selectedIndex
|
|
6913
|
-
);
|
|
6914
|
-
}
|
|
6915
|
-
setSelectedFilters(newSelected);
|
|
6916
|
-
};
|
|
6917
|
-
const handleApplyFilters = (shouldSave) => {
|
|
6918
|
-
const updatedFilters = {
|
|
6919
|
-
...headerFilters,
|
|
6920
|
-
[headCell.id]: [...selectedFilters]
|
|
6921
|
-
};
|
|
6922
|
-
onApplyFilters?.(updatedFilters, shouldSave);
|
|
6923
|
-
setAnchorEl(null);
|
|
6924
|
-
};
|
|
6925
|
-
(0, import_react31.useEffect)(() => {
|
|
6926
|
-
setSelectedFilters(headerFilters[headCell.id] ?? []);
|
|
6927
|
-
}, [headerFilters, headCell.id]);
|
|
6928
|
-
const isOptionChecked = (0, import_react31.useMemo)(() => (resolvedOption) => !!selectedFilters?.some(
|
|
6929
|
-
(value) => resolveFilterOption(value) === resolvedOption
|
|
6930
|
-
), [selectedFilters]);
|
|
6931
|
-
const loadingSkeletons = /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_material57.Box, { "data-testid": "loading-skeletons", width: 272, children: [
|
|
6932
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
6933
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, {}),
|
|
6934
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
6935
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
6936
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
6937
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
6938
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, {}),
|
|
6939
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton })
|
|
6940
|
-
] });
|
|
6941
|
-
return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_jsx_runtime108.Fragment, { children: [
|
|
6942
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6943
|
-
ActiveFiltersIconButton_default,
|
|
6944
|
-
{
|
|
6945
|
-
numActiveFilters,
|
|
6946
|
-
handleClick: handleFilterMenuOpen,
|
|
6947
|
-
className: (0, import_classnames3.default)("filter-menu-trigger", {
|
|
6948
|
-
"has-active-filters": !!numActiveFilters || !!anchorEl
|
|
6949
|
-
})
|
|
6950
|
-
}
|
|
6951
|
-
),
|
|
6952
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6953
|
-
import_material57.Menu,
|
|
6954
|
-
{
|
|
6955
|
-
open: !!anchorEl,
|
|
6956
|
-
onClose: handleFilterMenuClose,
|
|
6957
|
-
anchorEl,
|
|
6958
|
-
"data-testid": "filter-menu",
|
|
6959
|
-
anchorOrigin: { vertical: "bottom", horizontal: "right" },
|
|
6960
|
-
transformOrigin: { vertical: "top", horizontal: "right" },
|
|
6961
|
-
children: headCell.filterOptionsQuery?.isFetching ? loadingSkeletons : /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_material57.Box, { className: classes.filterMenu, children: [
|
|
6962
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Box, { px: 3, mb: 0.5, children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6963
|
-
import_material57.FormControlLabel,
|
|
6964
|
-
{
|
|
6965
|
-
label: "Select All",
|
|
6966
|
-
control: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6967
|
-
import_material57.Checkbox,
|
|
6968
|
-
{
|
|
6969
|
-
disableRipple: true,
|
|
6970
|
-
checked: numCurrentSelectedFilters === numFilterOptions,
|
|
6971
|
-
indeterminate: numCurrentSelectedFilters > 0 && numCurrentSelectedFilters < numFilterOptions,
|
|
6972
|
-
onChange: ({ target: { checked } }) => {
|
|
6973
|
-
if (checked) {
|
|
6974
|
-
setSelectedFilters([...filterOptions]);
|
|
6975
|
-
} else {
|
|
6976
|
-
setSelectedFilters([]);
|
|
6977
|
-
}
|
|
6978
|
-
}
|
|
6979
|
-
}
|
|
6980
|
-
)
|
|
6981
|
-
}
|
|
6982
|
-
) }),
|
|
6983
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, { sx: { mb: 0.5 } }),
|
|
6984
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Box, { className: classes.filterOptions, children: filterOptions.map(
|
|
6985
|
-
(option) => {
|
|
6986
|
-
const resolvedOption = resolveFilterOption(option);
|
|
6987
|
-
return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
|
|
6988
|
-
import_material57.Box,
|
|
6989
|
-
{
|
|
6990
|
-
className: classes.filter,
|
|
6991
|
-
children: [
|
|
6992
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6993
|
-
import_material57.FormControlLabel,
|
|
6994
|
-
{
|
|
6995
|
-
label: resolvedOption,
|
|
6996
|
-
control: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
6997
|
-
import_material57.Checkbox,
|
|
6998
|
-
{
|
|
6999
|
-
disableRipple: true,
|
|
7000
|
-
onChange: () => handleFilterOptionClick(option),
|
|
7001
|
-
checked: isOptionChecked(resolvedOption)
|
|
7002
|
-
}
|
|
7003
|
-
)
|
|
7004
|
-
},
|
|
7005
|
-
resolvedOption
|
|
7006
|
-
),
|
|
7007
|
-
shouldShowCheckOnFilter?.(headCell.id, option) ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Tooltip, { title: "This filter is saved as default", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_Check.default, { fontSize: "small", color: "action" }) }) : null
|
|
7008
|
-
]
|
|
7009
|
-
},
|
|
7010
|
-
resolvedOption
|
|
7011
|
-
);
|
|
7012
|
-
}
|
|
7013
|
-
) }),
|
|
7014
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, { sx: { mb: 0.5 } }),
|
|
7015
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_material57.Box, { className: classes.applyFilterButtonsContainer, children: [
|
|
7016
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
7017
|
-
ExtendedButton_default,
|
|
7018
|
-
{
|
|
7019
|
-
copy: "Save as Default",
|
|
7020
|
-
buttonType: "button",
|
|
7021
|
-
variant: "text",
|
|
7022
|
-
tooltip: "Persists those filters for future visits",
|
|
7023
|
-
className: classes.saveAsDefaultButton,
|
|
7024
|
-
onClick: () => handleApplyFilters(true)
|
|
7025
|
-
}
|
|
7026
|
-
),
|
|
7027
|
-
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
|
|
7028
|
-
ExtendedButton_default,
|
|
7029
|
-
{
|
|
7030
|
-
copy: "Apply",
|
|
7031
|
-
color: "primary",
|
|
7032
|
-
buttonType: "submit",
|
|
7033
|
-
onClick: () => handleApplyFilters(false)
|
|
7034
|
-
}
|
|
7035
|
-
)
|
|
7036
|
-
] })
|
|
7037
|
-
] })
|
|
7038
|
-
}
|
|
7039
|
-
)
|
|
7040
|
-
] });
|
|
7041
|
-
};
|
|
7042
|
-
var SmartTableHeaderFilterMenu_default = (0, import_react31.memo)(SmartTableHeaderFilterMenu);
|
|
6871
|
+
var import_mui55 = require("tss-react/mui");
|
|
6872
|
+
|
|
6873
|
+
// src/components/TableDesktop/TableDesktop.tsx
|
|
6874
|
+
var import_react33 = require("react");
|
|
6875
|
+
var import_material60 = require("@mui/material");
|
|
6876
|
+
var import_mui54 = require("tss-react/mui");
|
|
7043
6877
|
|
|
7044
6878
|
// src/components/SmartTableHeader/SmartTableHeader.tsx
|
|
7045
6879
|
var import_react32 = require("react");
|
|
7046
6880
|
var import_material58 = require("@mui/material");
|
|
7047
|
-
var
|
|
6881
|
+
var import_mui52 = require("tss-react/mui");
|
|
7048
6882
|
var import_jsx_runtime109 = require("react/jsx-runtime");
|
|
7049
|
-
var
|
|
6883
|
+
var useStyles46 = (0, import_mui52.makeStyles)()((theme) => ({
|
|
7050
6884
|
root: {
|
|
7051
6885
|
backgroundColor: colors.neutral100,
|
|
7052
6886
|
height: theme.spacing(6),
|
|
@@ -7113,7 +6947,7 @@ var SmartTableHeader = ({
|
|
|
7113
6947
|
onApplyFilters,
|
|
7114
6948
|
shouldShowCheckOnFilter
|
|
7115
6949
|
}) => {
|
|
7116
|
-
const { classes } =
|
|
6950
|
+
const { classes } = useStyles46();
|
|
7117
6951
|
const createSortHandler = (property) => (event) => {
|
|
7118
6952
|
onRequestSort(event, property);
|
|
7119
6953
|
};
|
|
@@ -7123,6 +6957,7 @@ var SmartTableHeader = ({
|
|
|
7123
6957
|
import_material58.Checkbox,
|
|
7124
6958
|
{
|
|
7125
6959
|
color: "primary",
|
|
6960
|
+
disableRipple: true,
|
|
7126
6961
|
indeterminate: numSelected > 0 && numSelected < numRows,
|
|
7127
6962
|
checked: numRows > 0 && numSelected === numRows,
|
|
7128
6963
|
onChange: onSelectAllClick
|
|
@@ -7144,12 +6979,12 @@ var SmartTableHeader = ({
|
|
|
7144
6979
|
direction: orderBy === headCell.id ? order : "asc",
|
|
7145
6980
|
onClick: createSortHandler(headCell.id),
|
|
7146
6981
|
children: [
|
|
7147
|
-
headCell.
|
|
6982
|
+
headCell.RenderHeader ?? headCell.label,
|
|
7148
6983
|
orderBy === headCell.id ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: classes.visuallyHidden, children: order === "desc" ? "sorted descending" : "sorted ascending" }) : null
|
|
7149
6984
|
]
|
|
7150
6985
|
}
|
|
7151
6986
|
),
|
|
7152
|
-
headCell.
|
|
6987
|
+
headCell.refetchFilterOptions ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
|
|
7153
6988
|
SmartTableHeaderFilterMenu_default,
|
|
7154
6989
|
{
|
|
7155
6990
|
headCell,
|
|
@@ -7167,193 +7002,11 @@ var SmartTableHeader = ({
|
|
|
7167
7002
|
};
|
|
7168
7003
|
var SmartTableHeader_default = (0, import_react32.memo)(SmartTableHeader);
|
|
7169
7004
|
|
|
7170
|
-
// src/components/
|
|
7171
|
-
var import_react33 = require("react");
|
|
7172
|
-
var import_material60 = require("@mui/material");
|
|
7173
|
-
var import_debounce = __toESM(require_debounce(), 1);
|
|
7174
|
-
var import_mui54 = require("tss-react/mui");
|
|
7175
|
-
var import_uuid = require("uuid");
|
|
7176
|
-
|
|
7177
|
-
// src/components/TableLoading/TableLoading.tsx
|
|
7005
|
+
// src/components/TableEmptyResult/TableEmptyResult.tsx
|
|
7178
7006
|
var import_material59 = require("@mui/material");
|
|
7007
|
+
var import_mui53 = require("tss-react/mui");
|
|
7179
7008
|
var import_jsx_runtime110 = require("react/jsx-runtime");
|
|
7180
|
-
var
|
|
7181
|
-
rowsPerPage,
|
|
7182
|
-
rowHeight
|
|
7183
|
-
}) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.Box, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
|
|
7184
|
-
import_material59.Skeleton,
|
|
7185
|
-
{
|
|
7186
|
-
animation: "pulse",
|
|
7187
|
-
"data-testid": "table-loading-skeleton",
|
|
7188
|
-
style: { margin: "8px", opacity: 0.4 },
|
|
7189
|
-
variant: "rectangular",
|
|
7190
|
-
height: rowHeight
|
|
7191
|
-
},
|
|
7192
|
-
index
|
|
7193
|
-
)) });
|
|
7194
|
-
var TableLoading_default = TableLoading;
|
|
7195
|
-
|
|
7196
|
-
// src/components/Table/helpers.tsx
|
|
7197
|
-
function stableSort(array, cmp) {
|
|
7198
|
-
const stabilizedThis = array.map((el, index) => [el, index]);
|
|
7199
|
-
stabilizedThis.sort((a, b) => {
|
|
7200
|
-
const order = cmp(a[0], b[0]);
|
|
7201
|
-
if (order !== 0) {
|
|
7202
|
-
return order;
|
|
7203
|
-
}
|
|
7204
|
-
return a[1] - b[1];
|
|
7205
|
-
});
|
|
7206
|
-
return stabilizedThis.map((el) => el[0]);
|
|
7207
|
-
}
|
|
7208
|
-
function descendingComparator(a, b, orderBy) {
|
|
7209
|
-
if (b[orderBy] < a[orderBy]) {
|
|
7210
|
-
return -1;
|
|
7211
|
-
}
|
|
7212
|
-
if (b[orderBy] > a[orderBy]) {
|
|
7213
|
-
return 1;
|
|
7214
|
-
}
|
|
7215
|
-
return 0;
|
|
7216
|
-
}
|
|
7217
|
-
function getSorting(order, orderBy) {
|
|
7218
|
-
return order === "desc" ? (a, b) => descendingComparator(a, b, orderBy) : (a, b) => -descendingComparator(a, b, orderBy);
|
|
7219
|
-
}
|
|
7220
|
-
function calculateRowsPerPage(rowHeight) {
|
|
7221
|
-
const appContainerDom = document.getElementById("mainContainer");
|
|
7222
|
-
const headerDom = document.getElementById("aboveTableHeader");
|
|
7223
|
-
if (appContainerDom && headerDom) {
|
|
7224
|
-
return Math.floor(
|
|
7225
|
-
(appContainerDom.clientHeight - headerDom.clientHeight - 24) / rowHeight - 2
|
|
7226
|
-
);
|
|
7227
|
-
}
|
|
7228
|
-
return 1;
|
|
7229
|
-
}
|
|
7230
|
-
|
|
7231
|
-
// src/components/Table/Table.tsx
|
|
7232
|
-
var import_jsx_runtime111 = require("react/jsx-runtime");
|
|
7233
|
-
var useStyles48 = (0, import_mui54.makeStyles)()(() => ({
|
|
7234
|
-
root: {
|
|
7235
|
-
height: "calc(100vh - 262px)",
|
|
7236
|
-
overflow: "scroll"
|
|
7237
|
-
},
|
|
7238
|
-
paper: {
|
|
7239
|
-
width: "100%",
|
|
7240
|
-
display: "flex",
|
|
7241
|
-
flexDirection: "column",
|
|
7242
|
-
justifyContent: "space-between"
|
|
7243
|
-
},
|
|
7244
|
-
header: {
|
|
7245
|
-
"& .MuiTableSortLabel-root": {
|
|
7246
|
-
fontWeight: 600,
|
|
7247
|
-
fontSize: ".875rem"
|
|
7248
|
-
}
|
|
7249
|
-
},
|
|
7250
|
-
container: {
|
|
7251
|
-
maxHeight: "calc(100% - 0)"
|
|
7252
|
-
}
|
|
7253
|
-
}));
|
|
7254
|
-
var Table = ({
|
|
7255
|
-
appliedFilters,
|
|
7256
|
-
data,
|
|
7257
|
-
doNotCalculateRows,
|
|
7258
|
-
headCells,
|
|
7259
|
-
isLoading,
|
|
7260
|
-
onRowClick,
|
|
7261
|
-
page = 0,
|
|
7262
|
-
RenderItem = null,
|
|
7263
|
-
rowsPerPage: defaultRowsPerPage = 10,
|
|
7264
|
-
serverRendered,
|
|
7265
|
-
updateSort
|
|
7266
|
-
}) => {
|
|
7267
|
-
const [order, setOrder] = (0, import_react33.useState)(appliedFilters?.sortDir || "desc");
|
|
7268
|
-
const [orderBy, setOrderBy] = (0, import_react33.useState)(
|
|
7269
|
-
appliedFilters?.sortField || "delivery_date"
|
|
7270
|
-
);
|
|
7271
|
-
const [rowsPerPage, setRowsPerPage] = (0, import_react33.useState)(defaultRowsPerPage);
|
|
7272
|
-
const { classes } = useStyles48();
|
|
7273
|
-
const rowHeight = 56;
|
|
7274
|
-
const emptyRows = rowsPerPage - Math.min(rowsPerPage, data.length - page * rowsPerPage);
|
|
7275
|
-
const handleRequestSort = (event, property) => {
|
|
7276
|
-
const isAsc = orderBy === property && order === "asc";
|
|
7277
|
-
const orderDir = isAsc ? "desc" : "asc";
|
|
7278
|
-
setOrder(orderDir);
|
|
7279
|
-
setOrderBy(property);
|
|
7280
|
-
if (updateSort) {
|
|
7281
|
-
updateSort(property, orderDir);
|
|
7282
|
-
}
|
|
7283
|
-
};
|
|
7284
|
-
(0, import_react33.useLayoutEffect)(() => {
|
|
7285
|
-
if (!doNotCalculateRows) {
|
|
7286
|
-
return;
|
|
7287
|
-
}
|
|
7288
|
-
function updateRowsPerPage() {
|
|
7289
|
-
const newRowsPerPage = calculateRowsPerPage(rowHeight);
|
|
7290
|
-
setRowsPerPage(newRowsPerPage);
|
|
7291
|
-
}
|
|
7292
|
-
updateRowsPerPage();
|
|
7293
|
-
const debounced = (0, import_debounce.default)(updateRowsPerPage, 150);
|
|
7294
|
-
window.addEventListener("resize", debounced);
|
|
7295
|
-
return () => {
|
|
7296
|
-
window.removeEventListener("resize", debounced);
|
|
7297
|
-
};
|
|
7298
|
-
}, [doNotCalculateRows]);
|
|
7299
|
-
const createSortHandler = (property) => (event) => {
|
|
7300
|
-
handleRequestSort(event, property);
|
|
7301
|
-
};
|
|
7302
|
-
const getTableRows = () => {
|
|
7303
|
-
const index = page;
|
|
7304
|
-
const rows = serverRendered ? data : stableSort(data, getSorting(order, orderBy)).slice(
|
|
7305
|
-
index * rowsPerPage,
|
|
7306
|
-
index * rowsPerPage + rowsPerPage
|
|
7307
|
-
);
|
|
7308
|
-
const rowsComponents = rows.map((row) => {
|
|
7309
|
-
if (RenderItem) {
|
|
7310
|
-
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(RenderItem, { ...row }, row.id);
|
|
7311
|
-
}
|
|
7312
|
-
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { hover: true, onClick: () => onRowClick?.(row), children: headCells?.map((column) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableCell, { children: row[column.id] }, column.id)) }, row.id);
|
|
7313
|
-
});
|
|
7314
|
-
if (emptyRows > 0 && rowsPerPage > emptyRows) {
|
|
7315
|
-
rowsComponents.push(
|
|
7316
|
-
/* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableCell, { colSpan: 8 }) }, (0, import_uuid.v4)())
|
|
7317
|
-
);
|
|
7318
|
-
}
|
|
7319
|
-
return rowsComponents;
|
|
7320
|
-
};
|
|
7321
|
-
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.Paper, { className: classes.root, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.Box, { className: classes.paper, children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_material60.Table, { size: "medium", stickyHeader: true, children: [
|
|
7322
|
-
/* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableHead, { className: classes.header, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { children: headCells?.map((headCell) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
7323
|
-
import_material60.TableCell,
|
|
7324
|
-
{
|
|
7325
|
-
align: "left",
|
|
7326
|
-
sortDirection: orderBy === headCell.id ? order : void 0,
|
|
7327
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
7328
|
-
import_material60.TableSortLabel,
|
|
7329
|
-
{
|
|
7330
|
-
active: orderBy === headCell.id,
|
|
7331
|
-
direction: orderBy === headCell.id ? order : "asc",
|
|
7332
|
-
onClick: createSortHandler(headCell.id),
|
|
7333
|
-
children: headCell.label
|
|
7334
|
-
}
|
|
7335
|
-
)
|
|
7336
|
-
},
|
|
7337
|
-
headCell.id
|
|
7338
|
-
)) }) }),
|
|
7339
|
-
/* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_material60.TableBody, { children: [
|
|
7340
|
-
getTableRows(),
|
|
7341
|
-
rowsPerPage === emptyRows && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableCell, { colSpan: 8, align: "center", children: "Nothing to display" }) })
|
|
7342
|
-
] })
|
|
7343
|
-
] }) }) }) });
|
|
7344
|
-
};
|
|
7345
|
-
var Table_default = Table;
|
|
7346
|
-
|
|
7347
|
-
// src/components/TableDesktop/TableDesktop.tsx
|
|
7348
|
-
var import_react34 = require("react");
|
|
7349
|
-
var import_material62 = require("@mui/material");
|
|
7350
|
-
var import_mui56 = require("tss-react/mui");
|
|
7351
|
-
|
|
7352
|
-
// src/components/TableEmptyResult/TableEmptyResult.tsx
|
|
7353
|
-
var import_material61 = require("@mui/material");
|
|
7354
|
-
var import_mui55 = require("tss-react/mui");
|
|
7355
|
-
var import_jsx_runtime112 = require("react/jsx-runtime");
|
|
7356
|
-
var useStyles49 = (0, import_mui55.makeStyles)()(() => ({
|
|
7009
|
+
var useStyles47 = (0, import_mui53.makeStyles)()(() => ({
|
|
7357
7010
|
tableCellIcon: { padding: 24, height: "calc(100vh - 320px)" },
|
|
7358
7011
|
tableCellDefault: { padding: 24 }
|
|
7359
7012
|
}));
|
|
@@ -7363,18 +7016,18 @@ var TableEmptyResult = ({
|
|
|
7363
7016
|
handleClickOnClearFiltersButton = () => {
|
|
7364
7017
|
}
|
|
7365
7018
|
}) => {
|
|
7366
|
-
const { classes } =
|
|
7367
|
-
return showClearFilterButton ? /* @__PURE__ */ (0,
|
|
7368
|
-
|
|
7019
|
+
const { classes } = useStyles47();
|
|
7020
|
+
return showClearFilterButton ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
|
|
7021
|
+
import_material59.TableCell,
|
|
7369
7022
|
{
|
|
7370
7023
|
className: classes.tableCellIcon,
|
|
7371
7024
|
colSpan,
|
|
7372
7025
|
align: "center",
|
|
7373
7026
|
children: [
|
|
7374
|
-
/* @__PURE__ */ (0,
|
|
7375
|
-
/* @__PURE__ */ (0,
|
|
7376
|
-
/* @__PURE__ */ (0,
|
|
7377
|
-
/* @__PURE__ */ (0,
|
|
7027
|
+
/* @__PURE__ */ (0, import_jsx_runtime110.jsx)(EmptyGlassIcon_default, {}),
|
|
7028
|
+
/* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.Typography, { variant: "h6", children: "No results found." }),
|
|
7029
|
+
/* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.Typography, { variant: "subtitle1", children: "Search without applied filters?" }),
|
|
7030
|
+
/* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
|
|
7378
7031
|
FilledButton_default,
|
|
7379
7032
|
{
|
|
7380
7033
|
copy: "Search",
|
|
@@ -7385,8 +7038,8 @@ var TableEmptyResult = ({
|
|
|
7385
7038
|
)
|
|
7386
7039
|
]
|
|
7387
7040
|
}
|
|
7388
|
-
) }) : /* @__PURE__ */ (0,
|
|
7389
|
-
|
|
7041
|
+
) }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
|
|
7042
|
+
import_material59.TableCell,
|
|
7390
7043
|
{
|
|
7391
7044
|
className: classes.tableCellDefault,
|
|
7392
7045
|
colSpan,
|
|
@@ -7398,8 +7051,8 @@ var TableEmptyResult = ({
|
|
|
7398
7051
|
var TableEmptyResult_default = TableEmptyResult;
|
|
7399
7052
|
|
|
7400
7053
|
// src/components/TableDesktop/TableDesktop.tsx
|
|
7401
|
-
var
|
|
7402
|
-
var
|
|
7054
|
+
var import_jsx_runtime111 = require("react/jsx-runtime");
|
|
7055
|
+
var useStyles48 = (0, import_mui54.makeStyles)()((theme) => ({
|
|
7403
7056
|
root: {
|
|
7404
7057
|
justifyContent: "space-between",
|
|
7405
7058
|
display: "flex",
|
|
@@ -7429,7 +7082,7 @@ var useStyles50 = (0, import_mui56.makeStyles)()((theme) => ({
|
|
|
7429
7082
|
}
|
|
7430
7083
|
}
|
|
7431
7084
|
}));
|
|
7432
|
-
var
|
|
7085
|
+
var descendingComparator = (a, b, orderBy) => {
|
|
7433
7086
|
const objA = a[orderBy];
|
|
7434
7087
|
const objB = b[orderBy];
|
|
7435
7088
|
const valA = typeof objA === "object" ? objA?.name : objA;
|
|
@@ -7449,61 +7102,515 @@ var descendingComparator2 = (a, b, orderBy) => {
|
|
|
7449
7102
|
if (valA < valB) {
|
|
7450
7103
|
return 1;
|
|
7451
7104
|
}
|
|
7452
|
-
return 0;
|
|
7453
|
-
};
|
|
7454
|
-
var
|
|
7455
|
-
const order = cmp(a.el, b.el);
|
|
7456
|
-
return order !== 0 ? order : a.index - b.index;
|
|
7457
|
-
}).map((el) => el.el);
|
|
7458
|
-
var getComparator = (order, orderBy) => order === "desc" ? (a, b) =>
|
|
7459
|
-
var
|
|
7105
|
+
return 0;
|
|
7106
|
+
};
|
|
7107
|
+
var stableSort = (array, cmp) => array.map((el, index) => ({ el, index })).sort((a, b) => {
|
|
7108
|
+
const order = cmp(a.el, b.el);
|
|
7109
|
+
return order !== 0 ? order : a.index - b.index;
|
|
7110
|
+
}).map((el) => el.el);
|
|
7111
|
+
var getComparator = (order, orderBy) => order === "desc" ? (a, b) => descendingComparator(a, b, orderBy) : (a, b) => -descendingComparator(a, b, orderBy);
|
|
7112
|
+
var resolveOptionType = (option, fieldName) => {
|
|
7113
|
+
if (!option || typeof option !== "object") {
|
|
7114
|
+
return option;
|
|
7115
|
+
}
|
|
7116
|
+
return option[fieldName] || "";
|
|
7117
|
+
};
|
|
7118
|
+
var TableDesktop = ({
|
|
7119
|
+
data,
|
|
7120
|
+
headCells,
|
|
7121
|
+
RenderItem,
|
|
7122
|
+
appliedFilters,
|
|
7123
|
+
headerFilters,
|
|
7124
|
+
children,
|
|
7125
|
+
height,
|
|
7126
|
+
isLoading,
|
|
7127
|
+
rowsPerPage = 50,
|
|
7128
|
+
enableCheckboxSelection = false,
|
|
7129
|
+
enableRowActions = false,
|
|
7130
|
+
disableInternalSort = false,
|
|
7131
|
+
updateSort,
|
|
7132
|
+
showClearFilterButton,
|
|
7133
|
+
handleClickOnClearFiltersButton,
|
|
7134
|
+
deleteItem,
|
|
7135
|
+
keyField = "id",
|
|
7136
|
+
tableLayout = "auto",
|
|
7137
|
+
onApplyFilters,
|
|
7138
|
+
shouldShowCheckOnFilter
|
|
7139
|
+
}) => {
|
|
7140
|
+
const [order, setOrder] = (0, import_react33.useState)(appliedFilters?.sortDir || "desc");
|
|
7141
|
+
const [orderBy, setOrderBy] = (0, import_react33.useState)(
|
|
7142
|
+
appliedFilters?.sortField || "delivery_date"
|
|
7143
|
+
);
|
|
7144
|
+
const [selected, setSelected] = (0, import_react33.useState)(/* @__PURE__ */ new Set());
|
|
7145
|
+
const [page] = (0, import_react33.useState)(0);
|
|
7146
|
+
const { classes } = useStyles48();
|
|
7147
|
+
const rowHeight = 56;
|
|
7148
|
+
const emptyRows = (0, import_react33.useMemo)(
|
|
7149
|
+
() => rowsPerPage - data.length,
|
|
7150
|
+
[rowsPerPage, data]
|
|
7151
|
+
);
|
|
7152
|
+
const visibleHeadCells = (0, import_react33.useMemo)(
|
|
7153
|
+
() => headCells.filter((headCell) => headCell?.enabled ?? true),
|
|
7154
|
+
[headCells]
|
|
7155
|
+
);
|
|
7156
|
+
const handleSelectAllClick = (0, import_react33.useCallback)(
|
|
7157
|
+
(event) => {
|
|
7158
|
+
if (event.target.checked) {
|
|
7159
|
+
const allItems = new Set(data.map((n) => n[keyField]));
|
|
7160
|
+
setSelected(allItems);
|
|
7161
|
+
} else {
|
|
7162
|
+
setSelected(/* @__PURE__ */ new Set());
|
|
7163
|
+
}
|
|
7164
|
+
},
|
|
7165
|
+
[data, keyField]
|
|
7166
|
+
);
|
|
7167
|
+
const handleRequestSort = (event, property) => {
|
|
7168
|
+
const isAsc = orderBy === property && order === "asc";
|
|
7169
|
+
const orderDir = isAsc ? "desc" : "asc";
|
|
7170
|
+
setOrder(orderDir);
|
|
7171
|
+
setOrderBy(property);
|
|
7172
|
+
if (updateSort) {
|
|
7173
|
+
updateSort(property, orderDir);
|
|
7174
|
+
}
|
|
7175
|
+
};
|
|
7176
|
+
const handleRowCheckboxChange = (0, import_react33.useCallback)(
|
|
7177
|
+
(event, keyFieldValue) => {
|
|
7178
|
+
event.stopPropagation();
|
|
7179
|
+
setSelected((prev) => {
|
|
7180
|
+
const newSelected = new Set(prev);
|
|
7181
|
+
if (newSelected.has(keyFieldValue)) {
|
|
7182
|
+
newSelected.delete(keyFieldValue);
|
|
7183
|
+
} else {
|
|
7184
|
+
newSelected.add(keyFieldValue);
|
|
7185
|
+
}
|
|
7186
|
+
return newSelected;
|
|
7187
|
+
});
|
|
7188
|
+
},
|
|
7189
|
+
[]
|
|
7190
|
+
);
|
|
7191
|
+
const renderTableRows = (0, import_react33.useMemo)(() => {
|
|
7192
|
+
const sortedData = disableInternalSort ? data : stableSort(data, getComparator(order, orderBy));
|
|
7193
|
+
return sortedData.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((row, index) => {
|
|
7194
|
+
const isItemSelected = selected.has(row[keyField]);
|
|
7195
|
+
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
7196
|
+
RenderItem,
|
|
7197
|
+
{
|
|
7198
|
+
...{
|
|
7199
|
+
...row,
|
|
7200
|
+
index,
|
|
7201
|
+
deleteItem,
|
|
7202
|
+
isItemSelected,
|
|
7203
|
+
enableCheckboxSelection,
|
|
7204
|
+
enableRowActions,
|
|
7205
|
+
keyFieldValue: row[keyField],
|
|
7206
|
+
handleRowCheckboxChange,
|
|
7207
|
+
visibleHeadCells
|
|
7208
|
+
}
|
|
7209
|
+
},
|
|
7210
|
+
row[keyField] ?? index
|
|
7211
|
+
);
|
|
7212
|
+
});
|
|
7213
|
+
}, [
|
|
7214
|
+
data,
|
|
7215
|
+
order,
|
|
7216
|
+
orderBy,
|
|
7217
|
+
page,
|
|
7218
|
+
rowsPerPage,
|
|
7219
|
+
selected,
|
|
7220
|
+
enableCheckboxSelection,
|
|
7221
|
+
enableRowActions,
|
|
7222
|
+
disableInternalSort,
|
|
7223
|
+
deleteItem,
|
|
7224
|
+
keyField,
|
|
7225
|
+
handleRowCheckboxChange,
|
|
7226
|
+
visibleHeadCells,
|
|
7227
|
+
RenderItem
|
|
7228
|
+
]);
|
|
7229
|
+
(0, import_react33.useEffect)(() => {
|
|
7230
|
+
if (!enableCheckboxSelection) {
|
|
7231
|
+
setSelected(/* @__PURE__ */ new Set());
|
|
7232
|
+
}
|
|
7233
|
+
}, [enableCheckboxSelection]);
|
|
7234
|
+
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: classes.root, style: { height }, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_material60.Paper, { className: classes.paper, children: [
|
|
7235
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.Box, { width: "100%", overflow: "hidden", children: [...Array(Math.floor(rowsPerPage ?? 50))].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
7236
|
+
import_material60.Skeleton,
|
|
7237
|
+
{
|
|
7238
|
+
animation: "pulse",
|
|
7239
|
+
variant: "rounded",
|
|
7240
|
+
sx: { margin: 1 },
|
|
7241
|
+
height: rowHeight,
|
|
7242
|
+
"data-testid": "loading-skeleton"
|
|
7243
|
+
},
|
|
7244
|
+
index
|
|
7245
|
+
)) }) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
|
|
7246
|
+
import_material60.Table,
|
|
7247
|
+
{
|
|
7248
|
+
stickyHeader: true,
|
|
7249
|
+
"aria-labelledby": "tableTitle",
|
|
7250
|
+
"aria-label": "sticky table",
|
|
7251
|
+
style: { tableLayout },
|
|
7252
|
+
children: [
|
|
7253
|
+
/* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
7254
|
+
SmartTableHeader_default,
|
|
7255
|
+
{
|
|
7256
|
+
headCells: visibleHeadCells,
|
|
7257
|
+
order,
|
|
7258
|
+
orderBy,
|
|
7259
|
+
numSelected: selected.size,
|
|
7260
|
+
numRows: data.length,
|
|
7261
|
+
enableCheckboxSelection,
|
|
7262
|
+
headerFilters: headerFilters ?? {},
|
|
7263
|
+
onRequestSort: handleRequestSort,
|
|
7264
|
+
onSelectAllClick: handleSelectAllClick,
|
|
7265
|
+
onApplyFilters,
|
|
7266
|
+
shouldShowCheckOnFilter
|
|
7267
|
+
}
|
|
7268
|
+
),
|
|
7269
|
+
/* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableBody, { children: rowsPerPage !== emptyRows ? renderTableRows : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
7270
|
+
TableEmptyResult_default,
|
|
7271
|
+
{
|
|
7272
|
+
colSpan: enableCheckboxSelection ? visibleHeadCells.length + 1 : visibleHeadCells.length,
|
|
7273
|
+
showClearFilterButton,
|
|
7274
|
+
handleClickOnClearFiltersButton
|
|
7275
|
+
}
|
|
7276
|
+
) })
|
|
7277
|
+
]
|
|
7278
|
+
}
|
|
7279
|
+
) }),
|
|
7280
|
+
children
|
|
7281
|
+
] }) });
|
|
7282
|
+
};
|
|
7283
|
+
var TableDesktop_default = TableDesktop;
|
|
7284
|
+
|
|
7285
|
+
// src/components/SmartTableHeaderFilterMenu/SmartTableHeaderFilterMenu.tsx
|
|
7286
|
+
var import_jsx_runtime112 = require("react/jsx-runtime");
|
|
7287
|
+
var useStyles49 = (0, import_mui55.makeStyles)()((theme) => ({
|
|
7288
|
+
filterMenu: {
|
|
7289
|
+
display: "flex",
|
|
7290
|
+
flexDirection: "column"
|
|
7291
|
+
},
|
|
7292
|
+
filterOptions: {
|
|
7293
|
+
maxHeight: theme.spacing(62),
|
|
7294
|
+
overflowY: "auto",
|
|
7295
|
+
"&::-webkit-scrollbar": {
|
|
7296
|
+
width: "8px",
|
|
7297
|
+
height: "8px"
|
|
7298
|
+
},
|
|
7299
|
+
"&::-webkit-scrollbar-track": {
|
|
7300
|
+
backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[800] : theme.palette.grey[100]
|
|
7301
|
+
},
|
|
7302
|
+
"&::-webkit-scrollbar-thumb": {
|
|
7303
|
+
backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[900] : theme.palette.grey[400],
|
|
7304
|
+
borderRadius: "10px"
|
|
7305
|
+
},
|
|
7306
|
+
"&::-webkit-scrollbar-thumb:hover": {
|
|
7307
|
+
backgroundColor: theme.palette.mode === "dark" ? theme.palette.common.black : theme.palette.grey[500]
|
|
7308
|
+
}
|
|
7309
|
+
},
|
|
7310
|
+
filter: {
|
|
7311
|
+
display: "flex",
|
|
7312
|
+
alignItems: "center",
|
|
7313
|
+
justifyContent: "space-between",
|
|
7314
|
+
padding: theme.spacing(0, 3)
|
|
7315
|
+
},
|
|
7316
|
+
applyFilterButtonsContainer: {
|
|
7317
|
+
display: "flex",
|
|
7318
|
+
padding: theme.spacing(0, 1)
|
|
7319
|
+
},
|
|
7320
|
+
saveAsDefaultButton: {
|
|
7321
|
+
color: theme.palette.primary.main
|
|
7322
|
+
},
|
|
7323
|
+
skeleton: {
|
|
7324
|
+
height: theme.spacing(3),
|
|
7325
|
+
margin: theme.spacing(1)
|
|
7326
|
+
}
|
|
7327
|
+
}));
|
|
7328
|
+
var findFilterIndex = (filters, filterOption) => filters.findIndex((item) => {
|
|
7329
|
+
if (typeof item === "string" && typeof filterOption === "string") {
|
|
7330
|
+
return item === filterOption;
|
|
7331
|
+
}
|
|
7332
|
+
if (typeof item === "object" && typeof filterOption === "object") {
|
|
7333
|
+
return item.id === filterOption.id;
|
|
7334
|
+
}
|
|
7335
|
+
return false;
|
|
7336
|
+
});
|
|
7337
|
+
var SmartTableHeaderFilterMenu = ({
|
|
7338
|
+
headCell,
|
|
7339
|
+
numActiveFilters,
|
|
7340
|
+
headerFilters,
|
|
7341
|
+
shouldShowCheckOnFilter,
|
|
7342
|
+
onApplyFilters
|
|
7343
|
+
}) => {
|
|
7344
|
+
const { classes } = useStyles49();
|
|
7345
|
+
const [anchorEl, setAnchorEl] = (0, import_react34.useState)(null);
|
|
7346
|
+
const [filterOptionsData, setFilterOptionsData] = (0, import_react34.useState)();
|
|
7347
|
+
const [selectedFilters, setSelectedFilters] = (0, import_react34.useState)(
|
|
7348
|
+
headerFilters[headCell.id] ?? []
|
|
7349
|
+
);
|
|
7350
|
+
(0, import_react34.useEffect)(() => {
|
|
7351
|
+
if (headCell.filterOptions)
|
|
7352
|
+
setFilterOptionsData(headCell.filterOptions);
|
|
7353
|
+
}, [headCell.filterOptions]);
|
|
7354
|
+
const numFilterOptions = (0, import_react34.useMemo)(() => filterOptionsData?.length ?? 0, [filterOptionsData?.length]);
|
|
7355
|
+
const numCurrentSelectedFilters = selectedFilters.length;
|
|
7356
|
+
const handleFilterMenuOpen = (event) => {
|
|
7357
|
+
if (!numFilterOptions) {
|
|
7358
|
+
headCell.refetchFilterOptions?.();
|
|
7359
|
+
}
|
|
7360
|
+
setAnchorEl(event.currentTarget);
|
|
7361
|
+
};
|
|
7362
|
+
const handleFilterMenuClose = () => {
|
|
7363
|
+
setSelectedFilters(headerFilters[headCell.id]);
|
|
7364
|
+
setAnchorEl(null);
|
|
7365
|
+
};
|
|
7366
|
+
const handleFilterOptionClick = (option) => {
|
|
7367
|
+
const selectedIndex = findFilterIndex(selectedFilters, option);
|
|
7368
|
+
let newSelected;
|
|
7369
|
+
if (selectedIndex === -1) {
|
|
7370
|
+
if (typeof option === "string") {
|
|
7371
|
+
newSelected = [...selectedFilters, option];
|
|
7372
|
+
} else {
|
|
7373
|
+
newSelected = [...selectedFilters, option];
|
|
7374
|
+
}
|
|
7375
|
+
} else {
|
|
7376
|
+
newSelected = selectedFilters.filter(
|
|
7377
|
+
(_, index) => index !== selectedIndex
|
|
7378
|
+
);
|
|
7379
|
+
}
|
|
7380
|
+
setSelectedFilters(newSelected);
|
|
7381
|
+
};
|
|
7382
|
+
const handleApplyFilters = (shouldSave) => {
|
|
7383
|
+
const updatedFilters = {
|
|
7384
|
+
...headerFilters,
|
|
7385
|
+
[headCell.id]: [...selectedFilters]
|
|
7386
|
+
};
|
|
7387
|
+
onApplyFilters?.(updatedFilters, shouldSave);
|
|
7388
|
+
setAnchorEl(null);
|
|
7389
|
+
};
|
|
7390
|
+
(0, import_react34.useEffect)(() => {
|
|
7391
|
+
setSelectedFilters(headerFilters[headCell.id] ?? []);
|
|
7392
|
+
}, [headerFilters, headCell.id]);
|
|
7393
|
+
const isOptionChecked = (0, import_react34.useMemo)(() => (resolvedOption) => !!selectedFilters?.some(
|
|
7394
|
+
(value) => resolveOptionType(value, headCell.fieldName ?? "") === resolvedOption
|
|
7395
|
+
), [selectedFilters]);
|
|
7396
|
+
const loadingSkeletons = /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_material61.Box, { "data-testid": "loading-skeletons", width: 272, children: [
|
|
7397
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
7398
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, {}),
|
|
7399
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
7400
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
7401
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
7402
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
|
|
7403
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, {}),
|
|
7404
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton })
|
|
7405
|
+
] });
|
|
7406
|
+
return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_jsx_runtime112.Fragment, { children: [
|
|
7407
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7408
|
+
ActiveFiltersIconButton_default,
|
|
7409
|
+
{
|
|
7410
|
+
numActiveFilters,
|
|
7411
|
+
handleClick: handleFilterMenuOpen,
|
|
7412
|
+
className: (0, import_classnames3.default)("filter-menu-trigger", {
|
|
7413
|
+
"has-active-filters": !!numActiveFilters || !!anchorEl
|
|
7414
|
+
})
|
|
7415
|
+
}
|
|
7416
|
+
),
|
|
7417
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7418
|
+
import_material61.Menu,
|
|
7419
|
+
{
|
|
7420
|
+
open: !!anchorEl,
|
|
7421
|
+
onClose: handleFilterMenuClose,
|
|
7422
|
+
anchorEl,
|
|
7423
|
+
"data-testid": "filter-menu",
|
|
7424
|
+
anchorOrigin: { vertical: "bottom", horizontal: "right" },
|
|
7425
|
+
transformOrigin: { vertical: "top", horizontal: "right" },
|
|
7426
|
+
children: false ? loadingSkeletons : /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_material61.Box, { className: classes.filterMenu, children: [
|
|
7427
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Box, { px: 3, mb: 0.5, children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7428
|
+
import_material61.FormControlLabel,
|
|
7429
|
+
{
|
|
7430
|
+
label: "Select All",
|
|
7431
|
+
control: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7432
|
+
import_material61.Checkbox,
|
|
7433
|
+
{
|
|
7434
|
+
disableRipple: true,
|
|
7435
|
+
checked: numCurrentSelectedFilters === numFilterOptions,
|
|
7436
|
+
indeterminate: numCurrentSelectedFilters > 0 && numCurrentSelectedFilters < numFilterOptions,
|
|
7437
|
+
onChange: ({ target: { checked } }) => {
|
|
7438
|
+
if (checked) {
|
|
7439
|
+
setSelectedFilters([...filterOptionsData]);
|
|
7440
|
+
} else {
|
|
7441
|
+
setSelectedFilters([]);
|
|
7442
|
+
}
|
|
7443
|
+
}
|
|
7444
|
+
}
|
|
7445
|
+
)
|
|
7446
|
+
}
|
|
7447
|
+
) }),
|
|
7448
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, { sx: { mb: 0.5 } }),
|
|
7449
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Box, { className: classes.filterOptions, children: filterOptionsData?.map(
|
|
7450
|
+
(option) => {
|
|
7451
|
+
const resolvedOption = resolveOptionType(option, headCell.fieldName ?? "");
|
|
7452
|
+
return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
|
|
7453
|
+
import_material61.Box,
|
|
7454
|
+
{
|
|
7455
|
+
className: classes.filter,
|
|
7456
|
+
children: [
|
|
7457
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7458
|
+
import_material61.FormControlLabel,
|
|
7459
|
+
{
|
|
7460
|
+
label: resolvedOption,
|
|
7461
|
+
control: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7462
|
+
import_material61.Checkbox,
|
|
7463
|
+
{
|
|
7464
|
+
disableRipple: true,
|
|
7465
|
+
onChange: () => handleFilterOptionClick(option),
|
|
7466
|
+
checked: isOptionChecked(resolvedOption)
|
|
7467
|
+
}
|
|
7468
|
+
)
|
|
7469
|
+
},
|
|
7470
|
+
resolvedOption
|
|
7471
|
+
),
|
|
7472
|
+
shouldShowCheckOnFilter?.(headCell.id, option) ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Tooltip, { title: "This filter is saved as default", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_Check.default, { fontSize: "small", color: "action" }) }) : null
|
|
7473
|
+
]
|
|
7474
|
+
},
|
|
7475
|
+
resolvedOption
|
|
7476
|
+
);
|
|
7477
|
+
}
|
|
7478
|
+
) }),
|
|
7479
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, { sx: { mb: 0.5 } }),
|
|
7480
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_material61.Box, { className: classes.applyFilterButtonsContainer, children: [
|
|
7481
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7482
|
+
ExtendedButton_default,
|
|
7483
|
+
{
|
|
7484
|
+
copy: "Save as Default",
|
|
7485
|
+
buttonType: "button",
|
|
7486
|
+
variant: "text",
|
|
7487
|
+
tooltip: "Persists those filters for future visits",
|
|
7488
|
+
className: classes.saveAsDefaultButton,
|
|
7489
|
+
onClick: () => handleApplyFilters(true)
|
|
7490
|
+
}
|
|
7491
|
+
),
|
|
7492
|
+
/* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
7493
|
+
ExtendedButton_default,
|
|
7494
|
+
{
|
|
7495
|
+
copy: "Apply",
|
|
7496
|
+
color: "primary",
|
|
7497
|
+
buttonType: "submit",
|
|
7498
|
+
onClick: () => handleApplyFilters(false)
|
|
7499
|
+
}
|
|
7500
|
+
)
|
|
7501
|
+
] })
|
|
7502
|
+
] })
|
|
7503
|
+
}
|
|
7504
|
+
)
|
|
7505
|
+
] });
|
|
7506
|
+
};
|
|
7507
|
+
var SmartTableHeaderFilterMenu_default = (0, import_react34.memo)(SmartTableHeaderFilterMenu);
|
|
7508
|
+
|
|
7509
|
+
// src/components/Table/Table.tsx
|
|
7510
|
+
var import_react35 = require("react");
|
|
7511
|
+
var import_material63 = require("@mui/material");
|
|
7512
|
+
var import_debounce = __toESM(require_debounce(), 1);
|
|
7513
|
+
var import_mui56 = require("tss-react/mui");
|
|
7514
|
+
var import_uuid = require("uuid");
|
|
7515
|
+
|
|
7516
|
+
// src/components/TableLoading/TableLoading.tsx
|
|
7517
|
+
var import_material62 = require("@mui/material");
|
|
7518
|
+
var import_jsx_runtime113 = require("react/jsx-runtime");
|
|
7519
|
+
var TableLoading = ({
|
|
7520
|
+
rowsPerPage,
|
|
7521
|
+
rowHeight
|
|
7522
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.Box, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
|
|
7523
|
+
import_material62.Skeleton,
|
|
7524
|
+
{
|
|
7525
|
+
animation: "pulse",
|
|
7526
|
+
"data-testid": "table-loading-skeleton",
|
|
7527
|
+
style: { margin: "8px", opacity: 0.4 },
|
|
7528
|
+
variant: "rectangular",
|
|
7529
|
+
height: rowHeight
|
|
7530
|
+
},
|
|
7531
|
+
index
|
|
7532
|
+
)) });
|
|
7533
|
+
var TableLoading_default = TableLoading;
|
|
7534
|
+
|
|
7535
|
+
// src/components/Table/helpers.tsx
|
|
7536
|
+
function stableSort2(array, cmp) {
|
|
7537
|
+
const stabilizedThis = array.map((el, index) => [el, index]);
|
|
7538
|
+
stabilizedThis.sort((a, b) => {
|
|
7539
|
+
const order = cmp(a[0], b[0]);
|
|
7540
|
+
if (order !== 0) {
|
|
7541
|
+
return order;
|
|
7542
|
+
}
|
|
7543
|
+
return a[1] - b[1];
|
|
7544
|
+
});
|
|
7545
|
+
return stabilizedThis.map((el) => el[0]);
|
|
7546
|
+
}
|
|
7547
|
+
function descendingComparator2(a, b, orderBy) {
|
|
7548
|
+
if (b[orderBy] < a[orderBy]) {
|
|
7549
|
+
return -1;
|
|
7550
|
+
}
|
|
7551
|
+
if (b[orderBy] > a[orderBy]) {
|
|
7552
|
+
return 1;
|
|
7553
|
+
}
|
|
7554
|
+
return 0;
|
|
7555
|
+
}
|
|
7556
|
+
function getSorting(order, orderBy) {
|
|
7557
|
+
return order === "desc" ? (a, b) => descendingComparator2(a, b, orderBy) : (a, b) => -descendingComparator2(a, b, orderBy);
|
|
7558
|
+
}
|
|
7559
|
+
function calculateRowsPerPage(rowHeight) {
|
|
7560
|
+
const appContainerDom = document.getElementById("mainContainer");
|
|
7561
|
+
const headerDom = document.getElementById("aboveTableHeader");
|
|
7562
|
+
if (appContainerDom && headerDom) {
|
|
7563
|
+
return Math.floor(
|
|
7564
|
+
(appContainerDom.clientHeight - headerDom.clientHeight - 24) / rowHeight - 2
|
|
7565
|
+
);
|
|
7566
|
+
}
|
|
7567
|
+
return 1;
|
|
7568
|
+
}
|
|
7569
|
+
|
|
7570
|
+
// src/components/Table/Table.tsx
|
|
7571
|
+
var import_jsx_runtime114 = require("react/jsx-runtime");
|
|
7572
|
+
var useStyles50 = (0, import_mui56.makeStyles)()(() => ({
|
|
7573
|
+
root: {
|
|
7574
|
+
height: "calc(100vh - 262px)",
|
|
7575
|
+
overflow: "scroll"
|
|
7576
|
+
},
|
|
7577
|
+
paper: {
|
|
7578
|
+
width: "100%",
|
|
7579
|
+
display: "flex",
|
|
7580
|
+
flexDirection: "column",
|
|
7581
|
+
justifyContent: "space-between"
|
|
7582
|
+
},
|
|
7583
|
+
header: {
|
|
7584
|
+
"& .MuiTableSortLabel-root": {
|
|
7585
|
+
fontWeight: 600,
|
|
7586
|
+
fontSize: ".875rem"
|
|
7587
|
+
}
|
|
7588
|
+
},
|
|
7589
|
+
container: {
|
|
7590
|
+
maxHeight: "calc(100% - 0)"
|
|
7591
|
+
}
|
|
7592
|
+
}));
|
|
7593
|
+
var Table2 = ({
|
|
7594
|
+
appliedFilters,
|
|
7460
7595
|
data,
|
|
7596
|
+
doNotCalculateRows,
|
|
7461
7597
|
headCells,
|
|
7462
|
-
RenderItem,
|
|
7463
|
-
appliedFilters,
|
|
7464
|
-
headerFilters,
|
|
7465
|
-
children,
|
|
7466
|
-
height,
|
|
7467
7598
|
isLoading,
|
|
7468
|
-
|
|
7469
|
-
|
|
7470
|
-
|
|
7471
|
-
|
|
7472
|
-
|
|
7473
|
-
|
|
7474
|
-
deleteItem,
|
|
7475
|
-
keyField = "id",
|
|
7476
|
-
tableLayout = "auto",
|
|
7477
|
-
onApplyFilters,
|
|
7478
|
-
shouldShowCheckOnFilter
|
|
7599
|
+
onRowClick,
|
|
7600
|
+
page = 0,
|
|
7601
|
+
RenderItem = null,
|
|
7602
|
+
rowsPerPage: defaultRowsPerPage = 10,
|
|
7603
|
+
serverRendered,
|
|
7604
|
+
updateSort
|
|
7479
7605
|
}) => {
|
|
7480
|
-
const [order, setOrder] = (0,
|
|
7481
|
-
const [orderBy, setOrderBy] = (0,
|
|
7606
|
+
const [order, setOrder] = (0, import_react35.useState)(appliedFilters?.sortDir || "desc");
|
|
7607
|
+
const [orderBy, setOrderBy] = (0, import_react35.useState)(
|
|
7482
7608
|
appliedFilters?.sortField || "delivery_date"
|
|
7483
7609
|
);
|
|
7484
|
-
const [
|
|
7485
|
-
const [page] = (0, import_react34.useState)(0);
|
|
7610
|
+
const [rowsPerPage, setRowsPerPage] = (0, import_react35.useState)(defaultRowsPerPage);
|
|
7486
7611
|
const { classes } = useStyles50();
|
|
7487
7612
|
const rowHeight = 56;
|
|
7488
|
-
const emptyRows = (
|
|
7489
|
-
() => rowsPerPage - data.length,
|
|
7490
|
-
[rowsPerPage, data]
|
|
7491
|
-
);
|
|
7492
|
-
const visibleHeadCells = (0, import_react34.useMemo)(
|
|
7493
|
-
() => headCells.filter((headCell) => headCell?.enabled ?? true),
|
|
7494
|
-
[headCells]
|
|
7495
|
-
);
|
|
7496
|
-
const handleSelectAllClick = (0, import_react34.useCallback)(
|
|
7497
|
-
(event) => {
|
|
7498
|
-
if (event.target.checked) {
|
|
7499
|
-
const newSelected = data.map((n) => n[keyField]);
|
|
7500
|
-
setSelected(newSelected);
|
|
7501
|
-
return;
|
|
7502
|
-
}
|
|
7503
|
-
setSelected([]);
|
|
7504
|
-
},
|
|
7505
|
-
[data, keyField]
|
|
7506
|
-
);
|
|
7613
|
+
const emptyRows = rowsPerPage - Math.min(rowsPerPage, data.length - page * rowsPerPage);
|
|
7507
7614
|
const handleRequestSort = (event, property) => {
|
|
7508
7615
|
const isAsc = orderBy === property && order === "asc";
|
|
7509
7616
|
const orderDir = isAsc ? "desc" : "asc";
|
|
@@ -7513,119 +7620,294 @@ var TableDesktop = ({
|
|
|
7513
7620
|
updateSort(property, orderDir);
|
|
7514
7621
|
}
|
|
7515
7622
|
};
|
|
7516
|
-
|
|
7517
|
-
(
|
|
7518
|
-
|
|
7519
|
-
|
|
7520
|
-
|
|
7521
|
-
|
|
7522
|
-
|
|
7523
|
-
|
|
7524
|
-
|
|
7525
|
-
|
|
7526
|
-
|
|
7527
|
-
|
|
7528
|
-
|
|
7529
|
-
|
|
7530
|
-
|
|
7623
|
+
(0, import_react35.useLayoutEffect)(() => {
|
|
7624
|
+
if (!doNotCalculateRows) {
|
|
7625
|
+
return;
|
|
7626
|
+
}
|
|
7627
|
+
function updateRowsPerPage() {
|
|
7628
|
+
const newRowsPerPage = calculateRowsPerPage(rowHeight);
|
|
7629
|
+
setRowsPerPage(newRowsPerPage);
|
|
7630
|
+
}
|
|
7631
|
+
updateRowsPerPage();
|
|
7632
|
+
const debounced = (0, import_debounce.default)(updateRowsPerPage, 150);
|
|
7633
|
+
window.addEventListener("resize", debounced);
|
|
7634
|
+
return () => {
|
|
7635
|
+
window.removeEventListener("resize", debounced);
|
|
7636
|
+
};
|
|
7637
|
+
}, [doNotCalculateRows]);
|
|
7638
|
+
const createSortHandler = (property) => (event) => {
|
|
7639
|
+
handleRequestSort(event, property);
|
|
7640
|
+
};
|
|
7641
|
+
const getTableRows = () => {
|
|
7642
|
+
const index = page;
|
|
7643
|
+
const rows = serverRendered ? data : stableSort2(data, getSorting(order, orderBy)).slice(
|
|
7644
|
+
index * rowsPerPage,
|
|
7645
|
+
index * rowsPerPage + rowsPerPage
|
|
7646
|
+
);
|
|
7647
|
+
const rowsComponents = rows.map((row) => {
|
|
7648
|
+
if (RenderItem) {
|
|
7649
|
+
return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(RenderItem, { ...row }, row.id);
|
|
7531
7650
|
}
|
|
7532
|
-
|
|
7533
|
-
},
|
|
7534
|
-
[selected]
|
|
7535
|
-
);
|
|
7536
|
-
const renderTableRows = (0, import_react34.useMemo)(() => {
|
|
7537
|
-
const sortedData = disableInternalSort ? data : stableSort2(data, getComparator(order, orderBy));
|
|
7538
|
-
return sortedData.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((row, index) => {
|
|
7539
|
-
const isItemSelected = selected.includes(row[keyField]);
|
|
7540
|
-
return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
|
|
7541
|
-
RenderItem,
|
|
7542
|
-
{
|
|
7543
|
-
...{
|
|
7544
|
-
...row,
|
|
7545
|
-
index,
|
|
7546
|
-
deleteItem,
|
|
7547
|
-
isItemSelected,
|
|
7548
|
-
enableCheckboxSelection,
|
|
7549
|
-
keyFieldValue: row[keyField],
|
|
7550
|
-
handleRowCheckboxClick,
|
|
7551
|
-
visibleHeadCells
|
|
7552
|
-
}
|
|
7553
|
-
},
|
|
7554
|
-
row[keyField] ?? index
|
|
7555
|
-
);
|
|
7651
|
+
return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { hover: true, onClick: () => onRowClick?.(row), children: headCells?.map((column) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { children: row[column.id] }, column.id)) }, row.id);
|
|
7556
7652
|
});
|
|
7557
|
-
|
|
7558
|
-
|
|
7559
|
-
|
|
7560
|
-
|
|
7561
|
-
|
|
7562
|
-
|
|
7563
|
-
|
|
7564
|
-
|
|
7565
|
-
|
|
7566
|
-
|
|
7567
|
-
keyField,
|
|
7568
|
-
handleRowCheckboxClick,
|
|
7569
|
-
visibleHeadCells,
|
|
7570
|
-
RenderItem
|
|
7571
|
-
]);
|
|
7572
|
-
return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { className: classes.root, style: { height }, children: /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(import_material62.Paper, { className: classes.paper, children: [
|
|
7573
|
-
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.Box, { width: "100%", overflow: "hidden", children: [...Array(Math.floor(rowsPerPage ?? 50))].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
|
|
7574
|
-
import_material62.Skeleton,
|
|
7653
|
+
if (emptyRows > 0 && rowsPerPage > emptyRows) {
|
|
7654
|
+
rowsComponents.push(
|
|
7655
|
+
/* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { colSpan: 8 }) }, (0, import_uuid.v4)())
|
|
7656
|
+
);
|
|
7657
|
+
}
|
|
7658
|
+
return rowsComponents;
|
|
7659
|
+
};
|
|
7660
|
+
return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.Paper, { className: classes.root, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.Box, { className: classes.paper, children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(import_material63.Table, { size: "medium", stickyHeader: true, children: [
|
|
7661
|
+
/* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableHead, { className: classes.header, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { children: headCells?.map((headCell) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
|
|
7662
|
+
import_material63.TableCell,
|
|
7575
7663
|
{
|
|
7576
|
-
|
|
7577
|
-
|
|
7578
|
-
|
|
7579
|
-
|
|
7580
|
-
|
|
7664
|
+
align: "left",
|
|
7665
|
+
sortDirection: orderBy === headCell.id ? order : void 0,
|
|
7666
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
|
|
7667
|
+
import_material63.TableSortLabel,
|
|
7668
|
+
{
|
|
7669
|
+
active: orderBy === headCell.id,
|
|
7670
|
+
direction: orderBy === headCell.id ? order : "asc",
|
|
7671
|
+
onClick: createSortHandler(headCell.id),
|
|
7672
|
+
children: headCell.label
|
|
7673
|
+
}
|
|
7674
|
+
)
|
|
7581
7675
|
},
|
|
7582
|
-
|
|
7583
|
-
)) })
|
|
7584
|
-
|
|
7676
|
+
headCell.id
|
|
7677
|
+
)) }) }),
|
|
7678
|
+
/* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(import_material63.TableBody, { children: [
|
|
7679
|
+
getTableRows(),
|
|
7680
|
+
rowsPerPage === emptyRows && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { colSpan: 8, align: "center", children: "Nothing to display" }) })
|
|
7681
|
+
] })
|
|
7682
|
+
] }) }) }) });
|
|
7683
|
+
};
|
|
7684
|
+
var Table_default = Table2;
|
|
7685
|
+
|
|
7686
|
+
// src/components/TableDesktopRowActions/TableDesktopRowActions.tsx
|
|
7687
|
+
var import_material64 = require("@mui/material");
|
|
7688
|
+
var import_jsx_runtime115 = require("react/jsx-runtime");
|
|
7689
|
+
var TableDesktopRowActions = ({
|
|
7690
|
+
rowRef,
|
|
7691
|
+
isRowHovered,
|
|
7692
|
+
px,
|
|
7693
|
+
py,
|
|
7694
|
+
pt,
|
|
7695
|
+
pb,
|
|
7696
|
+
pr,
|
|
7697
|
+
pl,
|
|
7698
|
+
top = 0,
|
|
7699
|
+
right = 0,
|
|
7700
|
+
bottom = 0,
|
|
7701
|
+
left = 0,
|
|
7702
|
+
zIndex = 1,
|
|
7703
|
+
backgroundColor,
|
|
7704
|
+
children
|
|
7705
|
+
}) => {
|
|
7706
|
+
return isRowHovered ? /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
7707
|
+
import_material64.TableCell,
|
|
7708
|
+
{
|
|
7709
|
+
ref: rowRef,
|
|
7710
|
+
padding: "none",
|
|
7711
|
+
sx: {
|
|
7712
|
+
top,
|
|
7713
|
+
right,
|
|
7714
|
+
bottom,
|
|
7715
|
+
left,
|
|
7716
|
+
zIndex,
|
|
7717
|
+
position: "sticky",
|
|
7718
|
+
display: "flex",
|
|
7719
|
+
justifyContent: "flex-end"
|
|
7720
|
+
},
|
|
7721
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
7722
|
+
import_material64.Box,
|
|
7723
|
+
{
|
|
7724
|
+
px,
|
|
7725
|
+
py,
|
|
7726
|
+
pt,
|
|
7727
|
+
pb,
|
|
7728
|
+
pr,
|
|
7729
|
+
pl,
|
|
7730
|
+
display: "flex",
|
|
7731
|
+
flexDirection: "row",
|
|
7732
|
+
borderLeft: `1px solid ${colors.neutral300}`,
|
|
7733
|
+
bgcolor: backgroundColor ?? ((theme) => theme.palette.background.default),
|
|
7734
|
+
children
|
|
7735
|
+
}
|
|
7736
|
+
)
|
|
7737
|
+
}
|
|
7738
|
+
) : null;
|
|
7739
|
+
};
|
|
7740
|
+
|
|
7741
|
+
// src/components/TableDesktopRowCell/TableDesktopRowCell.tsx
|
|
7742
|
+
var import_react37 = require("react");
|
|
7743
|
+
var import_material65 = require("@mui/material");
|
|
7744
|
+
|
|
7745
|
+
// src/components/TableDesktopRowCell/TableDesktopSmartSelect.tsx
|
|
7746
|
+
var import_react36 = require("react");
|
|
7747
|
+
var import_jsx_runtime116 = require("react/jsx-runtime");
|
|
7748
|
+
var getValueId = (value) => {
|
|
7749
|
+
if (typeof value === "string") {
|
|
7750
|
+
return value;
|
|
7751
|
+
}
|
|
7752
|
+
return value?.id;
|
|
7753
|
+
};
|
|
7754
|
+
var TableDesktopSmartSelect = (0, import_react36.memo)(({
|
|
7755
|
+
ref,
|
|
7756
|
+
initialValue,
|
|
7757
|
+
inputLabel,
|
|
7758
|
+
fieldName,
|
|
7759
|
+
rowId,
|
|
7760
|
+
filterOptions,
|
|
7761
|
+
refetchFilterOptions,
|
|
7762
|
+
isFetchingFilterOptions,
|
|
7763
|
+
onUpdateEditableCell
|
|
7764
|
+
}) => {
|
|
7765
|
+
const [value, setValue] = (0, import_react36.useState)(initialValue);
|
|
7766
|
+
const [options, setOptions] = (0, import_react36.useState)();
|
|
7767
|
+
const valueId = getValueId(value);
|
|
7768
|
+
const valueLabel = resolveOptionType(value, fieldName);
|
|
7769
|
+
(0, import_react36.useEffect)(() => {
|
|
7770
|
+
if (filterOptions) {
|
|
7771
|
+
const parsedOptions = filterOptions?.map((option) => ({
|
|
7772
|
+
value: getValueId(option),
|
|
7773
|
+
label: String(resolveOptionType(option, fieldName))
|
|
7774
|
+
}));
|
|
7775
|
+
setOptions(parsedOptions);
|
|
7776
|
+
}
|
|
7777
|
+
}, [filterOptions]);
|
|
7778
|
+
return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
|
|
7779
|
+
SmartSelect_default,
|
|
7780
|
+
{
|
|
7781
|
+
ref,
|
|
7782
|
+
value: valueId,
|
|
7783
|
+
inputLabel,
|
|
7784
|
+
options,
|
|
7785
|
+
refetch: refetchFilterOptions,
|
|
7786
|
+
isFetching: isFetchingFilterOptions,
|
|
7787
|
+
defaultOption: {
|
|
7788
|
+
value: valueId ?? "",
|
|
7789
|
+
label: String(valueLabel ?? "")
|
|
7790
|
+
},
|
|
7791
|
+
onChange: ({ value: value2, label }) => {
|
|
7792
|
+
setValue({ id: value2 ?? "", name: label ?? "" });
|
|
7793
|
+
onUpdateEditableCell?.(rowId, value2 ?? "");
|
|
7794
|
+
}
|
|
7795
|
+
}
|
|
7796
|
+
);
|
|
7797
|
+
});
|
|
7798
|
+
|
|
7799
|
+
// src/components/TableDesktopRowCell/TableDesktopRowCell.tsx
|
|
7800
|
+
var import_Check2 = __toESM(require("@mui/icons-material/Check"), 1);
|
|
7801
|
+
var import_jsx_runtime117 = require("react/jsx-runtime");
|
|
7802
|
+
var TableDesktopRowCell = ({
|
|
7803
|
+
ref,
|
|
7804
|
+
inputLabel,
|
|
7805
|
+
editInitialValue,
|
|
7806
|
+
rowId,
|
|
7807
|
+
fieldName,
|
|
7808
|
+
width,
|
|
7809
|
+
isEditMode,
|
|
7810
|
+
readOnlyValue,
|
|
7811
|
+
editableCellType,
|
|
7812
|
+
filterOptions,
|
|
7813
|
+
refetchFilterOptions,
|
|
7814
|
+
isFetchingFilterOptions,
|
|
7815
|
+
onUpdateEditableCell
|
|
7816
|
+
}) => {
|
|
7817
|
+
const cellRef = (0, import_react37.useRef)(null);
|
|
7818
|
+
const [isOverflowed, setIsOverflowed] = (0, import_react37.useState)(false);
|
|
7819
|
+
(0, import_react37.useEffect)(() => {
|
|
7820
|
+
const ref2 = cellRef.current;
|
|
7821
|
+
if (ref2) {
|
|
7822
|
+
setIsOverflowed(ref2.scrollWidth > ref2.clientWidth);
|
|
7823
|
+
}
|
|
7824
|
+
}, [readOnlyValue, width]);
|
|
7825
|
+
const editableComponents = {
|
|
7826
|
+
"select": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
|
|
7827
|
+
TableDesktopSmartSelect,
|
|
7585
7828
|
{
|
|
7586
|
-
|
|
7587
|
-
|
|
7588
|
-
|
|
7589
|
-
|
|
7590
|
-
|
|
7591
|
-
|
|
7592
|
-
|
|
7593
|
-
|
|
7594
|
-
|
|
7595
|
-
order,
|
|
7596
|
-
orderBy,
|
|
7597
|
-
numSelected: selected.length,
|
|
7598
|
-
numRows: data.length,
|
|
7599
|
-
enableCheckboxSelection,
|
|
7600
|
-
headerFilters: headerFilters ?? {},
|
|
7601
|
-
onRequestSort: handleRequestSort,
|
|
7602
|
-
onSelectAllClick: handleSelectAllClick,
|
|
7603
|
-
onApplyFilters,
|
|
7604
|
-
shouldShowCheckOnFilter
|
|
7605
|
-
}
|
|
7606
|
-
),
|
|
7607
|
-
/* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.TableBody, { children: rowsPerPage !== emptyRows ? renderTableRows : /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
|
|
7608
|
-
TableEmptyResult_default,
|
|
7609
|
-
{
|
|
7610
|
-
colSpan: enableCheckboxSelection ? visibleHeadCells.length + 1 : visibleHeadCells.length,
|
|
7611
|
-
showClearFilterButton,
|
|
7612
|
-
handleClickOnClearFiltersButton
|
|
7613
|
-
}
|
|
7614
|
-
) })
|
|
7615
|
-
]
|
|
7829
|
+
ref,
|
|
7830
|
+
initialValue: editInitialValue,
|
|
7831
|
+
inputLabel: inputLabel ?? "",
|
|
7832
|
+
fieldName,
|
|
7833
|
+
rowId,
|
|
7834
|
+
filterOptions,
|
|
7835
|
+
refetchFilterOptions,
|
|
7836
|
+
isFetchingFilterOptions,
|
|
7837
|
+
onUpdateEditableCell
|
|
7616
7838
|
}
|
|
7617
|
-
)
|
|
7618
|
-
|
|
7619
|
-
|
|
7839
|
+
),
|
|
7840
|
+
"checkbox": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
|
|
7841
|
+
import_material65.Checkbox,
|
|
7842
|
+
{
|
|
7843
|
+
disableRipple: true,
|
|
7844
|
+
defaultChecked: editInitialValue,
|
|
7845
|
+
onChange: ({ target: { checked } }) => {
|
|
7846
|
+
onUpdateEditableCell?.(rowId, checked);
|
|
7847
|
+
}
|
|
7848
|
+
}
|
|
7849
|
+
),
|
|
7850
|
+
"text": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
|
|
7851
|
+
import_material65.TextField,
|
|
7852
|
+
{
|
|
7853
|
+
fullWidth: true,
|
|
7854
|
+
variant: "standard",
|
|
7855
|
+
defaultValue: editInitialValue,
|
|
7856
|
+
label: inputLabel,
|
|
7857
|
+
onBlur: ({ target: { value } }) => {
|
|
7858
|
+
onUpdateEditableCell?.(rowId, value);
|
|
7859
|
+
}
|
|
7860
|
+
}
|
|
7861
|
+
),
|
|
7862
|
+
"numeric": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
|
|
7863
|
+
import_material65.TextField,
|
|
7864
|
+
{
|
|
7865
|
+
fullWidth: true,
|
|
7866
|
+
variant: "standard",
|
|
7867
|
+
defaultValue: editInitialValue,
|
|
7868
|
+
label: inputLabel,
|
|
7869
|
+
onChange: (e) => {
|
|
7870
|
+
e.target.value = e.target.value.replace(/\D/g, "");
|
|
7871
|
+
},
|
|
7872
|
+
onBlur: ({ target: { value } }) => {
|
|
7873
|
+
onUpdateEditableCell?.(rowId, value);
|
|
7874
|
+
},
|
|
7875
|
+
slotProps: {
|
|
7876
|
+
input: {
|
|
7877
|
+
inputMode: "numeric"
|
|
7878
|
+
}
|
|
7879
|
+
}
|
|
7880
|
+
}
|
|
7881
|
+
)
|
|
7882
|
+
};
|
|
7883
|
+
const getReadOnlyBooleanIcon = (value) => {
|
|
7884
|
+
if (value) {
|
|
7885
|
+
return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_Check2.default, { sx: { fontSize: 16 } });
|
|
7886
|
+
}
|
|
7887
|
+
return "-";
|
|
7888
|
+
};
|
|
7889
|
+
return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_material65.Tooltip, { title: isOverflowed ? String(readOnlyValue) : "", arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
|
|
7890
|
+
import_material65.TableCell,
|
|
7891
|
+
{
|
|
7892
|
+
ref: cellRef,
|
|
7893
|
+
align: "left",
|
|
7894
|
+
sx: {
|
|
7895
|
+
width: width ?? "auto",
|
|
7896
|
+
overflow: "hidden",
|
|
7897
|
+
textOverflow: "ellipsis",
|
|
7898
|
+
whiteSpace: "nowrap"
|
|
7899
|
+
},
|
|
7900
|
+
children: isEditMode && editableCellType ? editableComponents[editableCellType] : typeof readOnlyValue === "boolean" ? getReadOnlyBooleanIcon(readOnlyValue) : readOnlyValue
|
|
7901
|
+
}
|
|
7902
|
+
) });
|
|
7620
7903
|
};
|
|
7621
|
-
var TableDesktop_default = TableDesktop;
|
|
7622
7904
|
|
|
7623
7905
|
// src/components/TableHeader/TableHeader.tsx
|
|
7624
|
-
var
|
|
7906
|
+
var import_react38 = require("react");
|
|
7625
7907
|
var import_icons_material12 = require("@mui/icons-material");
|
|
7626
|
-
var
|
|
7908
|
+
var import_material66 = require("@mui/material");
|
|
7627
7909
|
var import_mui57 = require("tss-react/mui");
|
|
7628
|
-
var
|
|
7910
|
+
var import_jsx_runtime118 = require("react/jsx-runtime");
|
|
7629
7911
|
var useStyles51 = (0, import_mui57.makeStyles)()(() => ({
|
|
7630
7912
|
sortLabel: {
|
|
7631
7913
|
"& .MuiTableSortLabel-icon": {
|
|
@@ -7634,9 +7916,9 @@ var useStyles51 = (0, import_mui57.makeStyles)()(() => ({
|
|
|
7634
7916
|
}
|
|
7635
7917
|
}));
|
|
7636
7918
|
var TableHeader = ({ cells, onSort = null }) => {
|
|
7637
|
-
const [sortableCells, setSortableCells] = (0,
|
|
7919
|
+
const [sortableCells, setSortableCells] = (0, import_react38.useState)([]);
|
|
7638
7920
|
const { classes } = useStyles51();
|
|
7639
|
-
(0,
|
|
7921
|
+
(0, import_react38.useEffect)(() => {
|
|
7640
7922
|
setSortableCells(cells);
|
|
7641
7923
|
}, []);
|
|
7642
7924
|
const getNewSortDirection = (direction) => {
|
|
@@ -7670,8 +7952,8 @@ var TableHeader = ({ cells, onSort = null }) => {
|
|
|
7670
7952
|
});
|
|
7671
7953
|
setSortableCells(sortedCells);
|
|
7672
7954
|
};
|
|
7673
|
-
return /* @__PURE__ */ (0,
|
|
7674
|
-
|
|
7955
|
+
return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_material66.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_material66.TableRow, { children: sortableCells.map((cell, key) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_material66.TableCell, { children: cell.isSortable ? /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
|
|
7956
|
+
import_material66.TableSortLabel,
|
|
7675
7957
|
{
|
|
7676
7958
|
className: classes.sortLabel,
|
|
7677
7959
|
direction: cell?.direction || "asc",
|
|
@@ -7681,12 +7963,12 @@ var TableHeader = ({ cells, onSort = null }) => {
|
|
|
7681
7963
|
}
|
|
7682
7964
|
) : cell.label }, cell.label || key)) }) });
|
|
7683
7965
|
};
|
|
7684
|
-
var TableHeader_default = (0,
|
|
7966
|
+
var TableHeader_default = (0, import_react38.memo)(TableHeader);
|
|
7685
7967
|
|
|
7686
7968
|
// src/components/TextDivider/TextDivider.tsx
|
|
7687
|
-
var
|
|
7969
|
+
var import_material67 = require("@mui/material");
|
|
7688
7970
|
var import_mui58 = require("tss-react/mui");
|
|
7689
|
-
var
|
|
7971
|
+
var import_jsx_runtime119 = require("react/jsx-runtime");
|
|
7690
7972
|
var useStyles52 = (0, import_mui58.makeStyles)()(() => ({
|
|
7691
7973
|
icon: {
|
|
7692
7974
|
fontSize: 20
|
|
@@ -7723,19 +8005,19 @@ var TextDivider = ({
|
|
|
7723
8005
|
}) => {
|
|
7724
8006
|
const { classes } = useStyles52();
|
|
7725
8007
|
const iconColor = color ?? colors.neutral900;
|
|
7726
|
-
return /* @__PURE__ */ (0,
|
|
7727
|
-
|
|
8008
|
+
return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
|
|
8009
|
+
import_material67.Box,
|
|
7728
8010
|
{
|
|
7729
8011
|
display: "flex",
|
|
7730
8012
|
alignItems: "center",
|
|
7731
8013
|
justifyContent: "space-between",
|
|
7732
8014
|
className: classes.container,
|
|
7733
8015
|
children: [
|
|
7734
|
-
/* @__PURE__ */ (0,
|
|
7735
|
-
/* @__PURE__ */ (0,
|
|
7736
|
-
Icon2 && iconPosition === "left" && /* @__PURE__ */ (0,
|
|
7737
|
-
/* @__PURE__ */ (0,
|
|
7738
|
-
|
|
8016
|
+
/* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Divider, { className: classes.leftDivider }),
|
|
8017
|
+
/* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Button, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(import_material67.Box, { className: classes.center, children: [
|
|
8018
|
+
Icon2 && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } }),
|
|
8019
|
+
/* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
|
|
8020
|
+
import_material67.Typography,
|
|
7739
8021
|
{
|
|
7740
8022
|
color: "textSecondary",
|
|
7741
8023
|
className: classes.title,
|
|
@@ -7743,9 +8025,9 @@ var TextDivider = ({
|
|
|
7743
8025
|
children: title
|
|
7744
8026
|
}
|
|
7745
8027
|
),
|
|
7746
|
-
Icon2 && iconPosition === "right" && /* @__PURE__ */ (0,
|
|
8028
|
+
Icon2 && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } })
|
|
7747
8029
|
] }) }),
|
|
7748
|
-
/* @__PURE__ */ (0,
|
|
8030
|
+
/* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Divider, { className: classes.rightDivider })
|
|
7749
8031
|
]
|
|
7750
8032
|
}
|
|
7751
8033
|
);
|
|
@@ -7757,7 +8039,7 @@ var import_react_dates = require("react-dates");
|
|
|
7757
8039
|
var import_mui59 = require("tss-react/mui");
|
|
7758
8040
|
var import_initialize = require("react-dates/initialize");
|
|
7759
8041
|
var import_datepicker = require("react-dates/lib/css/_datepicker.css");
|
|
7760
|
-
var
|
|
8042
|
+
var import_jsx_runtime120 = require("react/jsx-runtime");
|
|
7761
8043
|
var useStyles53 = (0, import_mui59.makeStyles)()((theme) => ({
|
|
7762
8044
|
wrapper: {
|
|
7763
8045
|
"& .DateRangePicker": {
|
|
@@ -7853,15 +8135,15 @@ var ThemedDateRangePicker = ({
|
|
|
7853
8135
|
...props
|
|
7854
8136
|
}) => {
|
|
7855
8137
|
const { classes, cx } = useStyles53();
|
|
7856
|
-
return /* @__PURE__ */ (0,
|
|
8138
|
+
return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("div", { className: cx(classes.wrapper, className), children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_react_dates.DateRangePicker, { ...props }) });
|
|
7857
8139
|
};
|
|
7858
8140
|
var ThemedDateRangePicker_default = ThemedDateRangePicker;
|
|
7859
8141
|
|
|
7860
8142
|
// src/components/TheToolbar/TheToolbar.tsx
|
|
7861
|
-
var
|
|
7862
|
-
var
|
|
8143
|
+
var import_react39 = require("react");
|
|
8144
|
+
var import_material68 = require("@mui/material");
|
|
7863
8145
|
var import_mui60 = require("tss-react/mui");
|
|
7864
|
-
var
|
|
8146
|
+
var import_jsx_runtime121 = require("react/jsx-runtime");
|
|
7865
8147
|
var useStyles54 = (0, import_mui60.makeStyles)()((theme) => ({
|
|
7866
8148
|
menuButton: {
|
|
7867
8149
|
color: theme.palette.primary.contrastText
|
|
@@ -7881,9 +8163,9 @@ var TheToolbar = ({
|
|
|
7881
8163
|
rightSection
|
|
7882
8164
|
}) => {
|
|
7883
8165
|
const { classes } = useStyles54();
|
|
7884
|
-
return /* @__PURE__ */ (0,
|
|
7885
|
-
/* @__PURE__ */ (0,
|
|
7886
|
-
/* @__PURE__ */ (0,
|
|
8166
|
+
return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_material68.Box, { children: [
|
|
8167
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_material68.AppBar, { children: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_material68.Toolbar, { className: classes.topBar, children: [
|
|
8168
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
|
|
7887
8169
|
RoundButton_default,
|
|
7888
8170
|
{
|
|
7889
8171
|
className: classes.menuButton,
|
|
@@ -7892,7 +8174,7 @@ var TheToolbar = ({
|
|
|
7892
8174
|
onClick: handleOpen
|
|
7893
8175
|
}
|
|
7894
8176
|
),
|
|
7895
|
-
/* @__PURE__ */ (0,
|
|
8177
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
|
|
7896
8178
|
CompanyLogo_default,
|
|
7897
8179
|
{
|
|
7898
8180
|
size: "small",
|
|
@@ -7901,31 +8183,31 @@ var TheToolbar = ({
|
|
|
7901
8183
|
imageLogoLightSmall
|
|
7902
8184
|
}
|
|
7903
8185
|
),
|
|
7904
|
-
/* @__PURE__ */ (0,
|
|
7905
|
-
/* @__PURE__ */ (0,
|
|
8186
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_material68.Box, { ml: 2, children: leftSection }),
|
|
8187
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_material68.Box, { ml: "auto", children: rightSection })
|
|
7906
8188
|
] }) }),
|
|
7907
8189
|
LeftDrawer
|
|
7908
8190
|
] });
|
|
7909
8191
|
};
|
|
7910
|
-
var TheToolbar_default = (0,
|
|
8192
|
+
var TheToolbar_default = (0, import_react39.memo)(TheToolbar);
|
|
7911
8193
|
|
|
7912
8194
|
// src/components/ToastMessage/ToastMessage.tsx
|
|
7913
|
-
var
|
|
7914
|
-
var
|
|
8195
|
+
var import_material69 = require("@mui/material");
|
|
8196
|
+
var import_jsx_runtime122 = require("react/jsx-runtime");
|
|
7915
8197
|
var ToastMessage = ({
|
|
7916
8198
|
toastType,
|
|
7917
8199
|
toastMessage,
|
|
7918
8200
|
open,
|
|
7919
8201
|
onClose
|
|
7920
|
-
}) => /* @__PURE__ */ (0,
|
|
7921
|
-
|
|
8202
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
|
|
8203
|
+
import_material69.Snackbar,
|
|
7922
8204
|
{
|
|
7923
8205
|
open,
|
|
7924
8206
|
autoHideDuration: 1500,
|
|
7925
8207
|
onClose,
|
|
7926
8208
|
anchorOrigin: { vertical: "top", horizontal: "right" },
|
|
7927
|
-
children: /* @__PURE__ */ (0,
|
|
7928
|
-
|
|
8209
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
|
|
8210
|
+
import_material69.Alert,
|
|
7929
8211
|
{
|
|
7930
8212
|
elevation: 6,
|
|
7931
8213
|
variant: "filled",
|
|
@@ -7951,9 +8233,9 @@ var ToastMessage = ({
|
|
|
7951
8233
|
var ToastMessage_default = ToastMessage;
|
|
7952
8234
|
|
|
7953
8235
|
// src/components/TwoButtonDialog/TwoButtonDialog.tsx
|
|
7954
|
-
var
|
|
8236
|
+
var import_material70 = require("@mui/material");
|
|
7955
8237
|
var import_mui61 = require("tss-react/mui");
|
|
7956
|
-
var
|
|
8238
|
+
var import_jsx_runtime123 = require("react/jsx-runtime");
|
|
7957
8239
|
var useStyles55 = (0, import_mui61.makeStyles)()((theme) => ({
|
|
7958
8240
|
paper: {
|
|
7959
8241
|
padding: theme.spacing(2)
|
|
@@ -7983,20 +8265,20 @@ var TwoButtonDialog = ({
|
|
|
7983
8265
|
cancelButton
|
|
7984
8266
|
}) => {
|
|
7985
8267
|
const { classes } = useStyles55();
|
|
7986
|
-
return /* @__PURE__ */ (0,
|
|
7987
|
-
|
|
8268
|
+
return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
8269
|
+
import_material70.Dialog,
|
|
7988
8270
|
{
|
|
7989
8271
|
open,
|
|
7990
8272
|
disableEnforceFocus: true,
|
|
7991
8273
|
maxWidth: "sm",
|
|
7992
8274
|
fullWidth: true,
|
|
7993
8275
|
closeAfterTransition: true,
|
|
7994
|
-
BackdropComponent:
|
|
8276
|
+
BackdropComponent: import_material70.Backdrop,
|
|
7995
8277
|
BackdropProps: { timeout: 500 },
|
|
7996
|
-
children: /* @__PURE__ */ (0,
|
|
7997
|
-
/* @__PURE__ */ (0,
|
|
7998
|
-
/* @__PURE__ */ (0,
|
|
7999
|
-
|
|
8278
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Fade, { in: open, children: /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_material70.Paper, { className: classes.paper, children: [
|
|
8279
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_material70.Box, { className: classes.mb, children: [
|
|
8280
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Typography, { variant: "h5", component: "div", children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
8281
|
+
import_material70.Box,
|
|
8000
8282
|
{
|
|
8001
8283
|
sx: {
|
|
8002
8284
|
fontWeight: 600
|
|
@@ -8004,23 +8286,23 @@ var TwoButtonDialog = ({
|
|
|
8004
8286
|
children: title
|
|
8005
8287
|
}
|
|
8006
8288
|
) }),
|
|
8007
|
-
/* @__PURE__ */ (0,
|
|
8008
|
-
|
|
8289
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(
|
|
8290
|
+
import_material70.Box,
|
|
8009
8291
|
{
|
|
8010
8292
|
className: classes.mt,
|
|
8011
8293
|
sx: {
|
|
8012
8294
|
fontWeight: 600
|
|
8013
8295
|
},
|
|
8014
8296
|
children: [
|
|
8015
|
-
subtitle1 && /* @__PURE__ */ (0,
|
|
8016
|
-
subtitle2 && /* @__PURE__ */ (0,
|
|
8297
|
+
subtitle1 && /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Typography, { variant: "subtitle1", children: subtitle1 }),
|
|
8298
|
+
subtitle2 && /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Typography, { variant: "subtitle1", children: subtitle2 })
|
|
8017
8299
|
]
|
|
8018
8300
|
}
|
|
8019
8301
|
)
|
|
8020
8302
|
] }),
|
|
8021
|
-
/* @__PURE__ */ (0,
|
|
8022
|
-
/* @__PURE__ */ (0,
|
|
8023
|
-
/* @__PURE__ */ (0,
|
|
8303
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Divider, {}),
|
|
8304
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_material70.Box, { className: classes.buttonContainer, children: [
|
|
8305
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
8024
8306
|
FilledButton_default,
|
|
8025
8307
|
{
|
|
8026
8308
|
copy: cancelLabel,
|
|
@@ -8033,7 +8315,7 @@ var TwoButtonDialog = ({
|
|
|
8033
8315
|
}
|
|
8034
8316
|
}
|
|
8035
8317
|
),
|
|
8036
|
-
/* @__PURE__ */ (0,
|
|
8318
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
8037
8319
|
FilledButton_default,
|
|
8038
8320
|
{
|
|
8039
8321
|
color: "primary",
|
|
@@ -8042,7 +8324,7 @@ var TwoButtonDialog = ({
|
|
|
8042
8324
|
}
|
|
8043
8325
|
)
|
|
8044
8326
|
] }),
|
|
8045
|
-
/* @__PURE__ */ (0,
|
|
8327
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Loading_default, { isLoading: dialogLoading })
|
|
8046
8328
|
] }) })
|
|
8047
8329
|
}
|
|
8048
8330
|
);
|
|
@@ -8050,30 +8332,30 @@ var TwoButtonDialog = ({
|
|
|
8050
8332
|
var TwoButtonDialog_default = TwoButtonDialog;
|
|
8051
8333
|
|
|
8052
8334
|
// src/components/UserBust/UserBust.tsx
|
|
8053
|
-
var
|
|
8054
|
-
var
|
|
8055
|
-
var
|
|
8056
|
-
var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ (0,
|
|
8057
|
-
/* @__PURE__ */ (0,
|
|
8058
|
-
|
|
8335
|
+
var import_react40 = require("react");
|
|
8336
|
+
var import_material71 = require("@mui/material");
|
|
8337
|
+
var import_jsx_runtime124 = require("react/jsx-runtime");
|
|
8338
|
+
var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { children: [
|
|
8339
|
+
/* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
|
|
8340
|
+
import_material71.Avatar,
|
|
8059
8341
|
{
|
|
8060
8342
|
src: user.profile_picture,
|
|
8061
8343
|
alt: "user_avatar",
|
|
8062
8344
|
style: { width: avatarProps.width, height: avatarProps.height }
|
|
8063
8345
|
}
|
|
8064
8346
|
),
|
|
8065
|
-
/* @__PURE__ */ (0,
|
|
8066
|
-
/* @__PURE__ */ (0,
|
|
8067
|
-
/* @__PURE__ */ (0,
|
|
8347
|
+
/* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { style: { paddingTop: 16 }, children: [
|
|
8348
|
+
/* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_material71.Typography, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
|
|
8349
|
+
/* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_material71.Typography, { ...typographyProps.username, children: user.username })
|
|
8068
8350
|
] })
|
|
8069
8351
|
] });
|
|
8070
|
-
var UserBust_default = (0,
|
|
8352
|
+
var UserBust_default = (0, import_react40.memo)(UserBust);
|
|
8071
8353
|
|
|
8072
8354
|
// src/components/icons/IconChart.tsx
|
|
8073
|
-
var
|
|
8355
|
+
var import_jsx_runtime125 = require("react/jsx-runtime");
|
|
8074
8356
|
var SvgIconChart = (props) => {
|
|
8075
8357
|
const { fill } = props;
|
|
8076
|
-
return /* @__PURE__ */ (0,
|
|
8358
|
+
return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
|
|
8077
8359
|
"svg",
|
|
8078
8360
|
{
|
|
8079
8361
|
width: "20",
|
|
@@ -8082,7 +8364,7 @@ var SvgIconChart = (props) => {
|
|
|
8082
8364
|
fill: "none",
|
|
8083
8365
|
xmlns: "http://www.w3.org/2000/svg",
|
|
8084
8366
|
...props,
|
|
8085
|
-
children: /* @__PURE__ */ (0,
|
|
8367
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
|
|
8086
8368
|
"path",
|
|
8087
8369
|
{
|
|
8088
8370
|
d: "M2.49967 11.6667L2.91634 11.725L6.72467 7.91667C6.57467 7.375 6.71634 6.75833 7.15801 6.325C7.80801 5.66667 8.85801 5.66667 9.50801 6.325C9.94967 6.75833 10.0913 7.375 9.94134 7.91667L12.083 10.0583L12.4997 10C12.6497 10 12.7913 10 12.9163 10.0583L15.8913 7.08333C15.833 6.95833 15.833 6.81667 15.833 6.66667C15.833 6.22464 16.0086 5.80072 16.3212 5.48816C16.6337 5.17559 17.0576 5 17.4997 5C17.9417 5 18.3656 5.17559 18.6782 5.48816C18.9907 5.80072 19.1663 6.22464 19.1663 6.66667C19.1663 7.10869 18.9907 7.53262 18.6782 7.84518C18.3656 8.15774 17.9417 8.33333 17.4997 8.33333C17.3497 8.33333 17.208 8.33333 17.083 8.275L14.108 11.25C14.1663 11.375 14.1663 11.5167 14.1663 11.6667C14.1663 12.1087 13.9907 12.5326 13.6782 12.8452C13.3656 13.1577 12.9417 13.3333 12.4997 13.3333C12.0576 13.3333 11.6337 13.1577 11.3212 12.8452C11.0086 12.5326 10.833 12.1087 10.833 11.6667L10.8913 11.25L8.74967 9.10833C8.48301 9.16667 8.18301 9.16667 7.91634 9.10833L4.10801 12.9167L4.16634 13.3333C4.16634 13.7754 3.99075 14.1993 3.67819 14.5118C3.36563 14.8244 2.9417 15 2.49967 15C2.05765 15 1.63372 14.8244 1.32116 14.5118C1.0086 14.1993 0.833008 13.7754 0.833008 13.3333C0.833008 12.8913 1.0086 12.4674 1.32116 12.1548C1.63372 11.8423 2.05765 11.6667 2.49967 11.6667Z",
|
|
@@ -8149,6 +8431,7 @@ var IconChart_default = SvgIconChart;
|
|
|
8149
8431
|
ScrollableDialog,
|
|
8150
8432
|
SearchAndFilterHeader,
|
|
8151
8433
|
SearchAndFilterHeaderForTable,
|
|
8434
|
+
SearchFieldDebounced,
|
|
8152
8435
|
SearchWithFilters,
|
|
8153
8436
|
SearchWithFiltersForTable,
|
|
8154
8437
|
SectionName,
|
|
@@ -8160,6 +8443,9 @@ var IconChart_default = SvgIconChart;
|
|
|
8160
8443
|
Switch,
|
|
8161
8444
|
Table,
|
|
8162
8445
|
TableDesktop,
|
|
8446
|
+
TableDesktopRowActions,
|
|
8447
|
+
TableDesktopRowCell,
|
|
8448
|
+
TableDesktopSmartSelect,
|
|
8163
8449
|
TableEmptyResult,
|
|
8164
8450
|
TableHeader,
|
|
8165
8451
|
TableLoading,
|