From c4ae035a8f041a3cc344d5ee90800d856be17348 Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Thu, 10 Oct 2024 01:35:33 -0700
Subject: fix: missing diff props on ChannelData

---
 src/components/SubscriberTable/SubscriberTable.tsx | 153 +++++++++++----------
 1 file changed, 83 insertions(+), 70 deletions(-)

(limited to 'src/components')

diff --git a/src/components/SubscriberTable/SubscriberTable.tsx b/src/components/SubscriberTable/SubscriberTable.tsx
index 5a84055..43c8c16 100644
--- a/src/components/SubscriberTable/SubscriberTable.tsx
+++ b/src/components/SubscriberTable/SubscriberTable.tsx
@@ -2,83 +2,96 @@ import React from "react";
 import ChannelRow from "./SubscriberTableRow";
 
 interface ChannelDataProp {
-	channel_name: string;
-	profile_pic: string;
-	subscribers: number;
-	sub_org: string;
-	video_count: number;
-	day_diff: number;
-	views: number;
+    channel_name: string;
+    profile_pic: string;
+    subscribers: number;
+    sub_org: string;
+    video_count: number;
+    day_diff: number;
+    views: number;
+    diff_1d: number;
+    diff_7d: number;
+    diff_30d: number;
 }
 
 interface SubscriberDataTableProp {
-	channel_data: ChannelDataProp[];
-	timestamp: string;
+    channel_data: ChannelDataProp[];
+    timestamp: string;
 }
 
 const DataTable = ({ channel_data, timestamp }: SubscriberDataTableProp) => {
-	if (!channel_data) {
-		return null;
-	}
+    if (!channel_data) {
+        return null;
+    }
 
-	return (
-		<>
-			<div className="text-center sm:mt-5">
-				<h1 className="text-2xl font-bold text-gray-800">Subscriber Count</h1>
-				<h2 className="text-xl text-gray-800">Click on a row to view more details!</h2>
-				<p className="text-gray-500 text-sm">Updated Hourly. Retrieved at: {timestamp}</p>
-			</div>
-			<div className="px-2 sm:px-48 py-4 sm:py-8 relative rounded-l text-left overflow-auto">
-				<table className="w-full text-m sm:text-xl text-black bg-white">
-					<thead
-						className="text-m sm:text-lg text-white rounded-md"
-						style={{ backgroundColor: "black" }}
-					>
-						<tr>
-							<th
-								scope="col"
-								className="py-1 px-1 sm:px-3 hidden sm:table-cell"
-							>
-								RANK
-							</th>
-							<th scope="col" className="py-1 px-1 sm:px-3">
-								CHANNEL
-							</th>
-							<th
-								scope="col"
-								className="py-1 px-1 sm:px-3 hidden sm:table-cell"
-							>
-								GROUP
-							</th>
-							<th
-								scope="col"
-								className="py-1 px-1 sm:px-3 hidden sm:table-cell"
-							>
-								VIDEO COUNT
-							</th>
-							<th
-								scope="col"
-								className="py-1 px-1 sm:px-3 hidden sm:table-cell"
-							>
-								VIEW COUNT
-							</th>
-							<th scope="col" className="py-1 px-1 sm:px-3">
-								SUBSCRIBERS
-							</th>
-							<th scope="col" className="py-1 px-1 sm:px-3">
-								DIFF (24H)
-							</th>
-						</tr>
-					</thead>
-					<tbody>
-						{channel_data.map((channel, index) => (
-							<ChannelRow key={index} channel={channel} index={index} />
-						))}
-					</tbody>
-				</table>
-			</div>
-		</>
-	);
+    return (
+        <>
+            <div className="text-center sm:mt-5">
+                <h1 className="text-2xl font-bold text-gray-800">
+                    Subscriber Count
+                </h1>
+                <h2 className="text-xl text-gray-800">
+                    Click on a row to view more details!
+                </h2>
+                <p className="text-gray-500 text-sm">
+                    Updated Hourly. Retrieved at: {timestamp}
+                </p>
+            </div>
+            <div className="px-2 sm:px-48 py-4 sm:py-8 relative rounded-l text-left overflow-auto">
+                <table className="w-full text-m sm:text-xl text-black bg-white">
+                    <thead
+                        className="text-m sm:text-lg text-white rounded-md"
+                        style={{ backgroundColor: "black" }}
+                    >
+                        <tr>
+                            <th
+                                scope="col"
+                                className="py-1 px-1 sm:px-3 hidden sm:table-cell"
+                            >
+                                RANK
+                            </th>
+                            <th scope="col" className="py-1 px-1 sm:px-3">
+                                CHANNEL
+                            </th>
+                            <th
+                                scope="col"
+                                className="py-1 px-1 sm:px-3 hidden sm:table-cell"
+                            >
+                                GROUP
+                            </th>
+                            <th
+                                scope="col"
+                                className="py-1 px-1 sm:px-3 hidden sm:table-cell"
+                            >
+                                VIDEO COUNT
+                            </th>
+                            <th
+                                scope="col"
+                                className="py-1 px-1 sm:px-3 hidden sm:table-cell"
+                            >
+                                VIEW COUNT
+                            </th>
+                            <th scope="col" className="py-1 px-1 sm:px-3">
+                                SUBSCRIBERS
+                            </th>
+                            <th scope="col" className="py-1 px-1 sm:px-3">
+                                DIFF (24H)
+                            </th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {channel_data.map((channel, index) => (
+                            <ChannelRow
+                                key={index}
+                                channel={channel}
+                                index={index}
+                            />
+                        ))}
+                    </tbody>
+                </table>
+            </div>
+        </>
+    );
 };
 
 export default DataTable;
-- 
cgit v1.2.3