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/components/search.jsx | 57 ++++++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)
 create mode 100644 src/app/web-series/components/search.jsx

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

diff --git a/src/app/web-series/components/search.jsx b/src/app/web-series/components/search.jsx
new file mode 100644
index 0000000..ecf392c
--- /dev/null
+++ b/src/app/web-series/components/search.jsx
@@ -0,0 +1,57 @@
+"use client";
+
+import { useState } from "react";
+import { Input, Progress } from "@nextui-org/react";
+
+import { SEARCH_TV } from "./data-fetch";
+import SeriesSearchFormatter from "./seriesSearchFormatter";
+import PreFecthSeriesInfo from "./cacher";
+// import { SearchMovie } from "./requestsHandler";
+// import MovieSearchFormatter from "./searchFormatter";
+
+const SeriesSearchBar = () => {
+	const [seriesTitle, setSeriesTitle] = useState("");
+	const [loading, setLoading] = useState(<></>);
+	const [seriesResults, setSeriesResults] = useState(<></>);
+
+	async function handleInputChange() {
+		setLoading(
+			<Progress
+				size="sm"
+				isIndeterminate
+				aria-label="Loading..."
+				className="w-full"
+			/>
+		);
+		const data = await SEARCH_TV(seriesTitle);
+		PreFecthSeriesInfo(data);
+		setLoading(<></>);
+		setSeriesResults(await SeriesSearchFormatter(data));
+	}
+
+	return (
+		<section>
+			<div className="flex flex-col w-full md:flex-nowrap gap-2 lg:w-1/2">
+				<Input
+					type="text"
+					label="Search for series"
+					placeholder="Enter series title"
+					onChange={(event) => {
+						if (event.target.value.trim() !== "") {
+							setSeriesTitle(event.target.value);
+						}
+					}}
+					onKeyDown={async (event) => {
+						if (event.key === "Enter" || event.code === "Enter") {
+							await handleInputChange();
+						}
+					}}
+				/>
+				{loading}
+			</div>
+			<div className="mt-2">{seriesResults}</div>
+		</section>
+	);
+};
+
+export default SeriesSearchBar;
-- 
cgit v1.2.3