<div class="modal-header">
    <a class="pull-right" ng-click="closeModal()" href="">
        <span class="icon icon-cross" tooltip="{{translation.close[LANG]}}"></span>
    </a>
    <h3 class="modal-title">{{title}}</h3>
</div>
<div class="modal-body">
    <div class="form">
        <alert type="danger" ng-if="message.danger">{{message.danger}}</alert>
        <form name="tenantExtKeys" id="tenantExtKeys" novalidate ng-submit="tenantExtKeys.$valid && onSubmit()">
            <div class="form-group">
                <input type="text" class="form-control text-field-align-right mb5" ng-model="tenantSearch" ng-keyup="filterData(tenantSearch)" placeholder="Search">
                <label>{{translation.availableTenantsWithExternalKeys[LANG]}}</label>
                <div class="grid externalKeysGrid" style="overflow:scroll; height:500px; width: 100%">
                    <table cellspacing="0" cellpadding="0" border="0" width="100%">
                        <tbody>
                            <tr>
                                <th class="actions">{{translation.select[LANG]}}</th>
                                <th class="name">{{translation.name[LANG]}}</th>
                                <th class="package">{{translation.packages[LANG]}}</th>
                                <th class="description">{{translation.applicationDescription[LANG]}}</th>
                                <th class="extKeyEnv">{{translation.externalKeyEnv[LANG]}}&nbsp;</th>
                            </tr>
                            <tr ng-repeat="tenant in outerScope.filteredTenantsList" ng-class-even="'even'" ng-class-odd="'odd'" ng-if="outerScope.filteredTenantsList.length > 0">
                                <td><input type="checkbox" ng-model="selectedTenants[tenant.extKeyEnv + '.' + tenant.extKey]" ng-true-value="{{tenant}}"/></td>
                                <td>{{tenant.name}}</td>
                                <td>{{tenant.package}}</td>
                                <td>{{tenant.appDescription}}</td>
                                <td>{{tenant.extKeyEnv}}</td>
                            </tr>
                        </tbody>
                    </table>
                    <alert type="warning" ng-if="outerScope.filteredTenantsList.length === 0 && !tenantSearch">{{translation.noTenantsFound[LANG]}}</alert>
                    <alert type="warning" ng-if="outerScope.filteredTenantsList.length === 0 && tenantSearch">{{translation.noSearchResultsFoundFor[LANG]}} {{tenantSearch}}.</alert>
                </div><br>
                <div class="pull-right">
                    <input type="submit" class="btn btn-primary" value="{{translation.save[LANG]}}"/>
                    <input type="button" class="btn btn-danger" value="{{translation.cancel[LANG]}}" ng-click="closeModal()"/>
                </div><br/>
            </div>
        </form>
    </div>
</div>
