Skip to content

Commit 7001603

Browse files
jahoomajahooma
committed
Change always use a la carte to simply whether credit spending is enabled at all, which matches backend semantics
1 parent ebd3048 commit 7001603

File tree

2 files changed

+83
-47
lines changed

2 files changed

+83
-47
lines changed

‎cli/src/components/subscription-limit-banner.tsx‎

Lines changed: 68 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -127,47 +127,76 @@ export const SubscriptionLimitBanner = () => {
127127
<text style={{ fg: theme.muted }}>{weeklyPercentUsed}% used</text>
128128
</box>
129129

130-
{hasAlaCarteCredits && (
131-
<Button onClick={handleToggleFallbackToALaCarte} disabled={updatePreference.isPending}>
132-
<text style={{ fg: theme.muted }}>
133-
{updatePreference.isPending ? '[...]' : fallbackToALaCarte ? '[x]' : '[ ]'} always use credits if subscription limit is reached
134-
</text>
135-
</Button>
136-
)}
137-
138-
<box style={{ flexDirection: 'row', gap: 2, marginTop: 1 }}>
139-
{hasAlaCarteCredits ? (
140-
<>
141-
<Button onClick={handleContinueWithCredits}>
142-
<text style={{ fg: theme.background, bg: theme.foreground }}>
143-
{' '}Continue with credits ({remainingBalance.toLocaleString()}){' '}
130+
{hasAlaCarteCredits ? (
131+
<box style={{ flexDirection: 'column', gap: 1, marginTop: 1 }}>
132+
{fallbackToALaCarte ? (
133+
<>
134+
<text style={{ fg: theme.muted }}>
135+
✓ Credit spending enabled. You can continue using your credits.
144136
</text>
145-
</Button>
146-
{canUpgrade ? (
147-
<Button onClick={handleUpgrade}>
148-
<text style={{ fg: theme.background, bg: theme.foreground }}>{' '}Upgrade Plan ↗{' '}</text>
137+
<box style={{ flexDirection: 'row', gap: 2 }}>
138+
<Button onClick={handleContinueWithCredits}>
139+
<text style={{ fg: theme.background, bg: theme.foreground }}>
140+
{' '}Continue with credits ({remainingBalance.toLocaleString()}){' '}
141+
</text>
142+
</Button>
143+
{canUpgrade ? (
144+
<Button onClick={handleUpgrade}>
145+
<text style={{ fg: theme.background, bg: theme.foreground }}>{' '}Upgrade Plan ↗{' '}</text>
146+
</Button>
147+
) : (
148+
<Button onClick={handleBuyCredits}>
149+
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Buy Credits ↗{' '}</text>
150+
</Button>
151+
)}
152+
</box>
153+
<Button onClick={handleToggleFallbackToALaCarte} disabled={updatePreference.isPending}>
154+
<text style={{ fg: theme.muted }}>
155+
{updatePreference.isPending ? '[updating...]' : '[disable credit spending]'}
156+
</text>
149157
</Button>
150-
) : (
151-
<Button onClick={handleBuyCredits}>
152-
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Buy Credits ↗{' '}</text>
153-
</Button>
154-
)}
155-
</>
156-
) : (
157-
<>
158-
<text style={{ fg: theme.muted }}>No a-la-carte credits available.</text>
159-
{canUpgrade ? (
160-
<Button onClick={handleUpgrade}>
161-
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Upgrade Plan ↗{' '}</text>
162-
</Button>
163-
) : (
164-
<Button onClick={handleBuyCredits}>
165-
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Buy Credits ↗{' '}</text>
166-
</Button>
167-
)}
168-
</>
169-
)}
170-
</box>
158+
</>
159+
) : (
160+
<>
161+
<text style={{ fg: theme.warning }}>
162+
Credit spending is disabled. Enable it to continue.
163+
</text>
164+
<box style={{ flexDirection: 'row', gap: 2 }}>
165+
<Button onClick={handleToggleFallbackToALaCarte} disabled={updatePreference.isPending}>
166+
<text style={{ fg: theme.background, bg: theme.foreground }}>
167+
{updatePreference.isPending ? ' Enabling... ' : ' Enable Credit Spending '}
168+
</text>
169+
</Button>
170+
{canUpgrade ? (
171+
<Button onClick={handleUpgrade}>
172+
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Upgrade Plan ↗{' '}</text>
173+
</Button>
174+
) : (
175+
<Button onClick={handleBuyCredits}>
176+
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Buy Credits ↗{' '}</text>
177+
</Button>
178+
)}
179+
</box>
180+
<text style={{ fg: theme.muted }}>
181+
You have {remainingBalance.toLocaleString()} credits available.
182+
</text>
183+
</>
184+
)}
185+
</box>
186+
) : (
187+
<box style={{ flexDirection: 'row', gap: 2, marginTop: 1 }}>
188+
<text style={{ fg: theme.muted }}>No a-la-carte credits available.</text>
189+
{canUpgrade ? (
190+
<Button onClick={handleUpgrade}>
191+
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Upgrade Plan ↗{' '}</text>
192+
</Button>
193+
) : (
194+
<Button onClick={handleBuyCredits}>
195+
<text style={{ fg: theme.background, bg: theme.muted }}>{' '}Buy Credits ↗{' '}</text>
196+
</Button>
197+
)}
198+
</box>
199+
)}
171200
</box>
172201
</box>
173202
)

‎cli/src/components/usage-banner.tsx‎

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -266,16 +266,23 @@ const SubscriptionUsageSection: React.FC<SubscriptionUsageSectionProps> = ({
266266
</box>
267267
</box>
268268
) : null}
269-
<box style={{ flexDirection: 'row', alignItems: 'center', gap: 1, marginTop: 1 }}>
270-
<text style={{ fg: theme.muted }}>When limit reached:</text>
269+
<box style={{ flexDirection: 'column', gap: 0, marginTop: 1 }}>
270+
<box style={{ flexDirection: 'row', alignItems: 'center', gap: 1 }}>
271+
<text style={{ fg: theme.muted }}>Credit spending:</text>
272+
<text style={{ fg: fallbackToALaCarte ? theme.foreground : theme.warning }}>
273+
{fallbackToALaCarte ? 'enabled' : 'disabled'}
274+
</text>
275+
<Button onClick={handleToggleFallbackToALaCarte} disabled={updatePreference.isPending}>
276+
<text style={{ fg: theme.muted, attributes: TextAttributes.UNDERLINE }}>
277+
{updatePreference.isPending ? '[updating...]' : `[${fallbackToALaCarte ? 'disable' : 'enable'}]`}
278+
</text>
279+
</Button>
280+
</box>
271281
<text style={{ fg: theme.muted }}>
272-
{fallbackToALaCarte ? 'spend credits' : 'pause'}
282+
{fallbackToALaCarte
283+
? 'Your credits will be used when subscription limits are reached.'
284+
: 'Credits will NOT be spent when subscription limits are reached. Enable to use credits.'}
273285
</text>
274-
<Button onClick={handleToggleFallbackToALaCarte} disabled={updatePreference.isPending}>
275-
<text style={{ fg: theme.muted, attributes: TextAttributes.UNDERLINE }}>
276-
{updatePreference.isPending ? '[updating...]' : `[${fallbackToALaCarte ? 'switch to pause' : 'switch to spend credits'}]`}
277-
</text>
278-
</Button>
279286
</box>
280287
</box>
281288
)

0 commit comments

Comments
 (0)