diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/Paywall.vue b/app/javascript/dashboard/components-next/captain/pageComponents/Paywall.vue index 2b896a905..4da3be357 100644 --- a/app/javascript/dashboard/components-next/captain/pageComponents/Paywall.vue +++ b/app/javascript/dashboard/components-next/captain/pageComponents/Paywall.vue @@ -6,6 +6,13 @@ import { useAccount } from 'dashboard/composables/useAccount'; import BasePaywallModal from 'dashboard/routes/dashboard/settings/components/BasePaywallModal.vue'; +defineProps({ + featurePrefix: { + type: String, + default: 'CAPTAIN', + }, +}); + const router = useRouter(); const currentUser = useMapGetter('getCurrentUser'); @@ -31,7 +38,7 @@ const openBilling = () => { > { ); }); -const hasCustomTools = computed(() => { - return ( - isFeatureEnabledonAccount.value( - accountId.value, - FEATURE_FLAGS.CAPTAIN_CUSTOM_TOOLS - ) || - isFeatureEnabledonAccount.value(accountId.value, FEATURE_FLAGS.CAPTAIN_V2) - ); -}); - const toggleShortcutModalFn = show => { if (show) { emit('openKeyShortcutModal'); @@ -374,18 +364,14 @@ const menuItems = computed(() => { navigationPath: 'captain_assistants_inboxes_index', }), }, - ...(hasCustomTools.value - ? [ - { - name: 'Tools', - label: t('SIDEBAR.CAPTAIN_TOOLS'), - activeOn: ['captain_tools_index'], - to: accountScopedRoute('captain_assistants_index', { - navigationPath: 'captain_tools_index', - }), - }, - ] - : []), + { + name: 'Tools', + label: t('SIDEBAR.CAPTAIN_TOOLS'), + activeOn: ['captain_tools_index'], + to: accountScopedRoute('captain_assistants_index', { + navigationPath: 'captain_tools_index', + }), + }, { name: 'Settings', label: t('SIDEBAR.CAPTAIN_SETTINGS'), diff --git a/app/javascript/dashboard/featureFlags.js b/app/javascript/dashboard/featureFlags.js index b4aa34f88..0cc67db67 100644 --- a/app/javascript/dashboard/featureFlags.js +++ b/app/javascript/dashboard/featureFlags.js @@ -50,6 +50,7 @@ export const FEATURE_FLAGS = { export const PREMIUM_FEATURES = [ FEATURE_FLAGS.SLA, FEATURE_FLAGS.CAPTAIN, + FEATURE_FLAGS.CAPTAIN_CUSTOM_TOOLS, FEATURE_FLAGS.CUSTOM_ROLES, FEATURE_FLAGS.AUDIT_LOGS, FEATURE_FLAGS.HELP_CENTER, diff --git a/app/javascript/dashboard/i18n/locale/en/integrations.json b/app/javascript/dashboard/i18n/locale/en/integrations.json index 1b9caf02f..ad89755e1 100644 --- a/app/javascript/dashboard/i18n/locale/en/integrations.json +++ b/app/javascript/dashboard/i18n/locale/en/integrations.json @@ -838,6 +838,18 @@ "SUCCESS_MESSAGE": "Custom tool deleted successfully", "ERROR_MESSAGE": "Failed to delete custom tool" }, + "PAYWALL": { + "TITLE": "Upgrade to use tools with Captain", + "AVAILABLE_ON": "Captain Tools are only available in Business and Enterprise plans. Please upgrade to Business plan to use the feature.", + "UPGRADE_PROMPT": "", + "UPGRADE_NOW": "Open billing", + "CANCEL_ANYTIME": "" + }, + "ENTERPRISE_PAYWALL": { + "AVAILABLE_ON": "Captain Tools are only available in the paid plans.", + "UPGRADE_PROMPT": "Please upgrade to a paid plan to use this feature.", + "ASK_ADMIN": "Please reach out to your administrator for the upgrade." + }, "TEST": { "BUTTON": "Test connection", "SUCCESS": "Endpoint returned HTTP {status}", diff --git a/app/javascript/dashboard/routes/dashboard/captain/captain.routes.js b/app/javascript/dashboard/routes/dashboard/captain/captain.routes.js index 9fd87ccba..1ab4fa501 100644 --- a/app/javascript/dashboard/routes/dashboard/captain/captain.routes.js +++ b/app/javascript/dashboard/routes/dashboard/captain/captain.routes.js @@ -23,6 +23,12 @@ const meta = { installationTypes: [INSTALLATION_TYPES.CLOUD, INSTALLATION_TYPES.ENTERPRISE], }; +const metaCustomTools = { + permissions: ['administrator', 'agent'], + featureFlag: FEATURE_FLAGS.CAPTAIN_CUSTOM_TOOLS, + installationTypes: [INSTALLATION_TYPES.CLOUD, INSTALLATION_TYPES.ENTERPRISE], +}; + const metaV2 = { permissions: ['administrator', 'agent'], featureFlag: FEATURE_FLAGS.CAPTAIN_V2, @@ -46,7 +52,7 @@ const assistantRoutes = [ path: frontendURL('accounts/:accountId/captain/:assistantId/tools'), component: CustomToolsIndex, name: 'captain_tools_index', - meta, + meta: metaCustomTools, }, { path: frontendURL('accounts/:accountId/captain/:assistantId/scenarios'), diff --git a/app/javascript/dashboard/routes/dashboard/captain/tools/Index.vue b/app/javascript/dashboard/routes/dashboard/captain/tools/Index.vue index ea331dcaf..442c5ae65 100644 --- a/app/javascript/dashboard/routes/dashboard/captain/tools/Index.vue +++ b/app/javascript/dashboard/routes/dashboard/captain/tools/Index.vue @@ -5,13 +5,14 @@ import { FEATURE_FLAGS } from 'dashboard/featureFlags'; import { usePolicy } from 'dashboard/composables/usePolicy'; import PageLayout from 'dashboard/components-next/captain/PageLayout.vue'; +import CaptainPaywall from 'dashboard/components-next/captain/pageComponents/Paywall.vue'; import CustomToolsPageEmptyState from 'dashboard/components-next/captain/pageComponents/emptyStates/CustomToolsPageEmptyState.vue'; import CreateCustomToolDialog from 'dashboard/components-next/captain/pageComponents/customTool/CreateCustomToolDialog.vue'; import CustomToolCard from 'dashboard/components-next/captain/pageComponents/customTool/CustomToolCard.vue'; import DeleteDialog from 'dashboard/components-next/captain/pageComponents/DeleteDialog.vue'; const store = useStore(); -const { isFeatureFlagEnabled } = usePolicy(); +const { isFeatureFlagEnabled, shouldShowPaywall } = usePolicy(); const SOFT_LIMIT = 10; const isV2 = computed(() => isFeatureFlagEnabled(FEATURE_FLAGS.CAPTAIN_V2)); @@ -80,7 +81,9 @@ const onDeleteSuccess = () => { }; onMounted(() => { - fetchCustomTools(); + if (!shouldShowPaywall(FEATURE_FLAGS.CAPTAIN_CUSTOM_TOOLS)) { + fetchCustomTools(); + } }); @@ -89,6 +92,7 @@ onMounted(() => { :header-title="$t('CAPTAIN.CUSTOM_TOOLS.HEADER')" :button-label="$t('CAPTAIN.CUSTOM_TOOLS.ADD_NEW')" :button-policy="['administrator']" + :feature-flag="FEATURE_FLAGS.CAPTAIN_CUSTOM_TOOLS" :total-count="customToolsMeta.totalCount" :current-page="customToolsMeta.page" :show-pagination-footer="!isFetching && !!customTools.length" @@ -98,6 +102,10 @@ onMounted(() => { @update:current-page="onPageChange" @click="openCreateDialog" > + + diff --git a/app/javascript/dashboard/routes/dashboard/settings/components/BasePaywallModal.vue b/app/javascript/dashboard/routes/dashboard/settings/components/BasePaywallModal.vue index 6701d111a..3381a30ed 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/components/BasePaywallModal.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/components/BasePaywallModal.vue @@ -1,4 +1,5 @@