rez-table-listing-mui 1.3.21 → 1.3.23
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/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/listing/components/filter/components/forms/components/Dropdown.tsx +3 -241
- package/src/listing/components/filter/components/forms/index.tsx +1052 -911
- package/src/listing/components/filter/components/forms/utils/filter-date-input-resolver.tsx +30 -55
- package/src/listing/components/login/index.tsx +3 -2
package/package.json
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
// !! DON'T DELETE THIS OLD CODE !! //
|
|
2
|
+
|
|
1
3
|
import { FormControl, MenuItem, Select, SxProps, Theme } from "@mui/material";
|
|
2
4
|
import { Controller, UseFormSetValue } from "react-hook-form";
|
|
3
5
|
import { FilterStateProps } from "../../../../../types/filter";
|
|
@@ -54,10 +56,8 @@ const FormDropdown = ({
|
|
|
54
56
|
const newOperator = e.target.value;
|
|
55
57
|
const oldOperator = field.value;
|
|
56
58
|
|
|
57
|
-
// Update RHF field
|
|
58
59
|
field.onChange(e);
|
|
59
60
|
|
|
60
|
-
// Handle date/year specific operator-based value reset logic
|
|
61
61
|
if (
|
|
62
62
|
(filter?.filter_attribute_data_type === "date" ||
|
|
63
63
|
filter?.filter_attribute_data_type === "year") &&
|
|
@@ -85,10 +85,7 @@ const FormDropdown = ({
|
|
|
85
85
|
}
|
|
86
86
|
}
|
|
87
87
|
|
|
88
|
-
|
|
89
|
-
setTimeout(() => {
|
|
90
|
-
onValueChange?.();
|
|
91
|
-
}, 0);
|
|
88
|
+
onValueChange?.();
|
|
92
89
|
}}
|
|
93
90
|
>
|
|
94
91
|
{dropdownList?.map((item, idx) => (
|
|
@@ -104,238 +101,3 @@ const FormDropdown = ({
|
|
|
104
101
|
};
|
|
105
102
|
|
|
106
103
|
export default FormDropdown;
|
|
107
|
-
|
|
108
|
-
// import { FormControl, MenuItem, Select, SxProps, Theme } from "@mui/material";
|
|
109
|
-
// import { Controller, UseFormSetValue } from "react-hook-form";
|
|
110
|
-
// import { FilterStateProps } from "../../../../../types/filter";
|
|
111
|
-
// import moment from "moment";
|
|
112
|
-
|
|
113
|
-
// interface FormDropdownProps {
|
|
114
|
-
// filter: FilterStateProps;
|
|
115
|
-
// control: any;
|
|
116
|
-
// setValue: UseFormSetValue<any>;
|
|
117
|
-
// dropdownList: {
|
|
118
|
-
// label?: string;
|
|
119
|
-
// value?: string;
|
|
120
|
-
// }[];
|
|
121
|
-
// isLoading?: boolean;
|
|
122
|
-
// sx?: SxProps<Theme>;
|
|
123
|
-
// onValueChange?: () => void;
|
|
124
|
-
// }
|
|
125
|
-
|
|
126
|
-
// // Allowed date-based operators
|
|
127
|
-
// const DATE_ALLOWED_OPERATORS = [
|
|
128
|
-
// "equal",
|
|
129
|
-
// "before",
|
|
130
|
-
// "after",
|
|
131
|
-
// "between",
|
|
132
|
-
// "is",
|
|
133
|
-
// "today",
|
|
134
|
-
// "is_before",
|
|
135
|
-
// "is_after",
|
|
136
|
-
// "is_on_or_before",
|
|
137
|
-
// "is_on_or_after",
|
|
138
|
-
// "empty",
|
|
139
|
-
// "not_empty",
|
|
140
|
-
// ];
|
|
141
|
-
|
|
142
|
-
// const FormDropdown = ({
|
|
143
|
-
// filter,
|
|
144
|
-
// control,
|
|
145
|
-
// setValue,
|
|
146
|
-
// dropdownList,
|
|
147
|
-
// isLoading = false,
|
|
148
|
-
// sx,
|
|
149
|
-
// onValueChange,
|
|
150
|
-
// }: FormDropdownProps) => {
|
|
151
|
-
// return (
|
|
152
|
-
// <Controller
|
|
153
|
-
// name={`${filter?.filter_attribute_name}.operator`}
|
|
154
|
-
// control={control}
|
|
155
|
-
// defaultValue={filter?.filter_operator || dropdownList?.[0]?.value || ""}
|
|
156
|
-
// render={({ field }) => (
|
|
157
|
-
// <FormControl sx={sx} size="small">
|
|
158
|
-
// <Select
|
|
159
|
-
// {...field}
|
|
160
|
-
// variant="standard"
|
|
161
|
-
// sx={{
|
|
162
|
-
// fontSize: "0.875rem",
|
|
163
|
-
// minWidth: 50,
|
|
164
|
-
// border: "none",
|
|
165
|
-
// boxShadow: "none",
|
|
166
|
-
// "& .MuiSelect-icon": {
|
|
167
|
-
// top: "45%",
|
|
168
|
-
// transform: "translateY(-50%)",
|
|
169
|
-
// "& .MuiOutlinedInput-input": {
|
|
170
|
-
// padding: "12px 20px",
|
|
171
|
-
// },
|
|
172
|
-
// },
|
|
173
|
-
// }}
|
|
174
|
-
// disabled={isLoading}
|
|
175
|
-
// disableUnderline
|
|
176
|
-
// onChange={(e) => {
|
|
177
|
-
// const newOperator = e.target.value;
|
|
178
|
-
// const oldOperator = field.value;
|
|
179
|
-
|
|
180
|
-
// field.onChange(e);
|
|
181
|
-
|
|
182
|
-
// // Reset value if operator switches date → non-date or non-date → date
|
|
183
|
-
// if (filter.filter_attribute_data_type === "date") {
|
|
184
|
-
// const wasDateOp = DATE_ALLOWED_OPERATORS.includes(oldOperator);
|
|
185
|
-
// const isDateOpNow =
|
|
186
|
-
// DATE_ALLOWED_OPERATORS.includes(newOperator);
|
|
187
|
-
|
|
188
|
-
// if (wasDateOp !== isDateOpNow) {
|
|
189
|
-
// setValue(`${filter?.filter_attribute_name}.value`, "", {
|
|
190
|
-
// shouldDirty: true,
|
|
191
|
-
// });
|
|
192
|
-
// }
|
|
193
|
-
// }
|
|
194
|
-
|
|
195
|
-
// if (
|
|
196
|
-
// (filter?.filter_attribute_data_type === "date" ||
|
|
197
|
-
// filter?.filter_attribute_data_type === "year") &&
|
|
198
|
-
// newOperator !== oldOperator
|
|
199
|
-
// ) {
|
|
200
|
-
// if (newOperator === "today") {
|
|
201
|
-
// setValue(
|
|
202
|
-
// `${filter?.filter_attribute_name}.value`,
|
|
203
|
-
// moment().format("YYYY-MM-DD"),
|
|
204
|
-
// {
|
|
205
|
-
// shouldDirty: true,
|
|
206
|
-
// }
|
|
207
|
-
// );
|
|
208
|
-
// } else if (newOperator === "between") {
|
|
209
|
-
// setValue(`${filter?.filter_attribute_name}.value`, ["", ""], {
|
|
210
|
-
// shouldDirty: true,
|
|
211
|
-
// });
|
|
212
|
-
// } else if (
|
|
213
|
-
// oldOperator === "between" ||
|
|
214
|
-
// oldOperator === "today"
|
|
215
|
-
// ) {
|
|
216
|
-
// setValue(`${filter?.filter_attribute_name}.value`, "", {
|
|
217
|
-
// shouldDirty: true,
|
|
218
|
-
// });
|
|
219
|
-
// }
|
|
220
|
-
// }
|
|
221
|
-
|
|
222
|
-
// onValueChange?.();
|
|
223
|
-
// }}
|
|
224
|
-
// >
|
|
225
|
-
// {dropdownList?.map((item, idx) => (
|
|
226
|
-
// <MenuItem key={idx} value={item.value}>
|
|
227
|
-
// {item.label}
|
|
228
|
-
// </MenuItem>
|
|
229
|
-
// ))}
|
|
230
|
-
// </Select>
|
|
231
|
-
// </FormControl>
|
|
232
|
-
// )}
|
|
233
|
-
// />
|
|
234
|
-
// );
|
|
235
|
-
// };
|
|
236
|
-
|
|
237
|
-
// export default FormDropdown;
|
|
238
|
-
|
|
239
|
-
// !! DON'T DELETE THIS OLD CODE !! //
|
|
240
|
-
|
|
241
|
-
// import { FormControl, MenuItem, Select, SxProps, Theme } from "@mui/material";
|
|
242
|
-
// import { Controller, UseFormSetValue } from "react-hook-form";
|
|
243
|
-
// import { FilterStateProps } from "../../../../../types/filter";
|
|
244
|
-
// import moment from "moment";
|
|
245
|
-
|
|
246
|
-
// interface FormDropdownProps {
|
|
247
|
-
// filter: FilterStateProps;
|
|
248
|
-
// control: any;
|
|
249
|
-
// setValue: UseFormSetValue<any>;
|
|
250
|
-
// dropdownList: {
|
|
251
|
-
// label?: string;
|
|
252
|
-
// value?: string;
|
|
253
|
-
// }[];
|
|
254
|
-
// isLoading?: boolean;
|
|
255
|
-
// sx?: SxProps<Theme>;
|
|
256
|
-
// onValueChange?: () => void;
|
|
257
|
-
// }
|
|
258
|
-
|
|
259
|
-
// const FormDropdown = ({
|
|
260
|
-
// filter,
|
|
261
|
-
// control,
|
|
262
|
-
// setValue,
|
|
263
|
-
// dropdownList,
|
|
264
|
-
// isLoading = false,
|
|
265
|
-
// sx,
|
|
266
|
-
// onValueChange,
|
|
267
|
-
// }: FormDropdownProps) => {
|
|
268
|
-
// return (
|
|
269
|
-
// <Controller
|
|
270
|
-
// name={`${filter?.filter_attribute_name}.operator`}
|
|
271
|
-
// control={control}
|
|
272
|
-
// defaultValue={filter?.filter_operator || dropdownList?.[0]?.value || ""}
|
|
273
|
-
// render={({ field }) => (
|
|
274
|
-
// <FormControl sx={sx} size="small">
|
|
275
|
-
// <Select
|
|
276
|
-
// {...field}
|
|
277
|
-
// variant="standard"
|
|
278
|
-
// sx={{
|
|
279
|
-
// fontSize: "0.875rem",
|
|
280
|
-
// minWidth: 50,
|
|
281
|
-
// border: "none",
|
|
282
|
-
// boxShadow: "none",
|
|
283
|
-
// "& .MuiSelect-icon": {
|
|
284
|
-
// top: "45%",
|
|
285
|
-
// transform: "translateY(-50%)",
|
|
286
|
-
// "& .MuiOutlinedInput-input": {
|
|
287
|
-
// padding: "12px 20px",
|
|
288
|
-
// },
|
|
289
|
-
// },
|
|
290
|
-
// }}
|
|
291
|
-
// disabled={isLoading}
|
|
292
|
-
// disableUnderline
|
|
293
|
-
// onChange={(e) => {
|
|
294
|
-
// const newOperator = e.target.value;
|
|
295
|
-
// const oldOperator = field.value;
|
|
296
|
-
|
|
297
|
-
// field.onChange(e);
|
|
298
|
-
|
|
299
|
-
// if (
|
|
300
|
-
// (filter?.filter_attribute_data_type === "date" ||
|
|
301
|
-
// filter?.filter_attribute_data_type === "year") &&
|
|
302
|
-
// newOperator !== oldOperator
|
|
303
|
-
// ) {
|
|
304
|
-
// if (newOperator === "today") {
|
|
305
|
-
// setValue(
|
|
306
|
-
// `${filter?.filter_attribute_name}.value`,
|
|
307
|
-
// moment().format("YYYY-MM-DD"),
|
|
308
|
-
// {
|
|
309
|
-
// shouldDirty: true,
|
|
310
|
-
// }
|
|
311
|
-
// );
|
|
312
|
-
// } else if (newOperator === "between") {
|
|
313
|
-
// setValue(`${filter?.filter_attribute_name}.value`, ["", ""], {
|
|
314
|
-
// shouldDirty: true,
|
|
315
|
-
// });
|
|
316
|
-
// } else if (
|
|
317
|
-
// oldOperator === "between" ||
|
|
318
|
-
// oldOperator === "today"
|
|
319
|
-
// ) {
|
|
320
|
-
// setValue(`${filter?.filter_attribute_name}.value`, "", {
|
|
321
|
-
// shouldDirty: true,
|
|
322
|
-
// });
|
|
323
|
-
// }
|
|
324
|
-
// }
|
|
325
|
-
|
|
326
|
-
// onValueChange?.();
|
|
327
|
-
// }}
|
|
328
|
-
// >
|
|
329
|
-
// {dropdownList?.map((item, idx) => (
|
|
330
|
-
// <MenuItem key={idx} value={item.value}>
|
|
331
|
-
// {item.label}
|
|
332
|
-
// </MenuItem>
|
|
333
|
-
// ))}
|
|
334
|
-
// </Select>
|
|
335
|
-
// </FormControl>
|
|
336
|
-
// )}
|
|
337
|
-
// />
|
|
338
|
-
// );
|
|
339
|
-
// };
|
|
340
|
-
|
|
341
|
-
// export default FormDropdown;
|