{% extends 'base.html.twig' %}
  
{% block title %}Box index{% endblock %}
  
{% block body %}
    <div class="container">
        <h2 class="text-center mt-5 mb-3">Box Manager</h2>
        <div class="card">
            <div class="card-header">
                {% if is_granted('ROLE_ADMIN') %}
                    <a class="btn btn-outline-primary" href="{{ path('app_box_new') }}"> 
                        Create New Box 
                    </a>
                {% endif %}
            </div>
            <div class="card-body">
                <table class="table table-bordered">
                    <tr>
                        <th>Label</th>
                        <th>Date Created</th>
                        <th>Date Updated</th>
                        <th width="240px">Action</th>
                    </tr>
                    {% for box in boxes %}
                    <tr>
                        <td>{{ box.label }}</td>
                        <td>{{ box.createdAt ? box.createdAt|date('Y-m-d H:i:s') : '' }}</td>
                        <td>{{ box.updatedAt ? box.updatedAt|date('Y-m-d H:i:s') : '' }}</td>
                        <td>
                            <form method="post" action="{{ path('app_box_delete', {'id': box.id}) }}" onsubmit="return confirm('Are you sure you want to delete this item?');">
                                <a
                                    class="btn btn-outline-info"
                                    href="{{ path('app_box_show', {'id': box.id}) }}">
                                    Show
                                </a>
                                {% if is_granted('ROLE_ADMIN') %}
                                    <a
                                        class="btn btn-outline-success"
                                        href="{{ path('app_box_edit', {'id': box.id}) }}">
                                        Edit
                                    </a>
    
                                    <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ box.id) }}">
                                    <button class="btn btn-outline-danger">Delete</button>
                                    {% endif %}
                            </form>
                        </td>
                    </tr>
                    {% endfor %}
                </table>
            </div>
        </div>
    </div>
  
{% endblock %}