{% if items.len() > 0 %}
<div class="mx-auto">
  <div class="flex flex-col">
    {% for item in items %}
    <div class="mx-1 mb-4 flex flex-row">
      <div class="basis-1/2">
        <a
          class="font-medium text-paynes-gray hover:underline dark:text-paynes-gray"
          href="/item/{{item.id}}/"
          hx-push-url="true"
        >
          {{ item.name }}
        </a>
      </div>
      <div class="basis-1/4">
        Count:
        <span
          id="item-{{item.id}}-count"
          hx-get="/item/{{item.id}}/count"
          hx-trigger="load"
          >0</span
        >
      </div>
      <div class="basis-1/4">Reorder Point: {{ item.reorder_point }}</div>
    </div>
    {% endfor %}
  </div>
</div>
{% endif %}