From 2f7e5f575c2e4161d92ec82a34474a3844b8ffb9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D5=A1=C9=A8=D5=BC=C9=A2=D3=84=D5=A1=D6=85=D5=BC=C9=A2?=
 <wingkwong.code@gmail.com>
Date: Sun, 19 Nov 2023 00:18:51 +0800
Subject: [PATCH] feat(nc-gui): add dateFormat to comparisonOpList &
 comparisonSubOpList

---
 .../smartsheet/toolbar/ColumnFilter.vue       |  33 +-
 packages/nc-gui/utils/filterUtils.ts          | 413 +++++++++---------
 2 files changed, 234 insertions(+), 212 deletions(-)

diff --git a/packages/nc-gui/components/smartsheet/toolbar/ColumnFilter.vue b/packages/nc-gui/components/smartsheet/toolbar/ColumnFilter.vue
index 6d22c8dcf1..e72362e71f 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/ColumnFilter.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/ColumnFilter.vue
@@ -107,12 +107,16 @@ const isFilterDraft = (filter: Filter, col: ColumnType) => {
 
   if (
     filter.comparison_op &&
-    comparisonSubOpList(filter.comparison_op).find((compOp) => compOp.value === filter.comparison_sub_op)?.ignoreVal
+    comparisonSubOpList(filter.comparison_op, col?.meta?.date_format).find((compOp) => compOp.value === filter.comparison_sub_op)
+      ?.ignoreVal
   ) {
     return false
   }
 
-  if (comparisonOpList(col.uidt as UITypes).find((compOp) => compOp.value === filter.comparison_op)?.ignoreVal) {
+  if (
+    comparisonOpList(col.uidt as UITypes, col?.meta?.date_format).find((compOp) => compOp.value === filter.comparison_op)
+      ?.ignoreVal
+  ) {
     return false
   }
 
@@ -145,7 +149,7 @@ const filterUpdateCondition = (filter: FilterType, i: number) => {
     // hence remove the previous value
     filter.value = null
     if (
-      !comparisonSubOpList(filter.comparison_op!)
+      !comparisonSubOpList(filter.comparison_op!, col?.meta?.date_format)
         .map((op) => op.value)
         .includes(filter.comparison_sub_op!)
     ) {
@@ -224,8 +228,9 @@ const selectFilterField = (filter: Filter, index: number) => {
   // since the existing one may not be supported for the new field
   // e.g. `eq` operator is not supported in checkbox field
   // hence, get the first option of the supported operators of the new field
-  filter.comparison_op = comparisonOpList(col.uidt as UITypes).find((compOp) => isComparisonOpAllowed(filter, compOp))
-    ?.value as FilterType['comparison_op']
+  filter.comparison_op = comparisonOpList(col.uidt as UITypes, col?.meta?.date_format).find((compOp) =>
+    isComparisonOpAllowed(filter, compOp),
+  )?.value as FilterType['comparison_op']
 
   if ([UITypes.Date, UITypes.DateTime].includes(col.uidt as UITypes) && !['blank', 'notblank'].includes(filter.comparison_op!)) {
     if (filter.comparison_op === 'isWithin') {
@@ -297,12 +302,16 @@ const addFilterGroup = async () => {
 }
 
 const showFilterInput = (filter: Filter) => {
+  const col = getColumn(filter)
   if (!filter.comparison_op) return false
 
   if (filter.comparison_sub_op) {
-    return !comparisonSubOpList(filter.comparison_op).find((op) => op.value === filter.comparison_sub_op)?.ignoreVal
+    return !comparisonSubOpList(filter.comparison_op, getColumn(filter)?.meta?.date_format).find(
+      (op) => op.value === filter.comparison_sub_op,
+    )?.ignoreVal
   } else {
-    return !comparisonOpList(getColumn(filter)?.uidt as UITypes).find((op) => op.value === filter.comparison_op)?.ignoreVal
+    return !comparisonOpList(col?.uidt as UITypes, col?.meta?.date_format).find((op) => op.value === filter.comparison_op)
+      ?.ignoreVal
   }
 }
 
@@ -427,7 +436,10 @@ onBeforeUnmount(() => {
               dropdown-class-name="nc-dropdown-filter-comp-op"
               @change="filterUpdateCondition(filter, i)"
             >
-              <template v-for="compOp of comparisonOpList(getColumn(filter)?.uidt)" :key="compOp.value">
+              <template
+                v-for="compOp of comparisonOpList(getColumn(filter)?.uidt, getColumn(filter)?.meta?.date_format)"
+                :key="compOp.value"
+              >
                 <a-select-option v-if="isComparisonOpAllowed(filter, compOp)" :value="compOp.value">
                   {{ compOp.text }}
                 </a-select-option>
@@ -450,7 +462,10 @@ onBeforeUnmount(() => {
               dropdown-class-name="nc-dropdown-filter-comp-sub-op"
               @change="filterUpdateCondition(filter, i)"
             >
-              <template v-for="compSubOp of comparisonSubOpList(filter.comparison_op)" :key="compSubOp.value">
+              <template
+                v-for="compSubOp of comparisonSubOpList(filter.comparison_op, getColumn(filter)?.meta?.date_format)"
+                :key="compSubOp.value"
+              >
                 <a-select-option v-if="isComparisonSubOpAllowed(filter, compSubOp)" :value="compSubOp.value">
                   {{ compSubOp.text }}
                 </a-select-option>
diff --git a/packages/nc-gui/utils/filterUtils.ts b/packages/nc-gui/utils/filterUtils.ts
index b1a9d4b982..9f091397da 100644
--- a/packages/nc-gui/utils/filterUtils.ts
+++ b/packages/nc-gui/utils/filterUtils.ts
@@ -1,4 +1,4 @@
-import { UITypes, isNumericCol, numericUITypes } from 'nocodb-sdk'
+import { UITypes, isDateMonthFormat, isNumericCol, numericUITypes } from 'nocodb-sdk'
 
 const getEqText = (fieldUiType: UITypes) => {
   if (isNumericCol(fieldUiType) || fieldUiType === UITypes.Time) {
@@ -70,210 +70,215 @@ const getLteText = (fieldUiType: UITypes) => {
 
 export const comparisonOpList = (
   fieldUiType: UITypes,
+  dateFormat?: string,
 ): {
   text: string
   value: string
   ignoreVal: boolean
   includedTypes?: UITypes[]
   excludedTypes?: UITypes[]
-}[] => [
-  {
-    text: 'is checked',
-    value: 'checked',
-    ignoreVal: true,
-    includedTypes: [UITypes.Checkbox],
-  },
-  {
-    text: 'is not checked',
-    value: 'notchecked',
-    ignoreVal: true,
-    includedTypes: [UITypes.Checkbox],
-  },
-  {
-    text: getEqText(fieldUiType),
-    value: 'eq',
-    ignoreVal: false,
-    excludedTypes: [UITypes.Checkbox, UITypes.MultiSelect, UITypes.Attachment],
-  },
-  {
-    text: getNeqText(fieldUiType),
-    value: 'neq',
-    ignoreVal: false,
-    excludedTypes: [UITypes.Checkbox, UITypes.MultiSelect, UITypes.Attachment],
-  },
-  {
-    text: getLikeText(fieldUiType),
-    value: 'like',
-    ignoreVal: false,
-    excludedTypes: [
-      UITypes.Checkbox,
-      UITypes.SingleSelect,
-      UITypes.MultiSelect,
-      UITypes.Collaborator,
-      UITypes.Date,
-      UITypes.DateTime,
-      UITypes.Time,
-      ...numericUITypes,
-    ],
-  },
-  {
-    text: getNotLikeText(fieldUiType),
-    value: 'nlike',
-    ignoreVal: false,
-    excludedTypes: [
-      UITypes.Checkbox,
-      UITypes.SingleSelect,
-      UITypes.MultiSelect,
-      UITypes.Collaborator,
-      UITypes.Date,
-      UITypes.DateTime,
-      UITypes.Time,
-      ...numericUITypes,
-    ],
-  },
-  {
-    text: 'is empty',
-    value: 'empty',
-    ignoreVal: true,
-    excludedTypes: [
-      UITypes.Checkbox,
-      UITypes.SingleSelect,
-      UITypes.MultiSelect,
-      UITypes.Collaborator,
-      UITypes.Attachment,
-      UITypes.LinkToAnotherRecord,
-      UITypes.Lookup,
-      UITypes.Date,
-      UITypes.DateTime,
-      UITypes.Time,
-      ...numericUITypes,
-    ],
-  },
-  {
-    text: 'is not empty',
-    value: 'notempty',
-    ignoreVal: true,
-    excludedTypes: [
-      UITypes.Checkbox,
-      UITypes.SingleSelect,
-      UITypes.MultiSelect,
-      UITypes.Collaborator,
-      UITypes.Attachment,
-      UITypes.LinkToAnotherRecord,
-      UITypes.Lookup,
-      UITypes.Date,
-      UITypes.DateTime,
-      UITypes.Time,
-      ...numericUITypes,
-    ],
-  },
-  {
-    text: 'is null',
-    value: 'null',
-    ignoreVal: true,
-    excludedTypes: [
-      ...numericUITypes,
-      UITypes.Checkbox,
-      UITypes.SingleSelect,
-      UITypes.MultiSelect,
-      UITypes.Collaborator,
-      UITypes.Attachment,
-      UITypes.LinkToAnotherRecord,
-      UITypes.Lookup,
-      UITypes.Date,
-      UITypes.DateTime,
-      UITypes.Time,
-    ],
-  },
-  {
-    text: 'is not null',
-    value: 'notnull',
-    ignoreVal: true,
-    excludedTypes: [
-      ...numericUITypes,
-      UITypes.Checkbox,
-      UITypes.SingleSelect,
-      UITypes.MultiSelect,
-      UITypes.Collaborator,
-      UITypes.Attachment,
-      UITypes.LinkToAnotherRecord,
-      UITypes.Lookup,
-      UITypes.Date,
-      UITypes.DateTime,
-      UITypes.Time,
-    ],
-  },
-  {
-    text: 'contains all of',
-    value: 'allof',
-    ignoreVal: false,
-    includedTypes: [UITypes.MultiSelect],
-  },
-  {
-    text: 'contains any of',
-    value: 'anyof',
-    ignoreVal: false,
-    includedTypes: [UITypes.MultiSelect, UITypes.SingleSelect],
-  },
-  {
-    text: 'does not contain all of',
-    value: 'nallof',
-    ignoreVal: false,
-    includedTypes: [UITypes.MultiSelect],
-  },
-  {
-    text: 'does not contain any of',
-    value: 'nanyof',
-    ignoreVal: false,
-    includedTypes: [UITypes.MultiSelect, UITypes.SingleSelect],
-  },
-  {
-    text: getGtText(fieldUiType),
-    value: 'gt',
-    ignoreVal: false,
-    includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
-  },
-  {
-    text: getLtText(fieldUiType),
-    value: 'lt',
-    ignoreVal: false,
-    includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
-  },
-  {
-    text: getGteText(fieldUiType),
-    value: 'gte',
-    ignoreVal: false,
-    includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
-  },
-  {
-    text: getLteText(fieldUiType),
-    value: 'lte',
-    ignoreVal: false,
-    includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
-  },
-  {
-    text: 'is within',
-    value: 'isWithin',
-    ignoreVal: true,
-    includedTypes: [UITypes.Date, UITypes.DateTime],
-  },
-  {
-    text: 'is blank',
-    value: 'blank',
-    ignoreVal: true,
-    excludedTypes: [UITypes.Checkbox, UITypes.Links, UITypes.Rollup],
-  },
-  {
-    text: 'is not blank',
-    value: 'notblank',
-    ignoreVal: true,
-    excludedTypes: [UITypes.Checkbox, UITypes.Links, UITypes.Rollup],
-  },
-]
+}[] => {
+  const isDateMonth = dateFormat && isDateMonthFormat(dateFormat)
+  return [
+    {
+      text: 'is checked',
+      value: 'checked',
+      ignoreVal: true,
+      includedTypes: [UITypes.Checkbox],
+    },
+    {
+      text: 'is not checked',
+      value: 'notchecked',
+      ignoreVal: true,
+      includedTypes: [UITypes.Checkbox],
+    },
+    {
+      text: getEqText(fieldUiType),
+      value: 'eq',
+      ignoreVal: false,
+      excludedTypes: [UITypes.Checkbox, UITypes.MultiSelect, UITypes.Attachment],
+    },
+    {
+      text: getNeqText(fieldUiType),
+      value: 'neq',
+      ignoreVal: false,
+      excludedTypes: [UITypes.Checkbox, UITypes.MultiSelect, UITypes.Attachment],
+    },
+    {
+      text: getLikeText(fieldUiType),
+      value: 'like',
+      ignoreVal: false,
+      excludedTypes: [
+        UITypes.Checkbox,
+        UITypes.SingleSelect,
+        UITypes.MultiSelect,
+        UITypes.Collaborator,
+        UITypes.Date,
+        UITypes.DateTime,
+        UITypes.Time,
+        ...numericUITypes,
+      ],
+    },
+    {
+      text: getNotLikeText(fieldUiType),
+      value: 'nlike',
+      ignoreVal: false,
+      excludedTypes: [
+        UITypes.Checkbox,
+        UITypes.SingleSelect,
+        UITypes.MultiSelect,
+        UITypes.Collaborator,
+        UITypes.Date,
+        UITypes.DateTime,
+        UITypes.Time,
+        ...numericUITypes,
+      ],
+    },
+    {
+      text: 'is empty',
+      value: 'empty',
+      ignoreVal: true,
+      excludedTypes: [
+        UITypes.Checkbox,
+        UITypes.SingleSelect,
+        UITypes.MultiSelect,
+        UITypes.Collaborator,
+        UITypes.Attachment,
+        UITypes.LinkToAnotherRecord,
+        UITypes.Lookup,
+        UITypes.Date,
+        UITypes.DateTime,
+        UITypes.Time,
+        ...numericUITypes,
+      ],
+    },
+    {
+      text: 'is not empty',
+      value: 'notempty',
+      ignoreVal: true,
+      excludedTypes: [
+        UITypes.Checkbox,
+        UITypes.SingleSelect,
+        UITypes.MultiSelect,
+        UITypes.Collaborator,
+        UITypes.Attachment,
+        UITypes.LinkToAnotherRecord,
+        UITypes.Lookup,
+        UITypes.Date,
+        UITypes.DateTime,
+        UITypes.Time,
+        ...numericUITypes,
+      ],
+    },
+    {
+      text: 'is null',
+      value: 'null',
+      ignoreVal: true,
+      excludedTypes: [
+        ...numericUITypes,
+        UITypes.Checkbox,
+        UITypes.SingleSelect,
+        UITypes.MultiSelect,
+        UITypes.Collaborator,
+        UITypes.Attachment,
+        UITypes.LinkToAnotherRecord,
+        UITypes.Lookup,
+        UITypes.Date,
+        UITypes.DateTime,
+        UITypes.Time,
+      ],
+    },
+    {
+      text: 'is not null',
+      value: 'notnull',
+      ignoreVal: true,
+      excludedTypes: [
+        ...numericUITypes,
+        UITypes.Checkbox,
+        UITypes.SingleSelect,
+        UITypes.MultiSelect,
+        UITypes.Collaborator,
+        UITypes.Attachment,
+        UITypes.LinkToAnotherRecord,
+        UITypes.Lookup,
+        UITypes.Date,
+        UITypes.DateTime,
+        UITypes.Time,
+      ],
+    },
+    {
+      text: 'contains all of',
+      value: 'allof',
+      ignoreVal: false,
+      includedTypes: [UITypes.MultiSelect],
+    },
+    {
+      text: 'contains any of',
+      value: 'anyof',
+      ignoreVal: false,
+      includedTypes: [UITypes.MultiSelect, UITypes.SingleSelect],
+    },
+    {
+      text: 'does not contain all of',
+      value: 'nallof',
+      ignoreVal: false,
+      includedTypes: [UITypes.MultiSelect],
+    },
+    {
+      text: 'does not contain any of',
+      value: 'nanyof',
+      ignoreVal: false,
+      includedTypes: [UITypes.MultiSelect, UITypes.SingleSelect],
+    },
+    {
+      text: getGtText(fieldUiType),
+      value: 'gt',
+      ignoreVal: false,
+      includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
+    },
+    {
+      text: getLtText(fieldUiType),
+      value: 'lt',
+      ignoreVal: false,
+      includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
+    },
+    {
+      text: getGteText(fieldUiType),
+      value: 'gte',
+      ignoreVal: false,
+      includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
+    },
+    {
+      text: getLteText(fieldUiType),
+      value: 'lte',
+      ignoreVal: false,
+      includedTypes: [...numericUITypes, UITypes.Date, UITypes.DateTime, UITypes.Time],
+    },
+    {
+      text: 'is within',
+      value: 'isWithin',
+      ignoreVal: true,
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
+    },
+    {
+      text: 'is blank',
+      value: 'blank',
+      ignoreVal: true,
+      excludedTypes: [UITypes.Checkbox, UITypes.Links, UITypes.Rollup],
+    },
+    {
+      text: 'is not blank',
+      value: 'notblank',
+      ignoreVal: true,
+      excludedTypes: [UITypes.Checkbox, UITypes.Links, UITypes.Rollup],
+    },
+  ]
+}
 
 export const comparisonSubOpList = (
   // TODO: type
   comparison_op: string,
+  dateFormat?: string,
 ): {
   text: string
   value: string
@@ -281,6 +286,8 @@ export const comparisonSubOpList = (
   includedTypes?: UITypes[]
   excludedTypes?: UITypes[]
 }[] => {
+  const isDateMonth = dateFormat && isDateMonthFormat(dateFormat)
+
   if (comparison_op === 'isWithin') {
     return [
       {
@@ -338,31 +345,31 @@ export const comparisonSubOpList = (
       text: 'today',
       value: 'today',
       ignoreVal: true,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
       text: 'tomorrow',
       value: 'tomorrow',
       ignoreVal: true,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
       text: 'yesterday',
       value: 'yesterday',
       ignoreVal: true,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
       text: 'one week ago',
       value: 'oneWeekAgo',
       ignoreVal: true,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
       text: 'one week from now',
       value: 'oneWeekFromNow',
       ignoreVal: true,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
       text: 'one month ago',
@@ -380,16 +387,16 @@ export const comparisonSubOpList = (
       text: 'number of days ago',
       value: 'daysAgo',
       ignoreVal: false,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
       text: 'number of days from now',
       value: 'daysFromNow',
       ignoreVal: false,
-      includedTypes: [UITypes.Date, UITypes.DateTime],
+      includedTypes: [...(isDateMonth ? [] : [UITypes.Date, UITypes.DateTime])],
     },
     {
-      text: 'exact date',
+      text: isDateMonth ? 'exact month' : 'exact date',
       value: 'exactDate',
       ignoreVal: false,
       includedTypes: [UITypes.Date, UITypes.DateTime],