<script>
    import Tools from "./tools/Tools.svelte";
    import Pagination from "./pagination/Pagination.svelte";
    import ActionsOnSelected from "./ActionsOnSelected.svelte";
    import Table from "./Table.svelte";
    import {getContext} from "svelte";
    import Grid from "./Grid.svelte";

    const axios = getContext("axios");
    export let schema;
    export let users;
    export let records;
    export let graph;
    // export let visibleFields;
    export let systemFields;
    export let sortParam;
    export let sortField;
    export let operators;
    export let filter;
    export let limit;
    export let skip;
    export let total;
    export let inModal;
    export let modalUrl;
    export let selected = [];
    export let isWritable = false;

    function refresh(e) {
        const newUrl = e.detail;
        axios
            .get(newUrl)
            .then((response) => {
                records = response.data.records;
                sortParam = response.data.sortParam;
                sortField = response.data.sortField;
                operators = response.data.operators;
                filter = response.data.filter;
                skip = response.data.skip;
                limit = response.data.limit;
                total = response.data.total;
                modalUrl = response.data.modalUrl;
            })
            .catch((error) => {
                console.log(error);
            });
    }
</script>

<div class="wrapper-large transparent ">
    <div class="lx-card  mb-4  {inModal ? 'mt-0' : 'mt-5'}">
        <h3 class="header-normal mb-5 ">
            {schema.label}
        </h3>
        {#if selected.length > 0 && !inModal && isWritable}
            <ActionsOnSelected {schema} {selected} {filter}/>
        {:else}
            <Tools
                    bind:schema
                    bind:records
                    {systemFields}
                    {sortParam}
                    {sortField}
                    {operators}
                    {filter}
                    {graph}
                    {inModal}
                    {modalUrl}
                    {isWritable}
                    on:refresh={refresh}
            />
        {/if}

        {#if schema.type === "collection"}
            <Table
                    {records}
                    {graph}
                    {schema}
                    {sortParam}
                    {sortField}
                    {systemFields}
                    {inModal}
                    {users}
                    {isWritable}
                    bind:selected
            />
        {:else}
            <Grid
                    {records}
                    {schema}
                    {isWritable}
                    bind:selected
            />

        {/if}
    </div>

    <Pagination
            {limit}
            {skip}
            {total}
            on:refresh={refresh}
            {inModal}
            {modalUrl}
    />
</div>

