rez-table-listing-mui 1.0.42 → 1.0.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/index.js +1 -1
  2. package/dist/index.mjs +1 -1
  3. package/package.json +1 -1
  4. package/src/components/filter/components/attributes-filter.tsx +1 -0
  5. package/src/components/filter/components/forms/index.tsx +92 -88
  6. package/src/components/filter/components/main-filter.tsx +1 -1
  7. package/src/components/filter/components/saved-edit-filter.tsx +2 -2
  8. package/src/components/filter/components/saved-filter.tsx +9 -9
  9. package/src/components/filter/style.ts +1 -0
  10. package/src/components/table-settings/components/sorting.tsx +2 -1
  11. package/src/libs/utils/apiColumn.ts +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rez-table-listing-mui",
3
- "version": "1.0.42",
3
+ "version": "1.0.44",
4
4
  "type": "module",
5
5
  "description": "A rez table listing component built on TanStack Table",
6
6
  "main": "dist/index.js",
package/src/components/filter/components/attributes-filter.tsx CHANGED
@@ -112,6 +112,7 @@ const AttributesFilter = ({
112
112
  flexDirection: "column",
113
113
  gap: "1.25rem",
114
114
  }}
115
+ className="attributes-filter-component-wrapper"
115
116
  >
116
117
  <FormControl fullWidth size="small">
117
118
  <Select
package/src/components/filter/components/forms/index.tsx CHANGED
@@ -239,99 +239,103 @@ const FilterForm = ({
239
239
  <CustomSearch value={searchTerm} onChange={setSearchTerm} />
240
240
  )}
241
241
 
242
- {selectedFilters
243
- .filter(
244
- (filter) =>
245
- filter.name?.toLowerCase().includes(searchTerm.toLowerCase()) ||
246
- filter.filter_value
247
- ?.toString()
248
- .toLowerCase()
249
- .includes(searchTerm.toLowerCase())
250
- )
251
- .map((filter) => {
252
- const { dropdown_list = [] } = filter;
253
- return (
254
- <Box
255
- key={filter.filter_attribute}
256
- sx={filterFormStyles.formListItem}
257
- >
258
- <Box sx={filterFormStyles.formListItemHeader}>
259
- <Typography sx={filterFormStyles.formListItemHeaderName}>
260
- {filter.name}
261
- </Typography>
262
- <FormDropdown
263
- filter={filter}
264
- control={control}
265
- dropdownList={dropdown_list}
266
- sx={filterFormStyles.formListItemHeaderDropdown}
267
- onValueChange={updateFiltersFromForm}
268
- />
269
- <IconButton
270
- sx={{ marginLeft: "auto" }}
271
- onClick={() => {
272
- unregister(`${filter.name}.value`);
273
- unregister(`${filter.name}.operator`);
274
-
275
- // ✅ Toggle dummy field to force form dirty
276
- const dummy = watch("dummyChange");
277
- setValue(
278
- "dummyChange",
279
- dummy === "changed" ? "reset" : "changed",
280
- {
281
- shouldDirty: true,
282
- }
283
- );
284
-
285
- handleRemoveFilter(filter.filter_attribute);
286
- }}
287
- size="small"
288
- >
289
- <CloseIcon />
290
- </IconButton>
291
- </Box>
292
-
293
- <Box>
294
- {filter.data_type === "text" ||
295
- filter.data_type === "number" ? (
296
- <FormTextfield
297
- filter={filter}
298
- control={control}
299
- onValueChange={updateFiltersFromForm}
300
- />
301
- ) : filter.data_type === "year" ? (
302
- <FormDatePicker
303
- filter={filter}
304
- control={control}
305
- views={["year"]}
306
- onValueChange={updateFiltersFromForm}
307
- />
308
- ) : filter.data_type === "date" ? (
309
- <FormDatePicker
242
+ <Box className="filter-form-inputs">
243
+ {selectedFilters
244
+ .filter(
245
+ (filter) =>
246
+ filter.name
247
+ ?.toLowerCase()
248
+ .includes(searchTerm.toLowerCase()) ||
249
+ filter.filter_value
250
+ ?.toString()
251
+ .toLowerCase()
252
+ .includes(searchTerm.toLowerCase())
253
+ )
254
+ .map((filter) => {
255
+ const { dropdown_list = [] } = filter;
256
+ return (
257
+ <Box
258
+ key={filter.filter_attribute}
259
+ sx={filterFormStyles.formListItem}
260
+ >
261
+ <Box sx={filterFormStyles.formListItemHeader}>
262
+ <Typography sx={filterFormStyles.formListItemHeaderName}>
263
+ {filter.name}
264
+ </Typography>
265
+ <FormDropdown
310
266
  filter={filter}
311
267
  control={control}
268
+ dropdownList={dropdown_list}
269
+ sx={filterFormStyles.formListItemHeaderDropdown}
312
270
  onValueChange={updateFiltersFromForm}
313
271
  />
314
- ) : filter.data_type === "select" ? (
315
- <FormSelect
316
- filter={filter}
317
- control={control}
318
- dropdownData={dropdownData}
319
- onValueChange={updateFiltersFromForm}
320
- />
321
- ) : filter.data_type === "multiselect" ? (
322
- <FormMultiSelect
323
- filter={filter}
324
- control={control}
325
- dropdownData={dropdownData}
326
- onValueChange={updateFiltersFromForm}
327
- />
328
- ) : (
329
- <FormControl fullWidth size="small" />
330
- )}
272
+ <IconButton
273
+ sx={{ marginLeft: "auto" }}
274
+ onClick={() => {
275
+ unregister(`${filter.name}.value`);
276
+ unregister(`${filter.name}.operator`);
277
+
278
+ // ✅ Toggle dummy field to force form dirty
279
+ const dummy = watch("dummyChange");
280
+ setValue(
281
+ "dummyChange",
282
+ dummy === "changed" ? "reset" : "changed",
283
+ {
284
+ shouldDirty: true,
285
+ }
286
+ );
287
+
288
+ handleRemoveFilter(filter.filter_attribute);
289
+ }}
290
+ size="small"
291
+ >
292
+ <CloseIcon />
293
+ </IconButton>
294
+ </Box>
295
+
296
+ <Box>
297
+ {filter.data_type === "text" ||
298
+ filter.data_type === "number" ? (
299
+ <FormTextfield
300
+ filter={filter}
301
+ control={control}
302
+ onValueChange={updateFiltersFromForm}
303
+ />
304
+ ) : filter.data_type === "year" ? (
305
+ <FormDatePicker
306
+ filter={filter}
307
+ control={control}
308
+ views={["year"]}
309
+ onValueChange={updateFiltersFromForm}
310
+ />
311
+ ) : filter.data_type === "date" ? (
312
+ <FormDatePicker
313
+ filter={filter}
314
+ control={control}
315
+ onValueChange={updateFiltersFromForm}
316
+ />
317
+ ) : filter.data_type === "select" ? (
318
+ <FormSelect
319
+ filter={filter}
320
+ control={control}
321
+ dropdownData={dropdownData}
322
+ onValueChange={updateFiltersFromForm}
323
+ />
324
+ ) : filter.data_type === "multiselect" ? (
325
+ <FormMultiSelect
326
+ filter={filter}
327
+ control={control}
328
+ dropdownData={dropdownData}
329
+ onValueChange={updateFiltersFromForm}
330
+ />
331
+ ) : (
332
+ <FormControl fullWidth size="small" />
333
+ )}
334
+ </Box>
331
335
  </Box>
332
- </Box>
333
- );
334
- })}
336
+ );
337
+ })}
338
+ </Box>
335
339
  </Box>
336
340
  </Box>
337
341
 
package/src/components/filter/components/main-filter.tsx CHANGED
@@ -44,7 +44,7 @@ const MainFilter = ({
44
44
  };
45
45
 
46
46
  return (
47
- <Box sx={mainBoxStyles}>
47
+ <Box sx={mainBoxStyles} className="main-filter-component-wrapper">
48
48
  {/* Set selectedFilters state */}
49
49
 
50
50
  {/* Render selectedFilters state */}
package/src/components/filter/components/saved-edit-filter.tsx CHANGED
@@ -40,10 +40,10 @@ const SavedFilterEditComponent = ({
40
40
 
41
41
  const handleRemoveFilter = (filter_attribute: string) => {
42
42
  setFilters((prev) =>
43
- prev.filter((filter) => filter.filter_attribute !== filter_attribute)
43
+ prev.filter((filter) => filter?.filter_attribute !== filter_attribute)
44
44
  );
45
45
  setSelectedFilters((prev) =>
46
- prev.filter((filter) => filter.filter_attribute !== filter_attribute)
46
+ prev.filter((filter) => filter?.filter_attribute !== filter_attribute)
47
47
  );
48
48
  };
49
49
 
package/src/components/filter/components/saved-filter.tsx CHANGED
@@ -59,8 +59,8 @@ const SavedFilter = ({
59
59
  ...prev,
60
60
  saved_filters: {
61
61
  ...prev?.attributes,
62
- selectedId: filter.value,
63
- selectedName: filter.label,
62
+ selectedId: filter?.value,
63
+ selectedName: filter?.label,
64
64
  },
65
65
  activeFilterTabIndex: tabValue,
66
66
  } as FilterMasterStateProps)
@@ -78,7 +78,7 @@ const SavedFilter = ({
78
78
  className="search-input"
79
79
  />
80
80
 
81
- {columnsData.saved_filter.length === 0 ? (
81
+ {columnsData?.saved_filter?.length === 0 ? (
82
82
  <Typography sx={{ mt: 2 }}>No saved filters yet.</Typography>
83
83
  ) : (
84
84
  <List
@@ -89,13 +89,13 @@ const SavedFilter = ({
89
89
  mt: 2,
90
90
  }}
91
91
  >
92
- {columnsData.saved_filter
93
- .filter((filter) =>
92
+ {columnsData?.saved_filter
93
+ ?.filter((filter) =>
94
94
  filter.label?.toLowerCase().includes(searchTerm.toLowerCase())
95
95
  )
96
- .map((filter) => (
96
+ ?.map((filter) => (
97
97
  <ListItem
98
- key={filter.value}
98
+ key={filter?.value}
99
99
  sx={{
100
100
  cursor: "pointer",
101
101
  border: "1px solid #ccc",
@@ -106,7 +106,7 @@ const SavedFilter = ({
106
106
  }}
107
107
  onClick={() => handleListItemClick(filter)}
108
108
  >
109
- <ListItemText primary={filter.label} />
109
+ <ListItemText primary={filter?.label} />
110
110
 
111
111
  <Box onClick={(e) => e.stopPropagation()}>
112
112
  <IconButton
@@ -134,7 +134,7 @@ const SavedFilter = ({
134
134
  };
135
135
 
136
136
  return (
137
- <Box sx={mainBoxStyles}>
137
+ <Box sx={mainBoxStyles} className="saved-filter-component-wrapper">
138
138
  {/* Render search input and list */}
139
139
  {!editMode && renderList()}
140
140
 
package/src/components/filter/style.ts CHANGED
@@ -35,6 +35,7 @@ export const filterStyles: StyleProps = {
35
35
  },
36
36
 
37
37
  filterContainer: {
38
+ backgroundColor: "#fff",
38
39
  height: "100%",
39
40
  overflowY: "hidden",
40
41
  boxShadow: "0px 3px 8px 0px rgba(34, 48, 62, 0.10)",
package/src/components/table-settings/components/sorting.tsx CHANGED
@@ -264,7 +264,8 @@ const Sorting = ({
264
264
  }
265
265
  };
266
266
 
267
- const { showList } = getCurrentLists();
267
+ const { showList, hideList } = getCurrentLists();
268
+ console.log("showList", showList);
268
269
 
269
270
  return (
270
271
  <Box sx={{ display: "flex", flexDirection: "column", gap: "0.75rem" }}>
package/src/libs/utils/apiColumn.ts CHANGED
@@ -96,7 +96,7 @@ export const deleteSavedFilter = async (
96
96
  ) => {
97
97
  try {
98
98
  const response = await api.post(
99
- `/entity/update/17?entity_type=${entity_type}`,
99
+ `/entity/update/${payload?.id}?entity_type=${entity_type}`,
100
100
  payload
101
101
  );
102
102
  return response.data;