<commit_before>{{! regarding formLayout: 
https://github.com/kaliber5/ember-bootstrap/issues/441}}

<BsModal
  @open={{this.showDeleteUsersDialog}}
  @onSubmit={{perform this.deleteUsers}}
  @onHide={{action (mut this.showDeleteUsersDialog) false}}
  as |modal|>
  <modal.header>
    <h4 class="modal-title">Please confirm</h4>
  </modal.header>
  <modal.body>Are you sure you want to delete the selected users?</modal.body>
  <modal.footer as |footer|>
    <BsButton @onClick={{action modal.close}} @type="danger">Cancel</BsButton>
    <BsButton @onClick={{action modal.submit}} @type="success" @disabled={{this.deleteUsers.isRunning}}>
      {{#if this.deleteUsers.isRunning}}
        Deleting <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
      {{else}}
        Confirm
      {{/if}}
    </BsButton>
  </modal.footer>
</BsModal>

<div class="col-12 d-flex flex-column">
  <h3>Users</h3>
  <div class="mb-3">
    <div class="d-flex justify-content-between">
      <div class="d-flex">
        {{!-- Delete Multiple Users Button --}}
        {{#if this.showDeleteUsersButton}}
          <BsButton
            class="d-flex-center mr-2"
            @onClick={{action (mut this.showDeleteUsersDialog) true}}
            @type="danger"
            @outline={{true}}
            @title="Delete Selected Users"
          >
            {{svg-jar "trashcan" class="octicon"}}
          </BsButton>
        {{/if}}
      </div>
      <div class="d-flex">
        {{!-- User Creation Button --}}
        <BsButton
          class="d-flex-center mr-2"
          @onClick={{perform this.openUserCreation}}
          @type="success"
          @outline={{true}}
          @title="Add Users"
          @disabled={{this.openUserCreation.isRunning}}
        >
          {{#if this.openUserCreation.isRunning}}
            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
          {{else}}
            {{svg-jar "organization" class="octicon"}}{{svg-jar "plus-small" class="octicon"}}
          {{/if}}
          <span>Create Users</span>
        </BsButton>
        {{!-- Refresh Button --}}
        <BsButton
          class="d-flex-center"
          @onClick={{action 'updateUserList'}}
          @outline={{true}}
          @title="Reload Users"
        >
          {{#unless this.users}}
            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
          {{else}}
            {{svg-jar "sync" class="octicon"}}
          {{/unless}}
        </BsButton>
      </div>
    </div>
  </div>
  <div id="user-list-table-div" class="d-flex flex-grow-1 flex-column" style="overflow-y: auto">
    {{!-- User List --}}
    <table class="table table-striped">
      <thead class="thead-light">
        <tr>
          <th style="width: 20px">
            <div class="custom-control custom-checkbox">
              <input type="checkbox" class="custom-control-input" id="checkAll" checked={{this.allSelected}} onchange={{action "selectAllCheckboxes"}}>
              <label class="custom-control-label" for="checkAll"></label>
            </div>
          </th>
          <th scope="col">ID</th>
          <th scope="col">Name</th> 
          <th scope="col">Roles</th>
          <th scope="col"></th>
        </tr>
      </thead>
      <tbody>
        {{#unless this.users}}
          <tr>
            <th scope="row"></th>
            <td>
              Loading User List
              <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
            </td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
        {{else}}
          {{#each users as |user|}}
            <tr>
              <td scope="col">
                {{#unless (eq this.currentUser.user.id user.id)}}
                  <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="check-{{user.id}}" checked={{get this.selected user.id}} onchange={{action "selectCheckbox" user.id}}>
                    <label class="custom-control-label" for="check-{{user.id}}"></label>
                  </div>
                {{/unless}}
              </td>
              <th scope="row">{{user.id}}</th>
              <td>{{user.username}}</td>
              <td>
                {{user-roles-list user.roles}}
              </td>
              <td class="text-right">
                {{!-- Hide Edit/Delete for the admin user themself --}}
                {{#unless (eq this.currentUser.user.id user.id)}}
                  <BsDropdown as |dd|>
                    {{!-- Show spinner instead of edit button, if user edit or deletion was called --}}
                    {{#if (or
                      (and this.deleteUser.isRunning (eq (get this.deleteUser.last.args 0) user))
                      (and this.openUserEdit.isRunning (eq (get this.openUserEdit.last.args 0) user.id)))
                    }}
                      <span class="spinner-border spinner-border-sm text-primary" role="status" aria-hidden="true"></span>
                    {{else}}
                      <dd.button class="removecaret d-flex-center" @size="sm" @title="Options">
                        {{svg-jar "kebab-vertical" class="octicon"}}
                      </dd.button>
                    {{/if}}
                    <dd.menu as |ddm|>
                      <ddm.item @title="Edit">
                        <a class="dropdown-item d-flex-center" style="cursor: pointer" title="Edit" onclick={{perform this.openUserEdit user.id}}>
                          {{svg-jar "pencil" class="octicon" id="edit-button"}}<span>Edit</span>
                        </a>
                      </ddm.item>
                      <ddm.item @title="Delete">
                        <a class="dropdown-item d-flex-center" style="cursor: pointer" title="Delete" onclick={{perform this.deleteUser user}}>
                          {{svg-jar "x" class="octicon" id="delete-button"}}<span>Delete</span>
                        </a>
                      </ddm.item>
                    </dd.menu>
                  </BsDropdown>
                {{/unless}}
              </td>
            </tr>
          {{/each}}
        {{/unless}}
      </tbody>
    </table>
  </div>
  <div class="d-flex justify-content-between mt-3 mb-1">
    <PageNavigation
      @first={{this.users.meta.pagination.first.number}}
      @prev={{this.users.meta.pagination.prev.number}}
      @self={{this.page}}
      @next={{this.users.meta.pagination.next.number}}
      @last={{this.users.meta.pagination.last.number}}
      @route="configuration.usermanagement.users"
    />
    <PageSizeSelector
      @pageSizes={{this.pageSizes}}
      @size={{this.size}}
      @label="Users per page"
    />
  </div>
</div><commit_msg>Fix page size selector position in user list<commit_after>{{! regarding formLayout: 
https://github.com/kaliber5/ember-bootstrap/issues/441}}

<BsModal
  @open={{this.showDeleteUsersDialog}}
  @onSubmit={{perform this.deleteUsers}}
  @onHide={{action (mut this.showDeleteUsersDialog) false}}
  as |modal|>
  <modal.header>
    <h4 class="modal-title">Please confirm</h4>
  </modal.header>
  <modal.body>Are you sure you want to delete the selected users?</modal.body>
  <modal.footer as |footer|>
    <BsButton @onClick={{action modal.close}} @type="danger">Cancel</BsButton>
    <BsButton @onClick={{action modal.submit}} @type="success" @disabled={{this.deleteUsers.isRunning}}>
      {{#if this.deleteUsers.isRunning}}
        Deleting <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
      {{else}}
        Confirm
      {{/if}}
    </BsButton>
  </modal.footer>
</BsModal>

<div class="col-12 d-flex flex-column">
  <h3>Users</h3>
  <div class="mb-3">
    <div class="d-flex justify-content-between">
      <div class="d-flex">
        {{!-- Delete Multiple Users Button --}}
        {{#if this.showDeleteUsersButton}}
          <BsButton
            class="d-flex-center mr-2"
            @onClick={{action (mut this.showDeleteUsersDialog) true}}
            @type="danger"
            @outline={{true}}
            @title="Delete Selected Users"
          >
            {{svg-jar "trashcan" class="octicon"}}
          </BsButton>
        {{/if}}
      </div>
      <div class="d-flex">
        {{!-- User Creation Button --}}
        <BsButton
          class="d-flex-center mr-2"
          @onClick={{perform this.openUserCreation}}
          @type="success"
          @outline={{true}}
          @title="Add Users"
          @disabled={{this.openUserCreation.isRunning}}
        >
          {{#if this.openUserCreation.isRunning}}
            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
          {{else}}
            {{svg-jar "organization" class="octicon"}}{{svg-jar "plus-small" class="octicon"}}
          {{/if}}
          <span>Create Users</span>
        </BsButton>
        {{!-- Refresh Button --}}
        <BsButton
          class="d-flex-center"
          @onClick={{action 'updateUserList'}}
          @outline={{true}}
          @title="Reload Users"
        >
          {{#unless this.users}}
            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
          {{else}}
            {{svg-jar "sync" class="octicon"}}
          {{/unless}}
        </BsButton>
      </div>
    </div>
  </div>
  <div id="user-list-table-div" class="d-flex flex-grow-1 flex-column" style="overflow-y: auto">
    {{!-- User List --}}
    <table class="table table-striped">
      <thead class="thead-light">
        <tr>
          <th style="width: 20px">
            <div class="custom-control custom-checkbox">
              <input type="checkbox" class="custom-control-input" id="checkAll" checked={{this.allSelected}} onchange={{action "selectAllCheckboxes"}}>
              <label class="custom-control-label" for="checkAll"></label>
            </div>
          </th>
          <th scope="col">ID</th>
          <th scope="col">Name</th> 
          <th scope="col">Roles</th>
          <th scope="col"></th>
        </tr>
      </thead>
      <tbody>
        {{#unless this.users}}
          <tr>
            <th scope="row"></th>
            <td>
              Loading User List
              <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
            </td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
        {{else}}
          {{#each users as |user|}}
            <tr>
              <td scope="col">
                {{#unless (eq this.currentUser.user.id user.id)}}
                  <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="check-{{user.id}}" checked={{get this.selected user.id}} onchange={{action "selectCheckbox" user.id}}>
                    <label class="custom-control-label" for="check-{{user.id}}"></label>
                  </div>
                {{/unless}}
              </td>
              <th scope="row">{{user.id}}</th>
              <td>{{user.username}}</td>
              <td>
                {{user-roles-list user.roles}}
              </td>
              <td class="text-right">
                {{!-- Hide Edit/Delete for the admin user themself --}}
                {{#unless (eq this.currentUser.user.id user.id)}}
                  <BsDropdown as |dd|>
                    {{!-- Show spinner instead of edit button, if user edit or deletion was called --}}
                    {{#if (or
                      (and this.deleteUser.isRunning (eq (get this.deleteUser.last.args 0) user))
                      (and this.openUserEdit.isRunning (eq (get this.openUserEdit.last.args 0) user.id)))
                    }}
                      <span class="spinner-border spinner-border-sm text-primary" role="status" aria-hidden="true"></span>
                    {{else}}
                      <dd.button class="removecaret d-flex-center" @size="sm" @title="Options">
                        {{svg-jar "kebab-vertical" class="octicon"}}
                      </dd.button>
                    {{/if}}
                    <dd.menu as |ddm|>
                      <ddm.item @title="Edit">
                        <a class="dropdown-item d-flex-center" style="cursor: pointer" title="Edit" onclick={{perform this.openUserEdit user.id}}>
                          {{svg-jar "pencil" class="octicon" id="edit-button"}}<span>Edit</span>
                        </a>
                      </ddm.item>
                      <ddm.item @title="Delete">
                        <a class="dropdown-item d-flex-center" style="cursor: pointer" title="Delete" onclick={{perform this.deleteUser user}}>
                          {{svg-jar "x" class="octicon" id="delete-button"}}<span>Delete</span>
                        </a>
                      </ddm.item>
                    </dd.menu>
                  </BsDropdown>
                {{/unless}}
              </td>
            </tr>
          {{/each}}
        {{/unless}}
      </tbody>
    </table>
  </div>
  <div class="d-flex justify-content-between mt-3 mb-1">
    <PageNavigation
      @first={{this.users.meta.pagination.first.number}}
      @prev={{this.users.meta.pagination.prev.number}}
      @self={{this.page}}
      @next={{this.users.meta.pagination.next.number}}
      @last={{this.users.meta.pagination.last.number}}
      @route="configuration.usermanagement.users"
    />
    <PageSizeSelector
      @pageSizes={{this.pageSizes}}
      @size={{this.size}}
      @label="Users per page"
      @position="above"
    />
  </div>
</div>
{'fraction_non_alphanumeric': 0.1702127659574468, 'fraction_numerical': 0.0029046547091714473, 'mean_word_length': 1.7986181670392196, 'pattern_counts': {'":': 0, '<': 243, '<?xml version=': 0, '>': 243, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2137659', 'n_tokens_mistral': 4139, 'n_tokens_neox': 4023, 'n_words': 763}