diff --git a/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/ContactForm.tsx b/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/ContactForm.tsx index 881bd7b7d8..0a48ff808c 100644 --- a/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/ContactForm.tsx +++ b/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/ContactForm.tsx @@ -17,7 +17,7 @@ import { isEmail } from "utils/formhelpers"; import ReduxFormTextField from "components/utils/ReduxFormTextField"; import { PRICING_PAGE_URL } from "constants/ThirdPartyConstants"; import { getAppsmithConfigs } from "ee/configs"; -import { getInstanceId, isFreePlan } from "ee/selectors/tenantSelectors"; +import { getInstanceId } from "ee/selectors/tenantSelectors"; import { pricingPageUrlSource } from "ee/utils/licenseHelpers"; import { RampFeature, RampSection } from "utils/ProductRamps/RampsControlList"; import { @@ -29,6 +29,8 @@ import { shouldLearnMoreButtonBeVisible, } from "./Helpers"; import { PREMIUM_INTEGRATION_CONTACT_FORM } from "./Constants"; +import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; +import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; const FormWrapper = styled.form` display: flex; @@ -41,7 +43,8 @@ const PremiumDatasourceContactForm = ( ) => { const instanceId = useSelector(getInstanceId); const appsmithConfigs = getAppsmithConfigs(); - const isFreePlanInstance = useSelector(isFreePlan); + // We are using this feature flag to identify whether its the enterprise/business user - ref : https://www.notion.so/appsmith/Condition-for-showing-Premium-Soon-tag-datasources-184fe271b0e2802cb55bd63f468df60d + const isGACEnabled = useFeatureFlag(FEATURE_FLAG.license_gac_enabled); const redirectPricingURL = PRICING_PAGE_URL( appsmithConfigs.pricingUrl, @@ -68,24 +71,20 @@ const PremiumDatasourceContactForm = ( }, [redirectPricingURL, props.email, props.integrationName]); const submitEvent = useCallback(() => { - handleSubmitEvent( - props.integrationName, - props.email || "", - !isFreePlanInstance, - ); - }, [props.email, props.integrationName, isFreePlanInstance]); + handleSubmitEvent(props.integrationName, props.email || "", isGACEnabled); + }, [props.email, props.integrationName, isGACEnabled]); return ( <> - {getContactFormModalTitle(props.integrationName, !isFreePlanInstance)} + {getContactFormModalTitle(props.integrationName, isGACEnabled)} {getContactFormModalDescription( props.email || "", props.integrationName, - !isFreePlanInstance, + isGACEnabled, )} - {shouldLearnMoreButtonBeVisible(!isFreePlanInstance) && ( + {shouldLearnMoreButtonBeVisible(isGACEnabled) && ( diff --git a/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx b/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx index d585771198..0e314dca93 100644 --- a/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx +++ b/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx @@ -4,10 +4,10 @@ import { Modal, ModalContent, Tag } from "@appsmith/ads"; import styled from "styled-components"; import ContactForm from "./ContactForm"; import { getTagText, handlePremiumDatasourceClick } from "./Helpers"; -import { isFreePlan } from "ee/selectors/tenantSelectors"; -import { useSelector } from "react-redux"; import DatasourceItem from "../DatasourceItem"; import type { PremiumIntegration } from "./Constants"; +import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; +import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; const ModalContentWrapper = styled(ModalContent)` max-width: 518px; @@ -36,9 +36,10 @@ export default function PremiumDatasources(props: { plugins: PremiumIntegration[]; }) { const [selectedIntegration, setSelectedIntegration] = useState(""); - const isFreePlanInstance = useSelector(isFreePlan); + // We are using this feature flag to identify whether its the enterprise/business user - ref : https://www.notion.so/appsmith/Condition-for-showing-Premium-Soon-tag-datasources-184fe271b0e2802cb55bd63f468df60d + const isGACEnabled = useFeatureFlag(FEATURE_FLAG.license_gac_enabled); const handleOnClick = (name: string) => { - handlePremiumDatasourceClick(name, !isFreePlanInstance); + handlePremiumDatasourceClick(name, isGACEnabled); setSelectedIntegration(name); }; @@ -61,11 +62,11 @@ export default function PremiumDatasources(props: { name={integration.name} rightSibling={ - {getTagText(!isFreePlanInstance)} + {getTagText(isGACEnabled)} } />