feat(sub): hide usage limits and seats info from enterprise members (non-admin) (#3243)

- Add isEnterpriseMember and canViewUsageInfo flags to subscription permissions
- Hide UsageHeader, CreditBalance, billing date, and usage notifications from enterprise members
- Show only plan name in subscription tab for enterprise members (non-admin)
- Hide usage indicator details (amount, progress pills) from enterprise members
- Team tab already hidden via requiresTeam check in settings modal

Closes #6882

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Emir Karabeg <emir-karabeg@users.noreply.github.com>

Author: emir-karabeg

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/settings-modal/components/subscription/subscription-permissions.ts

@@ -7,6 +7,8 @@ export interface SubscriptionPermissions {
   canCancelSubscription: boolean
   showTeamMemberView: boolean
   showUpgradePlans: boolean
+  isEnterpriseMember: boolean
+  canViewUsageInfo: boolean
 }
 
 export interface SubscriptionState {
@@ -31,6 +33,9 @@ export function getSubscriptionPermissions(
   const { isFree, isPro, isTeam, isEnterprise, isPaid } = subscription
   const { isTeamAdmin } = userRole
 
+  const isEnterpriseMember = isEnterprise && !isTeamAdmin
+  const canViewUsageInfo = !isEnterpriseMember
+
   return {
     canUpgradeToPro: isFree,
     canUpgradeToTeam: isFree || (isPro && !isTeam),
@@ -40,6 +45,8 @@ export function getSubscriptionPermissions(
     canCancelSubscription: isPaid && !isEnterprise && !(isTeam && !isTeamAdmin), // Team members can't cancel
     showTeamMemberView: isTeam && !isTeamAdmin,
     showUpgradePlans: isFree || (isPro && !isTeam) || (isTeam && isTeamAdmin), // Free users, Pro users, Team owners see plans
+    isEnterpriseMember,
+    canViewUsageInfo,
   }
 }
 

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/settings-modal/components/subscription/subscription.tsx

@@ -300,12 +300,16 @@ export function Subscription() {
   )
 
   const showBadge =
-    (permissions.canEditUsageLimit && !permissions.showTeamMemberView) ||
-    permissions.showTeamMemberView ||
-    subscription.isEnterprise ||
-    isBlocked
+    !permissions.isEnterpriseMember &&
+    ((permissions.canEditUsageLimit && !permissions.showTeamMemberView) ||
+      permissions.showTeamMemberView ||
+      subscription.isEnterprise ||
+      isBlocked)
 
   const getBadgeConfig = (): { text: string; variant: 'blue-secondary' | 'red' } => {
+    if (permissions.isEnterpriseMember) {
+      return { text: '', variant: 'blue-secondary' }
+    }
     if (permissions.showTeamMemberView || subscription.isEnterprise) {
       return { text: `${subscription.seats} seats`, variant: 'blue-secondary' }
     }
@@ -443,67 +447,75 @@ export function Subscription() {
 
   return (
     <div className='flex h-full flex-col gap-[20px]'>
-      {/* Current Plan & Usage Overview */}
-      <UsageHeader
-        title={formatPlanName(subscription.plan)}
-        showBadge={showBadge}
-        badgeText={badgeConfig.text}
-        badgeVariant={badgeConfig.variant}
-        onBadgeClick={permissions.showTeamMemberView ? undefined : handleBadgeClick}
-        seatsText={
-          permissions.canManageTeam || subscription.isEnterprise
-            ? `${subscription.seats} seats`
-            : undefined
-        }
-        current={usage.current}
-        limit={
-          subscription.isEnterprise || subscription.isTeam
-            ? organizationBillingData?.data?.totalUsageLimit
-            : !subscription.isFree &&
-                (permissions.canEditUsageLimit || permissions.showTeamMemberView)
-              ? usage.current // placeholder; rightContent will render UsageLimit
-              : usage.limit
-        }
-        isBlocked={isBlocked}
-        progressValue={Math.min(usage.percentUsed, 100)}
-        rightContent={
-          !subscription.isFree &&
-          (permissions.canEditUsageLimit || permissions.showTeamMemberView) ? (
-            <UsageLimit
-              ref={usageLimitRef}
-              currentLimit={
-                (subscription.isTeam || subscription.isEnterprise) &&
-                isTeamAdmin &&
-                organizationBillingData?.data
-                  ? organizationBillingData.data.totalUsageLimit
-                  : usageLimitData.currentLimit || usage.limit
-              }
-              currentUsage={usage.current}
-              canEdit={permissions.canEditUsageLimit}
-              minimumLimit={
-                (subscription.isTeam || subscription.isEnterprise) &&
-                isTeamAdmin &&
-                organizationBillingData?.data
-                  ? organizationBillingData.data.minimumBillingAmount
-                  : usageLimitData.minimumLimit || (subscription.isPro ? 20 : 40)
-              }
-              context={
-                (subscription.isTeam || subscription.isEnterprise) && isTeamAdmin
-                  ? 'organization'
-                  : 'user'
-              }
-              organizationId={
-                (subscription.isTeam || subscription.isEnterprise) && isTeamAdmin
-                  ? activeOrgId
-                  : undefined
-              }
-              onLimitUpdated={() => {
-                logger.info('Usage limit updated')
-              }}
-            />
-          ) : undefined
-        }
-      />
+      {/* Current Plan & Usage Overview - hidden from enterprise members (non-admin) */}
+      {permissions.canViewUsageInfo ? (
+        <UsageHeader
+          title={formatPlanName(subscription.plan)}
+          showBadge={showBadge}
+          badgeText={badgeConfig.text}
+          badgeVariant={badgeConfig.variant}
+          onBadgeClick={permissions.showTeamMemberView ? undefined : handleBadgeClick}
+          seatsText={
+            permissions.canManageTeam || subscription.isEnterprise
+              ? `${subscription.seats} seats`
+              : undefined
+          }
+          current={usage.current}
+          limit={
+            subscription.isEnterprise || subscription.isTeam
+              ? organizationBillingData?.data?.totalUsageLimit
+              : !subscription.isFree &&
+                  (permissions.canEditUsageLimit || permissions.showTeamMemberView)
+                ? usage.current // placeholder; rightContent will render UsageLimit
+                : usage.limit
+          }
+          isBlocked={isBlocked}
+          progressValue={Math.min(usage.percentUsed, 100)}
+          rightContent={
+            !subscription.isFree &&
+            (permissions.canEditUsageLimit || permissions.showTeamMemberView) ? (
+              <UsageLimit
+                ref={usageLimitRef}
+                currentLimit={
+                  (subscription.isTeam || subscription.isEnterprise) &&
+                  isTeamAdmin &&
+                  organizationBillingData?.data
+                    ? organizationBillingData.data.totalUsageLimit
+                    : usageLimitData.currentLimit || usage.limit
+                }
+                currentUsage={usage.current}
+                canEdit={permissions.canEditUsageLimit}
+                minimumLimit={
+                  (subscription.isTeam || subscription.isEnterprise) &&
+                  isTeamAdmin &&
+                  organizationBillingData?.data
+                    ? organizationBillingData.data.minimumBillingAmount
+                    : usageLimitData.minimumLimit || (subscription.isPro ? 20 : 40)
+                }
+                context={
+                  (subscription.isTeam || subscription.isEnterprise) && isTeamAdmin
+                    ? 'organization'
+                    : 'user'
+                }
+                organizationId={
+                  (subscription.isTeam || subscription.isEnterprise) && isTeamAdmin
+                    ? activeOrgId
+                    : undefined
+                }
+                onLimitUpdated={() => {
+                  logger.info('Usage limit updated')
+                }}
+              />
+            ) : undefined
+          }
+        />
+      ) : (
+        <div className='flex items-center'>
+          <span className='font-medium text-[14px] text-[var(--text-primary)]'>
+            {formatPlanName(subscription.plan)}
+          </span>
+        </div>
+      )}
 
       {/* Upgrade Plans */}
       {permissions.showUpgradePlans && (
@@ -539,8 +551,8 @@ export function Subscription() {
         </div>
       )}
 
-      {/* Credit Balance */}
-      {subscription.isPaid && (
+      {/* Credit Balance - hidden from enterprise members (non-admin) */}
+      {subscription.isPaid && permissions.canViewUsageInfo && (
         <CreditBalance
           balance={subscriptionData?.data?.creditBalance ?? 0}
           canPurchase={permissions.canEditUsageLimit}
@@ -554,10 +566,11 @@ export function Subscription() {
         <ReferralCode onRedeemComplete={() => refetchSubscription()} />
       )}
 
-      {/* Next Billing Date - hidden from team members */}
+      {/* Next Billing Date - hidden from team members and enterprise members (non-admin) */}
       {subscription.isPaid &&
         subscriptionData?.data?.periodEnd &&
-        !permissions.showTeamMemberView && (
+        !permissions.showTeamMemberView &&
+        !permissions.isEnterpriseMember && (
           <div className='flex items-center justify-between'>
             <Label>Next Billing Date</Label>
             <span className='text-[12px] text-[var(--text-secondary)]'>
@@ -566,8 +579,8 @@ export function Subscription() {
           </div>
         )}
 
-      {/* Usage notifications */}
-      {subscription.isPaid && <BillingUsageNotificationsToggle />}
+      {/* Usage notifications - hidden from enterprise members (non-admin) */}
+      {subscription.isPaid && permissions.canViewUsageInfo && <BillingUsageNotificationsToggle />}
 
       {/* Cancel Subscription */}
       {permissions.canCancelSubscription && (

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/usage-indicator/usage-indicator.tsx

@@ -285,6 +285,7 @@ export function UsageIndicator({ onClick }: UsageIndicatorProps) {
   const isPro = planType === 'pro'
   const isTeam = planType === 'team'
   const isEnterprise = planType === 'enterprise'
+  const isEnterpriseMember = isEnterprise && !userCanManageBilling
 
   const handleUpgradeToPro = useCallback(async () => {
     try {
@@ -463,6 +464,18 @@ export function UsageIndicator({ onClick }: UsageIndicatorProps) {
     }
   }
 
+  if (isEnterpriseMember) {
+    return (
+      <div className='flex flex-shrink-0 flex-col border-t px-[13.5px] pt-[8px] pb-[10px]'>
+        <div className='flex h-[18px] items-center'>
+          <span className='font-medium text-[12px] text-[var(--text-primary)]'>
+            {PLAN_NAMES[planType]}
+          </span>
+        </div>
+      </div>
+    )
+  }
+
   return (
     <>
       <div