diff options
| author | zephex <[email protected]> | 2024-04-20 13:34:53 +0530 |
|---|---|---|
| committer | zephex <[email protected]> | 2024-04-20 13:34:53 +0530 |
| commit | d6780cf3dad729c69a102ba2940188cf1e6bcbf4 (patch) | |
| tree | d10a2aefef6664c42439f165c73722c514b032bc /src/app/anime/search/page.jsx | |
| parent | feature added: tracker for mangas (diff) | |
| download | dramalama-d6780cf3dad729c69a102ba2940188cf1e6bcbf4.tar.xz dramalama-d6780cf3dad729c69a102ba2940188cf1e6bcbf4.zip | |
idk whats happening
Diffstat (limited to 'src/app/anime/search/page.jsx')
| -rw-r--r-- | src/app/anime/search/page.jsx | 134 |
1 files changed, 67 insertions, 67 deletions
diff --git a/src/app/anime/search/page.jsx b/src/app/anime/search/page.jsx index 43b5cd7..7ec2d2d 100644 --- a/src/app/anime/search/page.jsx +++ b/src/app/anime/search/page.jsx @@ -1,67 +1,67 @@ -"use client"; - -import styles from "./search.module.css"; -import { FaSearch } from "react-icons/fa"; // Import the search icon from react-icons library -import { useState } from "react"; -import Results from "./components/fetchInfo"; -import fetchedInfo from "./components/fetchedInfo"; -import Link from "next/link"; - -export default function Input() { - const [searchedAnime, setSearchedAnime] = useState(null); - const [loading, setLoading] = useState(null); - const [info, setInfo] = useState(null); - - const handleKeyPress = async (event) => { - if ( - (event.code === "Enter" || - event.key === "Enter" || - event.code === 13) && - searchedAnime !== "" - ) { - setLoading(true); - setInfo(await fetchedInfo(await Results(searchedAnime))); - setLoading(false); - } else if ( - (event.code === "Enter" || - event.key === "Enter" || - event.code === 13) && - searchedAnime === "" - ) { - alert("Input cannot be empty"); - } - }; - - return ( - <div> - <div className={styles.inputContainer}> - <div className={styles.searchContainer}> - <FaSearch className={styles.searchIcon} /> - <input - onChange={(event) => { - if (event.target.value.trim() !== "") { - setSearchedAnime(event.target.value); - } - }} - onKeyDown={(event) => handleKeyPress(event)} - placeholder="Enter anime title" - className={styles.SearchInput} - ></input> - </div> - <button> - <Link href={"/anime/history/continueWatching"}> - Watch History - </Link> - </button> - </div> - - {loading && ( - <p className={styles.waitWhileLoading}> - Please wait while we crunch all the data for you - </p> - )} - - {info} - </div> - ); -} +"use client";
+
+import styles from "./search.module.css";
+import { FaSearch } from "react-icons/fa"; // Import the search icon from react-icons library
+import { useState } from "react";
+import Results from "./components/fetchInfo";
+import fetchedInfo from "./components/fetchedInfo";
+import Link from "next/link";
+
+export default function Input() {
+ const [searchedAnime, setSearchedAnime] = useState(null);
+ const [loading, setLoading] = useState(null);
+ const [info, setInfo] = useState(null);
+
+ const handleKeyPress = async (event) => {
+ if (
+ (event.code === "Enter" ||
+ event.key === "Enter" ||
+ event.code === 13) &&
+ searchedAnime !== ""
+ ) {
+ setLoading(true);
+ setInfo(await fetchedInfo(await Results(searchedAnime)));
+ setLoading(false);
+ } else if (
+ (event.code === "Enter" ||
+ event.key === "Enter" ||
+ event.code === 13) &&
+ searchedAnime === ""
+ ) {
+ alert("Input cannot be empty");
+ }
+ };
+
+ return (
+ <div>
+ <div className={styles.inputContainer}>
+ <div className={styles.searchContainer}>
+ <FaSearch className={styles.searchIcon} />
+ <input
+ onChange={(event) => {
+ if (event.target.value.trim() !== "") {
+ setSearchedAnime(event.target.value);
+ }
+ }}
+ onKeyDown={(event) => handleKeyPress(event)}
+ placeholder="Enter anime title"
+ className={styles.SearchInput}
+ ></input>
+ </div>
+ <button>
+ <Link href={"/anime/history/continueWatching"}>
+ Watch History
+ </Link>
+ </button>
+ </div>
+
+ {loading && (
+ <p className={styles.waitWhileLoading}>
+ Please wait while we crunch all the data for you
+ </p>
+ )}
+
+ {info}
+ </div>
+ );
+}
|