<script>

    import {getContext, onMount} from "svelte";
    import RecordRow from "./RecordRow.svelte"

    const channel = getContext("channel");
    let records = [];
    let graph = null;
    let users = [];
    onMount(() => {
        axios
            .get(channel.lucentUrl + "/home/records")
            .then((response) => {
                records = response.data.records;
                graph = response.data.graph;
                users = response.data.users;
            })
            .catch((error) => {
                console.log(error);
            });
    });
</script>

<div class="wrapper-normal transparent">

    <h3 class="header-small mb-4 mt-5">Latest Content changes</h3>
    {#if records.length > 0}
        <div class="lx-card  mb-4">
            <div class="lx-table p-0">
                <table class="">
                    <tbody>
                    {#each records as record (record.id)}
                        <tr>
                            <RecordRow {graph} {record} {users}/>
                        </tr>
                    {/each}
                    </tbody>
                </table>
            </div>
        </div>

    {/if}

</div>
