Merge pull request #41 from real-zephex/series-overhaul

✨ feat(series): rewrite series page and drop manga support

1 files changed, 57 insertions, 0 deletions

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;