From 5abe1265c8daf12d690614b387dbd34cbdecbad3 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Fri, 29 Sep 2023 11:02:34 +0530
Subject: [PATCH] fix: i18n for Duration

---
 packages/nc-gui/components/cell/Duration.vue          | 11 +++++++----
 .../components/smartsheet/column/DurationOptions.vue  |  4 ++--
 packages/nc-gui/lang/en.json                          |  3 +++
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/packages/nc-gui/components/cell/Duration.vue b/packages/nc-gui/components/cell/Duration.vue
index 34cc923bf1..c3bc7bb3ea 100644
--- a/packages/nc-gui/components/cell/Duration.vue
+++ b/packages/nc-gui/components/cell/Duration.vue
@@ -23,6 +23,8 @@ const { modelValue, showValidationError = true } = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
+const { t } = useI18n()
+
 const { showNull } = useGlobal()
 
 const column = inject(ColumnInj)
@@ -39,7 +41,9 @@ const isEditColumn = inject(EditColumnInj, ref(false))
 
 const durationType = computed(() => parseProp(column?.value?.meta)?.duration || 0)
 
-const durationPlaceholder = computed(() => (isEditColumn.value ? '(Optional)' : durationOptions[durationType.value].title))
+const durationPlaceholder = computed(() =>
+  isEditColumn.value ? `(${t('labels.optional')})` : durationOptions[durationType.value].title,
+)
 
 const localState = computed({
   get: () => convertMS2Duration(modelValue, durationType.value),
@@ -105,13 +109,12 @@ const focus: VNodeRef = (el) => !isExpandedFormOpen.value && !isEditColumn.value
       @mousedown.stop
     />
 
-    <span v-else-if="modelValue === null && showNull" class="nc-null">NULL</span>
+    <span v-else-if="modelValue === null && showNull" class="nc-null capitalize">{{ $t('general.null') }}</span>
 
     <span v-else> {{ localState }}</span>
 
     <div v-if="showWarningMessage && showValidationError" class="duration-warning">
-      <!-- TODO: i18n -->
-      Please enter a number
+      {{ $t('msg.plsEnterANumber') }}
     </div>
   </div>
 </template>
diff --git a/packages/nc-gui/components/smartsheet/column/DurationOptions.vue b/packages/nc-gui/components/smartsheet/column/DurationOptions.vue
index 688c19c685..d6d844f0a2 100644
--- a/packages/nc-gui/components/smartsheet/column/DurationOptions.vue
+++ b/packages/nc-gui/components/smartsheet/column/DurationOptions.vue
@@ -26,11 +26,11 @@ vModel.value.meta = {
 <template>
   <a-row>
     <a-col :span="24">
-      <span class="prose-sm mt-2">A duration of time in minutes or seconds (e.g. 1:23).</span>
+      <span class="prose-sm mt-2">{{ $t('labels.durationInfo') }}</span>
     </a-col>
 
     <a-col :span="24">
-      <a-form-item label="Duration Format">
+      <a-form-item :label="$t('labels.durationFormat')">
         <a-select v-model:value="vModel.meta.duration" class="w-52" dropdown-class-name="nc-dropdown-duration-option">
           <a-select-option v-for="(duration, i) of durationOptionList" :key="i" :value="duration.id">
             {{ duration.title }}
diff --git a/packages/nc-gui/lang/en.json b/packages/nc-gui/lang/en.json
index 7b531ef434..4f06382922 100644
--- a/packages/nc-gui/lang/en.json
+++ b/packages/nc-gui/lang/en.json
@@ -349,6 +349,8 @@
     "renameFile": "Rename File"
   },
   "labels": {
+    "durationInfo": "A duration of time in minutes or seconds (e.g. 1:23).",
+    "durationFormat": "Duration Format",
     "dateFormat": "Date Format",
     "timeFormat": "Time Format",
     "singularLabel": "Singular Label",
@@ -777,6 +779,7 @@
     "decimal8": "1.00000000"
   },
   "msg": {
+    "plsEnterANumber": "Please enter a number",
     "invalidDate": "Invalid date",
     "invalidLocale": "Invalid locale",
     "invalidCurrencyCode": "Invalid Currency Code",