Merge pull request #4757 from Infisical/fix/upgrade-plan-notice-in-popup

fix: Pro/Enterprise plan clarification in ui popup

frontend/src/components/pki-syncs/PkiSyncSelect.tsx

@@ -69,7 +69,10 @@ export const PkiSyncSelect = ({ onSelect }: Props) => {
               type="button"
               onClick={() =>
                 enterprise && !subscription.enterpriseCertificateSyncs
-                  ? handlePopUpOpen("upgradePlan")
+                  ? handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true,
+                      text: "You can use every Certificate Sync if you switch to Infisical's Enterprise plan."
+                    })
                   : onSelect(destination)
               }
               className="group relative flex h-28 cursor-pointer flex-col items-center justify-center overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600"
@@ -148,6 +151,7 @@ export const PkiSyncSelect = ({ onSelect }: Props) => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         text="You can use every Certificate Sync if you switch to Infisical's Enterprise plan."
       />
     </div>

frontend/src/components/secret-syncs/SecretSyncSelect.tsx

@@ -67,7 +67,9 @@ export const SecretSyncSelect = ({ onSelect }: Props) => {
               type="button"
               onClick={() =>
                 enterprise && !subscription.enterpriseSecretSyncs
-                  ? handlePopUpOpen("upgradePlan")
+                  ? handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    })
                   : onSelect(destination)
               }
               className="group relative flex h-28 cursor-pointer flex-col items-center justify-center overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600"
@@ -145,6 +147,7 @@ export const SecretSyncSelect = ({ onSelect }: Props) => {
       )}
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can use every Secret Sync if you switch to Infisical's Enterprise plan."
       />

frontend/src/layouts/PamLayout/PamLayout.tsx

@@ -18,7 +18,10 @@ export const PamLayout = () => {
 
   useEffect(() => {
     if (subscription && !subscription.pam) {
-      handlePopUpOpen("upgradePlan");
+      handlePopUpOpen("upgradePlan", {
+        description: "You can use PAM if you switch to Infisical's Enterprise plan.",
+        isEnterpriseFeature: true
+      });
     }
   }, [subscription]);
 
@@ -111,7 +114,8 @@ export const PamLayout = () => {
         onOpenChange={(isOpen) => {
           handlePopUpToggle("upgradePlan", isOpen);
         }}
-        text="You can use PAM if you switch to a paid Infisical plan."
+        text={popUp.upgradePlan.data?.description}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </>
   );

frontend/src/pages/admin/EncryptionPage/components/EncryptionPageForm.tsx

@@ -54,6 +54,7 @@ export const EncryptionPageForm = () => {
 
     if (!subscription.hsm) {
       handlePopUpOpen("upgradePlan", {
+        isEnterpriseFeature: true,
         description: "Hardware Security Module's (HSM's), are only available on Enterprise plans."
       });
       return;
@@ -146,6 +147,7 @@ export const EncryptionPageForm = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text={(popUp.upgradePlan?.data as { description: string })?.description}
+        isEnterpriseFeature={popUp.upgradePlan?.data?.isEnterpriseFeature}
       />
     </>
   );

frontend/src/pages/cert-manager/CertificatesPage/components/CertificateTemplatesSection.tsx

@@ -104,6 +104,7 @@ export const CertificateTemplatesSection = ({ caId }: Props) => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         text="Managing template enrollment options for EST is only available on Infisical's Enterprise plan."
       />
     </div>

frontend/src/pages/cert-manager/CertificatesPage/components/CertificateTemplatesTable.tsx

@@ -36,6 +36,7 @@ type Props = {
     data?: {
       id?: string;
       name?: string;
+      isEnterpriseFeature?: boolean;
     }
   ) => void;
 };
@@ -90,7 +91,9 @@ export const CertificateTemplatesTable = ({ handlePopUpOpen, caId }: Props) => {
                               <DropdownMenuItem
                                 onClick={() => {
                                   if (!subscription?.pkiEst) {
-                                    handlePopUpOpen("upgradePlan");
+                                    handlePopUpOpen("upgradePlan", {
+                                      isEnterpriseFeature: true
+                                    });
                                     return;
                                   }
 

frontend/src/pages/cert-manager/PkiTemplateListPage/PkiTemplateListPage.tsx

@@ -203,7 +203,9 @@ export const PkiTemplateListPage = () => {
                                       onClick={(e) => {
                                         e.stopPropagation();
                                         if (!subscription.pkiEst) {
-                                          handlePopUpOpen("estUpgradePlan");
+                                          handlePopUpOpen("estUpgradePlan", {
+                                            isEnterpriseFeature: true
+                                          });
                                           return;
                                         }
                                         handlePopUpOpen("enrollmentOptions", {
@@ -296,6 +298,7 @@ export const PkiTemplateListPage = () => {
         isOpen={popUp.estUpgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("estUpgradePlan", isOpen)}
         text="You can only configure template enrollment methods if you switch to Infisical's Enterprise plan."
+        isEnterpriseFeature={popUp.estUpgradePlan.data?.isEnterpriseFeature}
       />
     </>
   );

frontend/src/pages/kms/KmipPage/components/KmipClientTable.tsx

@@ -170,7 +170,9 @@ export const KmipClientTable = () => {
                 leftIcon={<FontAwesomeIcon icon={faPlus} />}
                 onClick={() => {
                   if (subscription && !subscription.kmip) {
-                    handlePopUpOpen("upgradePlan");
+                    handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    });
                     return;
                   }
 
@@ -343,6 +345,7 @@ export const KmipClientTable = () => {
           isOpen={popUp.upgradePlan.isOpen}
           onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
           text="KMIP requires an enterprise plan."
+          isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         />
       </div>
     </motion.div>

frontend/src/pages/organization/AccessManagementPage/components/OrgGroupsTab/components/OrgGroupsSection/OrgGroupsSection.tsx

@@ -27,7 +27,8 @@ export const OrgGroupsSection = () => {
     if (!subscription?.groups) {
       handlePopUpOpen("upgradePlan", {
         description:
-          "You can manage users more efficiently with groups if you upgrade your Infisical plan to an Enterprise license."
+          "You can manage users more efficiently with groups if you upgrade your Infisical plan to an Enterprise license.",
+        isEnterpriseFeature: true
       });
     } else {
       handlePopUpOpen("group");
@@ -92,6 +93,7 @@ export const OrgGroupsSection = () => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         text={(popUp.upgradePlan?.data as { description: string })?.description}
       />
     </div>

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModalContent.tsx

@@ -291,7 +291,8 @@ export const IdentityAuthMethodModalContent = ({
       <UpgradePlanModal
         isOpen={popUp?.upgradePlan?.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-        text="You can use IP allowlisting if you switch to Infisical's Pro plan."
+        text={`You can use ${popUp.upgradePlan.data?.featureName ?? "IP allowlisting"} if you switch to Infisical's ${popUp.upgradePlan.data?.isEnterpriseFeature ? "Enterprise" : "Pro"} plan.`}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </>
   );

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityLdapAuthForm.tsx

@@ -147,7 +147,10 @@ const schema = z
 export type FormData = z.infer<typeof schema>;
 
 type Props = {
-  handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
+  handlePopUpOpen: (
+    popUpName: keyof UsePopUpState<["upgradePlan"]>,
+    data?: { isEnterpriseFeature?: boolean; featureName?: string }
+  ) => void;
   handlePopUpToggle: (
     popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
@@ -304,7 +307,10 @@ export const IdentityLdapAuthForm = ({
 
   useEffect(() => {
     if (!subscription?.ldap) {
-      handlePopUpOpen("upgradePlan");
+      handlePopUpOpen("upgradePlan", {
+        isEnterpriseFeature: true,
+        featureName: "LDAP authentication"
+      });
       handlePopUpToggle("identityAuthMethod", false);
     }
   }, [subscription, handlePopUpOpen, handlePopUpToggle]);

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentitySection.tsx

@@ -163,7 +163,7 @@ export const IdentitySection = withPermission(
                     if (!isMoreIdentitiesAllowed && !isEnterprise) {
                       handlePopUpOpen("upgradePlan", {
                         description:
-                          "You can add more identities if you upgrade your Infisical plan."
+                          "You can add more identities if you upgrade your Infisical Pro plan."
                       });
                       return;
                     }
@@ -209,7 +209,11 @@ export const IdentitySection = withPermission(
                   leftIcon={<FontAwesomeIcon icon={faPlus} />}
                   onClick={() => {
                     if (subscription && !subscription.machineIdentityAuthTemplates) {
-                      handlePopUpOpen("upgradePlan");
+                      handlePopUpOpen("upgradePlan", {
+                        isEnterpriseFeature: true,
+                        description:
+                          "You can use Identity Auth Templates if you switch to Infisical's Enterprise plan."
+                      });
                       return;
                     }
                     handlePopUpOpen("createTemplate");
@@ -279,7 +283,8 @@ export const IdentitySection = withPermission(
         <UpgradePlanModal
           isOpen={popUp.upgradePlan.isOpen}
           onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-          text="You can use Identity Auth Templates if you switch to Infisical's Enterprise plan."
+          text={popUp.upgradePlan.data?.description}
+          isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         />
       </div>
     );

frontend/src/pages/organization/AccessManagementPage/components/OrgMembersTab/components/OrgMembersSection/OrgMembersSection.tsx

@@ -75,7 +75,7 @@ export const OrgMembersSection = () => {
 
     if (!isMoreIdentitiesAllowed && !isEnterprise) {
       handlePopUpOpen("upgradePlan", {
-        description: "You can add more members if you upgrade your Infisical plan."
+        description: "You can add more members if you switch to Infisical's Pro plan."
       });
       return;
     }

frontend/src/pages/organization/AccessManagementPage/components/OrgMembersTab/components/OrgMembersSection/OrgMembersTable.tsx

@@ -133,7 +133,8 @@ export const OrgMembersTable = ({
 
       if (isCustomRole && subscription && !subscription?.rbac) {
         handlePopUpOpen("upgradePlan", {
-          description: "You can assign custom roles to members if you upgrade your Infisical plan."
+          description:
+            "You can assign custom roles to members if you switch to Infisical's Pro plan."
         });
         return;
       }

frontend/src/pages/organization/AccessManagementPage/components/OrgRoleTabSection/OrgRoleTable.tsx

@@ -104,7 +104,7 @@ export const OrgRoleTable = () => {
     if (isCustomRole && subscription && !subscription?.rbac) {
       handlePopUpOpen("upgradePlan", {
         description:
-          "You can set the default org role to a custom role if you upgrade your Infisical plan."
+          "You can set the default org role to a custom role if you switch to Infisical's Pro plan."
       });
       return;
     }

frontend/src/pages/organization/AppConnections/AppConnectionsPage/components/AppConnectionList.tsx

@@ -75,7 +75,9 @@ export const AppConnectionsSelect = ({ onSelect, projectType }: Props) => {
               type="button"
               onClick={() =>
                 enterprise && !subscription.enterpriseAppConnections
-                  ? handlePopUpOpen("upgradePlan")
+                  ? handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    })
                   : onSelect(option.app)
               }
               className="group relative flex h-28 cursor-pointer flex-col items-center justify-center rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600"
@@ -167,6 +169,7 @@ export const AppConnectionsSelect = ({ onSelect, projectType }: Props) => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can use every App Connection if you switch to Infisical's Enterprise plan."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </div>
   );

frontend/src/pages/organization/AuditLogsPage/components/LogsSection.tsx

@@ -137,7 +137,7 @@ const LogsSectionComponent = ({
             onOpenChange={(isOpen) => {
               handlePopUpToggle("upgradePlan", isOpen);
             }}
-            text="You can use audit logs if you switch to a paid Infisical plan."
+            text="You can use audit logs if you switch to Infisical's Pro plan."
           />
         </div>
       </div>
@@ -181,7 +181,7 @@ const LogsSectionComponent = ({
         onOpenChange={(isOpen) => {
           handlePopUpToggle("upgradePlan", isOpen);
         }}
-        text="You can use audit logs if you switch to a paid Infisical plan."
+        text="You can use audit logs if you switch to Infisical's Pro plan."
       />
     </div>
   );

frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx

@@ -121,6 +121,7 @@ const Page = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text={(popUp.upgradePlan?.data as { description: string })?.description}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
       <DeleteActionModal
         isOpen={popUp.deleteIdentity.isOpen}

frontend/src/pages/organization/ProjectsPage/ProjectsPage.tsx

@@ -92,7 +92,7 @@ export const ProjectsPage = () => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-        text="You have exceeded the number of projects allowed on the free plan."
+        text="You have exceeded the number of projects allowed on the free plan. You can upgrade to Infisical's Pro plan to add more projects."
       />
     </div>
   );

frontend/src/pages/organization/SettingsPage/components/AuditLogStreamTab/AuditLogStreamTab.tsx

@@ -29,7 +29,9 @@ export const AuditLogStreamsTab = withPermission(
               <Button
                 onClick={() => {
                   if (subscription && !subscription?.auditLogStreams) {
-                    handlePopUpOpen("upgradePlan");
+                    handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    });
                     return;
                   }
                   handlePopUpOpen("auditLogStreamForm");
@@ -56,6 +58,7 @@ export const AuditLogStreamsTab = withPermission(
           isOpen={popUp.upgradePlan.isOpen}
           onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
           text="You can add audit log streams if you switch to Infisical's Enterprise plan."
+          isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         />
       </div>
     );

frontend/src/pages/organization/SettingsPage/components/AuditLogStreamTab/components/LogStreamProviderSelect.tsx

@@ -70,7 +70,9 @@ export const LogStreamProviderSelect = ({ onSelect }: Props) => {
               type="button"
               onClick={() => {
                 if (option.provider === LogProvider.QRadar) {
-                  handlePopUpOpen("upgradePlan");
+                  handlePopUpOpen("upgradePlan", {
+                    isEnterpriseFeature: true
+                  });
                 } else {
                   onSelect(option.provider);
                 }
@@ -110,6 +112,7 @@ export const LogStreamProviderSelect = ({ onSelect }: Props) => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="This audit log stream provider requires an enterprise license."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </div>
   );

frontend/src/pages/organization/SettingsPage/components/KmipTab/OrgKmipTab.tsx

@@ -180,7 +180,9 @@ const OrgConfigSection = ({
               className="mt-2"
               onClick={() => {
                 if (subscription && !subscription.kmip) {
-                  handlePopUpOpen("upgradePlan");
+                  handlePopUpOpen("upgradePlan", {
+                    isEnterpriseFeature: true
+                  });
                   return;
                 }
 
@@ -251,6 +253,7 @@ const OrgConfigSection = ({
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="KMIP requires an enterprise plan."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </>
   );

frontend/src/pages/organization/SettingsPage/components/OrgEncryptionTab/ExternalKmsItem.tsx

@@ -27,6 +27,7 @@ type Props = {
       kmsId?: string;
       name?: string;
       provider?: string;
+      isEnterpriseFeature?: boolean;
     }
   ) => void;
   subscription: SubscriptionPlan;
@@ -111,7 +112,9 @@ export const ExternalKmsItem = ({ kms, handlePopUpOpen, subscription }: Props) =
                   onClick={(e) => {
                     e.stopPropagation();
                     if (subscription && !subscription?.externalKms) {
-                      handlePopUpOpen("upgradePlan");
+                      handlePopUpOpen("upgradePlan", {
+                        isEnterpriseFeature: true
+                      });
                       return;
                     }
 

frontend/src/pages/organization/SettingsPage/components/OrgEncryptionTab/OrgEncryptionTab.tsx

@@ -74,7 +74,9 @@ export const OrgEncryptionTab = withPermission(
               <Button
                 onClick={() => {
                   if (subscription && !subscription?.externalKms) {
-                    handlePopUpOpen("upgradePlan");
+                    handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    });
                     return;
                   }
                   handlePopUpOpen("addExternalKms");
@@ -124,6 +126,7 @@ export const OrgEncryptionTab = withPermission(
           isOpen={popUp.upgradePlan.isOpen}
           onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
           text="You can configure external KMS if you switch to Infisical's Enterprise plan."
+          isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
         />
         <AddExternalKmsForm
           isOpen={popUp.addExternalKms.isOpen}

frontend/src/pages/organization/SettingsPage/components/OrgProvisioningTab/OrgGithubSyncSection.tsx

@@ -111,7 +111,9 @@ export const OrgGithubSyncSection = () => {
                   onClick={() =>
                     subscription.githubOrgSync
                       ? handlePopUpOpen("githubOrgSyncConfig")
-                      : handlePopUpOpen("upgradePlan")
+                      : handlePopUpOpen("upgradePlan", {
+                          isEnterpriseFeature: true
+                        })
                   }
                   colorSchema="secondary"
                   isDisabled={!isAllowed}
@@ -203,6 +205,7 @@ export const OrgGithubSyncSection = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can use GitHub Organization Plan if you switch to Infisical's Enterprise plan."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </div>
   );

frontend/src/pages/organization/SettingsPage/components/OrgProvisioningTab/OrgSCIMSection.tsx

@@ -29,7 +29,9 @@ export const OrgScimSection = () => {
     if (subscription?.scim) {
       handlePopUpOpen("scimToken");
     } else {
-      handlePopUpOpen("upgradePlan");
+      handlePopUpOpen("upgradePlan", {
+        isEnterpriseFeature: true
+      });
     }
   };
 
@@ -37,7 +39,9 @@ export const OrgScimSection = () => {
     try {
       if (!currentOrg?.id) return;
       if (!subscription?.scim) {
-        handlePopUpOpen("upgradePlan");
+        handlePopUpOpen("upgradePlan", {
+          isEnterpriseFeature: true
+        });
         return;
       }
 
@@ -90,7 +94,9 @@ export const OrgScimSection = () => {
                   if (subscription?.scim) {
                     handleEnableSCIMToggle(value);
                   } else {
-                    handlePopUpOpen("upgradePlan");
+                    handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    });
                   }
                 }}
                 isChecked={currentOrg?.scimEnabled ?? false}
@@ -112,6 +118,7 @@ export const OrgScimSection = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can use SCIM Provisioning if you switch to Infisical's Enterprise plan."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </div>
   );

frontend/src/pages/organization/SettingsPage/components/OrgSsoTab/OrgLDAPSection.tsx

@@ -34,7 +34,9 @@ export const OrgLDAPSection = (): JSX.Element => {
     try {
       if (!currentOrg?.id) return;
       if (!subscription?.ldap) {
-        handlePopUpOpen("upgradePlan");
+        handlePopUpOpen("upgradePlan", {
+          isEnterpriseFeature: true
+        });
         return;
       }
 
@@ -78,7 +80,9 @@ export const OrgLDAPSection = (): JSX.Element => {
 
         handlePopUpOpen("addLDAP");
       } else {
-        handlePopUpOpen("upgradePlan");
+        handlePopUpOpen("upgradePlan", {
+          isEnterpriseFeature: true
+        });
       }
     } catch (err) {
       console.error(err);
@@ -87,7 +91,9 @@ export const OrgLDAPSection = (): JSX.Element => {
 
   const openLDAPGroupMapModal = () => {
     if (!subscription?.ldap) {
-      handlePopUpOpen("upgradePlan");
+      handlePopUpOpen("upgradePlan", {
+        isEnterpriseFeature: true
+      });
       return;
     }
 
@@ -186,6 +192,7 @@ export const OrgLDAPSection = (): JSX.Element => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can use LDAP authentication if you switch to Infisical's Enterprise plan."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </div>
   );

frontend/src/pages/organization/SettingsPage/components/OrgSsoTab/OrgSSOSection.tsx

@@ -27,7 +27,7 @@ export const OrgSSOSection = (): JSX.Element => {
   const { mutateAsync } = useUpdateSSOConfig();
   const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
     "upgradePlan",
-    "upgradeEnterprisePlan",
+    // "upgradeEnterprisePlan",
     "addSSO"
   ] as const);
 
@@ -38,7 +38,9 @@ export const OrgSSOSection = (): JSX.Element => {
       if (!currentOrg?.id) return;
 
       if (!subscription?.samlSSO) {
-        handlePopUpOpen("upgradePlan");
+        handlePopUpOpen("upgradePlan", {
+          description: "You can use SAML SSO if you switch to Infisical's Pro plan."
+        });
         return;
       }
 
@@ -65,7 +67,11 @@ export const OrgSSOSection = (): JSX.Element => {
       if (!currentOrg?.id) return;
 
       if (!subscription?.samlSSO || !subscription?.groups) {
-        handlePopUpOpen("upgradeEnterprisePlan");
+        handlePopUpOpen("upgradePlan", {
+          isEnterpriseFeature: true,
+          description:
+            "You can use SAML group mapping if you switch to Infisical's Enterprise plan."
+        });
         return;
       }
 
@@ -105,7 +111,9 @@ export const OrgSSOSection = (): JSX.Element => {
 
         handlePopUpOpen("addSSO");
       } else {
-        handlePopUpOpen("upgradePlan");
+        handlePopUpOpen("upgradePlan", {
+          description: "You can use SAML SSO if you switch to Infisical's Pro plan."
+        });
       }
     } catch (err) {
       console.error(err);
@@ -234,12 +242,8 @@ export const OrgSSOSection = (): JSX.Element => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-        text="You can use SAML SSO if you switch to Infisical's Pro plan."
+        text={popUp.upgradePlan.data?.description}
-      />
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
-      <UpgradePlanModal
-        isOpen={popUp.upgradeEnterprisePlan.isOpen}
-        onOpenChange={(isOpen) => handlePopUpToggle("upgradeEnterprisePlan", isOpen)}
-        text="You can use SAML group mapping if you switch to Infisical's Enterprise plan."
       />
     </div>
   );

frontend/src/pages/organization/SettingsPage/components/OrgSsoTab/OrgSsoTab.tsx

@@ -93,7 +93,7 @@ export const OrgSsoTab = withPermission(
                   colorSchema="secondary"
                   onClick={() => {
                     if (!subscription?.samlSSO) {
-                      handlePopUpOpen("upgradePlan", { feature: "SAML SSO", plan: "Pro" });
+                      handlePopUpOpen("upgradePlan", { feature: "SAML SSO" });
                       return;
                     }
 
@@ -116,7 +116,7 @@ export const OrgSsoTab = withPermission(
                   colorSchema="secondary"
                   onClick={() => {
                     if (!subscription?.oidcSSO) {
-                      handlePopUpOpen("upgradePlan", { feature: "OIDC SSO", plan: "Pro" });
+                      handlePopUpOpen("upgradePlan", { feature: "OIDC SSO" });
                       return;
                     }
 
@@ -134,7 +134,10 @@ export const OrgSsoTab = withPermission(
                   colorSchema="secondary"
                   onClick={() => {
                     if (!subscription?.ldap) {
-                      handlePopUpOpen("upgradePlan", { feature: "LDAP", plan: "Enterprise" });
+                      handlePopUpOpen("upgradePlan", {
+                        feature: "LDAP",
+                        isEnterpriseFeature: true
+                      });
                       return;
                     }
 
@@ -208,8 +211,13 @@ export const OrgSsoTab = withPermission(
           text={`You can use ${
             (popUp.upgradePlan.data as { feature: string })?.feature
           } if you switch to Infisical's ${
-            (popUp.upgradePlan.data as { plan: string })?.plan
+            (popUp.upgradePlan.data as { isEnterpriseFeature: boolean })?.isEnterpriseFeature
+              ? "Enterprise"
+              : "Pro"
           } plan.`}
+          isEnterpriseFeature={
+            (popUp.upgradePlan.data as { isEnterpriseFeature: boolean })?.isEnterpriseFeature
+          }
         />
       </>
     );

frontend/src/pages/organization/SettingsPage/components/ProjectTemplatesTab/components/ProjectTemplatesSection.tsx

@@ -60,7 +60,9 @@ export const ProjectTemplatesSection = () => {
                     leftIcon={<FontAwesomeIcon icon={faPlus} />}
                     onClick={() => {
                       if (!subscription?.projectTemplates) {
-                        handlePopUpOpen("upgradePlan");
+                        handlePopUpOpen("upgradePlan", {
+                          isEnterpriseFeature: true
+                        });
                         return;
                       }
 
@@ -84,6 +86,7 @@ export const ProjectTemplatesSection = () => {
               isOpen={popUp.upgradePlan.isOpen}
               onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
               text="You can create project templates if you switch to Infisical's Enterprise plan."
+              isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
             />
           </div>
         </div>

frontend/src/pages/organization/UserDetailsByIDPage/components/UserOrgMembershipModal.tsx

@@ -149,7 +149,7 @@ export const UserOrgMembershipModal = ({ popUp, handlePopUpOpen, handlePopUpTogg
                     if (isCustomRole && subscription && !subscription?.rbac) {
                       handlePopUpOpen("upgradePlan", {
                         description:
-                          "You can assign custom roles to members if you upgrade your Infisical plan."
+                          "You can assign custom roles to members if you switch to Infisical's Pro plan."
                       });
                       return;
                     }

frontend/src/pages/pam/PamResourcesPage/components/ResourceTypeSelect.tsx

@@ -54,10 +54,10 @@ export const ResourceTypeSelect = ({ onSelect }: Props) => {
 
   const handleResourceSelect = (resource: PamResourceType) => {
     if (!subscription.pam) {
-      handlePopUpOpen(
+      handlePopUpOpen("upgradePlan", {
-        "upgradePlan",
+        description: "PAM (Privileged Access Management) requires an enterprise plan.",
-        "PAM (Privileged Access Management) requires an enterprise plan."
+        isEnterpriseFeature: true
-      );
+      });
       return;
     }
 
@@ -67,10 +67,11 @@ export const ResourceTypeSelect = ({ onSelect }: Props) => {
       resource === PamResourceType.SSH ||
       resource === PamResourceType.Kubernetes
     ) {
-      handlePopUpOpen(
+      handlePopUpOpen("upgradePlan", {
-        "upgradePlan",
+        description:
-        "This resource type requires a special license add-on to be enabled in your enterprise plan."
+          "This resource type requires a special license add-on to be enabled in your enterprise plan.",
-      );
+        isEnterpriseFeature: true
+      });
       return;
     }
 
@@ -179,7 +180,8 @@ export const ResourceTypeSelect = ({ onSelect }: Props) => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-        text={popUp.upgradePlan.data || ""}
+        text={popUp.upgradePlan.data?.description}
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </div>
   );

frontend/src/pages/project/AccessControlPage/components/GroupsTab/components/GroupsSection/GroupsSection.tsx

@@ -33,7 +33,8 @@ export const GroupsSection = () => {
     if (!subscription?.groups) {
       handlePopUpOpen("upgradePlan", {
         description:
-          "You can manage users more efficiently with groups if you upgrade your Infisical plan to an Enterprise license."
+          "You can manage users more efficiently with groups if you switch to Infisical's Enterprise plan.",
+        isEnterpriseFeature: true
       });
     } else {
       handlePopUpOpen("group");
@@ -100,6 +101,9 @@ export const GroupsSection = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text={(popUp.upgradePlan?.data as { description: string })?.description}
+        isEnterpriseFeature={
+          (popUp.upgradePlan?.data as { isEnterpriseFeature: boolean })?.isEnterpriseFeature
+        }
       />
     </div>
   );

frontend/src/pages/project/MemberDetailsByIDPage/MemberDetailsByIDPage.tsx

@@ -191,7 +191,7 @@ export const Page = () => {
             onOpenUpgradeModal={() =>
               handlePopUpOpen("upgradePlan", {
                 description:
-                  "You can assign custom roles to members if you upgrade your Infisical plan."
+                  "You can assign custom roles to members if you switch to Infisical's Pro plan."
               })
             }
           />

frontend/src/pages/project/MemberDetailsByIDPage/components/MemberRoleDetailsSection/MemberRoleModify.tsx

@@ -60,7 +60,7 @@ type TRoleForm = z.infer<typeof roleFormSchema>;
 
 type Props = {
   projectMember: TWorkspaceUser;
-  onOpenUpgradeModal: (title: string) => void;
+  onOpenUpgradeModal: () => void;
 };
 
 export const MemberRoleModify = ({ projectMember, onOpenUpgradeModal }: Props) => {
@@ -122,9 +122,7 @@ export const MemberRoleModify = ({ projectMember, onOpenUpgradeModal }: Props) =
     );
 
     if (hasCustomRoleSelected && subscription && !subscription?.rbac) {
-      onOpenUpgradeModal(
+      onOpenUpgradeModal();
-        "You can assign custom roles to members if you upgrade your Infisical plan."
-      );
       return;
     }
 

frontend/src/pages/project/SettingsPage/components/AuditLogsRetentionSection/AuditLogsRetentionSection.tsx

@@ -42,7 +42,8 @@ export const AuditLogsRetentionSection = () => {
     try {
       if (!subscription?.auditLogs) {
         handlePopUpOpen("upgradePlan", {
-          description: "You can only configure audit logs retention if you upgrade your plan."
+          description:
+            "You can only configure audit logs retention if you switch to Infisical's Pro plan."
         });
 
         return;
@@ -51,7 +52,7 @@ export const AuditLogsRetentionSection = () => {
       if (subscription && auditLogsRetentionDays > subscription?.auditLogsRetentionDays) {
         handlePopUpOpen("upgradePlan", {
           description:
-            "To update your audit logs retention period to a higher value, upgrade your plan."
+            "To update your audit logs retention period to a higher value, switch to Infisical's Pro plan."
         });
 
         return;

frontend/src/pages/secret-manager/OverviewPage/OverviewPage.tsx

@@ -1173,7 +1173,9 @@ export const OverviewPage = () => {
                               return;
                             }
                             handlePopUpOpen("upgradePlan", {
-                              isEnterpriseFeature: true
+                              isEnterpriseFeature: true,
+                              description:
+                                "You can add dynamic secrets if you switch to Infisical's Enterprise plan."
                             });
                           }}
                           isDisabled={userAvailableDynamicSecretEnvs.length === 0}
@@ -1197,7 +1199,10 @@ export const OverviewPage = () => {
                               handlePopUpClose("misc");
                               return;
                             }
-                            handlePopUpOpen("upgradePlan");
+                            handlePopUpOpen("upgradePlan", {
+                              description:
+                                "You can add secret rotations if you switch to Infisical's Pro plan."
+                            });
                           }}
                           isDisabled={userAvailableSecretRotationEnvs.length === 0}
                           variant="outline_bg"
@@ -1682,11 +1687,7 @@ export const OverviewPage = () => {
           isOpen={popUp.upgradePlan.isOpen}
           onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
           isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
-          text={
+          text={popUp.upgradePlan.data?.description}
-            subscription.slug === null
-              ? "You can perform this action under an Enterprise license"
-              : "You can perform this action if you switch to Infisical's Enterprise plan"
-          }
         />
       )}
       <CreateSecretRotationV2Modal

frontend/src/pages/secret-manager/SecretApprovalsPage/components/AccessApprovalRequest/AccessApprovalRequest.tsx

@@ -329,7 +329,10 @@ export const AccessApprovalRequest = ({
             <Button
               onClick={() => {
                 if (subscription && !subscription?.secretApproval) {
-                  handlePopUpOpen("upgradePlan");
+                  handlePopUpOpen("upgradePlan", {
+                    description:
+                      "You can use request access feature if you switch to Infisical's Pro plan."
+                  });
                   return;
                 }
                 handlePopUpOpen("requestAccess");
@@ -593,7 +596,7 @@ export const AccessApprovalRequest = ({
       )}
 
       <UpgradePlanModal
-        text="You need to upgrade your plan to access this feature"
+        text={popUp.upgradePlan.data?.description}
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={() => handlePopUpClose("upgradePlan")}
       />

frontend/src/pages/secret-manager/SecretApprovalsPage/components/ApprovalPolicyList/ApprovalPolicyList.tsx

@@ -505,7 +505,7 @@ export const ApprovalPolicyList = ({ projectId }: IProps) => {
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-        text="You can add secret approval policy if you switch to Infisical's Enterprise plan."
+        text="You can add secret approval policy if you switch to Infisical's Pro plan."
       />
     </>
   );

frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/ActionBar.tsx

@@ -905,7 +905,9 @@ export const ActionBar = ({
                     return;
                   }
 
-                  handlePopUpOpen("upgradePlan");
+                  handlePopUpOpen("upgradePlan", {
+                    feature: "PIT Recovery"
+                  });
                 }}
                 leftIcon={<FontAwesomeIcon icon={faCodeCommit} />}
                 isLoading={isSnapshotCountLoading}
@@ -1020,6 +1022,7 @@ export const ActionBar = ({
                           return;
                         }
                         handlePopUpOpen("upgradePlan", {
+                          feature: "Dynamic Secrets",
                           isEnterpriseFeature: true
                         });
                       }}
@@ -1048,7 +1051,9 @@ export const ActionBar = ({
                           handlePopUpClose("misc");
                           return;
                         }
-                        handlePopUpOpen("upgradePlan");
+                        handlePopUpOpen("upgradePlan", {
+                          feature: "Secret Rotation"
+                        });
                       }}
                       variant="outline_bg"
                       className="h-10 text-left"
@@ -1214,7 +1219,11 @@ export const ActionBar = ({
         environment={environment}
         secretPath={secretPath}
         projectId={projectId}
-        onUpgradePlan={() => handlePopUpOpen("upgradePlan")}
+        onUpgradePlan={() =>
+          handlePopUpOpen("upgradePlan", {
+            feature: "Secret Imports"
+          })
+        }
         isOpen={popUp.addSecretImport.isOpen}
         onClose={() => handlePopUpClose("addSecretImport")}
         onTogglePopUp={(isOpen) => handlePopUpToggle("addSecretImport", isOpen)}
@@ -1277,13 +1286,7 @@ export const ActionBar = ({
           isOpen={popUp.upgradePlan.isOpen}
           onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
           isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
-          text={
+          text={`You can use ${popUp.upgradePlan.data?.feature} if you switch to Infisical's ${popUp.upgradePlan.data?.isEnterpriseFeature ? "Enterprise" : "Pro"} plan.`}
-            subscription.slug === null
-              ? "You can perform this action under an Enterprise license"
-              : `You can perform this action if you switch to Infisical's ${
-                  popUp.upgradePlan.data?.isEnterpriseFeature ? "Enterprise" : "Pro"
-                } plan`
-          }
         />
       )}
       <Modal

frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretDetailSidebar.tsx

@@ -321,7 +321,7 @@ export const SecretDetailSidebar = ({
         onOpenChange={(isUpgradeModalOpen) =>
           handlePopUpToggle("secretAccessUpgradePlan", isUpgradeModalOpen)
         }
-        text="Secret access analysis is only available on Infisical's Pro plan and above."
+        text="You can access secret access analysis if you switch to Infisical's Pro plan."
       />
       <Modal
         isOpen={popUp.secretReferenceTree.isOpen}

frontend/src/pages/secret-scanning/SecretScanningDataSourcesPage/components/SecretScanningDataSourcesSection.tsx

@@ -72,7 +72,9 @@ export const SecretScanningDataSourcesSection = () => {
                 leftIcon={<FontAwesomeIcon icon={faPlus} />}
                 onClick={() => {
                   if (!subscription.secretScanning) {
-                    handlePopUpOpen("upgradePlan");
+                    handlePopUpOpen("upgradePlan", {
+                      isEnterpriseFeature: true
+                    });
                     return;
                   }
 
@@ -95,6 +97,7 @@ export const SecretScanningDataSourcesSection = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can create Data Sources by upgrading to Infisical's Enterprise plan."
+        isEnterpriseFeature={popUp.upgradePlan.data?.isEnterpriseFeature}
       />
     </>
   );

frontend/src/pages/ssh/SshHostGroupDetailsByIDPage/components/SshHostGroupHostsSection.tsx

@@ -30,7 +30,8 @@ export const SshHostGroupHostsSection = ({ sshHostGroupId }: Props) => {
     if (!subscription?.sshHostGroups) {
       handlePopUpOpen("upgradePlan", {
         description:
-          "You can manage hosts more efficiently with SSH host groups if you upgrade your Infisical plan to an Enterprise license."
+          "You can manage hosts more efficiently with SSH host groups if you upgrade your Infisical plan to an Enterprise license.",
+        isEnterpriseFeature: true
       });
     } else {
       handlePopUpOpen("addHostGroupMembers", {
@@ -107,6 +108,9 @@ export const SshHostGroupHostsSection = ({ sshHostGroupId }: Props) => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text={(popUp.upgradePlan?.data as { description: string })?.description}
+        isEnterpriseFeature={
+          (popUp.upgradePlan?.data as { isEnterpriseFeature: boolean })?.isEnterpriseFeature
+        }
       />
     </div>
   );

frontend/src/pages/ssh/SshHostsPage/components/SshHostGroupsSection.tsx

@@ -26,7 +26,8 @@ export const SshHostGroupsSection = () => {
     if (!subscription?.sshHostGroups) {
       handlePopUpOpen("upgradePlan", {
         description:
-          "You can manage hosts more efficiently with SSH host groups if you upgrade your Infisical plan to an Enterprise license."
+          "You can manage hosts more efficiently with SSH host groups if you upgrade your Infisical plan to an Enterprise license.",
+        isEnterpriseFeature: true
       });
     } else {
       handlePopUpOpen("sshHostGroup");
@@ -106,6 +107,9 @@ export const SshHostGroupsSection = () => {
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text={(popUp.upgradePlan?.data as { description: string })?.description}
+        isEnterpriseFeature={
+          (popUp.upgradePlan?.data as { isEnterpriseFeature: boolean })?.isEnterpriseFeature
+        }
       />
     </div>
   );