'use client' import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { IconUserFilled } from "@tabler/icons-react" import { Black, Blue, Green, White, Red, Colorless } from "@/components/ui/mana-icons" import { useEffect, useState } from 'react' interface NavigationProps { isLoggedIn: boolean, username: string } interface bsetJsonObject { name: string, sanitized_name: string, set_codes: string[], icons: string[] } export function NavigationBar ({ isLoggedIn, username}: NavigationProps) { const [bsetsList, setBsetsList] = useState([]) useEffect(() => { fetch('http://localhost:8072/misc/bsets.json').then((res) => { if(res.status == 200) { res.json().then((data) => { setBsetsList(data) console.log(data) }) } }) }, []) return (
BRAWL SET Top commandants Mono White Bleu Noir Rouge Vert Incolor 2 couleurs Azorius Dimir Rakdos Gruul Selesnya Orzhov Izzet Golgari Boros Simic 3 couleurs Esper Grixis Jund Naya Bant Abzan Jeskai Sultai Mardu Temur 4+ couleurs Yore-Tiller Glint-Eye Dune-Brood Ink-Treader Witch-Maw 5 couleurs { bsetsList.length == 0 && ( Loading )} { bsetsList.length != 0 && bsetsList.slice(0,7).map((bset) => (
{ bset.icons.map((icon) => ( ))}
{bset.name}
))} Plus de BSets...
{ !isLoggedIn && <> } { isLoggedIn && <> Decks {username} }
) }