import React, { CSSProperties, useState } from "react"
import "../style/visualizer.css"
import Court from "../assets/court/full_court.svg"

export default function Visualizer({ id, name }: { id: number; name: string }) {
    const [style, setStyle] = useState<CSSProperties>({})

    return (
        <div id="main">
            <div id="topbar">
                <h1>{name}</h1>
            </div>
            <div id="court-container">
                <img
                    id="court"
                    src={Court}
                    style={style}
                    alt="Basketball Court"
                />
            </div>
        </div>
    )
}