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

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

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

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

<div class="space-y-4">
    {#if mod_pres_mgmt_json}
        <div class="grid grid-cols-2 gap-4">
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.lock_config}
                    />
                    <span>Lock Config</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.hide__location_code}
                    />
                    <span>Hide Location Code</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.hide__presentation_code}
                    />
                    <span>Hide Presentation Code</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.hide__presenter_code}
                    />
                    <span>Hide Presenter Code</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.hide__session_code}
                    />
                    <span>Hide Session Code</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.limit__navigation}
                    />
                    <span>Limit Navigation</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.limit__options}
                    />
                    <span>Limit Options</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.require__presenter_agree}
                    />
                    <span>Require Presenter Agreement</span>
                </label>
            </div>
            <div>
                <label class="label">
                    <input
                        type="checkbox"
                        class="checkbox"
                        bind:checked={mod_pres_mgmt_json.require__session_agree}
                    />
                    <span>Require Session Agreement</span>
                </label>
            </div>
        </div>

        <div class="space-y-2">
            <div>
                <label class="label">
                    <span>Label for Person External ID</span>
                    <input
                        type="text"
                        class="input"
                        bind:value={mod_pres_mgmt_json.label__person_external_id}
                    />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Label for Session POC Type</span>
                    <input
                        type="text"
                        class="input"
                        bind:value={mod_pres_mgmt_json.label__session_poc_type}
                    />
                </label>
            </div>
            <div>
                <label class="label">
                    <span>Label for Session POC Name</span>
                    <input
                        type="text"
                        class="input"
                        bind:value={mod_pres_mgmt_json.label__session_poc_name}
                    />
                </label>
            </div>
        </div>
    {/if}

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