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

feat: show subscription revenue and referral earnings in network stats

Browse Source 
Add subscription revenue (total from subscription payments) to the
stats panel alongside referral earnings. Layout updated to 2-column
grid with subscription revenue highlighted in accent color.
This commit is contained in:
Fringg
2026-03-22 10:31:29 +03:00
parent ebe2c3af7e
commit 5b12784ab8
6 changed files with 50 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
src/pages/ReferralNetwork/components/NetworkStats.tsx
View File

@@ -10,38 +10,51 @@ interface NetworkStatsProps {
export function NetworkStats({ data, className }: NetworkStatsProps) {
const { t } = useTranslation();
const stats = [
{
label: t('admin.referralNetwork.stats.totalUsers'),
value: data.total_users.toLocaleString(),
},
{
label: t('admin.referralNetwork.stats.totalReferrers'),
value: data.total_referrers.toLocaleString(),
},
{
label: t('admin.referralNetwork.stats.totalCampaigns'),
value: data.total_campaigns.toLocaleString(),
},
{
label: t('admin.referralNetwork.stats.totalEarnings'),
value: `${formatKopeksToRubles(data.total_earnings_kopeks)} ₽`,
},
];
return (
<div
className={`rounded-xl border border-dark-700/50 bg-dark-900/80 p-2 backdrop-blur-md sm:p-3 ${className ?? ''}`}
>
<div className="grid grid-cols-1 gap-1.5 sm:grid-cols-2 sm:gap-3">
{stats.map((stat) => (
<div key={stat.label}>
<p className="text-[10px] font-medium uppercase tracking-wider text-dark-500">
{stat.label}
</p>
<p className="font-mono text-sm font-semibold text-dark-100">{stat.value}</p>
</div>
))}
<div className="grid grid-cols-2 gap-x-4 gap-y-1.5 sm:gap-x-6 sm:gap-y-2">
<div>
<p className="text-[10px] font-medium uppercase tracking-wider text-dark-500">
{t('admin.referralNetwork.stats.totalUsers')}
</p>
<p className="font-mono text-sm font-semibold text-dark-100">
{data.total_users.toLocaleString()}
</p>
</div>
<div>
<p className="text-[10px] font-medium uppercase tracking-wider text-dark-500">
{t('admin.referralNetwork.stats.totalReferrers')}
</p>
<p className="font-mono text-sm font-semibold text-dark-100">
{data.total_referrers.toLocaleString()}
</p>
</div>
<div>
<p className="text-[10px] font-medium uppercase tracking-wider text-dark-500">
{t('admin.referralNetwork.stats.totalCampaigns')}
</p>
<p className="font-mono text-sm font-semibold text-dark-100">
{data.total_campaigns.toLocaleString()}
</p>
</div>
<div>
<p className="text-[10px] font-medium uppercase tracking-wider text-dark-500">
{t('admin.referralNetwork.stats.subscriptionRevenue')}
</p>
<p className="font-mono text-sm font-semibold text-accent-400">
{formatKopeksToRubles(data.total_subscription_revenue_kopeks)} ₽
</p>
</div>
<div className="col-span-2 border-t border-dark-700/30 pt-1.5">
<p className="text-[10px] font-medium uppercase tracking-wider text-dark-500">
{t('admin.referralNetwork.stats.totalEarnings')}
</p>
<p className="font-mono text-sm font-semibold text-dark-100">
{formatKopeksToRubles(data.total_earnings_kopeks)} ₽
</p>
</div>
</div>
</div>
);