Radiquum/AniX
1
0
Fork 0
mirror of https://github.com/Radiquum/AniX.git synced 2025-04-07 00:34:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

frontend: add message panels to search. disable to search empty query.

Browse source
This commit is contained in:
Kentai Radiquum 2024-04-27 23:50:57 +05:00
parent baaa67f2ab
commit 3fdf67c860
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
2 changed files with 44 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/app/components/LogInNeeded/LogInNeeded.jsx
View file

@ -1,7 +1,5 @@
"use client"; "use client";
import Link from "next/link";
export const LogInNeeded = (props) => { export const LogInNeeded = (props) => {
return ( return (
<div className="absolute padding error center middle round"> <div className="absolute padding error center middle round">

75
frontend/app/search/page.js
View file

@ -69,20 +69,22 @@ export default function Search() {
const handleSubmit = async (e) => { const handleSubmit = async (e) => {
e.preventDefault(); e.preventDefault();
router.push(pathname + "?" + createQueryString("query", query)); if (query != "") {
setReleases(null); router.push(pathname + "?" + createQueryString("query", query));
setPage(0); setReleases(null);
fetchData(query); setPage(0);
fetchData(query);
// save searches and update search history // save searches and update search history
if (!searches) { if (!searches) {
setSearches([query]); setSearches([query]);
saveSearches(JSON.stringify([query])); saveSearches(JSON.stringify([query]));
} else { } else {
console.log(searches); console.log(searches);
if (!searches.find((element) => element == query)) { if (!searches.find((element) => element == query)) {
setSearches([query, ...searches.slice(0, 5)]); setSearches([query, ...searches.slice(0, 5)]);
saveSearches(JSON.stringify([query, ...searches.slice(0, 5)])); saveSearches(JSON.stringify([query, ...searches.slice(0, 5)]));
}
} }
} }
}; };
@ -115,26 +117,37 @@ export default function Search() {
</div> </div>
{releases ? ( {releases ? (
<> releases.lenght > 0 ? (
<div className="grid"> <>
<CardList data={releases} /> <div className="grid">
</div> <CardList data={releases} />
</div>
<nav className="large-margin center-align"> <nav className="large-margin center-align">
<button <button
className="large" className="large"
onClick={() => { onClick={() => {
setPage(page + 1); setPage(page + 1);
}} }}
> >
<i>add</i> <i>add</i>
<span>загрузить ещё</span> <span>загрузить ещё</span>
</button> </button>
</nav> </nav>
</> </>
) : (
<div className="absolute padding primary center middle small-round">
<i className="extra">search</i>
<h5>Ничего не найдено.</h5>
<p>Введите другой поисковой запрос.</p>
</div>
)
) : ( ) : (
// <progress className="s1"></progress> <div className="absolute padding primary center middle small-round">
"" <i className="extra">search</i>
<h5>Здесь пока ничего нет.</h5>
<p>Введите поисковой запрос для начала поиска.</p>
</div>
)} )}
</> </>
); );