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

<% assets = step.assets.joins(file_attachment: :blob) %>
<% current_order = step.current_view_state(current_user).state.dig('assets', 'sort') %>
<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>
  <% if !(preview) && (can_manage_protocol_in_module?(@protocol) ||
                             can_manage_protocol_draft_in_repository?(@protocol)) %>
    <div class="actions">
      <div class="dropdown sci-dropdown">
        <button class="btn btn-light dropdown-toggle" type="button" id="dropdownAttachmentsOptions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
          <span><%= t("protocols.steps.attachments.manage") %></span>
          <span class="caret pull-right"></span>
        </button>
        <ul class="dropdown-menu dropdown-menu-right dropdown-attachment-options"
            aria-labelledby="dropdownAttachmentsOptions"
            data-view-mode-url="<%= update_asset_view_mode_step_path(step) %>"
            data-step-id="<%= step.id %>"
            data-state-save-url="<%= update_view_state_step_path(step.id) %>">
          <li class="divider-label"><%= t("protocols.steps.attachments.add") %></li>
          <%= render partial: '/assets/marvinjs/create_marvin_sketch_li',
                     locals: {  element_id: step.id, element_type: 'Step',  sketch_container: ".attachments[data-step-id=#{step.id}]" } %>
          <%= render partial: '/assets/bio_eddie/create_bio_eddie_li',
                     locals: {  element_id: step.id, element_type: 'Step',  assets_container: ".attachments[data-step-id=#{step.id}]" } %>

          <li>
            <%= render partial: '/assets/wopi/create_wopi_file_li',
                       locals: {  element_id: step.id, element_type: 'Step' } %>
          </li>
          <li role="separator" class="divider"></li>
          <li class="divider-label"><%= t("protocols.steps.attachments.sort_by") %></li>
          <% ['new', 'old', 'atoz', 'ztoa'].each do |sort| %>
            <li>
              <a data-order="<%= sort %>" class="action-link change-order <%= 'selected' if current_order == sort %>">
                <%= t("general.sort_new.#{sort}") %>
              </a>
            </li>
          <% end %>
          <li role="separator" class="divider"></li>
          <li class="divider-label"><%= t("protocols.steps.attachments.attachments_view_mode") %></li>
          <% ['inline', 'thumbnail', 'list'].each do |view_mode| %>
          <li>
            <a class="attachments-view-mode action-link <%= 'selected' if view_mode == step.assets_view_mode %>"  data-assets-view-mode="<%= view_mode %>">
              <%= t("protocols.steps.attachments.view_mode.#{view_mode}_html") %>
            </a>
          </li>
          <% end %>
        </ul>
      </div>
    </div>
  <% end %>
</div>

<div class="col-xs-12 attachments" data-preview="<%= preview %>" data-step-id="<%= step.id %>" data-order="<%= current_order %>">
  <% assets.each_with_index do |asset, i| %>
    <%= render partial: 'assets/asset', locals: { asset: asset, gallery_view_id: step.id } %>
  <% end %>
</div>
<hr>