<div class="col-sm-9 col-md-10 col-sm-push-3 col-md-push-2">
    <h1>
        <span><strong>User Federation</strong> {{realm.realm|capitalize}}</span>
    </h1>

    <table class="table table-striped table-bordered">
        <thead>
        <tr ng-show="providers.length > 0 && access.manageUsers">
            <th colspan="3" class="kc-table-actions">
                <div class="pull-right">
                    <div>
                        <select class="form-control" ng-model="selectedProvider"
                                ng-options="p.id for p in providers"
                                data-ng-change="addProvider(selectedProvider); selectedProvider = null">
                            <option value="" disabled selected>Add provider...</option>
                        </select>
                    </div>
                </div>
            </th>
        </tr>
        <tr data-ng-show="instances && instances.length > 0">
            <th>ID</th>
            <th>Provider Name</th>
            <th>Priority</th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="instance in instances">
            <td><a href="#/realms/{{realm.realm}}/user-federation/providers/{{instance.providerName}}/{{instance.id}}">{{instance.displayName}}</a></td>
            <td>{{instance.providerName|capitalize}}</td>
            <td>{{instance.priority}}</td>
         </tr>
        <tr data-ng-show="!instances || instances.length == 0">
            <td class="text-muted">No user federation providers configured</td>
        </tr>
        </tbody>
    </table>
</div>

<kc-menu></kc-menu>