diff --git a/app/javascript/dashboard/i18n/locale/en/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/en/inboxMgmt.json index 07506c20f..365ddff1d 100644 --- a/app/javascript/dashboard/i18n/locale/en/inboxMgmt.json +++ b/app/javascript/dashboard/i18n/locale/en/inboxMgmt.json @@ -59,7 +59,6 @@ "ERROR_AUTH": "There was an error connecting to Instagram, please try again", "NEW_INBOX_SUGGESTION": "This Instagram account was previously linked to a different inbox and has now been migrated here. All new messages will appear here. The old inbox will no longer be able to send or receive messages for this account.", "DUPLICATE_INBOX_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. You won’t be able to send/receive Instagram messages from this inbox anymore.", - "RESTRICTED_WARNING": "Instagram inbox creation is temporarily unavailable due to current Instagram platform restrictions. We’ll restore support as soon as possible.", "SETTINGS_RESTRICTED_WARNING": "Instagram is currently restricted. Some messages or actions may be delayed or unavailable while we restore full support.", "STATUS_LINK": "View status update" }, diff --git a/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConfig.js b/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConfig.js index 3d19943d3..5d50cad29 100644 --- a/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConfig.js +++ b/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConfig.js @@ -1,4 +1,6 @@ import { useMapGetter } from 'dashboard/composables/store'; +import { useAccount } from 'dashboard/composables/useAccount'; +import { FEATURE_FLAGS } from 'dashboard/featureFlags'; // OAuth/SDK channels need installation-level app credentials to be usable. When // the credential is missing the channel is "not configured" and is hidden from @@ -8,6 +10,7 @@ import { useMapGetter } from 'dashboard/composables/store'; export function useChannelConfig() { const globalConfig = useMapGetter('globalConfig/get'); const isOnChatwootCloud = useMapGetter('globalConfig/isOnChatwootCloud'); + const { isCloudFeatureEnabled } = useAccount(); const installationConfig = window.chatwootConfig || {}; const CHANNEL_CONFIGURED = { @@ -20,7 +23,8 @@ export function useChannelConfig() { Boolean(installationConfig.whatsappConfigurationId), facebook: () => Boolean(installationConfig.fbAppId), instagram: () => - !isOnChatwootCloud.value && Boolean(installationConfig.instagramAppId), + Boolean(installationConfig.instagramAppId) && + isCloudFeatureEnabled(FEATURE_FLAGS.CHANNEL_INSTAGRAM), tiktok: () => Boolean(installationConfig.tiktokAppId), gmail: () => Boolean(installationConfig.googleOAuthClientId), outlook: () => Boolean(globalConfig.value.azureAppId), diff --git a/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConnect.js b/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConnect.js index 57411c43c..bd34d5f20 100644 --- a/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConnect.js +++ b/app/javascript/dashboard/routes/dashboard/onboarding/inbox-setup/useChannelConnect.js @@ -1,7 +1,6 @@ import { useI18n } from 'vue-i18n'; import { useAlert } from 'dashboard/composables'; import { useStore } from 'dashboard/composables/store'; -import { useAccount } from 'dashboard/composables/useAccount'; import { useWhatsappEmbeddedSignup } from 'dashboard/composables/useWhatsappEmbeddedSignup'; import { parseAPIErrorResponse } from 'dashboard/store/utils/api'; import googleClient from 'dashboard/api/channel/googleClient'; @@ -24,17 +23,11 @@ export function useChannelConnect() { const { t } = useI18n(); const store = useStore(); const { runEmbeddedSignup } = useWhatsappEmbeddedSignup(); - const { isOnChatwootCloud } = useAccount(); const connectViaOAuth = async provider => { const client = OAUTH_CLIENTS[provider]; if (!client) return; - if (provider === 'instagram' && isOnChatwootCloud.value) { - useAlert(t('INBOX_MGMT.ADD.INSTAGRAM.RESTRICTED_WARNING')); - return; - } - try { const { data: { url }, diff --git a/app/javascript/dashboard/routes/dashboard/onboarding/specs/inbox-setup/useDetectedChannels.spec.js b/app/javascript/dashboard/routes/dashboard/onboarding/specs/inbox-setup/useDetectedChannels.spec.js index 7bc39adf1..9e8e5e3db 100644 --- a/app/javascript/dashboard/routes/dashboard/onboarding/specs/inbox-setup/useDetectedChannels.spec.js +++ b/app/javascript/dashboard/routes/dashboard/onboarding/specs/inbox-setup/useDetectedChannels.spec.js @@ -13,6 +13,7 @@ vi.mock('vue-router'); // channel_type, social ordering) derived from CHANNEL_LIST. const mountComposable = ({ brandInfo, + features = { channel_instagram: true }, inboxes = [], isOnChatwootCloud = false, } = {}) => { @@ -30,8 +31,11 @@ const mountComposable = ({ getters: { getAccount: () => () => ({ id: 1, + features, custom_attributes: { brand_info: brandInfo }, }), + isFeatureEnabledonAccount: () => (_accountId, feature) => + Boolean(features[feature]), }, }, inboxes: { @@ -207,7 +211,7 @@ describe('useDetectedChannels', () => { ]); }); - it('hides Instagram from onboarding on Chatwoot Cloud', () => { + it('keeps Instagram available on Chatwoot Cloud when enabled for the account', () => { const { displayedChannels } = mountComposable({ isOnChatwootCloud: true, brandInfo: { @@ -218,6 +222,24 @@ describe('useDetectedChannels', () => { }, }); + expect(displayedChannels.value.map(channel => channel.type)).toEqual([ + 'instagram', + 'tiktok', + ]); + }); + + it('hides Instagram when disabled for the account', () => { + const { displayedChannels } = mountComposable({ + features: { channel_instagram: false }, + isOnChatwootCloud: true, + brandInfo: { + socials: [ + { type: 'instagram', url: 'https://instagram.com/acme' }, + { type: 'tiktok', url: 'https://tiktok.com/@acme' }, + ], + }, + }); + expect(displayedChannels.value.map(channel => channel.type)).toEqual([ 'tiktok', ]); diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue index ee7abe9a9..253a41cd4 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue @@ -1,23 +1,15 @@