From 6f6e54b1b5bf8ec6198ab022ca90d9368ada0a94 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Mon, 9 Dec 2024 08:25:41 +0000
Subject: [PATCH] fix(nc-gui): prompt ester egg pending issues

---
 .../dashboard/TreeView/CreateViewBtn.vue      |   3 +-
 .../smartsheet/column/LongTextOptions.vue     | 136 +++++++++---------
 .../smartsheet/topbar/ViewListDropdown.vue    |  22 ++-
 3 files changed, 83 insertions(+), 78 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue b/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
index bb031307d3..b415c40bb9 100644
--- a/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
@@ -16,7 +16,6 @@ const { refreshCommandPalette } = useCommandPalette()
 const viewsStore = useViewsStore()
 const { loadViews, navigateToView } = viewsStore
 
-const { aiIntegrationAvailable } = useNocoAi()
 const { isFeatureEnabled } = useBetaFeatureToggle()
 
 const table = inject(SidebarTableInj)!
@@ -197,7 +196,7 @@ async function onOpenModal({
             <GeneralIcon v-else class="plus" icon="plus" />
           </div>
         </NcMenuItem>
-        <template v-if="aiIntegrationAvailable && isFeatureEnabled(FEATURE_FLAG.AI_FEATURES)">
+        <template v-if="isFeatureEnabled(FEATURE_FLAG.AI_FEATURES)">
           <NcDivider />
           <NcMenuItem data-testid="sidebar-view-create-ai" @click="onOpenModal({ type: 'AI' })">
             <div class="item">
diff --git a/packages/nc-gui/components/smartsheet/column/LongTextOptions.vue b/packages/nc-gui/components/smartsheet/column/LongTextOptions.vue
index 68502d38f8..60a8ebe8a7 100644
--- a/packages/nc-gui/components/smartsheet/column/LongTextOptions.vue
+++ b/packages/nc-gui/components/smartsheet/column/LongTextOptions.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { UITypes } from 'nocodb-sdk'
+import { isAIPromptCol, UITypes } from 'nocodb-sdk'
 
 const props = defineProps<{
   modelValue: any
@@ -105,6 +105,15 @@ const generate = async () => {
   generatingPreview.value = false
 }
 
+const isPromptEnabled = computed(() => {
+  console.log('isAiPrompt', isAIPromptCol(column.value))
+  if (isEdit.value) {
+    return isAIPromptCol(column.value)
+  }
+
+  return isFeatureEnabled(FEATURE_FLAG.AI_FEATURES)
+})
+
 onMounted(() => {
   // set default value
   vModel.value.prompt_raw = (column?.value?.colOptions as Record<string, any>)?.prompt_raw || ''
@@ -183,11 +192,10 @@ watch(
       </NcTooltip>
     </a-form-item>
 
-    <template v-if="isFeatureEnabled(FEATURE_FLAG.AI_FEATURES)">
-      <div class="relative">
-        <a-form-item class="flex items-center">
-          <NcTooltip :disabled="!richMode" class="flex items-center">
-            <template #title> Generate text using AI is not supported when rich text formatting is enabled </template>
+    <div v-if="isPromptEnabled" class="relative">
+      <a-form-item class="flex items-center">
+        <NcTooltip :disabled="!richMode" class="flex items-center">
+          <template #title> Generate text using AI is not supported when rich text formatting is enabled </template>
 
             <NcSwitch
               v-model:checked="isEnabledGenerateText"
@@ -215,66 +223,66 @@ watch(
           </NcTooltip>
           <div class="flex-1"></div>
 
-          <div class="absolute right-0">
-            <AiSettings
-              v-model:fk-integration-id="vModel.fk_integration_id"
-              v-model:model="vModel.model"
-              v-model:randomness="vModel.randomness"
-              :workspace-id="activeWorkspaceId"
-              :show-tooltip="false"
-              :is-edit-column="isEdit"
-              placement="bottomRight"
+        <div class="absolute right-0">
+          <AiSettings
+            v-model:fk-integration-id="vModel.fk_integration_id"
+            v-model:model="vModel.model"
+            v-model:randomness="vModel.randomness"
+            :workspace-id="activeWorkspaceId"
+            :show-tooltip="false"
+            :is-edit-column="isEdit"
+            placement="bottomRight"
+          >
+            <NcButton size="xs" theme="ai" class="!px-1" type="text">
+              <GeneralIcon icon="settings" />
+            </NcButton>
+          </AiSettings>
+        </div>
+      </a-form-item>
+    </div>
+    <template v-if="isPromptEnabled && (!isEdit ? aiIntegrationAvailable && isEnabledGenerateText : isEnabledGenerateText)">
+      <a-form-item class="flex">
+        <div class="nc-prompt-input-wrapper bg-nc-bg-gray-light rounded-lg w-full">
+          <AiPromptWithFields
+            v-model="vModel.prompt_raw"
+            :options="availableFields"
+            :read-only="!aiIntegrationAvailable"
+            placeholder="Write custom AI Prompt instruction here"
+            prompt-field-tag-class-name="!text-nc-content-purple-dark font-weight-500"
+            suggestion-icon-class-name="!text-nc-content-purple-medium"
+          />
+          <div class="rounded-b-lg flex items-center gap-1.5 p-1">
+            <GeneralIcon icon="info" class="!text-nc-content-purple-medium w-3.5 h-3.5" />
+            <span class="text-xs text-nc-content-gray-subtle2"
+              >Mention fields using curly braces, e.g. <span class="text-nc-content-purple-dark">{Field name}</span>.</span
             >
-              <NcButton size="xs" theme="ai" class="!px-1" type="text">
-                <GeneralIcon icon="settings" />
-              </NcButton>
-            </AiSettings>
-          </div>
-        </a-form-item>
-      </div>
-      <template v-if="!isEdit ? aiIntegrationAvailable && isEnabledGenerateText : isEnabledGenerateText">
-        <a-form-item class="flex">
-          <div class="nc-prompt-input-wrapper bg-nc-bg-gray-light rounded-lg w-full">
-            <AiPromptWithFields
-              v-model="vModel.prompt_raw"
-              :options="availableFields"
-              :read-only="!aiIntegrationAvailable"
-              placeholder="Write custom AI Prompt instruction here"
-              prompt-field-tag-class-name="!text-nc-content-purple-dark font-weight-500"
-              suggestion-icon-class-name="!text-nc-content-purple-medium"
-            />
-            <div class="rounded-b-lg flex items-center gap-1.5 p-1">
-              <GeneralIcon icon="info" class="!text-nc-content-purple-medium w-3.5 h-3.5" />
-              <span class="text-xs text-nc-content-gray-subtle2"
-                >Mention fields using curly braces, e.g. <span class="text-nc-content-purple-dark">{Field name}</span>.</span
-              >
-            </div>
           </div>
-        </a-form-item>
-        <div v-if="aiIntegrationAvailable && isEnabledGenerateText" class="nc-ai-options-preview overflow-hidden">
-          <div>
-            <div
-              class="flex items-center gap-2 transition-all duration-300"
-              :class="{
-                'pl-3 py-2 pr-2': !isAlreadyGenerated,
-                'pl-3 py-1 pr-1 border-b-1 border-nc-border-gray-medium': isAlreadyGenerated,
-              }"
-            >
-              <div class="flex flex-col flex-1 gap-1">
-                <div class="flex items-center gap-2">
-                  <span class="text-sm font-bold text-nc-content-gray-subtle">Preview</span>
-                  <NcTooltip class="flex cursor-pointer">
-                    <template #title> Preview is generated using the first record in this table</template>
-                    <GeneralIcon
-                      icon="info"
-                      class="text-nc-content-gray-muted hover:text-nc-content-gray-subtle opacity-70 w-3.5 h-3.5"
-                    />
-                  </NcTooltip>
-                </div>
-                <span v-if="!isAlreadyGenerated" class="text-[11px] leading-[18px] text-nc-content-gray-muted">
-                  Include at least 1 field in prompt.
-                </span>
+        </div>
+      </a-form-item>
+      <div v-if="aiIntegrationAvailable && isEnabledGenerateText" class="nc-ai-options-preview overflow-hidden">
+        <div>
+          <div
+            class="flex items-center gap-2 transition-all duration-300"
+            :class="{
+              'pl-3 py-2 pr-2': !isAlreadyGenerated,
+              'pl-3 py-1 pr-1 border-b-1 border-nc-border-gray-medium': isAlreadyGenerated,
+            }"
+          >
+            <div class="flex flex-col flex-1 gap-1">
+              <div class="flex items-center gap-2">
+                <span class="text-sm font-bold text-nc-content-gray-subtle">Preview</span>
+                <NcTooltip class="flex cursor-pointer">
+                  <template #title> Preview is generated using the first record in this table</template>
+                  <GeneralIcon
+                    icon="info"
+                    class="text-nc-content-gray-muted hover:text-nc-content-gray-subtle opacity-70 w-3.5 h-3.5"
+                  />
+                </NcTooltip>
               </div>
+              <span v-if="!isAlreadyGenerated" class="text-[11px] leading-[18px] text-nc-content-gray-muted">
+                Include at least 1 field in prompt.
+              </span>
+            </div>
 
               <NcTooltip :disabled="isPreviewEnabled">
                 <template #title> Include at least 1 field in prompt to generate </template>
@@ -328,7 +336,7 @@ watch(
       </template>
     </template>
 
-    <AiIntegrationNotFound v-if="!aiIntegrationAvailable && isEnabledGenerateText" />
+    <AiIntegrationNotFound v-if="!aiIntegrationAvailable && isEnabledGenerateText && isPromptEnabled" />
   </div>
 </template>
 
diff --git a/packages/nc-gui/components/smartsheet/topbar/ViewListDropdown.vue b/packages/nc-gui/components/smartsheet/topbar/ViewListDropdown.vue
index bbff1e7506..c44a7f8287 100644
--- a/packages/nc-gui/components/smartsheet/topbar/ViewListDropdown.vue
+++ b/packages/nc-gui/components/smartsheet/topbar/ViewListDropdown.vue
@@ -21,7 +21,7 @@ const { loadViews, navigateToView } = viewsStore
 
 const { refreshCommandPalette } = useCommandPalette()
 
-const { aiIntegrationAvailable } = useNocoAi()
+const { isFeatureEnabled } = useBetaFeatureToggle()
 
 const isOpen = ref<boolean>(false)
 
@@ -254,17 +254,15 @@ async function onOpenModal({
                   </div>
                 </a-menu-item>
 
-                <NcDivider />
-                <a-menu-item
-                  v-if="aiIntegrationAvailable"
-                  data-testid="sidebar-view-create-ai"
-                  @click="onOpenModal({ type: 'AI' })"
-                >
-                  <div class="nc-viewlist-submenu-popup-item">
-                    <GeneralIcon icon="ncAutoAwesome" class="!w-4 !h-4 text-nc-fill-purple-dark" />
-                    <div>{{ $t('labels.aiSuggested') }}</div>
-                  </div>
-                </a-menu-item>
+                <template v-if="isFeatureEnabled(FEATURE_FLAG.AI_FEATURES)">
+                  <NcDivider />
+                  <a-menu-item data-testid="sidebar-view-create-ai" @click="onOpenModal({ type: 'AI' })">
+                    <div class="nc-viewlist-submenu-popup-item">
+                      <GeneralIcon icon="ncAutoAwesome" class="!w-4 !h-4 text-nc-fill-purple-dark" />
+                      <div>{{ $t('labels.aiSuggested') }}</div>
+                    </div>
+                  </a-menu-item>
+                </template>
               </a-sub-menu>
             </a-menu>
           </div>