scinote-web/app/views/steps/attachments/_list.html.erb

<% assets = ordered_assets(step) %>
<div class="col-xs-12">
<hr>
</div>
<div class="col-xs-12 attachments-actions">

  <div class="title">
    <h4>
      <%= t('protocols.steps.files', count: assets.length) %>
    </h4>
  </div>
  <div>
    <div class="attachemnts-header pull-right">
      <% if !(preview) && (can_manage_protocol_in_module?(@protocol) ||
                           can_manage_protocol_in_repository?(@protocol)) %>
        <%= render partial: '/assets/wopi/create_wopi_file_button.html.erb',
                   locals: {  element_id: step.id, element_type: 'Step' } %>
      <% end %>
      <div class="dropdown attachments-order" id="dd-att-step-<%= step.id %>">
        <button class="btn btn-default dropdown-toggle" type="button" id="sortMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
          <span id="dd-att-step-<%= step.id %>-label">
            <%= t("protocols.steps.attachments.sort.#{step.current_view_state(current_user).state.dig('assets', 'sort')}_html") %>
          </span>
          <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" aria-labelledby="sortMenu" data-state-save-path="<%= update_view_state_step_path(step.id) %>">
          <% ['new', 'old', 'atoz', 'ztoa'].each do |sort| %>
            <li>
              <a data-order="<%= sort %>" onClick="reorderAttachments(this, '<%= step.id %>', '<%= sort %>')">
                <%= t("protocols.steps.attachments.sort.#{sort}_html") %>
              </a>
            </li>
          <% end %>
        </ul>
      </div>
    </div>
  </div>
</div>

<div class="col-xs-12 attachments" id="att-<%= step.id %>">
  <% assets.each_with_index do |asset, i| %>
    <% order_atoz = az_ordered_assets_index(assets, asset.id) %>
    <% order_ztoa = assets.length - az_ordered_assets_index(assets, asset.id) %>
    <%= render partial: 'steps/attachments/item.html.erb',
               locals: { asset: asset, i: i, assets_count: assets.length, step: step, order_atoz: order_atoz, order_ztoa: order_ztoa } %>
  <% end %>
</div>
<hr>