<script>
    import {getContext} from "svelte";
    import SpinnerButton from "../common/SpinnerButton.svelte";
    import ErrorAlert from "../common/ErrorAlert.svelte";
    import MemberSettingsCard from "../members/MemberSettingsCard.svelte";
    import SuccessAlert from "../common/SuccessAlert.svelte";
    import Radio from "../forms/Radio.svelte";

    const channel = getContext("channel");
    export let title;
    $: date = "";
    $: logs = "";


    function buildWebsite(e) {
        e.preventDefault();

        axios.post(channel.lucentUrl + "/build").then(response => {
            const eventSource = new EventSource(channel.lucentUrl + "/build-report-source");

            eventSource.onmessage = function(event) {
                const data = JSON.parse(event.data);
                date =  data.date;
                logs =  data.logs;
            }
            eventSource.onerror = (e)=>{
                console.log(e)
            }
        })

    }

</script>

<div class="wrapper-tiny transparent mb-5">
    <div class="lx-card mt-5">

        <h3 class="header-small mb-5">{title}</h3>

        <button on:click={buildWebsite} class="btn btn-outline-primary btn-sm mb-3">Start Build</button>

        <div class="mb-3">{date}</div>

        <pre>{logs}</pre>
    </div>
</div>
