From 9497598754c5a810974c6040e78c295ff0a4ed6f Mon Sep 17 00:00:00 2001
From: real-zephex <zephex-1@outlook.com>
Date: Wed, 29 May 2024 01:00:42 +0530
Subject: =?UTF-8?q?=E2=9C=A8=20feat(series):=20rewrite=20series=20page=20a?=
 =?UTF-8?q?nd=20drop=20manga=20support?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/web-series/page.jsx | 107 +++++++++++++++++++++++++++++++++-----------
 1 file changed, 82 insertions(+), 25 deletions(-)

(limited to 'src/app/web-series/page.jsx')

diff --git a/src/app/web-series/page.jsx b/src/app/web-series/page.jsx
index 63fcd05..1adac80 100644
--- a/src/app/web-series/page.jsx
+++ b/src/app/web-series/page.jsx
@@ -1,28 +1,85 @@
-import styles from "./styles/web-series.module.css";
-import Pages from "./components/HomePageModules";
-import SearchBar from "./components/searchBar";
+import { Card, CardHeader, CardBody } from "@nextui-org/react";
+import Image from "next/image";
+import Link from "next/link";
+
+import {
+	TOP_SHOWS,
+	TRENDING_SHOWS,
+	POPULAR_SHOWS,
+} from "./components/data-fetch";
+import PreFecthSeriesInfo from "./components/cacher";
+import SeriesSearchBar from "./components/search";
+import styles from "../page.module.css";
+
+const SeriesHomepage = async () => {
+	const top_data = await TOP_SHOWS();
+	const trending_data = await TRENDING_SHOWS();
+	const popular_data = await POPULAR_SHOWS();
+
+	const dataToBeLoaded = [top_data, trending_data, popular_data];
+
+	for (let item of dataToBeLoaded) {
+		PreFecthSeriesInfo(item);
+	}
+
+	const HomepageDataFormatter = (title, data) => {
+		return (
+			<section className="flex flex-col">
+				<p className="text-sky-400 text-2xl font-bold">{title}</p>
+
+				<div
+					className={`flex items-center overflow-auto pb-2 mt-1 ${styles.ScrollBarAdjuster}`}
+				>
+					{data &&
+						data.results.map((item, index) => (
+							<Link
+								key={index}
+								href={`/web-series/${item.id}`}
+								aria-label="anime redirection links"
+								className="flex flex-col items-center mx-1 "
+							>
+								<Card className="overflow-visible " isPressable>
+									<CardBody>
+										<Image
+											alt="Movie Poster"
+											src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${item.poster_path}`}
+											width={270}
+											height={180}
+											className="h-64 rounded-md overflow-hidden"
+											priority
+										/>
+									</CardBody>
+									<CardHeader>
+										<h4
+											className={`antialiased  text-small text-center uppercase w-44 overflow-hidden whitespace-nowrap text-ellipsis `}
+										>
+											{item.name}
+										</h4>
+									</CardHeader>
+								</Card>
+							</Link>
+						))}
+				</div>
+			</section>
+		);
+	};
 
-export default async function SeriesHomepage() {
 	return (
-		<main className={styles.main}>
-			<SearchBar />
-			<Pages type={"popular"} />
-			<hr
-				style={{
-					borderColor: "grey",
-					marginTop: 15,
-					marginBottom: -15,
-				}}
-			/>
-			<Pages type={"trending"} />
-			<hr
-				style={{
-					borderColor: "grey",
-					marginTop: 15,
-					marginBottom: -15,
-				}}
-			/>
-			<Pages type={"top"} />
-		</main>
+		<section className="pt-12">
+			<div className="lg:ml-1">
+				<SeriesSearchBar />
+			</div>
+			<div className="lg:ml-1">
+				{HomepageDataFormatter("Popular Series", popular_data)}
+				<div className="mt-2">
+					{HomepageDataFormatter("Trending Series", trending_data)}
+				</div>
+				<div className="mt-2">
+					{HomepageDataFormatter("Top Rated Series", top_data)}
+				</div>
+			</div>
+		</section>
 	);
-}
+};
+
+export default SeriesHomepage;
-- 
cgit v1.2.3