From b67ac03161018dd9d87026b92b590c8e22890489 Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Thu, 20 Jun 2024 20:19:34 -0700
Subject: show total viewcount on personal page channel card

---
 src/components/channel-card.tsx | 9 +++++++--
 src/pages/stats/[slug].tsx      | 1 +
 2 files changed, 8 insertions(+), 2 deletions(-)

(limited to 'src')

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,12 +34,16 @@ 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>
diff --git a/src/pages/stats/[slug].tsx b/src/pages/stats/[slug].tsx
index 87e85ab..908a9f8 100644
--- a/src/pages/stats/[slug].tsx
+++ b/src/pages/stats/[slug].tsx
@@ -62,6 +62,7 @@ function Page({ chartData, channelData, sevenDayGraphData, slug }: { chartData:
               avatarUrl={channelData.profile_pic}
               subscriberCount={channelData.subscribers}
               videoCount={channelData.video_count}
+              viewCount={channelData.view_count}
               suborg={channelData.sub_org}
               nextMilestone={channelData.next_milestone}
               nextMilestoneDays={channelData.days_until_next_milestone}
-- 
cgit v1.2.3