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

- 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: Emir Karabeg <emir-karabeg@users.noreply.github.com>
2026-02-18 10:22:00 -05:00 · 2026-02-18 05:40:34 +00:00
parent eab01e0272
commit 6fbf5741d4
3 changed files with 104 additions and 71 deletions
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/settings-modal/components/subscription/subscription-permissions.ts
+++ b/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,
  }
 }

--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/settings-modal/components/subscription/subscription.tsx
+++ b/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 && (
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/usage-indicator/usage-indicator.tsx
+++ b/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