<script>
    import { post } from "../../modules/remote";
    import { getApp } from "../../app";

    // import Tools from "./tools/Tools.svelte";
    // import Pagination from "./pagination/Pagination.svelte";
    // import ActionsOnSelected from "./ActionsOnSelected.svelte";
    // import Table from "./Table.svelte";
    let { channel, data } = $props();
    let newRecordName = $state("");
    const app = getApp();
    // 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;
    let inModal = false;
    // 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;
    //             document.querySelector("dialog h3").scrollIntoView();
    //         })
    //         .catch((error) => {
    //             console.log(error);
    //         });
    // }
    //

    function handleRecordCreate(e) {
        e.preventDefault();
        post(
            channel.lucentUrl + "/records",
            {
                schemaId: data.schema.id,
                title: newRecordName,
            },
            (data, err) => {
                if (err.isEmpty()) {
                    Turbo.visit(app.url("records/" + data.id));
                }
            },
        );
    }
</script>

<div class="">
    <div class={inModal ? "mt-0" : "mt-5"}>
        <h3 class="header-normal mb-5">
            {data.schema.name}
        </h3>
        <details style="max-width: 400px;">
            <summary>New Record</summary>
            <form onsubmit={handleRecordCreate}>
                <fieldset>
                    <input
                        bind:value={newRecordName}
                        placeholder="Record title"
                        required
                    />
                </fieldset>
                <button type="submit">Create</button>
            </form>
        </details>
        <!-- {#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}

        <Table
                {records}
                {graph}
                {schema}
                {sortParam}
                {sortField}
                {systemFields}
                {inModal}
                {users}
                {isWritable}
                bind:selected
        /> -->
    </div>
    <!--
    <Pagination
            {limit}
            {skip}
            {total}
            on:refresh={refresh}
            {inModal}
            {modalUrl}
    /> -->
</div>
