diff options
| author | Pinapelz <yukais@pinapelz.com> | 2024-06-20 20:19:34 -0700 |
|---|---|---|
| committer | Pinapelz <yukais@pinapelz.com> | 2024-06-20 20:19:34 -0700 |
| commit | b67ac03161018dd9d87026b92b590c8e22890489 (patch) | |
| tree | 1d6bc1e2fe86016ddff68db54207a799b9a08cc2 /src/components | |
| parent | d70ce27a1c3618cadd98330765861ff55e5dc394 (diff) | |
show total viewcount on personal page channel card
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/channel-card.tsx | 9 |
1 files changed, 7 insertions, 2 deletions
diff --git a/src/components/channel-card.tsx b/src/components/channel-card.tsx index 839cde6..b66a6e0 100644 --- a/src/components/channel-card.tsx +++ b/src/components/channel-card.tsx @@ -8,6 +8,7 @@ interface ChannelCardProps { avatarUrl: string subscriberCount: number videoCount: number + viewCount: number suborg: string nextMilestone: string nextMilestoneDays: string @@ -15,7 +16,7 @@ interface ChannelCardProps { } export function ChannelCard(props: ChannelCardProps) { - const { channel_id, name, avatarUrl, subscriberCount, videoCount, suborg, nextMilestone, nextMilestoneDays, nextMilestoneDate } = props + const { channel_id, name, avatarUrl, subscriberCount, videoCount, viewCount, suborg, nextMilestone, nextMilestoneDays, nextMilestoneDate } = props return ( <Card className="w-[500px] shadow-lg rounded-lg overflow-hidden mt-4 py-4"> <CardHeader> @@ -33,13 +34,17 @@ export function ChannelCard(props: ChannelCardProps) { <CardContent className="px-4 py-2 space-y-4"> <div className="flex flex-col items-center"> <span className="text-l text-gray-600">Subscribers</span> - <span className="font-semibold">{subscriberCount.toLocaleString()}</span> + <span className="font-semibold">{Number(subscriberCount).toLocaleString()}</span> </div> <div className="flex flex-col items-center"> <span className="text-l text-gray-600">Videos</span> <span className="font-semibold">{videoCount}</span> </div> <div className="flex flex-col items-center"> + <span className="text-l text-gray-600">View Count</span> + <span className="font-semibold">{Number(viewCount).toLocaleString()}</span> + </div> + <div className="flex flex-col items-center"> <span className="text-l text-gray-600">Next Milestone</span> <span className="font-semibold">{Number(nextMilestone).toLocaleString()}</span> <div className="flex justify-center items-center"> |