Fixes date filter chip bugs (#12788)

This PR fixes a bug that occurs during filter operand changes.

As a date filter can contain values that have a different shape, mainly
date ISO string and hard-coded relative dates, changing the operand
without resetting the value to its default was causing a crash.

This PR also extracts the logic that computes the right part of a filter
chip into a util instead of a difficult to understand ternary, thus
solving small bugs in the value displayed also.

Fixes https://github.com/twentyhq/twenty/issues/12778
This commit is contained in:
Lucas Bordeau
2025-06-24 11:29:28 +02:00
committed by GitHub
parent 84b204dcab
commit c56ccf7ed9
4 changed files with 80 additions and 16 deletions

View File

@ -1,12 +1,10 @@
import { useFieldMetadataItemById } from '@/object-metadata/hooks/useFieldMetadataItemById';
import { getCompositeSubFieldLabel } from '@/object-record/object-filter-dropdown/utils/getCompositeSubFieldLabel';
import { getOperandLabelShort } from '@/object-record/object-filter-dropdown/utils/getOperandLabel';
import { isCompositeFieldType } from '@/object-record/object-filter-dropdown/utils/isCompositeFieldType';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { isEmptinessOperand } from '@/object-record/record-filter/utils/isEmptinessOperand';
import { isRecordFilterConsideredEmpty } from '@/object-record/record-filter/utils/isRecordFilterConsideredEmpty';
import { isValidSubFieldName } from '@/settings/data-model/utils/isValidSubFieldName';
import { SortOrFilterChip } from '@/views/components/SortOrFilterChip';
import { getRecordFilterLabelValue } from '@/views/utils/getRecordFilterLabelValue';
import { isNonEmptyString } from '@sniptt/guards';
import { useIcons } from 'twenty-ui/display';
@ -29,9 +27,6 @@ export const EditableFilterChip = ({
const FieldMetadataItemIcon = getIcon(fieldMetadataItem.icon);
const operandLabelShort = getOperandLabelShort(recordFilter.operand);
const operandIsEmptiness = isEmptinessOperand(recordFilter.operand);
const recordFilterSubFieldName = recordFilter.subFieldName;
const subFieldLabel =
@ -48,10 +43,8 @@ export const EditableFilterChip = ({
? `${recordFilter.label} / ${subFieldLabel}`
: recordFilter.label;
const recordFilterIsEmpty = isRecordFilterConsideredEmpty(recordFilter);
const labelKey = `${fieldNameLabel}`;
const labelValue = `${!operandIsEmptiness && !recordFilterIsEmpty ? operandLabelShort : operandIsEmptiness ? ` ${operandLabelShort}` : ''} ${operandIsEmptiness ? '' : recordFilter.displayValue}`;
const labelValue = getRecordFilterLabelValue(recordFilter);
return (
<SortOrFilterChip

View File

@ -0,0 +1,35 @@
import { getOperandLabelShort } from '@/object-record/object-filter-dropdown/utils/getOperandLabel';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { RecordFilterOperand } from '@/object-record/record-filter/types/RecordFilterOperand';
import { isEmptinessOperand } from '@/object-record/record-filter/utils/isEmptinessOperand';
import { isRecordFilterConsideredEmpty } from '@/object-record/record-filter/utils/isRecordFilterConsideredEmpty';
export const getRecordFilterLabelValue = (recordFilter: RecordFilter) => {
const operandLabelShort = getOperandLabelShort(recordFilter.operand);
const operandIsEmptiness = isEmptinessOperand(recordFilter.operand);
const recordFilterIsEmpty = isRecordFilterConsideredEmpty(recordFilter);
const isDateOrDateTimeFilter =
recordFilter.type === 'DATE' || recordFilter.type === 'DATE_TIME';
if (isDateOrDateTimeFilter) {
switch (recordFilter.operand) {
case RecordFilterOperand.IsToday:
case RecordFilterOperand.IsInFuture:
case RecordFilterOperand.IsInPast:
return operandLabelShort;
default:
return `${operandLabelShort} ${recordFilter.displayValue}`;
}
}
if (!operandIsEmptiness && !recordFilterIsEmpty) {
return `${operandLabelShort} ${recordFilter.displayValue}`;
}
if (operandIsEmptiness) {
return `${operandLabelShort}`;
}
return recordFilter.displayValue;
};