Fascinated/scoresaber-reloaded-v2
1
2
Fork 0
Code Issues 1 Pull Requests 10 Actions Activity

fix searching
All checks were successful
deploy / deploy (push) Successful in 44s
Details

Browse Source
This commit is contained in:
Lee 2023-10-20 12:07:17 +01:00
parent c743745889
commit 9b85521964
1 changed files with 7 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/SearchPlayer.tsx
View File

@ -1,6 +1,7 @@
"use client"; "use client";
import { ScoresaberPlayer } from "@/schemas/scoresaber/player"; import { ScoresaberPlayer } from "@/schemas/scoresaber/player";
import { searchByName } from "@/utils/scoresaber/api";
import { MagnifyingGlassIcon } from "@heroicons/react/20/solid"; import { MagnifyingGlassIcon } from "@heroicons/react/20/solid";
import clsx from "clsx"; import clsx from "clsx";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
@ -19,15 +20,11 @@ export default function SearchPlayer() {
searchPlayer(search); searchPlayer(search);
}, [search]); }, [search]);
function searchPlayer(search: string) { async function searchPlayer(search: string) {
fetch(`/api/player/search?name=${search}`).then(async (reponse) => { const players = await searchByName(search);
const json = await reponse.json(); if (players == undefined) return;
if (json.error || !json.players) { setPlayers(players);
setPlayers([]); // Clear players
}
setPlayers(json.players); // Set players
});
} }
function handleSubmit(e: React.FormEvent<HTMLFormElement>) { function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
@ -54,14 +51,14 @@ export default function SearchPlayer() {
<div <div
className={clsx( className={clsx(
"absolute z-20 mt-7 flex min-w-[14rem] flex-col divide-y rounded-md bg-neutral-700 shadow-sm", "absolute z-20 mt-7 flex min-w-[14rem] flex-col divide-y rounded-md bg-gray-700 shadow-sm",
players.length > 0 ? "flex" : "hidden", players.length > 0 ? "flex" : "hidden",
)} )}
> >
{players.map((player: ScoresaberPlayer) => ( {players.map((player: ScoresaberPlayer) => (
<a <a
key={player.id} key={player.id}
className="flex min-w-[14rem] items-center gap-2 rounded-md p-2 transition-all hover:bg-neutral-600" className="flex min-w-[14rem] items-center gap-2 rounded-md p-2 transition-all hover:bg-gray-600"
href={`/player/${player.id}`} href={`/player/${player.id}`}
> >
<Avatar label="Account" size={40} url={player.profilePicture} /> <Avatar label="Account" size={40} url={player.profilePicture} />