cloud: fix credits tooltips (#6655)

Moves the refresh button's tooltip to the monthy bonus tooltip (correct,
intended tooltip assignments).

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6655-cloud-fix-credits-tooltips-2a86d73d365081b585ecf19af574a10a)
by [Unito](https://www.unito.io)
This commit is contained in:
Christian Byrne
2025-11-11 16:45:13 -08:00
committed by GitHub
parent 1f78b59afc
commit d14c416cc4
4 changed files with 21 additions and 10 deletions

View File

@@ -2041,6 +2041,7 @@
"beta": "BETA", "beta": "BETA",
"perMonth": "USD / month", "perMonth": "USD / month",
"renewsDate": "Renews {date}", "renewsDate": "Renews {date}",
"refreshesOn": "Refreshes to ${monthlyCreditBonusUsd} on {date}",
"expiresDate": "Expires {date}", "expiresDate": "Expires {date}",
"manageSubscription": "Manage subscription", "manageSubscription": "Manage subscription",
"partnerNodesBalance": "\"Partner Nodes\" Credit Balance", "partnerNodesBalance": "\"Partner Nodes\" Credit Balance",
@@ -2052,7 +2053,7 @@
"monthlyCreditsRollover": "These credits will rollover to the next month", "monthlyCreditsRollover": "These credits will rollover to the next month",
"monthlyBonusDescription": "Monthly credit bonus", "monthlyBonusDescription": "Monthly credit bonus",
"prepaidDescription": "Pre-paid credits", "prepaidDescription": "Pre-paid credits",
"prepaidCreditsInfo": "Credits purchased separately that don't expire", "prepaidCreditsInfo": "Pre-paid credits expire after 1 year from purchase date.",
"nextBillingCycle": "next billing cycle", "nextBillingCycle": "next billing cycle",
"yourPlanIncludes": "Your plan includes:", "yourPlanIncludes": "Your plan includes:",
"viewMoreDetails": "View more details", "viewMoreDetails": "View more details",
@@ -2060,7 +2061,7 @@
"messageSupport": "Message support", "messageSupport": "Message support",
"invoiceHistory": "Invoice history", "invoiceHistory": "Invoice history",
"benefits": { "benefits": {
"benefit1": "Monthly credits for Partner Nodes — top up when needed", "benefit1": "$10 in monthly credits for Partner Nodes — top up when needed",
"benefit2": "Up to 30 min runtime per job" "benefit2": "Up to 30 min runtime per job"
}, },
"required": { "required": {
@@ -2072,7 +2073,7 @@
"subscribeToRunFull": "Subscribe to Run", "subscribeToRunFull": "Subscribe to Run",
"subscribeNow": "Subscribe Now", "subscribeNow": "Subscribe Now",
"subscribeToComfyCloud": "Subscribe to Comfy Cloud", "subscribeToComfyCloud": "Subscribe to Comfy Cloud",
"partnerNodesCredits": "Partner Nodes credits" "partnerNodesCredits": "Partner Nodes pricing table"
}, },
"userSettings": { "userSettings": {
"title": "User Settings", "title": "User Settings",
@@ -2353,4 +2354,5 @@
"message": "Nodes just got a new look and feel", "message": "Nodes just got a new look and feel",
"tryItOut": "Try it out" "tryItOut": "Try it out"
} }
} }

View File

@@ -95,7 +95,6 @@
" "
> >
<Button <Button
v-tooltip="refreshTooltip"
icon="pi pi-sync" icon="pi pi-sync"
text text
size="small" size="small"
@@ -142,7 +141,7 @@
{{ $t('subscription.monthlyBonusDescription') }} {{ $t('subscription.monthlyBonusDescription') }}
</div> </div>
<Button <Button
v-tooltip="$t('subscription.monthlyCreditsRollover')" v-tooltip="refreshTooltip"
icon="pi pi-question-circle" icon="pi pi-question-circle"
text text
rounded rounded

View File

@@ -8,6 +8,8 @@ import { useTelemetry } from '@/platform/telemetry'
import { useDialogService } from '@/services/dialogService' import { useDialogService } from '@/services/dialogService'
import { useCommandStore } from '@/stores/commandStore' import { useCommandStore } from '@/stores/commandStore'
const MONTHLY_CREDIT_BONUS_USD = 10
/** /**
* Composable for handling subscription panel actions and loading states * Composable for handling subscription panel actions and loading states
*/ */
@@ -24,7 +26,10 @@ export function useSubscriptionActions() {
const refreshTooltip = computed(() => { const refreshTooltip = computed(() => {
const date = const date =
formattedRenewalDate.value || t('subscription.nextBillingCycle') formattedRenewalDate.value || t('subscription.nextBillingCycle')
return `Refreshes on ${date}` return t('subscription.refreshesOn', {
monthlyCreditBonusUsd: MONTHLY_CREDIT_BONUS_USD,
date
})
}) })
onMounted(() => { onMounted(() => {

View File

@@ -7,8 +7,11 @@ const mockFetchBalance = vi.fn()
const mockFetchStatus = vi.fn() const mockFetchStatus = vi.fn()
const mockShowTopUpCreditsDialog = vi.fn() const mockShowTopUpCreditsDialog = vi.fn()
const mockExecute = vi.fn() const mockExecute = vi.fn()
const mockT = vi.fn((key: string) => { const mockT = vi.fn((key: string, values?: any) => {
if (key === 'subscription.nextBillingCycle') return 'next billing cycle' if (key === 'subscription.nextBillingCycle') return 'next billing cycle'
if (key === 'subscription.refreshesOn') {
return `Refreshes to $${values?.monthlyCreditBonusUsd} on ${values?.date}`
}
return key return key
}) })
@@ -65,13 +68,15 @@ describe('useSubscriptionActions', () => {
describe('refreshTooltip', () => { describe('refreshTooltip', () => {
it('should format tooltip with renewal date', () => { it('should format tooltip with renewal date', () => {
const { refreshTooltip } = useSubscriptionActions() const { refreshTooltip } = useSubscriptionActions()
expect(refreshTooltip.value).toBe('Refreshes on 2024-12-31') expect(refreshTooltip.value).toBe('Refreshes to $10 on 2024-12-31')
}) })
it('should use fallback text when no renewal date', () => { it('should use fallback text when no renewal date', () => {
mockFormattedRenewalDate.value = '' mockFormattedRenewalDate.value = ''
const { refreshTooltip } = useSubscriptionActions() const { refreshTooltip } = useSubscriptionActions()
expect(refreshTooltip.value).toBe('Refreshes on next billing cycle') expect(refreshTooltip.value).toBe(
'Refreshes to $10 on next billing cycle'
)
expect(mockT).toHaveBeenCalledWith('subscription.nextBillingCycle') expect(mockT).toHaveBeenCalledWith('subscription.nextBillingCycle')
}) })
}) })