@antscorp/antsomi-ui 1.3.5-beta.474 → 1.3.5-beta.475

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 (5) hide show
  1. package/es/components/organism/DataTable/hooks/useDataTableListing/types.d.ts +1 -1
  2. package/es/components/organism/DataTable/hooks/useDataTableListing/useDataTableListing.js +7 -6
  3. package/es/components/organism/DataTable/types/filter.d.ts +1 -1
  4. package/es/components/organism/DataTable/utils/filter.js +51 -32
  5. package/package.json +1 -1
package/es/components/organism/DataTable/hooks/useDataTableListing/types.d.ts CHANGED
@@ -24,7 +24,7 @@ export type TConfig<TTableType = any> = {
24
24
  filter?: TApiGlobal;
25
25
  search?: TApiGlobal;
26
26
  matchesAny?: {
27
- general: Omit<TApiGlobal, 'params'> & {
27
+ general?: Omit<TApiGlobal, 'params'> & {
28
28
  params?: TMatchesAnyParams;
29
29
  };
30
30
  } & Partial<Record<keyof TTableType, Omit<TApiGlobal, 'params'> & {
package/es/components/organism/DataTable/hooks/useDataTableListing/useDataTableListing.js CHANGED
@@ -139,11 +139,13 @@ export function useDataTableListing(props) {
139
139
  },
140
140
  options: {
141
141
  enabled: !!selectedFilterItem &&
142
- [MATCHES_ANY, NOT_MATCHES, MATCHES].includes(selectedFilterItem.operator),
142
+ [MATCHES_ANY, NOT_MATCHES, MATCHES].includes(selectedFilterItem.operator) &&
143
+ !!matchesAnyRequest,
143
144
  keepPreviousData: true,
144
145
  retry: false,
145
146
  },
146
147
  });
148
+ console.log('getMatchesAnyList', getMatchesAnyList);
147
149
  // Variables
148
150
  const { data: modifyColumnsData, isLoading: isModifyColumnsLoading } = getModifyColumnList || {};
149
151
  const modifyColumnSelected = useDeepCompareMemo(() => { var _a; return ((_a = modifyColumnsData === null || modifyColumnsData === void 0 ? void 0 : modifyColumnsData.find(({ isLasted }) => +isLasted === 1)) === null || _a === void 0 ? void 0 : _a.modifyColId) || ''; }, [modifyColumnsData]);
@@ -176,7 +178,7 @@ export function useDataTableListing(props) {
176
178
  const { data: tableListing, isLoading: isTableListingLoading, isRefetching: isTableListingRefetching, } = getTableListing || {};
177
179
  const { body: tableBody, header: tableHeader, total } = tableListing || {};
178
180
  const { data: searchListingData, isLoading: isSearchListingLoading, isFetching: isSearchListingFetching, } = getSearchListing || {};
179
- const { data: matchesAnyListData, isLoading: isMatchesAnyListLoading } = getMatchesAnyList || {};
181
+ const { data: matchesAnyListData, isLoading: isMatchesAnyListLoading = false } = getMatchesAnyList || {};
180
182
  // Conditionally format search listing data based on the presence of a formatData function in searchProps.
181
183
  // If formatData is defined, use it to format searchListingData.
182
184
  // Otherwise, use the mapResponseSearchToGeneral function to format searchListingData.
@@ -304,11 +306,10 @@ export function useDataTableListing(props) {
304
306
  const matchesAnyProps = (matchesAny === null || matchesAny === void 0 ? void 0 : matchesAny[`${selectedFilterItem === null || selectedFilterItem === void 0 ? void 0 : selectedFilterItem.column}`.toLowerCase()])
305
307
  ? matchesAny === null || matchesAny === void 0 ? void 0 : matchesAny[`${selectedFilterItem === null || selectedFilterItem === void 0 ? void 0 : selectedFilterItem.column}`.toLowerCase()]
306
308
  : matchesAny === null || matchesAny === void 0 ? void 0 : matchesAny.general;
307
- if (matchesAnyListData) {
308
- return matchesAnyProps.formatData(matchesAnyListData);
309
- }
309
+ return matchesAnyProps.formatData(matchesAnyListData);
310
310
  return [];
311
311
  }, [matchesAny, matchesAnyListData, selectedFilterItem === null || selectedFilterItem === void 0 ? void 0 : selectedFilterItem.column]);
312
+ console.log('matchesAnyList', matchesAnyList);
312
313
  // Effects
313
314
  /**
314
315
  * Update values from local storage to state
@@ -526,7 +527,7 @@ export function useDataTableListing(props) {
526
527
  filterMetrics,
527
528
  matchesAny: {
528
529
  list: matchesAnyList,
529
- isLoading: isMatchesAnyListLoading,
530
+ isLoading: isMatchesAnyListLoading && !!matchesAnyRequest,
530
531
  },
531
532
  onSaveFilter,
532
533
  onChangeFilters,
package/es/components/organism/DataTable/types/filter.d.ts CHANGED
@@ -28,7 +28,7 @@ export interface FilterItem {
28
28
  dataType?: string;
29
29
  operator: string;
30
30
  type?: number;
31
- value: string;
31
+ value: any;
32
32
  }
33
33
  export type TOnSaveFilterArgs = {
34
34
  existSavedFilter?: SavedFilterItem;
package/es/components/organism/DataTable/utils/filter.js CHANGED
@@ -114,13 +114,28 @@ export const renderValueField = ({ filterMetric, operator, value, matchesAny, on
114
114
  return (React.createElement(FormatInputNumber, { value: value, placeholder: `${t(translations.format)}: 1,234.560`, onChange: onChangeValue, style: { width: '100%' } }));
115
115
  }
116
116
  case OPERATORS_CODE.BETWEEN: {
117
- const [firstValue, secondValue] = typeof value === 'string' ? value === null || value === void 0 ? void 0 : value.split(' AND ') : [];
118
- return (React.createElement(Flex, { align: "center", gap: 10 },
119
- React.createElement(FormatInputNumber, { value: firstValue || undefined, max: secondValue, style: { width: '100%' }, onChange: value => onChangeValue(`${value || ''} AND ${secondValue || ''}`) }),
120
- React.createElement(Text, { style: { flexShrink: 0, textTransform: 'lowercase' } }, t(translations.and.title).toString()),
121
- React.createElement(FormatInputNumber, { value: secondValue || undefined, min: firstValue, style: { width: '100%' }, onChange: value => onChangeValue(`${firstValue || ''} AND ${value || ''}`) })));
117
+ const renderBetweenValue = () => {
118
+ const [firstValue, secondValue] = typeof value === 'string' ? value === null || value === void 0 ? void 0 : value.split(' AND ') : [];
119
+ switch (dataType) {
120
+ case METRIC_TYPE.DATE:
121
+ case METRIC_TYPE.DATE_TIME: {
122
+ return (React.createElement(React.Fragment, null,
123
+ React.createElement(DatePicker, { placeholder: DATE_TIME_FORMAT_DISPLAY.FILTER_CONDITION, format: DATE_TIME_FORMAT_DISPLAY.FILTER_CONDITION, allowClear: false, popupClassName: EXCEPTION_OFF_FILTER_CLASS, value: dayjs(firstValue).isValid() ? dayjs(firstValue) : undefined, onChange: value => onChangeValue(`${value || ''} AND ${secondValue || ''}`) }),
124
+ React.createElement(Text, { style: { flexShrink: 0, textTransform: 'lowercase' } }, t(translations.and.title).toString()),
125
+ React.createElement(DatePicker, { placeholder: DATE_TIME_FORMAT_DISPLAY.FILTER_CONDITION, format: DATE_TIME_FORMAT_DISPLAY.FILTER_CONDITION, allowClear: false, popupClassName: EXCEPTION_OFF_FILTER_CLASS, value: dayjs(secondValue).isValid() ? dayjs(secondValue) : undefined, onChange: value => onChangeValue(`${value || ''} AND ${secondValue || ''}`) })));
126
+ }
127
+ default: {
128
+ return (React.createElement(React.Fragment, null,
129
+ React.createElement(FormatInputNumber, { value: firstValue || undefined, max: secondValue, style: { width: '100%' }, onChange: value => onChangeValue(`${value || ''} AND ${secondValue || ''}`) }),
130
+ React.createElement(Text, { style: { flexShrink: 0, textTransform: 'lowercase' } }, t(translations.and.title).toString()),
131
+ React.createElement(FormatInputNumber, { value: secondValue || undefined, min: firstValue, style: { width: '100%' }, onChange: value => onChangeValue(`${firstValue || ''} AND ${value || ''}`) })));
132
+ }
133
+ }
134
+ };
135
+ return (React.createElement(Flex, { vertical: true, gap: 20 }, renderBetweenValue()));
122
136
  }
123
137
  case OPERATORS_CODE.EQUALS:
138
+ case OPERATORS_CODE.IS:
124
139
  case OPERATORS_CODE.NOT_EQUALS: {
125
140
  switch (dataType) {
126
141
  // Return InputNumber Field
@@ -188,33 +203,37 @@ export const mapRulesToFilters = (rules) => rules.map(({ dataType, metricCode, o
188
203
  operator: operatorValue,
189
204
  value: filterValue,
190
205
  }));
191
- export const mapFiltersToApiFilters = (filters, includeDataType = false) => filters.map(({ column, operator, value, dataType }) => {
192
- let serializeValue = '';
193
- switch (operator) {
194
- case MATCHES:
195
- case MATCHES_ANY:
196
- case NOT_MATCHES: {
197
- if (Array.isArray(value)) {
198
- serializeValue = value.map(item => item.key);
206
+ export const mapFiltersToApiFilters = (filters, includeDataType = false) => {
207
+ const serializedFilters = filters.map(({ column, operator, value, dataType }) => {
208
+ let serializeValue = '';
209
+ switch (operator) {
210
+ case MATCHES:
211
+ case MATCHES_ANY:
212
+ case NOT_MATCHES: {
213
+ if (Array.isArray(value)) {
214
+ // Check if value is object the return object.key otherwise return this value
215
+ serializeValue = value.map(item => (typeof item === 'object' ? item.key || item : item));
216
+ }
217
+ break;
199
218
  }
200
- break;
201
- }
202
- /** Date time */
203
- case AFTER:
204
- case AFTER_DATE:
205
- case BEFORE:
206
- case ON:
207
- case BEFORE_DATE: {
208
- if (dayjs(value).isValid()) {
209
- serializeValue = dayjs(value).format(DATE_TIME_FORMAT.FILTER_CONDITION);
219
+ /** Date time */
220
+ case AFTER:
221
+ case AFTER_DATE:
222
+ case BEFORE:
223
+ case ON:
224
+ case BEFORE_DATE: {
225
+ if (dayjs(value).isValid()) {
226
+ serializeValue = dayjs(value).format(DATE_TIME_FORMAT.FILTER_CONDITION);
227
+ }
228
+ break;
210
229
  }
211
- break;
230
+ default:
231
+ serializeValue = value;
232
+ break;
212
233
  }
213
- default:
214
- serializeValue = value;
215
- break;
216
- }
217
- return {
218
- [column]: Object.assign({ [operator]: serializeValue }, (includeDataType && { dataType: METRIC_MAP_STRING_TYPE[dataType || 'string'] })),
219
- };
220
- });
234
+ return {
235
+ [column]: Object.assign({ [operator]: serializeValue }, (includeDataType && { dataType: METRIC_MAP_STRING_TYPE[dataType || 'string'] })),
236
+ };
237
+ });
238
+ return serializedFilters;
239
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.474",
3
+ "version": "1.3.5-beta.475",
4
4
  "description": "An enterprise-class UI design language and React UI library.",
5
5
  "sideEffects": [
6
6
  "dist/*",