<div class="modal-header">
    <h4>{{ data.module_human_name|unquote }} - Module Information</h4>
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
            aria-hidden="true">&times;</span></button>
</div>
<div class="modal-body">
    <div class="row">
        <div class="container col-6">
            <div class="form-group">
                <label>Name :</label>
                <span type="text" class="">{{ data.module_human_name|unquote }}</span>
            </div>
            <div class="form-group mt--3">
                <label>Description :</label>
                <span type="text" class="">{{ data.module_description }}</span>
            </div>
            <div class="form-group mt--3">
                <label>Target package :</label>
                <span type="text" class="text-faded">{{ data.module_name }}</span>
            </div>
            <div class="form-group mt--3">
                <label>Date added :</label>
                <span type="text" class="text-faded">{{ data.date_added }}</span>
            </div>
           {% if not is_configured %}
            <div class="form-group">
                <b class="text-danger">The module was automatically disabled because mandatory parameters are not set.</b>
            </div>
            {% endif %}
        </div>
        <div class="container col-6">
            <div class="form-group">
                <label>Module version :</label>
                <span type="text" class="text-faded">{{ data.module_version }}</span>
            </div>
            <div class="form-group mt--3">
                <label>Interface version :</label>
                <span type="text" class="text-faded">{{ data.interface_version }}</span>
            </div>
            <div class="form-group mt--3">
                <label>Is active :</label>
                <span type="text" class="text-faded">{{ data.is_active }} </span>
            </div>
            <div class="form-group mt--3">
                <label>Provides pipeline :</label>
                <span type="text" class="text-faded">{{ data.has_pipeline }}</span>
            </div>
        </div>

    </div>
    <div class="container col-12">
        <hr/>
        <div class="form-group mt-3">
             <label>Configuration (click on a setting to edit)</label>
            <button type="button" class="btn btn-sm btn-outline-dark float-right" onclick="export_mod_config('{{ data.id }}');">Export configuration</button>
            <button type="button" class="btn btn-sm btn-outline-dark float-right mr-2" data-toggle="modal" data-target="#modal_input_config">Import configuration</button>
        </div>
        <div class="form-group mt-3">

            <table id="datatable_db_list" class="table display table-bordered table-striped table-hover mt-4" width="100%"
                cellspacing="0">
                <thead>
                    <tr role="row">
                        <th>Section</th>
                        <th>Parameter</th>
                        <th>Value</th>
                        <th>Mandatory</th>
                    </tr>
                </thead>
                <tbody>
                    {% for id in config %}
                    <tr role="row">
                        <td>{{ id["section"] or "Main" }}</td>
                        <td><a href="#" onclick="update_param({{ data.id }}, '{{ data.id }}##{{ id['param_name'] }}');">
                            {% if (id['param_name'] in missing_params) %}
                              <i class="fa-solid fa-triangle-exclamation text-danger" title="Mandatory parameter not set"></i>
                            {% endif %}
                            {{ id["param_human_name"] }}
                        </a></td>
                        <td>{% if id["value"] is not none %}{% if id["type"] != "sensitive_string" %} {% if id["value"] is string %}{{ id["value"][0:20] }}{% else %}{{id["value"]}}{% endif %} {% else %} *************** {% endif %}{% endif %}</td>
                        <td>{{ id["mandatory"] }}</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-outline-danger mr-auto" onclick="remove_module('{{ data.id }}');">Remove module</button>
    {% if is_configured and not data.is_active %}
    <button type="button" class="btn btn-outline-success" onclick="enable_module('{{ data.id }}');">Enable module</button>
    {% elif is_configured and data.is_active %}
    <button type="button" class="btn btn-outline-warning" onclick="disable_module('{{ data.id }}');">Disable module</button>
    {% endif %}
    <button type="button" class="btn btn-default" data-dismiss="modal">Dismiss</button>
</div>

<div class="modal bg-shadow-gradient" tabindex="-1" role="dialog" id="modal_input_config" data-backdrop="true">
    <div class="modal-lg modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
              <h5>Import module configuration from file</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                  aria-hidden="true">&times;</span></button>
            </div>

            <div class="modal-body">
                <div class="form-group">
                    <p>Select a configuration file to upload. Existing configuration for this module will be overwritten.</p>
                    <label class="placeholder">Configuration file : </label>
                    <input id="input_configuration_file" type="file" accept="text/json">
                    <button type="button" class="btn  btn-outline-success float-right mr-2" onclick="import_mod_config('{{ data.id }}');">Import</button>
                </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

<script>
$(document).ready(function(){
    $("#datatable_db_list").DataTable({
        filter: true,
        order: [[0, 'asc']],
        rowGroup: {
            dataSrc: 0
        }
    });
});
</script>
