import theme
from nicegui import ui
from utils import Utils
import random

color = {"tnt": theme.tnt, "cubbies": theme.cubbies, "sparks": theme.sparks}

@ui.page("/dashboard", dark=False)
def dashboard():
    random_order = []
    with theme.frame("Dashboard"):
        pass

    # with ui.grid().style('grid-template-columns: repeat(2, minmax(1px, 1fr));'):
    # with ui.grid().classes('grid-flow-row-dense grid-flow-col-dense grid-cols-auto grid-rows-5').style('height: 90vh; width: 100%;'):
    with ui.grid().classes("flex flex-row gap-x-2 flex-wrap").style(
        "height: 80vh; width: 100%;"
    ):
        peoples = Utils.get_unique_people()
        for ppl in peoples:
            pl = "".join(ppl)
            card_info = Utils.get_persons_incomplete(pl)
            random_order = random_order + card_info
        random.shuffle(random_order)
        for item in random_order:
            pl = ui.label(item[0]).classes("hidden")
            vcard = ui.label(item[1]).classes("hidden")
            pcard = ui.label(item[2]).classes("hidden")
            club = ui.label(item[3]).classes("hidden")
            with ui.card().classes("grid justify-items-center").style(
                f"border: 2px solid {color[club.text.lower()]}"
            ):
                ui.label(pl.text).classes("absolute top-4 left-3 font-thin text-sm")
                ui.label(vcard.text).classes("text-center font-mono")
                ui.label(pcard.text).classes("font-light text-lg font-sans text-wrap break-words")#.style('font-family: "Liberation Mono"')