{{ define "impliedSrcSuffixDialog" }}
<link href="/static/css/pages/src-dst.css" rel="stylesheet">

<div class="modal" id="implied_src_suffix_modal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="implied_src_suffix_modal_label" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-show-levels-size">
        <div class="modal-content">
            <div class="modal-header justify-content-between">
                <span class="modal-title" id="implied_src_suffix_modal_label"><i class="icon-rename icon-white"></i>Auto-Configured Source Suffixes</span>
                <span class="btn btn-transparent" id="button_cancel_header"><i class="icon-close-header"></i></span>
            </div>
            <div class="modal-body">
                <div class="container-data container-data-implied-suffix">
                    <div class="grid-wrapper-implied-suffix">
                        <div id="implied_src_suffix_grid" style="height: 100%;" class="ag-theme-balham-dark"></div>
                    </div>
                </div>
            </div>
            <div class="modal-footer justify-content-between">
                <button id="button_cancel" class="btn btn-text btn-outline-secondary" tabindex="4">Cancel</button>
                <button id="button_apply" class="btn btn-text" tabindex="3">Apply</button>
            </div>
        </div>
    </div>
</div>

<script src="/static/js/implied-src.js"></script>

<script type="text/javascript">
    const impliedSrcSuffixDialogId = "implied_src_suffix_modal";

    let impliedSrcSuffixGridConf;

    function showImpliedSrcSuffixModal() {
        let gridConf = createImpliedSrcSuffixGridConf(false);
        gridConf.onGridReady = onSuffixTableReady; // Data will be loaded in this callback.
        impliedSrcSuffixGridConf = gridConf;

        let gridDiv = document.getElementById("implied_src_suffix_grid");
        if (gridDiv.ag_grid) {
            gridDiv.ag_grid.destroy();
        }
        gridDiv.ag_grid = new agGrid.Grid(gridDiv, gridConf);

        document.getElementById("button_cancel").onclick = hideImpliedSrcSuffixModal;
        document.getElementById("button_cancel_header").onclick = hideImpliedSrcSuffixModal;
        document.getElementById("button_apply").onclick = () => {
            saveImpliedSrcSuffixRename(impliedSrcSuffixGridConf.api, impliedSrcSuffixGridConf.originalRows);
            hideImpliedSrcSuffixModal();
        };

        // Dialog will be shown in onSuffixDataLoaded.
    }

    function hideImpliedSrcSuffixModal() {
        hideDialog(impliedSrcSuffixDialogId);
    }

    function onSuffixTableReady(params) {
        loadImpliedSrcSuffixData(onSuffixDataLoaded);
    }

    function onSuffixDataLoaded(rows) {
        let gridConf = impliedSrcSuffixGridConf;
        let prepRows = prepImpliedSrcSuffixRows(rows);
        gridConf.originalRows = JSON.parse(JSON.stringify(prepRows)); // Deep copy of initial data.
        gridConf.api.setRowData(prepRows);

        displayDialog(impliedSrcSuffixDialogId);
    }
</script>

{{ end }}