<div class='row groups'>
  <div class='content-list span6'>
    <h3>{{i18n admin.groups.edit}}</h3>
    <ul>
      {{#each group in model}}
        <li>
          <a href="#" {{action "edit" group}} {{bindAttr class="group.active"}}>{{group.name}} <span class="count">{{group.userCountDisplay}}</span></a>
        </li>
      {{/each}}
    </ul>
    <div class='controls'>
      <button class='btn' {{bindAttr disabled="refreshingAutoGroups"}} {{action "refreshAutoGroups"}}>Refresh</button>
      <button class='btn' {{action newGroup}}>New</button>
    </div>
  </div>

  <div class='content-editor'>
    {{#if model.active}}
      {{#if model.active.loaded}}
        {{#with model.active}}
          {{#if automatic}}
            <h3>{{name}}</h3>
          {{else}}
            {{textField value=name placeholderKey="admin.groups.name_placeholder"}}
          {{/if}}

          <div class="control-group">
            <label class="control-label">Group members</label>
            <div class="controls">
              {{userSelector usernames=usernames id="group-users" placeholderKey="admin.groups.selector_placeholder" tabindex="1" disabledBinding="automatic"}}
            </div>
          </div>
          <div class="control-group">
            <label class="control-label">{{i18n admin.groups.alias_levels.title}}</label>
            <div class="controls">
              {{combobox valueAttribute="value" value=alias_level content=validValues}}
            </div>
          </div>
          <div class='controls'>
            <button {{action save this}} {{bindAttr disabled="disableSave"}} class='btn'>{{i18n admin.customize.save}}</button>
            {{#unless automatic}}
                <a {{action destroy this}} class='delete-link'>{{i18n admin.customize.delete}}</a>
            {{/unless}}
          </div>
        {{/with}}
      {{else}}
        <div class='spinner'>{{i18n loading}}</div>
      {{/if}}
    {{else}}
      {{i18n admin.groups.about}}
    {{/if}}
  </div>
</div>
