fixes: anime section is fully server rendered, added a loading screen for info and video page, minor css optimizations

2 files changed, 9 insertions, 14 deletions

diff --git a/src/app/search/page.jsx b/src/app/search/page.jsx
index e6d4f08..00309f6 100644
--- a/src/app/search/page.jsx
+++ b/src/app/search/page.jsx
@@ -5,19 +5,24 @@ import { FaSearch } from "react-icons/fa"; // Import the search icon from react-
 import { useState } from "react";
 import Image from "next/image";
 import Link from "next/link";
+import testFunction from "./api/fetchInfo";
 
 export default function Input() {
 	const [searchedAnime, setSearchedAnime] = useState(null);
 	const [loading, setLoading] = useState(null);
+	const [search1, setSearch] = useState(null);
 
-	const handleKeyPress = (event) => {
+	const handleKeyPress = async (event) => {
 		if (
 			(event.code === "Enter" ||
 				event.key === "Enter" ||
 				event.code === 13) &&
 			searchedAnime != ""
 		) {
-			fetch_animes(searchedAnime);
+			setLoading(true);
+			let x = await testFunction(searchedAnime);
+			setSearch(x);
+			setLoading(false);
 		} else if (
 			(event.code === "Enter" ||
 				event.key === "Enter" ||
@@ -28,17 +33,6 @@ export default function Input() {
 		}
 	};
 
-	const [search1, setSearch] = useState(null);
-	const fetch_animes = (title) => {
-		fetch("https://dramalama-api.vercel.app/anime/gogoanime/" + title)
-			.then(setLoading(true))
-			.then((res) => res.json())
-			.then((data) => {
-				setSearch(data);
-				setLoading(false);
-			});
-	};
-
 	return (
 		<div>
 			<div className="inputContainer">
diff --git a/src/app/search/search.css b/src/app/search/search.css
index d24293e..8afb508 100644
--- a/src/app/search/search.css
+++ b/src/app/search/search.css
@@ -63,13 +63,14 @@
 
 .anime p {
 	color: white;
-	width: 25vh;
+	width: 25dvh;
 	font-family: "Lato";
 	font-size: 18px;
 }
 
 .animeImage {
 	border-radius: 10px;
+	margin-left: 20px;
 }
 
 @media screen and (max-width: 768px) {