import { useEffect, useState } from "react"
import { Button, Typography } from "@mui/material"

export default function ApiTest() {
    const [data, setData] = useState<any>(null)

    function getRealtimeData(data: any) {
        setData(data)
    }

    useEffect(() => {
        const sse = new EventSource(`${import.meta.env.VITE_API_SSE_URL}/stream`)

        sse.onmessage = e => getRealtimeData(e.data)

        sse.onerror = () => {
            sse.close()
        }

        return () => {
            sse.close()
        }
    }, [])

    return (
        <>
            <Typography>
                {JSON.stringify(data)}
            </Typography>
        </>
    )
}