fix: handles premium integrations based on release and license flags

app/client/src/ce/entities/FeatureFlag.ts

@@ -57,6 +57,8 @@ export const FEATURE_FLAG = {
   release_table_custom_sort_function_enabled:
     "release_table_custom_sort_function_enabled",
   release_git_package_enabled: "release_git_package_enabled",
+  license_external_saas_plugins_enabled:
+    "license_external_saas_plugins_enabled",
 } as const;
 
 export type FeatureFlag = keyof typeof FEATURE_FLAG;
@@ -105,6 +107,7 @@ export const DEFAULT_FEATURE_FLAG_VALUE: FeatureFlags = {
   license_multi_org_enabled: false,
   release_table_custom_sort_function_enabled: false,
   release_git_package_enabled: false,
+  license_external_saas_plugins_enabled: false,
 };
 
 export const AB_TESTING_EVENT_KEYS = {

app/client/src/ce/selectors/entitiesSelector.ts

@@ -124,6 +124,10 @@ export const getDatasourcesGroupedByPluginCategory = createSelector(
     return <DatasourceGroupByPluginCategory>groupBy(datasources, (d) => {
       const plugin = groupedPlugins[d.pluginId];
 
+      if (!plugin) {
+        return PluginCategory.SAAS;
+      }
+
       if (
         plugin.type === PluginType.SAAS ||
         plugin.type === PluginType.REMOTE ||

app/client/src/pages/Editor/DataSidePane/DataSidePane.tsx

@@ -124,7 +124,7 @@ export const DataSidePane = (props: DataSidePaneProps) => {
                   startIcon: (
                     <DatasourceIcon
                       src={getAssetUrl(
-                        groupedPlugins[data.pluginId].iconLocation,
+                        groupedPlugins[data.pluginId]?.iconLocation || "",
                       )}
                     />
                   ),

app/client/src/pages/Editor/IntegrationEditor/APIOrSaasPlugins.tsx

@@ -79,7 +79,7 @@ interface CreateAPIOrSaasPluginsProps {
   authApiPlugin?: Plugin;
   restAPIVisible?: boolean;
   graphQLAPIVisible?: boolean;
-  isGACEnabled?: boolean;
+  isIntegrationsEnabledForPaid?: boolean;
 }
 
 export const API_ACTION = {
@@ -234,7 +234,7 @@ function APIOrSaasPlugins(props: CreateAPIOrSaasPluginsProps) {
           rightSibling={isCreating && <Spinner className="cta" size={"sm"} />}
         />
       ))}
-      {!props.isGACEnabled && (
+      {!props.isIntegrationsEnabledForPaid && (
         <PremiumDatasources plugins={props.premiumPlugins} />
       )}
     </DatasourceContainer>
@@ -281,13 +281,16 @@ function CreateAPIOrSaasPlugins(props: CreateAPIOrSaasPluginsProps) {
         </DatasourceSectionHeading>
         <APIOrSaasPlugins {...props} />
       </DatasourceSection>
-      {props.premiumPlugins.length > 0 && props.isGACEnabled ? (
+      {props.premiumPlugins.length > 0 && props.isIntegrationsEnabledForPaid ? (
         <DatasourceSection id="upcoming-saas-integrations">
           <DatasourceSectionHeading kind="heading-m">
             {createMessage(UPCOMING_SAAS_INTEGRATIONS)}
           </DatasourceSectionHeading>
           <DatasourceContainer data-testid="upcoming-datasource-card-container">
-            <PremiumDatasources isGACEnabled plugins={props.premiumPlugins} />
+            <PremiumDatasources
+              isIntegrationsEnabledForPaid
+              plugins={props.premiumPlugins}
+            />
           </DatasourceContainer>
         </DatasourceSection>
       ) : null}
@@ -342,10 +345,9 @@ const mapStateToProps = (
     FEATURE_FLAG.release_external_saas_plugins_enabled,
   );
 
-  // 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 = selectFeatureFlagCheck(
+  const isIntegrationsEnabledForPaid = selectFeatureFlagCheck(
     state,
-    FEATURE_FLAG.license_gac_enabled,
+    FEATURE_FLAG.license_external_saas_plugins_enabled,
   );
 
   const pluginNames = allPlugins.map((plugin) =>
@@ -355,7 +357,10 @@ const mapStateToProps = (
   const premiumPlugins =
     props.showSaasAPIs && props.isPremiumDatasourcesViewEnabled
       ? (filterSearch(
-          getFilteredPremiumIntegrations(isExternalSaasEnabled, pluginNames),
+          getFilteredPremiumIntegrations(
+            isExternalSaasEnabled || isIntegrationsEnabledForPaid,
+            pluginNames,
+          ),
           searchedPlugin,
         ) as PremiumIntegration[])
       : [];
@@ -380,7 +385,7 @@ const mapStateToProps = (
     restAPIVisible,
     graphQLAPIVisible,
     isCreating: props.isCreating || getDatasourcesLoadingState(state),
-    isGACEnabled,
+    isIntegrationsEnabledForPaid,
   };
 };
 

app/client/src/pages/Editor/IntegrationEditor/EmptySearchedPlugins.tsx

@@ -43,6 +43,12 @@ export default function EmptySearchedPlugins({
       FEATURE_FLAG.release_external_saas_plugins_enabled,
     ),
   );
+  const isIntegrationsEnabledForPaid = useSelector((state) =>
+    selectFeatureFlagCheck(
+      state,
+      FEATURE_FLAG.license_external_saas_plugins_enabled,
+    ),
+  );
 
   const pluginNames = plugins.map((plugin) => plugin.name.toLocaleLowerCase());
 
@@ -53,7 +59,10 @@ export default function EmptySearchedPlugins({
         { name: createMessage(CREATE_NEW_DATASOURCE_AUTHENTICATED_REST_API) },
         ...mockDatasources,
         ...(isPremiumDatasourcesViewEnabled
-          ? getFilteredPremiumIntegrations(isExternalSaasEnabled, pluginNames)
+          ? getFilteredPremiumIntegrations(
+              isExternalSaasEnabled || isIntegrationsEnabledForPaid,
+              pluginNames,
+            )
           : []),
       ],
       searchedPlugin,

app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx

@@ -27,11 +27,11 @@ const PremiumTag = styled(Tag)`
 
 export default function PremiumDatasources(props: {
   plugins: PremiumIntegration[];
-  isGACEnabled?: boolean;
+  isIntegrationsEnabledForPaid?: boolean;
 }) {
   const [selectedIntegration, setSelectedIntegration] = useState<string>("");
   const handleOnClick = (name: string) => {
-    handlePremiumDatasourceClick(name, props.isGACEnabled);
+    handlePremiumDatasourceClick(name, props.isIntegrationsEnabledForPaid);
     setSelectedIntegration(name);
   };
 
@@ -53,7 +53,7 @@ export default function PremiumDatasources(props: {
           key={integration.name}
           name={integration.name}
           rightSibling={
-            !props.isGACEnabled && (
+            !props.isIntegrationsEnabledForPaid && (
               <PremiumTag isClosable={false} kind={"premium"}>
                 {createMessage(PREMIUM_DATASOURCES.PREMIUM_TAG)}
               </PremiumTag>