<script lang="ts">
import type { key_val } from '$lib/stores/ae_stores';

interface Props {
    mod_abstracts_json: key_val | null | undefined;
    onsave?: (data: key_val) => void;
}

let { mod_abstracts_json = $bindable({}), onsave }: Props = $props();

function save() {
    if (onsave && mod_abstracts_json) onsave(mod_abstracts_json);
}
</script>

<div class="space-y-4">
    {#if mod_abstracts_json}
        <div class="space-y-2">
            <div>
                <label class="label">
                    <span>Name Character Limit</span>
                    <input
                        type="number"
                        class="input"
                        bind:value={mod_abstracts_json.name_char_limit} />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Text Character Limit</span>
                    <input
                        type="number"
                        class="input"
                        bind:value={mod_abstracts_json.text_char_limit} />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Deadline for New Abstracts</span>
                    <input
                        type="datetime-local"
                        class="input"
                        bind:value={mod_abstracts_json.deadline_new} />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Deadline for Updates</span>
                    <input
                        type="datetime-local"
                        class="input"
                        bind:value={mod_abstracts_json.deadline_updates} />
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={
                            mod_abstracts_json.confirm_email_w_link
                        } />
                    <span>Confirm Email with Link</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Confirmation From Email</span>
                    <input
                        type="email"
                        class="input"
                        bind:value={mod_abstracts_json.confirm_from_email} />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Confirmation From Name</span>
                    <input
                        type="text"
                        class="input"
                        bind:value={mod_abstracts_json.confirm_from_name} />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Confirmation To Email Override</span>
                    <input
                        type="email"
                        class="input"
                        bind:value={
                            mod_abstracts_json.confirm_to_email_override
                        } />
                </label>
            </div>
        </div>
    {/if}

    <button type="button" class="btn preset-tonal-primary" onclick={save}
        >Save</button>
</div>
