feat: add captain disabled for hacker plan

app/javascript/dashboard/i18n/locale/en/settings.json

@@ -345,7 +345,8 @@
       "DESCRIPTION": "Manage usage and credits for Captain AI.",
       "BUTTON_TXT": "Buy more credits",
       "DOCUMENTS": "Documents",
-      "RESPONSES": "Responses"
+      "RESPONSES": "Responses",
+      "UPGRADE": "Captain is not available on the free plan, upgrade now to get access to assistants, copilot and more."
     },
     "CHAT_WITH_US": {
       "TITLE": "Need help?",

app/javascript/dashboard/routes/dashboard/settings/billing/Index.vue

@@ -4,6 +4,7 @@ import { useMapGetter, useStore } from 'dashboard/composables/store.js';
 import { useAccount } from 'dashboard/composables/useAccount';
 import { useCamelCase } from 'dashboard/composables/useTransformKeys';
 import { format } from 'date-fns';
+import { FEATURE_FLAGS } from 'dashboard/featureFlags';
 
 import BillingMeter from './components/BillingMeter.vue';
 import BillingCard from './components/BillingCard.vue';
@@ -13,7 +14,7 @@ import BaseSettingsHeader from '../components/BaseSettingsHeader.vue';
 import SettingsLayout from '../SettingsLayout.vue';
 import ButtonV4 from 'next/button/Button.vue';
 
-const { currentAccount } = useAccount();
+const { currentAccount, isCloudFeatureEnabled } = useAccount();
 
 const uiFlags = useMapGetter('accounts/getUIFlags');
 const store = useStore();
@@ -44,6 +45,10 @@ const subscriptionRenewsOn = computed(() => {
   return format(endDate, 'dd MMM, yyyy');
 });
 
+const captainEnabled = computed(() => {
+  return isCloudFeatureEnabled(FEATURE_FLAGS.CAPTAIN);
+});
+
 const captainLimits = computed(() => {
   return currentAccount.value?.limits?.captain;
 });
@@ -140,6 +145,7 @@ onMounted(fetchAccountDetails);
           </div>
         </BillingCard>
         <BillingCard
+          v-if="captainEnabled"
           :title="$t('BILLING_SETTINGS.CAPTAIN.TITLE')"
           :description="$t('BILLING_SETTINGS.CAPTAIN.DESCRIPTION')"
         >
@@ -161,6 +167,17 @@ onMounted(fetchAccountDetails);
             />
           </div>
         </BillingCard>
+        <BillingCard
+          v-else
+          :title="$t('BILLING_SETTINGS.CAPTAIN.TITLE')"
+          :description="$t('BILLING_SETTINGS.CAPTAIN.UPGRADE')"
+        >
+          <template #action>
+            <ButtonV4 sm solid slate @click="onClickBillingPortal">
+              {{ $t('CAPTAIN.PAYWALL.UPGRADE_NOW') }}
+            </ButtonV4>
+          </template>
+        </BillingCard>
 
         <BillingHeader
           class="px-1 mt-5"