mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-01-26 19:09:52 +00:00
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:
@@ -2041,6 +2041,7 @@
|
||||
"beta": "BETA",
|
||||
"perMonth": "USD / month",
|
||||
"renewsDate": "Renews {date}",
|
||||
"refreshesOn": "Refreshes to ${monthlyCreditBonusUsd} on {date}",
|
||||
"expiresDate": "Expires {date}",
|
||||
"manageSubscription": "Manage subscription",
|
||||
"partnerNodesBalance": "\"Partner Nodes\" Credit Balance",
|
||||
@@ -2052,7 +2053,7 @@
|
||||
"monthlyCreditsRollover": "These credits will rollover to the next month",
|
||||
"monthlyBonusDescription": "Monthly credit bonus",
|
||||
"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",
|
||||
"yourPlanIncludes": "Your plan includes:",
|
||||
"viewMoreDetails": "View more details",
|
||||
@@ -2060,7 +2061,7 @@
|
||||
"messageSupport": "Message support",
|
||||
"invoiceHistory": "Invoice history",
|
||||
"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"
|
||||
},
|
||||
"required": {
|
||||
@@ -2072,7 +2073,7 @@
|
||||
"subscribeToRunFull": "Subscribe to Run",
|
||||
"subscribeNow": "Subscribe Now",
|
||||
"subscribeToComfyCloud": "Subscribe to Comfy Cloud",
|
||||
"partnerNodesCredits": "Partner Nodes credits"
|
||||
"partnerNodesCredits": "Partner Nodes pricing table"
|
||||
},
|
||||
"userSettings": {
|
||||
"title": "User Settings",
|
||||
@@ -2353,4 +2354,5 @@
|
||||
"message": "Nodes just got a new look and feel",
|
||||
"tryItOut": "Try it out"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -95,7 +95,6 @@
|
||||
"
|
||||
>
|
||||
<Button
|
||||
v-tooltip="refreshTooltip"
|
||||
icon="pi pi-sync"
|
||||
text
|
||||
size="small"
|
||||
@@ -142,7 +141,7 @@
|
||||
{{ $t('subscription.monthlyBonusDescription') }}
|
||||
</div>
|
||||
<Button
|
||||
v-tooltip="$t('subscription.monthlyCreditsRollover')"
|
||||
v-tooltip="refreshTooltip"
|
||||
icon="pi pi-question-circle"
|
||||
text
|
||||
rounded
|
||||
|
||||
@@ -8,6 +8,8 @@ import { useTelemetry } from '@/platform/telemetry'
|
||||
import { useDialogService } from '@/services/dialogService'
|
||||
import { useCommandStore } from '@/stores/commandStore'
|
||||
|
||||
const MONTHLY_CREDIT_BONUS_USD = 10
|
||||
|
||||
/**
|
||||
* Composable for handling subscription panel actions and loading states
|
||||
*/
|
||||
@@ -24,7 +26,10 @@ export function useSubscriptionActions() {
|
||||
const refreshTooltip = computed(() => {
|
||||
const date =
|
||||
formattedRenewalDate.value || t('subscription.nextBillingCycle')
|
||||
return `Refreshes on ${date}`
|
||||
return t('subscription.refreshesOn', {
|
||||
monthlyCreditBonusUsd: MONTHLY_CREDIT_BONUS_USD,
|
||||
date
|
||||
})
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
@@ -7,8 +7,11 @@ const mockFetchBalance = vi.fn()
|
||||
const mockFetchStatus = vi.fn()
|
||||
const mockShowTopUpCreditsDialog = 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.refreshesOn') {
|
||||
return `Refreshes to $${values?.monthlyCreditBonusUsd} on ${values?.date}`
|
||||
}
|
||||
return key
|
||||
})
|
||||
|
||||
@@ -65,13 +68,15 @@ describe('useSubscriptionActions', () => {
|
||||
describe('refreshTooltip', () => {
|
||||
it('should format tooltip with renewal date', () => {
|
||||
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', () => {
|
||||
mockFormattedRenewalDate.value = ''
|
||||
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')
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user