From 5f7bdb101c5f994d8e2b8c518087a5b2e5248b70 Mon Sep 17 00:00:00 2001
From: DarkPhoenix2704 <anbarasun123@gmail.com>
Date: Fri, 22 Sep 2023 13:41:33 +0530
Subject: [PATCH] fix: update fields tab

---
 .../smartsheet/column/EditOrAdd.vue           | 21 ++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue b/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
index 1b60419687..764793c103 100644
--- a/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
+++ b/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
@@ -56,6 +56,8 @@ const { appInfo } = useGlobal()
 
 const { betaFeatureToggleState } = useBetaFeatureToggle()
 
+const { openedViewsTab } = storeToRefs(useViewsStore())
+
 const { loadMagic, predictColumnType: _predictColumnType } = useNocoEe()
 
 const meta = inject(MetaInj, ref())
@@ -194,6 +196,10 @@ const handleEscape = (event: KeyboardEvent): void => {
   if (event.key === 'Escape') emit('cancel')
 }
 
+const isFieldsTab = computed(() => {
+  return openedViewsTab.value === 'field'
+})
+
 if (props.fromTableExplorer) {
   watch(
     formState,
@@ -220,8 +226,21 @@ if (props.fromTableExplorer) {
   >
     <a-form v-model="formState" no-style name="column-create-or-edit" layout="vertical" data-testid="add-or-edit-column">
       <div class="flex flex-col gap-2">
+        <a-form-item v-if="isFieldsTab" v-bind="validateInfos.title" class="flex flex-grow">
+          <div
+            class="flex flex-grow px-2 py-1 items-center rounded-lg bg-white hover:bg-gray-100 focus:bg-gray-100 outline-none"
+            style="outline-style: solid; outline-width: thin"
+          >
+            <input
+              ref="antInput"
+              v-model="formState.title"
+              class="flex flex-grow text-lg font-bold outline-none bg-inherit"
+              :contenteditable="true"
+            />
+          </div>
+        </a-form-item>
         <a-form-item
-          v-if="!props.hideTitle"
+          v-if="!props.hideTitle && !isFieldsTab"
           :label="`${columnLabel} ${$t('general.name')}`"
           v-bind="validateInfos.title"
           :required="false"