sccoreui 5.7.23 → 5.8.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/ag-grid/MyProvider.js +58 -0
- package/dist/components/ag-grid/ParentForGrid.js +111 -32
- package/dist/components/ag-grid/Types.js +0 -8
- package/dist/components/ag-grid/advancedFeature/advanced-feature.js +6 -2
- package/dist/components/ag-grid/advancedFeature/custom-sort.js +4 -6
- package/dist/components/ag-grid/advancedFeature/filter/filter.js +35 -18
- package/dist/components/ag-grid/advancedFeature/filter/querty.js +35 -17
- package/dist/components/ag-grid/advancedFeature/global-search.js +4 -2
- package/dist/components/ag-grid/advancedFeature/record-detail.js +5 -2
- package/dist/components/ag-grid/advancedFeature/refresh-grid.js +10 -0
- package/dist/components/ag-grid/error-ui.js +1 -1
- package/dist/components/ag-grid/grid-checkbox.js +8 -0
- package/dist/types/components/ag-grid/MyProvider.d.ts +14 -0
- package/dist/types/components/ag-grid/Types.d.ts +32 -6
- package/dist/types/components/ag-grid/advancedFeature/advanced-feature.d.ts +1 -5
- package/dist/types/components/ag-grid/advancedFeature/custom-sort.d.ts +1 -6
- package/dist/types/components/ag-grid/advancedFeature/filter/filter.d.ts +1 -5
- package/dist/types/components/ag-grid/advancedFeature/filter/querty.d.ts +4 -2
- package/dist/types/components/ag-grid/advancedFeature/global-search.d.ts +1 -3
- package/dist/types/components/ag-grid/advancedFeature/record-detail.d.ts +1 -3
- package/dist/types/components/ag-grid/advancedFeature/refresh-grid.d.ts +2 -0
- package/dist/types/components/ag-grid/grid-checkbox.d.ts +8 -0
- package/package.json +1 -1
- package/dist/App copy.scss +0 -917
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.FeatureContext = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const react_1 = require("react");
|
|
6
|
+
exports.FeatureContext = (0, react_1.createContext)(null);
|
|
7
|
+
function MyProvider({ children, value }) {
|
|
8
|
+
const { featureDetails, setFeatureDetails, gridData, callGrid, totalRecords } = value;
|
|
9
|
+
// States for sort
|
|
10
|
+
const [columnData] = (0, react_1.useState)(gridData === null || gridData === void 0 ? void 0 : gridData.columnData);
|
|
11
|
+
const [sortValue, setSortValue] = (0, react_1.useState)({});
|
|
12
|
+
const [sortBy, setSortBy] = (0, react_1.useState)({});
|
|
13
|
+
const [isOverlayOpened, setIsOverlayOpened] = (0, react_1.useState)(false);
|
|
14
|
+
// States for filter
|
|
15
|
+
const [queries, setQueries] = (0, react_1.useState)(() => {
|
|
16
|
+
var _a;
|
|
17
|
+
const length = ((_a = featureDetails === null || featureDetails === void 0 ? void 0 : featureDetails.filterQueries) === null || _a === void 0 ? void 0 : _a.length) || 0;
|
|
18
|
+
// Returns based on length of filterQueries present
|
|
19
|
+
return length === 0 ? [0] : Array.from({ length }, (_, index) => index);
|
|
20
|
+
});
|
|
21
|
+
// Function call on click to
|
|
22
|
+
const removeFeaturesAndRefresh = () => {
|
|
23
|
+
const emptyFeatures = {
|
|
24
|
+
searchedText: "",
|
|
25
|
+
filterQueries: [],
|
|
26
|
+
sort: {
|
|
27
|
+
isSortable: false,
|
|
28
|
+
columnToSort: {},
|
|
29
|
+
orderToSort: {},
|
|
30
|
+
},
|
|
31
|
+
};
|
|
32
|
+
// Remove stored features
|
|
33
|
+
setFeatureDetails(emptyFeatures);
|
|
34
|
+
// Remove filter
|
|
35
|
+
setQueries([0]);
|
|
36
|
+
// Remove sort
|
|
37
|
+
setSortBy({});
|
|
38
|
+
setSortValue({});
|
|
39
|
+
callGrid(emptyFeatures);
|
|
40
|
+
};
|
|
41
|
+
return ((0, jsx_runtime_1.jsx)(exports.FeatureContext.Provider, Object.assign({ value: {
|
|
42
|
+
sortValue,
|
|
43
|
+
setSortValue,
|
|
44
|
+
sortBy,
|
|
45
|
+
setSortBy,
|
|
46
|
+
isOverlayOpened,
|
|
47
|
+
setIsOverlayOpened,
|
|
48
|
+
queries,
|
|
49
|
+
setQueries,
|
|
50
|
+
featureDetails,
|
|
51
|
+
setFeatureDetails,
|
|
52
|
+
columnData,
|
|
53
|
+
callGrid,
|
|
54
|
+
removeFeaturesAndRefresh,
|
|
55
|
+
totalRecords
|
|
56
|
+
} }, { children: children })));
|
|
57
|
+
}
|
|
58
|
+
exports.default = MyProvider;
|
|
@@ -5,32 +5,39 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const AgGrid_1 = tslib_1.__importDefault(require("./AgGrid"));
|
|
7
7
|
const advanced_feature_1 = tslib_1.__importDefault(require("./advancedFeature/advanced-feature"));
|
|
8
|
-
|
|
8
|
+
const grid_checkbox_1 = tslib_1.__importDefault(require("./grid-checkbox"));
|
|
9
|
+
const MyProvider_1 = tslib_1.__importDefault(require("./MyProvider"));
|
|
10
|
+
const error_ui_1 = tslib_1.__importDefault(require("./error-ui"));
|
|
9
11
|
function ParentForGrid(props) {
|
|
10
|
-
const [gridData] = (0, react_1.useState)({
|
|
11
|
-
rowData:
|
|
12
|
+
const [gridData, setGridData] = (0, react_1.useState)({
|
|
13
|
+
rowData: [],
|
|
12
14
|
columnData: props === null || props === void 0 ? void 0 : props.columnData,
|
|
13
15
|
});
|
|
14
|
-
console.log(props, 'pros in parent');
|
|
15
16
|
const [style] = (0, react_1.useState)(props.style);
|
|
16
17
|
const [api, setApi] = (0, react_1.useState)(null);
|
|
18
|
+
const [totalRecords, setTotalRecords] = (0, react_1.useState)(0);
|
|
17
19
|
const [gridReadyEvent, setGridReadyEvent] = (0, react_1.useState)();
|
|
18
|
-
const [
|
|
19
|
-
|
|
20
|
+
const [emptyResponse] = (0, react_1.useState)({
|
|
21
|
+
totalRecords: 0,
|
|
22
|
+
rowData: [],
|
|
23
|
+
});
|
|
20
24
|
const [isLoading, setIsLoading] = (0, react_1.useState)(false);
|
|
25
|
+
const [checkBoxSelection, setCheckBoxSelection] = (0, react_1.useState)({
|
|
26
|
+
allBoxChecked: false,
|
|
27
|
+
isInterminate: false,
|
|
28
|
+
selectedCheckboxData: [],
|
|
29
|
+
unselectedCheckboxData: [],
|
|
30
|
+
});
|
|
21
31
|
const [featureDetails, setFeatureDetails] = (0, react_1.useState)({
|
|
22
32
|
searchedText: "",
|
|
23
33
|
filterQueries: [],
|
|
24
34
|
sort: {
|
|
25
35
|
isSortable: false,
|
|
26
36
|
columnToSort: {},
|
|
27
|
-
orderToSort: {}
|
|
28
|
-
}
|
|
29
|
-
// bulkAction: {
|
|
30
|
-
// columnData: {},
|
|
31
|
-
// updatedValue: "",
|
|
32
|
-
// },
|
|
37
|
+
orderToSort: {},
|
|
38
|
+
},
|
|
33
39
|
});
|
|
40
|
+
// Default column specification
|
|
34
41
|
const defaultColDef = (0, react_1.useMemo)(() => {
|
|
35
42
|
return {
|
|
36
43
|
flex: 1,
|
|
@@ -40,33 +47,80 @@ function ParentForGrid(props) {
|
|
|
40
47
|
sortable: false,
|
|
41
48
|
};
|
|
42
49
|
}, []);
|
|
50
|
+
// Function to handle checkbox click events
|
|
51
|
+
const handleCheckboxClick = (rowData) => {
|
|
52
|
+
const { unselectedCheckboxData, selectedCheckboxData, allBoxChecked } = checkBoxSelection;
|
|
53
|
+
if (allBoxChecked && unselectedCheckboxData.includes(rowData)) {
|
|
54
|
+
setCheckBoxSelection(Object.assign(Object.assign({}, checkBoxSelection), { unselectedCheckboxData: unselectedCheckboxData.filter((item) => item !== rowData) }));
|
|
55
|
+
return;
|
|
56
|
+
}
|
|
57
|
+
else if (allBoxChecked) {
|
|
58
|
+
setCheckBoxSelection(Object.assign(Object.assign({}, checkBoxSelection), { unselectedCheckboxData: [...unselectedCheckboxData, rowData], isInterminate: true }));
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
// Logic to handle checkbox click events
|
|
62
|
+
if (selectedCheckboxData.includes(rowData)) {
|
|
63
|
+
setCheckBoxSelection(Object.assign(Object.assign({}, checkBoxSelection), { selectedCheckboxData: selectedCheckboxData.filter((item) => item !== rowData) }));
|
|
64
|
+
}
|
|
65
|
+
else {
|
|
66
|
+
setCheckBoxSelection(Object.assign(Object.assign({}, checkBoxSelection), { selectedCheckboxData: [...selectedCheckboxData, rowData] }));
|
|
67
|
+
}
|
|
68
|
+
};
|
|
69
|
+
const handleHeaderCheckbox = () => {
|
|
70
|
+
const { allBoxChecked } = checkBoxSelection;
|
|
71
|
+
setCheckBoxSelection(Object.assign(Object.assign({}, checkBoxSelection), { allBoxChecked: !allBoxChecked, isInterminate: false, selectedCheckboxData: [], unselectedCheckboxData: [] }));
|
|
72
|
+
};
|
|
73
|
+
// JSX for rendering checkbox in header
|
|
74
|
+
const headerCheckBoxRenderer = (params) => {
|
|
75
|
+
const displayName = params === null || params === void 0 ? void 0 : params.displayName;
|
|
76
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex" }, { children: [(0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: checkBoxSelection.allBoxChecked, onChange: handleHeaderCheckbox, isInterminate: checkBoxSelection.isInterminate }), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "px-3" }, { children: displayName }))] })));
|
|
77
|
+
};
|
|
78
|
+
// JSX for rendering checkbox in cells
|
|
79
|
+
const cellCheckBoxRenderer = (params) => {
|
|
80
|
+
const { data } = params;
|
|
81
|
+
const { allBoxChecked, unselectedCheckboxData, selectedCheckboxData } = checkBoxSelection;
|
|
82
|
+
return ((0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: allBoxChecked
|
|
83
|
+
? !unselectedCheckboxData.includes(data)
|
|
84
|
+
: selectedCheckboxData.includes(data), onChange: () => handleCheckboxClick(data), isInterminate: false }));
|
|
85
|
+
};
|
|
86
|
+
// Render checkbox as well as initial component/data from props
|
|
87
|
+
const dataCellRenderer = (cellRendererParams, column) => {
|
|
88
|
+
var _a;
|
|
89
|
+
const { initialRenderer, cellCheckBoxRenderer } = cellRendererParams;
|
|
90
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "pr-3" }, { children: cellCheckBoxRenderer(cellRendererParams) })), typeof initialRenderer === "function" ? (initialRenderer(cellRendererParams)) : ((0, jsx_runtime_1.jsx)("div", { children: (_a = cellRendererParams === null || cellRendererParams === void 0 ? void 0 : cellRendererParams.data) === null || _a === void 0 ? void 0 : _a[column === null || column === void 0 ? void 0 : column.field] }))] })));
|
|
91
|
+
};
|
|
43
92
|
// Callback to products for getting data
|
|
44
|
-
const getData = (startRow, endRow) => tslib_1.__awaiter(this, void 0, void 0, function* () {
|
|
93
|
+
const getData = (startRow, endRow, currentFeatures) => tslib_1.__awaiter(this, void 0, void 0, function* () {
|
|
45
94
|
var _a, _b;
|
|
46
95
|
if (!(props === null || props === void 0 ? void 0 : props.getRowData)) {
|
|
47
96
|
return emptyResponse; // If callback function to get row data is not provided
|
|
48
97
|
}
|
|
49
|
-
const response = yield props.getRowData(startRow, endRow,
|
|
98
|
+
const response = yield props.getRowData(startRow, endRow, currentFeatures);
|
|
50
99
|
// To identify when to stop the callBack
|
|
51
100
|
const actualEndRow = startRow + ((_b = (_a = response === null || response === void 0 ? void 0 : response.rowData) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0);
|
|
52
101
|
if (response === null || response === void 0 ? void 0 : response.rowData) {
|
|
102
|
+
setTotalRecords(response === null || response === void 0 ? void 0 : response.totalRecords);
|
|
103
|
+
setGridData((prevState) => (Object.assign(Object.assign({}, prevState), { rowData: [...(prevState.rowData || []), ...response.rowData] })));
|
|
53
104
|
response.actualEndRow = actualEndRow;
|
|
54
105
|
return response;
|
|
55
106
|
}
|
|
56
107
|
return emptyResponse;
|
|
57
108
|
});
|
|
58
109
|
// Gets call onLoad,scroll and whenever any featureDetails changed
|
|
59
|
-
const onGridReady = (params) => {
|
|
110
|
+
const onGridReady = (params, updatedFeatures) => {
|
|
60
111
|
setIsLoading(true);
|
|
61
112
|
setApi(params.api);
|
|
62
113
|
setGridReadyEvent(params);
|
|
114
|
+
let currentFeatures = updatedFeatures;
|
|
115
|
+
if (!updatedFeatures) {
|
|
116
|
+
currentFeatures = featureDetails;
|
|
117
|
+
}
|
|
63
118
|
const dataSource = {
|
|
64
119
|
getRows: (params) => tslib_1.__awaiter(this, void 0, void 0, function* () {
|
|
65
120
|
var _a;
|
|
66
121
|
const startRow = params.startRow;
|
|
67
122
|
const endRow = params.endRow;
|
|
68
|
-
const result = yield getData(startRow, endRow);
|
|
69
|
-
console.log(result, 'result from call back');
|
|
123
|
+
const result = yield getData(startRow, endRow, currentFeatures);
|
|
70
124
|
if (((_a = result === null || result === void 0 ? void 0 : result.rowData) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
71
125
|
params.successCallback(result === null || result === void 0 ? void 0 : result.rowData, result === null || result === void 0 ? void 0 : result.actualEndRow);
|
|
72
126
|
}
|
|
@@ -78,38 +132,63 @@ function ParentForGrid(props) {
|
|
|
78
132
|
params.api.setGridOption("datasource", dataSource);
|
|
79
133
|
setIsLoading(false);
|
|
80
134
|
};
|
|
81
|
-
// Get
|
|
82
|
-
const
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
console.log(selectedData, "selected from checkbox"); // Send a callback to products
|
|
89
|
-
}
|
|
135
|
+
// Get values when cell edited
|
|
136
|
+
const getEditedColumn = (params) => {
|
|
137
|
+
var _a;
|
|
138
|
+
console.log(params, 'edited column');
|
|
139
|
+
const editedColumn = (_a = params === null || params === void 0 ? void 0 : params.colDef) === null || _a === void 0 ? void 0 : _a.field;
|
|
140
|
+
const editedRow = params === null || params === void 0 ? void 0 : params.data;
|
|
141
|
+
console.log(editedRow, editedColumn, 'edited row ');
|
|
90
142
|
};
|
|
91
143
|
// Options that grid should have
|
|
92
144
|
const gridOptions = {
|
|
93
|
-
columnDefs: gridData.columnData
|
|
145
|
+
columnDefs: gridData.columnData.map((column) => {
|
|
146
|
+
if (column.enableChildCheckbox && column.enableHeaderCheckbox) {
|
|
147
|
+
return Object.assign(Object.assign({}, column), { headerComponent: (params) => headerCheckBoxRenderer(params), cellRenderer: (params) => dataCellRenderer(params, column), cellRendererParams: {
|
|
148
|
+
initialRenderer: (column === null || column === void 0 ? void 0 : column.cellRenderer) ? column === null || column === void 0 ? void 0 : column.cellRenderer : null,
|
|
149
|
+
cellCheckBoxRenderer: cellCheckBoxRenderer,
|
|
150
|
+
} });
|
|
151
|
+
}
|
|
152
|
+
else {
|
|
153
|
+
return column;
|
|
154
|
+
}
|
|
155
|
+
}),
|
|
94
156
|
// rowData: gridData.rowData, // Passing row data
|
|
95
157
|
defaultColDef: defaultColDef,
|
|
96
158
|
enableRangeSelection: true,
|
|
97
159
|
suppressMenuHide: false,
|
|
98
|
-
|
|
160
|
+
onCellValueChanged: getEditedColumn,
|
|
99
161
|
rowSelection: "multiple",
|
|
100
162
|
suppressRowClickSelection: true,
|
|
101
163
|
rowHeight: 60,
|
|
102
164
|
rowModelType: "infinite", // Infinite scroll
|
|
103
165
|
};
|
|
104
166
|
// Fucntion to call the grid
|
|
105
|
-
const callGrid = () => {
|
|
106
|
-
onGridReady(gridReadyEvent);
|
|
167
|
+
const callGrid = (featureDetails) => {
|
|
168
|
+
onGridReady(gridReadyEvent, featureDetails);
|
|
107
169
|
};
|
|
170
|
+
// Call Grid if something is searched
|
|
108
171
|
(0, react_1.useEffect)(() => {
|
|
109
172
|
if (api && gridReadyEvent) {
|
|
110
|
-
callGrid();
|
|
173
|
+
callGrid(featureDetails);
|
|
111
174
|
}
|
|
112
175
|
}, [featureDetails.searchedText]);
|
|
113
|
-
|
|
176
|
+
// Remove all checkbox selection if any feature added
|
|
177
|
+
(0, react_1.useEffect)(() => {
|
|
178
|
+
setCheckBoxSelection({
|
|
179
|
+
allBoxChecked: false,
|
|
180
|
+
isInterminate: false,
|
|
181
|
+
selectedCheckboxData: [],
|
|
182
|
+
unselectedCheckboxData: [],
|
|
183
|
+
});
|
|
184
|
+
}, [featureDetails]);
|
|
185
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(error_ui_1.default, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ style: { height: style.height, width: style.width } }, { children: !isLoading ? ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(MyProvider_1.default, Object.assign({ value: {
|
|
186
|
+
featureDetails,
|
|
187
|
+
setFeatureDetails,
|
|
188
|
+
gridData,
|
|
189
|
+
callGrid,
|
|
190
|
+
totalRecords
|
|
191
|
+
} }, { children: (0, jsx_runtime_1.jsx)(advanced_feature_1.default, { props: props }) })), (0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: style, gridOptions: gridOptions, onGridReady: onGridReady })] })) : ((0, jsx_runtime_1.jsx)("p", { children: "Loading..." }) //Add skeleton
|
|
192
|
+
) })) }) }));
|
|
114
193
|
}
|
|
115
194
|
exports.default = ParentForGrid;
|
|
@@ -1,14 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.ATTRIBUTEDATATYPES = void 0;
|
|
4
|
-
// enum columnDatatype {
|
|
5
|
-
// STRING=0,
|
|
6
|
-
// NUMBER=1,
|
|
7
|
-
// BOOLEAN=2,
|
|
8
|
-
// SELECT=4,
|
|
9
|
-
// CHECKBOX=5,
|
|
10
|
-
// MULTISELECT=6
|
|
11
|
-
// }
|
|
12
4
|
var ATTRIBUTEDATATYPES;
|
|
13
5
|
(function (ATTRIBUTEDATATYPES) {
|
|
14
6
|
ATTRIBUTEDATATYPES["STRING"] = "string";
|
|
@@ -6,7 +6,11 @@ const global_search_1 = tslib_1.__importDefault(require("./global-search"));
|
|
|
6
6
|
const custom_sort_1 = tslib_1.__importDefault(require("./custom-sort"));
|
|
7
7
|
const record_detail_1 = tslib_1.__importDefault(require("./record-detail"));
|
|
8
8
|
const filter_1 = tslib_1.__importDefault(require("./filter/filter"));
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
const refresh_grid_1 = tslib_1.__importDefault(require("./refresh-grid"));
|
|
10
|
+
// import { ConditionsToDisplay } from "../Types"
|
|
11
|
+
function AdvancedFeatures({ props }) {
|
|
12
|
+
const conditionsToDisplay = props === null || props === void 0 ? void 0 : props.conditionsToDisplay;
|
|
13
|
+
// const {displayFilter,displaySearch,displayRefresh,displaySort} = conditionsToDisplay
|
|
14
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && (0, jsx_runtime_1.jsx)(global_search_1.default, { searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder }), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayFilter) && (0, jsx_runtime_1.jsx)(filter_1.default, { callBackForSelect: props === null || props === void 0 ? void 0 : props.myInputData })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex " }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRefresh) && (0, jsx_runtime_1.jsx)(refresh_grid_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySort) && (0, jsx_runtime_1.jsx)(custom_sort_1.default, {}), (0, jsx_runtime_1.jsx)(record_detail_1.default, {})] }))] })));
|
|
11
15
|
}
|
|
12
16
|
exports.default = AdvancedFeatures;
|
|
@@ -9,11 +9,10 @@ const radiobutton_1 = require("primereact/radiobutton");
|
|
|
9
9
|
const button_1 = require("primereact/button");
|
|
10
10
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
11
11
|
const constants_1 = require("../constants");
|
|
12
|
-
|
|
12
|
+
const MyProvider_1 = require("../MyProvider");
|
|
13
|
+
function Sort() {
|
|
13
14
|
var _a;
|
|
14
|
-
const
|
|
15
|
-
const [sortBy, setSortBy] = (0, react_1.useState)({});
|
|
16
|
-
const [isOverlayOpened, setIsOverlayOpened] = (0, react_1.useState)(false);
|
|
15
|
+
const { sortValue, setSortValue, sortBy, setSortBy, isOverlayOpened, setIsOverlayOpened, featureDetails, setFeatureDetails, callGrid, columnData } = (0, react_1.useContext)(MyProvider_1.FeatureContext);
|
|
17
16
|
const showShort = (0, react_1.useRef)(null);
|
|
18
17
|
const shortType = sortValue === null || sortValue === void 0 ? void 0 : sortValue.dataType;
|
|
19
18
|
const disableApply = (sortBy && sortValue) === null;
|
|
@@ -33,7 +32,6 @@ function Sort({ columnData, featureDetails, setFeatureDetails, callGrid }) {
|
|
|
33
32
|
}
|
|
34
33
|
addSortDetails(sortDetails);
|
|
35
34
|
setSortValue(eachColumn);
|
|
36
|
-
// setSortBy();
|
|
37
35
|
}
|
|
38
36
|
};
|
|
39
37
|
const onSelectSortType = (column) => {
|
|
@@ -59,7 +57,7 @@ function Sort({ columnData, featureDetails, setFeatureDetails, callGrid }) {
|
|
|
59
57
|
};
|
|
60
58
|
// Trigger action to apply
|
|
61
59
|
const applyTableSort = (e) => {
|
|
62
|
-
callGrid();
|
|
60
|
+
callGrid(featureDetails);
|
|
63
61
|
onClickSort(e);
|
|
64
62
|
// clearSort(e)
|
|
65
63
|
};
|
|
@@ -7,10 +7,11 @@ const svg_component_1 = tslib_1.__importDefault(require("../../../../directives/
|
|
|
7
7
|
const react_1 = require("react");
|
|
8
8
|
const overlaypanel_1 = require("primereact/overlaypanel");
|
|
9
9
|
const querty_1 = tslib_1.__importDefault(require("./querty"));
|
|
10
|
-
|
|
10
|
+
const MyProvider_1 = require("../../MyProvider");
|
|
11
|
+
function FilterParent({ callBackForSelect }) {
|
|
12
|
+
var _a;
|
|
11
13
|
const filterRef = (0, react_1.useRef)(null);
|
|
12
|
-
const
|
|
13
|
-
const [queries, setQueries] = (0, react_1.useState)([0]);
|
|
14
|
+
const { columnData, featureDetails, setFeatureDetails, callGrid, queries, setQueries } = (0, react_1.useContext)(MyProvider_1.FeatureContext);
|
|
14
15
|
// Filter header
|
|
15
16
|
const BulkActionHeader = (props) => {
|
|
16
17
|
const { header: { label, description }, } = props;
|
|
@@ -23,15 +24,16 @@ function FilterParent({ columnData, featureDetails, setFeatureDetails, callBackF
|
|
|
23
24
|
};
|
|
24
25
|
// Reset saved filters
|
|
25
26
|
const resettingFilters = () => {
|
|
26
|
-
emptyFilterQuries();
|
|
27
27
|
filterRef.current.toggle(false);
|
|
28
|
-
setQueryCount(1)
|
|
28
|
+
// setQueryCount(1)
|
|
29
|
+
setQueries([0]);
|
|
30
|
+
emptyFilterQuries();
|
|
29
31
|
};
|
|
30
32
|
// Toggle the pop display
|
|
31
33
|
const togglePopup = (e) => {
|
|
32
34
|
var _a;
|
|
33
35
|
(_a = filterRef.current) === null || _a === void 0 ? void 0 : _a.toggle(e);
|
|
34
|
-
setQueryCount(1)
|
|
36
|
+
// setQueryCount(1)
|
|
35
37
|
};
|
|
36
38
|
// Empty filterQuries
|
|
37
39
|
const emptyFilterQuries = () => {
|
|
@@ -39,33 +41,48 @@ function FilterParent({ columnData, featureDetails, setFeatureDetails, callBackF
|
|
|
39
41
|
};
|
|
40
42
|
// OnClick to +
|
|
41
43
|
const actionOnPlus = () => {
|
|
42
|
-
setQueryCount((prevCount) => prevCount + 1);
|
|
43
|
-
|
|
44
|
+
// setQueryCount((prevCount) => prevCount + 1);
|
|
45
|
+
const addLength = queries[queries.length - 1] + 1;
|
|
46
|
+
const updatedQureis = [...queries];
|
|
47
|
+
updatedQureis.push(addLength);
|
|
48
|
+
setQueries(updatedQureis);
|
|
44
49
|
};
|
|
45
50
|
// OnClick to -
|
|
46
51
|
const actionOnMinus = (index) => {
|
|
47
52
|
var _a;
|
|
48
53
|
const filterQuries = (_a = featureDetails.filterQueries) === null || _a === void 0 ? void 0 : _a.filter((query) => query.idx !== index);
|
|
49
54
|
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { filterQueries: filterQuries }));
|
|
50
|
-
setQueryCount((prevCount) => prevCount - 1);
|
|
51
|
-
|
|
55
|
+
// setQueryCount((prevCount) => prevCount - 1);
|
|
56
|
+
const removeQuery = queries.filter((query) => query !== index);
|
|
57
|
+
setQueries(removeQuery);
|
|
58
|
+
// setQueries((prevQueries) => {
|
|
59
|
+
// console.log(prevQueries,index,prevQueries.filter((query) => query !== index,'updating quries array'))
|
|
60
|
+
// return prevQueries.filter((query) => query !== index)
|
|
61
|
+
// });
|
|
52
62
|
};
|
|
53
63
|
// Display query by count
|
|
54
64
|
const RenderQuery = () => {
|
|
55
|
-
return queries.map((queryIndex
|
|
65
|
+
return queries.map((queryIndex, idx) => {
|
|
66
|
+
var _a, _b, _c, _d;
|
|
67
|
+
const currentQuery = (_a = featureDetails === null || featureDetails === void 0 ? void 0 : featureDetails.filterQueries.find((item) => {
|
|
68
|
+
return item.idx === queryIndex;
|
|
69
|
+
})) !== null && _a !== void 0 ? _a : {};
|
|
70
|
+
const defaultFilterValue = {
|
|
71
|
+
currentColumn: (_b = currentQuery === null || currentQuery === void 0 ? void 0 : currentQuery.selectedColumn) !== null && _b !== void 0 ? _b : {},
|
|
72
|
+
currentOperation: (_c = currentQuery === null || currentQuery === void 0 ? void 0 : currentQuery.selectedOperation) !== null && _c !== void 0 ? _c : {},
|
|
73
|
+
currentValue: (_d = currentQuery === null || currentQuery === void 0 ? void 0 : currentQuery.value) !== null && _d !== void 0 ? _d : "",
|
|
74
|
+
};
|
|
75
|
+
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-6 flex" }, { children: (0, jsx_runtime_1.jsx)(querty_1.default, { currentIndex: idx, queryIndex: queryIndex, columnData: columnData, featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, callBackForSelect: callBackForSelect, actionOnMinus: () => actionOnMinus(queryIndex), actionOnPlus: actionOnPlus, defaultFilterValue: defaultFilterValue }) }), queryIndex));
|
|
76
|
+
});
|
|
56
77
|
};
|
|
57
78
|
const applyFilters = () => {
|
|
58
79
|
if (!featureDetails.filterQueries.length) {
|
|
59
80
|
return;
|
|
60
81
|
}
|
|
61
|
-
callGrid();
|
|
62
|
-
|
|
82
|
+
callGrid(featureDetails);
|
|
83
|
+
filterRef.current.toggle(false);
|
|
63
84
|
};
|
|
64
|
-
(0,
|
|
65
|
-
var _a;
|
|
66
|
-
console.log(filterRef.current, (_a = filterRef.current) === null || _a === void 0 ? void 0 : _a.toggle, 'filter ref data');
|
|
67
|
-
}, [filterRef.current]);
|
|
68
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, className: "hover:bg-primary-25 ml-2", onClick: (e) => { togglePopup(e); } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines" }) })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: filterRef, className: "w-45rem bulk-action-feature" }, { children: [(0, jsx_runtime_1.jsx)(BulkActionHeader, { header: {
|
|
85
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, className: "hover:bg-primary-25 ml-2", onClick: (e) => { togglePopup(e); } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines" }) })), (0, jsx_runtime_1.jsxs)("button", Object.assign({ className: "bg-white", onClick: resettingFilters }, { children: ["Selected ", (_a = featureDetails === null || featureDetails === void 0 ? void 0 : featureDetails.filterQueries) === null || _a === void 0 ? void 0 : _a.length] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: filterRef, className: "w-45rem bulk-action-feature" }, { children: [(0, jsx_runtime_1.jsx)(BulkActionHeader, { header: {
|
|
69
86
|
label: "Filters",
|
|
70
87
|
description: "Streamline your search with filter",
|
|
71
88
|
} }), RenderQuery(), (0, jsx_runtime_1.jsx)(BulkActionFooter, { footer: {
|
|
@@ -11,23 +11,20 @@ const Types_1 = require("../../Types");
|
|
|
11
11
|
const inputnumber_1 = require("primereact/inputnumber");
|
|
12
12
|
const calendar_1 = require("primereact/calendar");
|
|
13
13
|
const multiselect_1 = require("primereact/multiselect");
|
|
14
|
-
function Querty({
|
|
14
|
+
function Querty({ currentIndex, queryIndex, columnData, featureDetails, setFeatureDetails, callBackForSelect, actionOnMinus, actionOnPlus, defaultFilterValue, }) {
|
|
15
15
|
var _a, _b, _c;
|
|
16
16
|
const [filterOperations, setFilterOperations] = (0, react_1.useState)([]);
|
|
17
|
-
const [thirdElementValue, setThirdElementValue] = (0, react_1.useState)();
|
|
17
|
+
const [thirdElementValue, setThirdElementValue] = (0, react_1.useState)(defaultFilterValue === null || defaultFilterValue === void 0 ? void 0 : defaultFilterValue.currentValue);
|
|
18
18
|
const [currentFilter, setCurrentFilter] = (0, react_1.useState)({
|
|
19
|
-
currentColumn:
|
|
20
|
-
currentOperation:
|
|
21
|
-
currentValue:
|
|
19
|
+
currentColumn: defaultFilterValue === null || defaultFilterValue === void 0 ? void 0 : defaultFilterValue.currentColumn,
|
|
20
|
+
currentOperation: defaultFilterValue === null || defaultFilterValue === void 0 ? void 0 : defaultFilterValue.currentOperation,
|
|
21
|
+
currentValue: defaultFilterValue === null || defaultFilterValue === void 0 ? void 0 : defaultFilterValue.currentValue,
|
|
22
22
|
});
|
|
23
23
|
const [thirdElementOptions, setThirdElementOptions] = (0, react_1.useState)([]);
|
|
24
24
|
// Assign selected columns
|
|
25
25
|
const assignSelectedColumn = (column) => {
|
|
26
26
|
console.log(column, "column on selected dropdown");
|
|
27
27
|
setCurrentFilter(Object.assign(Object.assign({}, currentFilter), { currentColumn: column }));
|
|
28
|
-
getFilterOperations(column);
|
|
29
|
-
// if(column?.dataType == ATTRIBUTEDATATYPES.SELECT ,column?.dataType == ATTRIBUTEDATATYPES.MULTI_SELECT){
|
|
30
|
-
// }
|
|
31
28
|
};
|
|
32
29
|
// Get operation list based on selected column datatype
|
|
33
30
|
const getFilterOperations = (column) => {
|
|
@@ -40,11 +37,16 @@ function Querty({ queryId, columnData, featureDetails, setFeatureDetails, callBa
|
|
|
40
37
|
setFilterOperations(filterList);
|
|
41
38
|
};
|
|
42
39
|
// Assign selected operation
|
|
43
|
-
const assignOperation = (operation) =>
|
|
40
|
+
const assignOperation = (operation) => {
|
|
41
|
+
setCurrentFilter(Object.assign(Object.assign({}, currentFilter), { currentOperation: operation }));
|
|
42
|
+
getOptionsFromCallback(operation);
|
|
43
|
+
};
|
|
44
|
+
// Get dropdown options from callback
|
|
45
|
+
const getOptionsFromCallback = (operation) => tslib_1.__awaiter(this, void 0, void 0, function* () {
|
|
44
46
|
var _d;
|
|
45
47
|
const currentColumnDataType = (_d = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _d === void 0 ? void 0 : _d.dataType;
|
|
46
|
-
|
|
47
|
-
|
|
48
|
+
if (currentColumnDataType == Types_1.ATTRIBUTEDATATYPES.SELECT ||
|
|
49
|
+
currentColumnDataType == Types_1.ATTRIBUTEDATATYPES.MULTI_SELECT) {
|
|
48
50
|
let options = yield callBackForSelect(currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn, operation);
|
|
49
51
|
setThirdElementOptions(options);
|
|
50
52
|
}
|
|
@@ -79,26 +81,42 @@ function Querty({ queryId, columnData, featureDetails, setFeatureDetails, callBa
|
|
|
79
81
|
// Disable condition for plus button
|
|
80
82
|
const disableStatusPlusButton = (index) => {
|
|
81
83
|
var _a, _b;
|
|
82
|
-
console.log(index,
|
|
84
|
+
console.log(index, currentIndex, "index and query id");
|
|
83
85
|
let status = true;
|
|
84
86
|
if (((_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName) &&
|
|
85
87
|
((_b = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation) === null || _b === void 0 ? void 0 : _b.name)) {
|
|
86
88
|
status = false;
|
|
87
89
|
}
|
|
88
|
-
console.log(status, "status of action");
|
|
89
90
|
return status;
|
|
90
91
|
};
|
|
91
92
|
// Disable condition for minus button
|
|
92
93
|
const disableStatusMinusButton = (index) => {
|
|
94
|
+
var _a;
|
|
93
95
|
let status = true;
|
|
94
|
-
if (index > 0
|
|
96
|
+
if (index > 0 ||
|
|
97
|
+
(index === 0 && ((_a = featureDetails.filterQueries) === null || _a === void 0 ? void 0 : _a.length) > 1)) {
|
|
95
98
|
status = false;
|
|
96
99
|
}
|
|
97
100
|
return status;
|
|
98
101
|
};
|
|
102
|
+
// Set value for third element
|
|
99
103
|
(0, react_1.useEffect)(() => {
|
|
100
104
|
setCurrentFilter(Object.assign(Object.assign({}, currentFilter), { currentValue: thirdElementValue }));
|
|
101
105
|
}, [thirdElementValue]);
|
|
106
|
+
// Get operation list when column is present/selected
|
|
107
|
+
(0, react_1.useEffect)(() => {
|
|
108
|
+
var _a;
|
|
109
|
+
if ((_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName) {
|
|
110
|
+
getFilterOperations(currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn);
|
|
111
|
+
}
|
|
112
|
+
}, [currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn]);
|
|
113
|
+
// Get third element options on load
|
|
114
|
+
(0, react_1.useEffect)(() => {
|
|
115
|
+
var _a;
|
|
116
|
+
if ((_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.operation) === null || _a === void 0 ? void 0 : _a.dataType) {
|
|
117
|
+
getOptionsFromCallback(currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.operation);
|
|
118
|
+
}
|
|
119
|
+
}, []);
|
|
102
120
|
(0, react_1.useEffect)(() => {
|
|
103
121
|
var _a, _b;
|
|
104
122
|
const columnName = (_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName;
|
|
@@ -107,19 +125,19 @@ function Querty({ queryId, columnData, featureDetails, setFeatureDetails, callBa
|
|
|
107
125
|
console.log(columnName, operationName, updatedValue, "all conditions");
|
|
108
126
|
if (columnName && operationName && updatedValue) {
|
|
109
127
|
const newQuery = {
|
|
110
|
-
idx:
|
|
128
|
+
idx: queryIndex,
|
|
111
129
|
selectedColumn: currentFilter.currentColumn,
|
|
112
130
|
selectedOperation: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation,
|
|
113
131
|
value: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentValue,
|
|
114
132
|
};
|
|
115
133
|
const presentQueries = featureDetails.filterQueries;
|
|
116
|
-
presentQueries[
|
|
134
|
+
presentQueries[currentIndex] = newQuery;
|
|
117
135
|
// presentQueries.push(newQuery)
|
|
118
136
|
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { filterQueries: presentQueries }));
|
|
119
137
|
}
|
|
120
138
|
}, [currentFilter]);
|
|
121
139
|
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3 w-30rem" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-inputgroup w-full" }, { children: [(0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: currentFilter.currentColumn, placeholder: "Select", options: columnData, optionLabel: "headerName", onChange: (e) => assignSelectedColumn(e.value) }), (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation, className: "border-left-none", placeholder: "Select", options: filterOperations, optionLabel: "name", onChange: (e) => assignOperation(e.value), disabled: !((_a = currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName) }), renderUIElement(((_b = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _b === void 0 ? void 0 : _b.dataType)
|
|
122
140
|
? (_c = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _c === void 0 ? void 0 : _c.dataType
|
|
123
|
-
: Types_1.ATTRIBUTEDATATYPES.STRING, thirdElementValue, setThirdElementValue, thirdElementOptions)] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-1" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { text: true, disabled: disableStatusPlusButton(
|
|
141
|
+
: Types_1.ATTRIBUTEDATATYPES.STRING, thirdElementValue, setThirdElementValue, thirdElementOptions)] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-1" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { text: true, disabled: disableStatusPlusButton(currentIndex), icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-circle", size: 18 }), onClick: () => actionOnPlus(currentIndex) }), (0, jsx_runtime_1.jsx)(button_1.Button, { disabled: disableStatusMinusButton(currentIndex), text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", size: 18 }), onClick: () => actionOnMinus(currentIndex) })] }))] })));
|
|
124
142
|
}
|
|
125
143
|
exports.default = Querty;
|
|
@@ -4,9 +4,11 @@ const tslib_1 = require("tslib");
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const inputtext_1 = require("primereact/inputtext");
|
|
6
6
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
7
|
+
const react_1 = require("react");
|
|
8
|
+
const MyProvider_1 = require("../MyProvider");
|
|
7
9
|
// import { useState } from "react";
|
|
8
|
-
function Search({
|
|
9
|
-
|
|
10
|
+
function Search({ searchPlaceHolder }) {
|
|
11
|
+
const { featureDetails, setFeatureDetails } = (0, react_1.useContext)(MyProvider_1.FeatureContext);
|
|
10
12
|
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `p-input-icon-left ${featureDetails.searchedText.length > 0 && "p-input-icon-right"}` }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { color: "#667085", icon: "search-lg", size: 18 }) })), featureDetails.searchedText.length > 0 && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer", onClick: () => {
|
|
11
13
|
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: "" }));
|
|
12
14
|
// setInputValue("");
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const MyProvider_1 = require("../MyProvider");
|
|
6
|
+
function RecordDetail() {
|
|
7
|
+
const { totalRecords } = (0, react_1.useContext)(MyProvider_1.FeatureContext);
|
|
8
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: `Total ${totalRecords} records` }));
|
|
6
9
|
}
|
|
7
10
|
exports.default = RecordDetail;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const MyProvider_1 = require("../MyProvider");
|
|
6
|
+
function RefreshGrid() {
|
|
7
|
+
const { removeFeaturesAndRefresh } = (0, react_1.useContext)(MyProvider_1.FeatureContext);
|
|
8
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("button", Object.assign({ onClick: removeFeaturesAndRefresh, className: "bg-white" }, { children: "Refresh" })) }));
|
|
9
|
+
}
|
|
10
|
+
exports.default = RefreshGrid;
|
|
@@ -20,7 +20,7 @@ function ErrorBoundary({ children }) {
|
|
|
20
20
|
if (hasError) {
|
|
21
21
|
console.log(hasError, 'error occured');
|
|
22
22
|
// Fallback UI for when an error occurs
|
|
23
|
-
return (0, jsx_runtime_1.jsx)("div", { children: " Something went wrong" });
|
|
23
|
+
return (0, jsx_runtime_1.jsx)("div", { children: " Something went wrong please refresh and try" });
|
|
24
24
|
}
|
|
25
25
|
return children;
|
|
26
26
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const Checkbox = ({ checked, onChange, isInterminate }) => {
|
|
5
|
+
console.log(isInterminate, 'is interminat status in checkbox');
|
|
6
|
+
return ((0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: checked, onChange: onChange }));
|
|
7
|
+
};
|
|
8
|
+
exports.default = Checkbox;
|