<section class="field">
  {{#if category.is_special}}
    {{#if category.isUncategorizedCategory}}
      <p class="warning">{{i18n "category.uncategorized_security_warning"}}</p>
    {{else}}
      <p class="warning">{{i18n "category.special_warning"}}</p>
    {{/if}}
  {{/if}}
  {{#unless category.isUncategorizedCategory}}
    <ul class="permission-list">
      {{#each category.permissions as |p|}}
        <li>
          <span class="name"><span class="badge-group">{{p.group_name}}</span></span>
          {{html-safe (i18n "category.can")}}
          <span class="permission">{{p.permission.description}}</span>
          {{#if editingPermissions}}
            <a class="remove-permission" href {{action "removePermission" p}}>{{d-icon "times-circle"}}</a>
          {{/if}}
        </li>
      {{/each}}
    </ul>
  {{/unless}}
  {{#if editingPermissions}}
    {{#if category.availableGroups}}
      {{combo-box
        class="available-groups"
        content=category.availableGroups
        onChange=(action "onSelectGroup")
        value=selectedGroup
        valueProperty=null
        nameProperty=null
        options=(hash
          placementStrategy="absolute"
        )
      }}
      {{combo-box
        class="permission-selector"
        nameProperty="description"
        content=category.availablePermissions
        onChange=(action "onSelectPermission")
        value=selectedPermission
        options=(hash
          placementStrategy="absolute"
        )
      }}
      {{d-button
        action=(action "addPermission" selectedGroup selectedPermission)
        class="btn-primary add-permission"
        icon="plus"}}
      {{#if showPendingGroupChangesAlert}}
        <div class="pending-permission-change-alert">
          <div class="arrow-div"></div>
          {{i18n "category.pending_permission_change_alert" group=selectedGroup}}
        </div>
      {{/if}}
    {{/if}}
  {{else}}
    {{#unless category.is_special}}
      {{d-button
        action=(action "editPermissions")
        class="btn-default edit-permission"
        label="category.edit_permissions"}}
    {{/unless}}
  {{/if}}
</section>

{{plugin-outlet name="category-custom-security" args=(hash category=category) connectorTagName="" tagName="section"}}
