sogo/UI/Templates/ContactsUI/UIxContactsUserFolders.wox

<?xml version="1.0" standalone="yes"?>
<!DOCTYPE container>
<container
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:var="http://www.skyrix.com/od/binding"
    xmlns:const="http://www.skyrix.com/od/constant"
    xmlns:label="OGo:label"
    xmlns:uix="OGo:uix">
  <md-dialog flex="50" flex-sm="100">
    <md-dialog-content>
      <h2 class="md-headline"><var:string label:value="Subscribe"/></h2>
      <md-input-container>
        <label><md-icon>search</md-icon><var:string label:value="Search"/></label>
        <input type="input"
               autocomplete="off"
               ng-model="vm.searchText"
               ng-model-options="vm.searchTextOptions"
               ng-change="vm.onChange()"/>
      </md-input-container>
      <md-list>
        <md-list-item layout="column"
                      ng-repeat="user in vm.users">
          <md-button class="sg-expandable" ng-click="vm.selectUser($index)">
            <div layout="row" layout-align="start center"
                 layout-fill="true">
              <div class="sg-avatar"><!-- normal-user --></div>
              <span class="sg-item-name">{{user.$shortFormat()}}</span>
              <span class="md-secondary md-display-1">
                <md-icon ng-class="{ 'icon-expand-more': user.uid != vm.selectedUser.uid,
                                     'icon-expand-less': user.uid == vm.selectedUser.uid }"><!--icon--></md-icon>
              </span>
            </div>
          </md-button>
          <md-list layout-fill="true"
                   ng-show="user == vm.selectedUser">
            <md-list-item ng-show="user.$$folders.length == 0">
              <md-icon>warning</md-icon>
              <var:string label:value="No possible subscription"/>
            </md-list-item>
            <md-list-item layout="row" layout-fill="true"
                          ng-repeat="folder in user.$$folders">
              <md-icon ng-class="{'icon-contacts': folder.type == 'Contact',
                                  'icon-event': folder.type == 'Appointment'}"><!--icon--></md-icon>
                <p class="md-flex sg-item-name">{{folder.displayName}}</p>
              <md-button
                  class="md-raised"
                  ng-click="vm.selectFolder(folder)"><var:string label:value="Subscribe"/></md-button>
            </md-list-item>
          </md-list>
          <md-divider ng-if="!$last"><!-- divider --></md-divider>
        </md-list-item>
      </md-list>
    </md-dialog-content>
  </md-dialog>
</container>