diff --git a/packages/nc-gui-v2/components/cell/DatePicker.vue b/packages/nc-gui-v2/components/cell/DatePicker.vue
index fe28acbc81..b259bdfe3e 100644
--- a/packages/nc-gui-v2/components/cell/DatePicker.vue
+++ b/packages/nc-gui-v2/components/cell/DatePicker.vue
@@ -1,14 +1,11 @@
 <script setup lang="ts">
 import dayjs from 'dayjs'
-import customParseFormat from 'dayjs/plugin/customParseFormat'
-
 import { ColumnInj, ReadonlyInj } from '~/context'
+
 const { modelValue } = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
-dayjs.extend(customParseFormat)
-
 interface Props {
   modelValue: string
 }
@@ -38,7 +35,7 @@ const localState = $computed({
       return
     }
 
-    if (val?.isValid()) {
+    if (val.isValid()) {
       emit('update:modelValue', val?.format('YYYY-MM-DD'))
     }
   },
diff --git a/packages/nc-gui-v2/utils/dateTimeUtils.ts b/packages/nc-gui-v2/utils/dateTimeUtils.ts
index e545ee290c..5f66d396df 100644
--- a/packages/nc-gui-v2/utils/dateTimeUtils.ts
+++ b/packages/nc-gui-v2/utils/dateTimeUtils.ts
@@ -2,8 +2,11 @@ import dayjs from 'dayjs'
 
 import relativeTime from 'dayjs/plugin/relativeTime'
 import utc from 'dayjs/plugin/utc'
+import customParseFormat from 'dayjs/plugin/customParseFormat'
+
 dayjs.extend(utc)
 dayjs.extend(relativeTime)
+dayjs.extend(customParseFormat)
 
 export const timeAgo = (date: any) => {
   return dayjs.utc(date).fromNow()