etkr4k/bedolaga-cabinet
1
0
Fork 0
mirror of https://github.com/chillpadclub/bedolaga-cabinet.git synced 2026-07-28 17:43:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Dashboard.tsx

Browse Source
This commit is contained in:
Egor
2026-01-21 10:13:40 +03:00
committed by GitHub
parent 5709ab4ff1
commit c5cd92ed6f
1 changed files with 49 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
src/pages/Dashboard.tsx
View File

@@ -122,6 +122,7 @@ export default function Dashboard() {
setTrialError(null) setTrialError(null)
queryClient.invalidateQueries({ queryKey: ['subscription'] }) queryClient.invalidateQueries({ queryKey: ['subscription'] })
queryClient.invalidateQueries({ queryKey: ['trial-info'] }) queryClient.invalidateQueries({ queryKey: ['trial-info'] })
queryClient.invalidateQueries({ queryKey: ['balance'] })
refreshUser() refreshUser()
}, },
onError: (error: { response?: { data?: { detail?: string } } }) => { onError: (error: { response?: { data?: { detail?: string } } }) => {
@@ -455,7 +456,9 @@ export default function Dashboard() {
</div> </div>
<div className="flex-1"> <div className="flex-1">
<h3 className="text-lg font-semibold text-dark-100 mb-2"> <h3 className="text-lg font-semibold text-dark-100 mb-2">
{t('subscription.trial.title', 'Free Trial')} {trialInfo.requires_payment
? t('subscription.trial.titlePaid', 'Trial Subscription')
: t('subscription.trial.title', 'Free Trial')}
</h3> </h3>
<p className="text-dark-400 text-sm mb-4"> <p className="text-dark-400 text-sm mb-4">
{t('subscription.trial.description', 'Try our VPN service for free!')} {t('subscription.trial.description', 'Try our VPN service for free!')}
@@ -467,7 +470,7 @@ export default function Dashboard() {
<div className="text-xs text-dark-500">{t('subscription.trial.days', 'days')}</div> <div className="text-xs text-dark-500">{t('subscription.trial.days', 'days')}</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<div className="text-2xl font-bold text-accent-400">{trialInfo.traffic_limit_gb}</div> <div className="text-2xl font-bold text-accent-400">{trialInfo.traffic_limit_gb || '∞'}</div>
<div className="text-xs text-dark-500">GB</div> <div className="text-xs text-dark-500">GB</div>
</div> </div>
<div className="text-center"> <div className="text-center">
@@ -477,9 +480,23 @@ export default function Dashboard() {
</div> </div>
{trialInfo.requires_payment && trialInfo.price_rubles > 0 && ( {trialInfo.requires_payment && trialInfo.price_rubles > 0 && (
<p className="text-sm text-dark-400 mb-4"> <div className="bg-dark-800/50 rounded-xl p-4 mb-4 space-y-2">
{t('subscription.trial.price', 'Activation price')}: {trialInfo.price_rubles.toFixed(2)} ₽ <div className="flex justify-between items-center">
</p> <span className="text-dark-400">{t('subscription.trial.price', 'Activation price')}:</span>
<span className="text-lg font-semibold text-accent-400">{trialInfo.price_rubles.toFixed(2)} {currencySymbol}</span>
</div>
<div className="flex justify-between items-center">
<span className="text-dark-400">{t('balance.currentBalance', 'Your balance')}:</span>
<span className={`text-lg font-semibold ${(balanceData?.balance_kopeks || 0) >= trialInfo.price_kopeks ? 'text-success-400' : 'text-warning-400'}`}>
{formatAmount(balanceData?.balance_rubles || 0)} {currencySymbol}
</span>
</div>
{(balanceData?.balance_kopeks || 0) < trialInfo.price_kopeks && (
<div className="text-xs text-warning-400 pt-1">
{t('subscription.trial.insufficientBalance', 'Top up your balance to activate')}
</div>
)}
</div>
)} )}
{trialError && ( {trialError && (
@@ -488,15 +505,33 @@ export default function Dashboard() {
</div> </div>
)} )}
<button {trialInfo.requires_payment && trialInfo.price_kopeks > 0 ? (
onClick={() => activateTrialMutation.mutate()} (balanceData?.balance_kopeks || 0) >= trialInfo.price_kopeks ? (
disabled={activateTrialMutation.isPending} <button
className="btn-primary" onClick={() => activateTrialMutation.mutate()}
> disabled={activateTrialMutation.isPending}
{activateTrialMutation.isPending className="btn-primary w-full"
? t('common.loading', 'Loading...') >
: t('subscription.trial.activate', 'Activate Free Trial')} {activateTrialMutation.isPending
</button> ? t('common.loading', 'Loading...')
: t('subscription.trial.payAndActivate', 'Pay from Balance & Activate')}
</button>
) : (
<Link to="/balance" className="btn-primary w-full text-center block">
{t('subscription.trial.topUpToActivate', 'Top Up Balance')}
</Link>
)
) : (
<button
onClick={() => activateTrialMutation.mutate()}
disabled={activateTrialMutation.isPending}
className="btn-primary w-full"
>
{activateTrialMutation.isPending
? t('common.loading', 'Loading...')
: t('subscription.trial.activate', 'Activate Free Trial')}
</button>
)}
</div> </div>
</div> </div>
</div> </div>