<%- include('../operationsContent/assets.ejs') %>
<main class="kt-ops" data-ops-page data-ops-csrf-token="<%= csrfToken %>"
  data-ops-delete-url="/dashboard/sliders/delete"
  data-ops-loading="<%= i18n.__('operationsContent.loading') %>"
  data-ops-refreshing="<%= i18n.__('operationsContent.refreshing') %>"
  data-ops-load-error="<%= i18n.__('operationsContent.loadError') %>"
  data-ops-action-success="<%= i18n.__('operationsContent.actionSuccess') %>"
  data-ops-action-error="<%= i18n.__('operationsContent.actionError') %>"
  data-ops-success-title="<%= i18n.__('operationsContent.actionSuccess') %>"
  data-ops-error-title="<%= i18n.__('operationsContent.actionError') %>">
  <div class="kt-ops__stack">
    <%- include('../operationsContent/hero.ejs', {
      heading: i18n.__('sliders.sliders'),
      description: i18n.__('operationsContent.slidersDescription'),
      icon: 'ti-adjustments',
      count: sliders.length,
      primaryUrl: '/dashboard/sliders/create',
      primaryLabel: i18n.__('operationsContent.add'),
      primaryIcon: 'ti-photo-plus',
      backUrl: null
    }) %>

    <form action="/dashboard/sliders" method="get" data-ops-filter-form hidden>
      <input type="hidden" name="type" value="filter">
    </form>

    <section class="kt-ops-resource" data-ops-resource aria-live="polite">
      <div class="kt-ops-loading" data-ops-loading hidden>
        <span class="kt-ops-loading__pill">
          <span class="kt-ops-loading__spinner" aria-hidden="true"></span>
          <span data-ops-loading-label><%= i18n.__('operationsContent.loading') %></span>
        </span>
      </div>
      <%- include('./dataTable.ejs', { sliders }) %>
    </section>
  </div>
  <%- include('../operationsContent/deleteModal.ejs') %>
</main>
<%- include('../operationsContent/scripts.ejs') %>
