Follow-up high fixes on date refactor (#15553)
This PR fixes important bugs on date filter handling following-up date refactor. Fixes : https://github.com/twentyhq/core-team-issues/issues/1814
This commit is contained in:
+5
-4
@@ -4,7 +4,7 @@ import { getFieldMetadataItemByIdOrThrow } from '@/object-metadata/utils/getFiel
|
||||
import { MAX_RECORDS_TO_DISPLAY } from '@/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordSelect';
|
||||
import { type RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
|
||||
import { useRecordsForSelect } from '@/object-record/select/hooks/useRecordsForSelect';
|
||||
import { useGetRecordFilterLabelValue } from '@/views/hooks/useGetRecordFilterLabelValue';
|
||||
import { useGetRecordFilterChipLabelValue } from '@/views/hooks/useGetRecordFilterChipLabelValue';
|
||||
|
||||
import { t } from '@lingui/core/macro';
|
||||
import {
|
||||
@@ -17,12 +17,13 @@ type ObjectFilterDropdownRecordSelectProps = {
|
||||
recordFilter: RecordFilter;
|
||||
};
|
||||
|
||||
// TODO: refactor this with new useGetRecordFilterDisplayValue
|
||||
export const useComputeRecordRelationFilterLabelValue = ({
|
||||
recordFilter,
|
||||
}: ObjectFilterDropdownRecordSelectProps) => {
|
||||
const { objectMetadataItems } = useObjectMetadataItems();
|
||||
|
||||
const { getRecordFilterLabelValue } = useGetRecordFilterLabelValue();
|
||||
const { getRecordFilterChipLabelValue } = useGetRecordFilterChipLabelValue();
|
||||
|
||||
if (!isDefined(recordFilter.fieldMetadataId)) {
|
||||
throw new Error('fieldMetadataItemUsedInFilterDropdown is not defined');
|
||||
@@ -87,13 +88,13 @@ export const useComputeRecordRelationFilterLabelValue = ({
|
||||
return {
|
||||
labelValue:
|
||||
labelValueItems.length > 0
|
||||
? getRecordFilterLabelValue({
|
||||
? getRecordFilterChipLabelValue({
|
||||
recordFilter: {
|
||||
...recordFilter,
|
||||
displayValue: filterDisplayValue,
|
||||
},
|
||||
})
|
||||
: getRecordFilterLabelValue({
|
||||
: getRecordFilterChipLabelValue({
|
||||
recordFilter,
|
||||
}),
|
||||
};
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
import { getOperandLabelShort } from '@/object-record/object-filter-dropdown/utils/getOperandLabel';
|
||||
import { useGetRecordFilterDisplayValue } from '@/object-record/record-filter/hooks/useGetRecordFilterDisplayValue';
|
||||
import { type RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
|
||||
import { isRecordFilterConsideredEmpty } from '@/object-record/record-filter/utils/isRecordFilterConsideredEmpty';
|
||||
import { isEmptinessOperand } from 'twenty-shared/utils';
|
||||
|
||||
export const useGetRecordFilterChipLabelValue = () => {
|
||||
const { getRecordFilterDisplayValue } = useGetRecordFilterDisplayValue();
|
||||
|
||||
const getRecordFilterChipLabelValue = ({
|
||||
recordFilter,
|
||||
}: {
|
||||
recordFilter: RecordFilter;
|
||||
}) => {
|
||||
const operandLabelShort = getOperandLabelShort(recordFilter.operand);
|
||||
const operandIsEmptiness = isEmptinessOperand(recordFilter.operand);
|
||||
const recordFilterIsEmpty = isRecordFilterConsideredEmpty(recordFilter);
|
||||
|
||||
const recordFilterDisplayValue = getRecordFilterDisplayValue(recordFilter);
|
||||
|
||||
if (!operandIsEmptiness && !recordFilterIsEmpty) {
|
||||
return `${operandLabelShort} ${recordFilterDisplayValue}`;
|
||||
}
|
||||
|
||||
if (operandIsEmptiness) {
|
||||
return `${operandLabelShort}`;
|
||||
}
|
||||
|
||||
return recordFilterDisplayValue;
|
||||
};
|
||||
|
||||
return { getRecordFilterChipLabelValue };
|
||||
};
|
||||
@@ -1,149 +0,0 @@
|
||||
import { type FieldMetadataItemOption } from '@/object-metadata/types/FieldMetadataItem';
|
||||
import { useGetDateTimeFilterDisplayValue } from '@/object-record/object-filter-dropdown/hooks/useGetDateTimeFilterDisplayValue';
|
||||
import { getOperandLabelShort } from '@/object-record/object-filter-dropdown/utils/getOperandLabel';
|
||||
import { getRelativeDateDisplayValue } from '@/object-record/object-filter-dropdown/utils/getRelativeDateDisplayValue';
|
||||
import { type RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
|
||||
import { RecordFilterOperand } from '@/object-record/record-filter/types/RecordFilterOperand';
|
||||
import { isRecordFilterConsideredEmpty } from '@/object-record/record-filter/utils/isRecordFilterConsideredEmpty';
|
||||
import { useUserTimezone } from '@/ui/input/components/internal/date/hooks/useUserTimezone';
|
||||
import { UserContext } from '@/users/contexts/UserContext';
|
||||
import { isValid } from 'date-fns';
|
||||
import { useContext } from 'react';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import {
|
||||
getDateFromPlainDate,
|
||||
isEmptinessOperand,
|
||||
parseJson,
|
||||
relativeDateFilterStringifiedSchema,
|
||||
shiftPointInTimeFromTimezoneDifferenceInMinutesWithSystemTimezone,
|
||||
} from 'twenty-shared/utils';
|
||||
import { dateLocaleState } from '~/localization/states/dateLocaleState';
|
||||
import { formatDateString } from '~/utils/string/formatDateString';
|
||||
|
||||
export const useGetRecordFilterLabelValue = () => {
|
||||
const { dateFormat, timeZone } = useContext(UserContext);
|
||||
const dateLocale = useRecoilValue(dateLocaleState);
|
||||
const { userTimezone } = useUserTimezone();
|
||||
|
||||
const { getDateTimeFilterDisplayValue } = useGetDateTimeFilterDisplayValue();
|
||||
|
||||
const getRecordFilterLabelValue = ({
|
||||
recordFilter,
|
||||
fieldMetadataOptions,
|
||||
}: {
|
||||
recordFilter: RecordFilter;
|
||||
fieldMetadataOptions?: FieldMetadataItemOption[];
|
||||
}) => {
|
||||
const operandLabelShort = getOperandLabelShort(recordFilter.operand);
|
||||
const operandIsEmptiness = isEmptinessOperand(recordFilter.operand);
|
||||
const recordFilterIsEmpty = isRecordFilterConsideredEmpty(recordFilter);
|
||||
|
||||
if (recordFilter.type === 'DATE') {
|
||||
switch (recordFilter.operand) {
|
||||
case RecordFilterOperand.IS: {
|
||||
const date = getDateFromPlainDate(recordFilter.value);
|
||||
|
||||
const shiftedDate =
|
||||
shiftPointInTimeFromTimezoneDifferenceInMinutesWithSystemTimezone(
|
||||
date,
|
||||
userTimezone,
|
||||
'add',
|
||||
);
|
||||
|
||||
if (!isValid(date)) {
|
||||
return `${operandLabelShort}`;
|
||||
}
|
||||
|
||||
const formattedDate = formatDateString({
|
||||
value: shiftedDate.toISOString(),
|
||||
timeZone,
|
||||
dateFormat,
|
||||
localeCatalog: dateLocale.localeCatalog,
|
||||
});
|
||||
|
||||
return `${operandLabelShort} ${formattedDate}`;
|
||||
}
|
||||
case RecordFilterOperand.IS_RELATIVE: {
|
||||
const relativeDateFilter =
|
||||
relativeDateFilterStringifiedSchema.safeParse(recordFilter.value);
|
||||
|
||||
if (!relativeDateFilter.success) {
|
||||
return `${operandLabelShort}`;
|
||||
}
|
||||
|
||||
const relativeDateDisplayValue = getRelativeDateDisplayValue(
|
||||
relativeDateFilter.data,
|
||||
);
|
||||
|
||||
return `${operandLabelShort} ${relativeDateDisplayValue}`;
|
||||
}
|
||||
case RecordFilterOperand.IS_TODAY:
|
||||
case RecordFilterOperand.IS_IN_FUTURE:
|
||||
case RecordFilterOperand.IS_IN_PAST:
|
||||
return operandLabelShort;
|
||||
default:
|
||||
return `${operandLabelShort} ${recordFilter.displayValue}`;
|
||||
}
|
||||
} else if (recordFilter.type === 'DATE_TIME') {
|
||||
switch (recordFilter.operand) {
|
||||
case RecordFilterOperand.IS:
|
||||
case RecordFilterOperand.IS_AFTER:
|
||||
case RecordFilterOperand.IS_BEFORE: {
|
||||
const pointInTime = new Date(recordFilter.value);
|
||||
|
||||
const { displayValue } = getDateTimeFilterDisplayValue(pointInTime);
|
||||
|
||||
return `${operandLabelShort} ${displayValue}`;
|
||||
}
|
||||
case RecordFilterOperand.IS_RELATIVE: {
|
||||
const relativeDateFilter =
|
||||
relativeDateFilterStringifiedSchema.safeParse(recordFilter.value);
|
||||
|
||||
if (!relativeDateFilter.success) {
|
||||
return `${operandLabelShort}`;
|
||||
}
|
||||
|
||||
const relativeDateDisplayValue = getRelativeDateDisplayValue(
|
||||
relativeDateFilter.data,
|
||||
);
|
||||
|
||||
return `${operandLabelShort} ${relativeDateDisplayValue}`;
|
||||
}
|
||||
case RecordFilterOperand.IS_TODAY:
|
||||
case RecordFilterOperand.IS_IN_FUTURE:
|
||||
case RecordFilterOperand.IS_IN_PAST:
|
||||
return operandLabelShort;
|
||||
default:
|
||||
return `${operandLabelShort} ${recordFilter.displayValue}`;
|
||||
}
|
||||
} else if (
|
||||
recordFilter.type === 'SELECT' ||
|
||||
recordFilter.type === 'MULTI_SELECT'
|
||||
) {
|
||||
const valueArray = parseJson<string[]>(recordFilter.value);
|
||||
|
||||
if (!Array.isArray(valueArray)) {
|
||||
return '';
|
||||
}
|
||||
|
||||
const optionLabels = valueArray.map(
|
||||
(value) =>
|
||||
fieldMetadataOptions?.find((option) => option.value === value)?.label,
|
||||
);
|
||||
|
||||
return `${operandLabelShort} ${optionLabels.join(', ')}`;
|
||||
}
|
||||
|
||||
if (!operandIsEmptiness && !recordFilterIsEmpty) {
|
||||
return `${operandLabelShort} ${recordFilter.displayValue}`;
|
||||
}
|
||||
|
||||
if (operandIsEmptiness) {
|
||||
return `${operandLabelShort}`;
|
||||
}
|
||||
|
||||
return recordFilter.displayValue;
|
||||
};
|
||||
|
||||
return { getRecordFilterLabelValue };
|
||||
};
|
||||
Reference in New Issue
Block a user