<div data-ng-controller="ClientScopeTabCtrl">

    <h1 data-ng-show="create">{{:: 'add-client-scope' | translate}}</h1>
    <h1 data-ng-hide="create">
        {{clientScope.name|capitalize}}
        <i id="removeClientScope" class="pficon pficon-delete clickable" data-ng-show="access.manageClients" data-ng-click="removeClientScope()"></i>
    </h1>

    <ul class="nav nav-tabs nav-tabs-pf"  data-ng-hide="create && !path[4]">
        <li ng-class="{active: !path[4]}"><a href="#/realms/{{realm.realm}}/client-scopes/{{clientScope.id}}">{{:: 'settings' | translate}}</a></li>
        <li ng-class="{active: path[4] == 'mappers'}">
            <a href="#/realms/{{realm.realm}}/client-scopes/{{clientScope.id}}/mappers">{{:: 'mappers' | translate}}</a>
            <kc-tooltip>{{:: 'mappers.tooltip' | translate}}</kc-tooltip>
        </li>
        <li ng-class="{active: path[4] == 'scope-mappings'}" data-ng-show="client.protocol != 'docker-v2'">
            <a href="#/realms/{{realm.realm}}/client-scopes/{{clientScope.id}}/scope-mappings">{{:: 'scope' | translate}}</a>
            <kc-tooltip>{{:: 'scope.tooltip' | translate}}</kc-tooltip>
        </li>
    </ul>
</div>