<% content_for :head do %>
  <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<% end %>
<div class="mx-auto mt-4 flex w-full max-w-2xl flex-col gap-4 pb-4">
  <% if flash[:success] %>
    <div class="bg-green-50 text-green-700 p-4 rounded-md border border-green-300">
      <%= flash[:success] %>
    </div>
  <% elsif flash[:error]  %>
    <div class="bg-red-50 text-red-700 p-4 rounded-md border border-red-300">
      <%= flash[:error] %>
    </div>
  <% end %>
  <section class="rounded-md border border-slate-300 bg-slate-50 p-4">
    <div class="flex items-center justify-between gap-2">
      <%= link_to tracked_objects_domain_user_job_events_kinds_path(@user),
                    class:
                      "px-2 py-1 text-sm font-medium text-slate-700 bg-white border border-slate-300 rounded-md hover:bg-slate-50" do %>
        <span class="mr-1">&larr;</span>
        <span>All Scans</span>
      <% end %>
      <h1 class="text-lg font-medium grow">
        <%= add_tracked_object_kind_for_view(@kind) %> Scans for
        <%= link_to @user.name, domain_user_path(@user), class: "text-blue-600 hover:underline" %>
      </h1>
      <%= button_to enqueue_scan_job_domain_user_job_events_path(@user, kind: @kind),
                      method: :post,
                      form_class: "justify-self-end",
                      class: "px-2 py-1 text-sm font-medium text-slate-700 bg-white border border-slate-300 rounded-md hover:bg-slate-50" do %>
        Enqueue Scan
      <% end %>
      <%= button_to backfill_scan_job_domain_user_job_events_path(@user, kind: @kind),
                      method: :post,
                      class: "px-2 py-1 text-sm font-medium text-slate-700 bg-white border border-slate-300 rounded-md hover:bg-slate-50" do %>
        Backfill Scans
      <% end %>
    </div>
  </section>
  <%= render 'tracked_objects_chart' %>
  <% if @tracked_objects.any? %>
    <section class="grid grid-cols-[auto_1fr_auto_auto_auto] overflow-hidden rounded-md border border-slate-300 bg-white">
      <div class="grid grid-cols-subgrid col-span-full px-3 py-2 gap-3 font-medium text-slate-600 text-sm border-b border-slate-200 bg-slate-100 rounded-t-md">
        <div class="">Scanned</div>
        <div class="text-right "><%= add_tracked_object_kind_for_view(@kind) %> Added</div>
        <div class="text-right ">Total <%= add_tracked_object_kind_for_view(@kind) %></div>
        <div class="">Since Last Scan</div>
        <div class="">Log Entry</div>
      </div>
      <% @tracked_objects.each do |scan| %>
        <div class="grid grid-cols-subgrid col-span-full px-3 py-1 gap-3 items-center border-b last:border-b-0 border-slate-200 hover:bg-slate-50">
          <div title="<%= scan.log_entry.requested_at.strftime("%Y-%m-%d %H:%M:%S") %>">
            <%= time_ago_in_words(scan.log_entry.requested_at) %> ago
          </div>
          <div class="text-right font-mono"><%= number_with_delimiter(scan.num_added) %></div>
          <div class="text-right font-mono"><%= number_with_delimiter(scan.num_total) %></div>
          <div>
            <% if scan.duration_since_last_scan.present? %>
              <div class="text-right">
                <%= format_duration_since_last_scan(scan.duration_since_last_scan) %>
              </div>
            <% else %>
              <span class="text-slate-400">N/A</span>
            <% end %>
          </div>
          <div class="text-right">
            <% if scan.log_entry %>
              <%= link_to scan.log_entry.id, log_entry_path(scan.log_entry), class: "text-blue-600 hover:underline" %>
            <% end %>
          </div>
        </div>
      <% end %>
    </section>
  <% else %>
    <section class="rounded-md border border-slate-300 bg-slate-50 p-8 text-center">
      <i class="bi bi-search mb-3 block text-4xl text-slate-400"></i>
      <p class="text-slate-600">No <%= add_tracked_object_kind_event_name(@kind) %> events found.</p>
    </section>
  <% end %>
</div>
