@use super::base_html;
@use super::components::return_to_main_html;
@use cm_lib::models::Shift;

@(shifts: Vec<Shift>)

@:base_html({

<div class="fixed right-0 top-0 pr-4 pt-4">
  @:return_to_main_html()
</div>

<h1 class="text-4xl underline text-center pt-4 pb-6">
    Shift Reports
</h1>

<div class="flex">
  <table class="m-auto table-auto w-4/5">
    <thead>
      <tr>
        <th>Shift ID</th>
        <th>Shift Start</th>
        <th>Shift End</th>
      </tr>
    </thead>
    <tbody>
      @for shift in shifts {

      <tr class="odd:bg-neutral-200">
        <td class="text-center">@shift.id</td>
        <td class="text-center">@shift.start.format("%Y-%m-%d %H:%M:%S")</td>
        <td class="text-center">
          @if let Some(end) = shift.end {
            @end.format("%Y-%m-%d %H:%M:%S")
          } else {
            Currently Open
          }
        </td>
        <td hx-boost="true" class="flex justify-end">
          <a href="/shifts/@shift.id/report">
            <button type="button" class=" text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5">View Shift</button>
          </a>
        </td>
      </tr>

      }
    </tbody>
  </table>
</div>

})