diff options
| author | real-zephex <[email protected]> | 2024-04-07 13:50:17 +0000 |
|---|---|---|
| committer | GitHub <[email protected]> | 2024-04-07 13:50:17 +0000 |
| commit | 1eee8b5196828128a189d6e9bf889500aadb2308 (patch) | |
| tree | 2c569fcd87048af5d3b2fd23a89b28c50565a109 /src/app/kdrama/components/search.jsx | |
| parent | idk what I am doing (diff) | |
| download | dramalama-1eee8b5196828128a189d6e9bf889500aadb2308.tar.xz dramalama-1eee8b5196828128a189d6e9bf889500aadb2308.zip | |
idek
Diffstat (limited to 'src/app/kdrama/components/search.jsx')
| -rw-r--r-- | src/app/kdrama/components/search.jsx | 15 |
1 files changed, 11 insertions, 4 deletions
diff --git a/src/app/kdrama/components/search.jsx b/src/app/kdrama/components/search.jsx index 4c9d00c..f9ba174 100644 --- a/src/app/kdrama/components/search.jsx +++ b/src/app/kdrama/components/search.jsx @@ -10,11 +10,14 @@ import Link from "next/link"; export default function DramaSearch() { const [title, setTitle] = useState(""); const [infoTitle, setInfoTitle] = useState(null); + const [loadingText, setLoadingText] = useState(null); - async function getSearchResults(title) { + const handleSearch = async (title) => { + setLoadingText(true); const data = await FetchSearchTitle(title); + setLoadingText(false); setInfoTitle(data); - } + }; return ( <div className={styles.SearchContainer}> @@ -25,12 +28,16 @@ export default function DramaSearch() { onChange={(event) => setTitle(event.target.value)} onKeyDown={async (e) => { if ((e.key === "Enter" || e.code === 13) && title) { - await getSearchResults(e.target.value); + await handleSearch(e.target.value); } }} ></input> </div> + {loadingText && ( + <p className={styles.LoadingText}>Wait a moment...</p> + )} + <div className={styles.SearchResults}> {infoTitle && infoTitle.results.map((item, index) => ( @@ -42,7 +49,7 @@ export default function DramaSearch() { <div className={styles.SearchEntry}> <p>{item.title}</p> <Image - src={item.image} + src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=${item.image}`} width={110} height={180} alt="Drama Poster" |