Date filter improvements

[Bonapara]

Current behavior

Users can only filter dates with the Greater than and Less than filters.

Desired behavior

We want to rename Greater than to Is After We want to rename Less than to Is Before

We want to introduce some new filters:

• Is
• Is Empty
• Is Not Empty
• Is Relative

Is Relative

1. Values: Past, Next, This
2. Number
3. Day, Week, Month, Year

We should reflect the selected values in the calendar. For instance, if someone chooses "This Week," it should be displayed in the calendar as selected.

Figma

https://www.figma.com/design/xt8O9mFeLl46C5InWwoMrN/Twenty?node-id=2709-52753&t=jqRWyAJosBHzOW0I-11

[greptile-apps[bot]]

Implementation Steps

1. Rename Existing Filters

   • Update isMatchingDateFilter.ts to rename Greater than to Is After and Less than to Is Before.

     // isMatchingDateFilter.ts
     const filterMap = {
     'Is After': (date, value) => date > value,
     'Is Before': (date, value) => date < value,
     // other filters
     };

2. Add New Filters

   • Extend isMatchingDateFilter.ts to include new filters: Is, Is Empty, Is Not Empty, Is Relative to today.

     // isMatchingDateFilter.ts
     const filterMap = {
     'Is': (date, value) => date === value,
     'Is Empty': (date) => !date,
     'Is Not Empty': (date) => !!date,
     'Is Relative to today': (date, value) => {
     // Implement relative date logic
     },
     // existing filters
     };

3. Update GraphQL Input Types

   • Modify date-time-filter.input-type.ts to include new filter types.

     // date-time-filter.input-type.ts
     export const DateTimeFilterInputType = new GraphQLInputObjectType({
     name: 'DateTimeFilterInput',
     fields: {
     is: { type: GraphQLString },
     isEmpty: { type: GraphQLBoolean },
     isNotEmpty: { type: GraphQLBoolean },
     isRelativeToToday: { type: GraphQLString },
     // existing fields
     }
     });

4. Update Filter Operand Types

   • Add new operand types in ViewFilterOperand.ts.

     // ViewFilterOperand.ts
     export enum ViewFilterOperand {
     Is = 'Is',
     IsEmpty = 'IsEmpty',
     IsNotEmpty = 'IsNotEmpty',
     IsRelativeToToday = 'IsRelativeToToday',
     // existing operands
     }

5. Update Tests

   • Add test cases in isMatchingDateFilter.spec.ts for new filters.

     // isMatchingDateFilter.spec.ts
     describe('isMatchingDateFilter', () => {
     it('should match Is filter', () => {
     // test implementation
     });
     it('should match Is Empty filter', () => {
     // test implementation
     });
     it('should match Is Not Empty filter', () => {
     // test implementation
     });
     it('should match Is Relative to today filter', () => {
     // test implementation
     });
     // existing tests
     });

References

[Bonapara]

Related to https://github.com/twentyhq/twenty/issues/6299 that should be handled first