Disable ads when you have a subscription

Author: jahooma

cli/src/chat.tsx

@@ -162,19 +162,21 @@ export const Chat = ({
   } = useChatState()
 
   const { statusMessage } = useClipboard()
-  const { ad } = useGravityAd()
+
+  // Fetch subscription data early - needed for session credits tracking and ad gating
+  const { data: subscriptionData } = useSubscriptionQuery({
+    refetchInterval: 60 * 1000,
+  })
+  const hasSubscription = subscriptionData?.hasSubscription ?? false
+
+  const { ad } = useGravityAd({ enabled: !hasSubscription })
   const [adsManuallyDisabled, setAdsManuallyDisabled] = useState(false)
 
   const handleDisableAds = useCallback(() => {
     handleAdsDisable()
     setAdsManuallyDisabled(true)
   }, [])
 
-  // Fetch subscription data early - needed for session credits tracking
-  const { data: subscriptionData } = useSubscriptionQuery({
-    refetchInterval: 60 * 1000,
-  })
-
   // Set initial mode from CLI flag on mount
   useEffect(() => {
     if (initialMode) {
@@ -221,16 +223,17 @@ export const Chat = ({
   const loadedSkills = useMemo(() => getLoadedSkills(), [])
 
   // Filter slash commands based on current ads state - only show the option that changes state
+  // Hide both ads commands entirely for subscribers
   // Also merge in skill commands
   const filteredSlashCommands = useMemo(() => {
     const adsEnabled = getAdsEnabled()
     const allCommands = getSlashCommandsWithSkills(loadedSkills)
     return allCommands.filter((cmd) => {
-      if (cmd.id === 'ads:enable') return !adsEnabled
-      if (cmd.id === 'ads:disable') return adsEnabled
+      if (cmd.id === 'ads:enable') return !hasSubscription && !adsEnabled
+      if (cmd.id === 'ads:disable') return !hasSubscription && adsEnabled
       return true
     })
-  }, [inputValue, loadedSkills]) // Re-evaluate when input changes (user may have just toggled)
+  }, [inputValue, loadedSkills, hasSubscription]) // Re-evaluate when input changes (user may have just toggled)
 
   const {
     slashContext,

cli/src/components/help-banner.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 
 import { BottomBanner } from './bottom-banner'
+import { useSubscriptionQuery } from '../hooks/use-subscription-query'
 import { useTheme } from '../hooks/use-theme'
 import { useChatStore } from '../state/chat-store'
 
@@ -33,6 +34,8 @@ const Shortcut = ({
 export const HelpBanner = () => {
   const setInputMode = useChatStore((state) => state.setInputMode)
   const theme = useTheme()
+  const { data: subscriptionData } = useSubscriptionQuery()
+  const hasSubscription = subscriptionData?.hasSubscription ?? false
 
   // Auto-hide after timeout
   React.useEffect(() => {
@@ -80,8 +83,12 @@ export const HelpBanner = () => {
               <text style={{ fg: theme.foreground }}>/subscribe</text>
               <text style={{ fg: theme.muted }}>·</text>
               <text style={{ fg: theme.foreground }}>/usage</text>
-              <text style={{ fg: theme.muted }}>·</text>
-              <text style={{ fg: theme.foreground }}>/ads:enable</text>
+              {!hasSubscription && (
+                <>
+                  <text style={{ fg: theme.muted }}>·</text>
+                  <text style={{ fg: theme.foreground }}>/ads:enable</text>
+                </>
+              )}
             </box>
             <text style={{ fg: theme.muted }}>
               Subscribe for the best credit rates — /subscribe

cli/src/hooks/use-gravity-ad.ts

@@ -68,7 +68,8 @@ function nextFromCache(ctrl: GravityController): AdResponse | null {
  *
  * Activity is tracked via the global activity-tracker module.
  */
-export const useGravityAd = (): GravityAdState => {
+export const useGravityAd = (options?: { enabled?: boolean }): GravityAdState => {
+  const enabled = options?.enabled ?? true
   const [ad, setAd] = useState<AdResponse | null>(null)
   const [isLoading, setIsLoading] = useState(false)
 
@@ -81,7 +82,8 @@ export const useGravityAd = (): GravityAdState => {
   const isFreeMode = agentMode === 'FREE'
 
   // Skip ads on very compact screens unless in FREE mode (where ads are mandatory)
-  const shouldHideAds = isVeryCompactHeight && !isFreeMode
+  // Also skip if explicitly disabled (e.g. user has a subscription)
+  const shouldHideAds = !enabled || (isVeryCompactHeight && !isFreeMode)
 
   // Use Zustand selector instead of manual subscription - only rerenders when value changes
   const hasUserMessaged = useChatStore((s) =>