{% import "_modules/bsmacros.html.twig" as bs %}
{% extends "baseadmin.html.twig" %}

{% block title %}Transactions - {{ parent() }}{% endblock %}

{% block breadcrumb %}
  {{ parent() }}
  <li class="breadcrumb-item active" aria-current="page">Transactions</li>
{% endblock %}

{% block content %}
{% if disputes|length > 0 %}
  <div class="alert alert-danger shadow">
    <div>
      <p class="mb-0">There are {{ disputes|length }} disputes that need attention.</p>
    </div>
    <ul class="mb-0">
      {% for dispute in disputes %}
        <li class="mb-1">
          <a href="{{ path('admin.transactions', {'disputed': 1, 'uuid': dispute.internal_txn.uuid}) }}" class="text-decoration-none">
            Transaction ({{ dispute.internal_txn.uuid }}) disputed by "{{ get_user_by_steam(dispute.internal_txn.usersteamid).username ?? dispute.internal_txn.usersteamid }}". (steamid: {{ dispute.internal_txn.usersteamid }}, id: {{ dispute.details.id }}, amount: {{ (dispute.details.amount / 100) | format_currency("USD") }})
          </a>
        </li>
      {% endfor %}
    </ul>
  </div>
{% endif %}
  <div class="card shadow mb-4">
    <div class="card-header py-3 d-flex justify-content-between">
      <h6 class="m-0 font-weight-bold text-primary">All Transactions</h6>
    </div>
    <div class="card-body">
      <form method="get" class="row g-3 mb-3 align-items-end justify-content-between">
        <div class="col">
          <label for="filter-uuid" class="form-label">UUID</label>
          <input type="text" id="filter-uuid" name="uuid" class="form-control" value="{{ filters.uuid }}">
        </div>
        <div class="col">
          <label for="filter-steamid" class="form-label">Steam ID</label>
          <input type="text" id="filter-steamid" name="steamid" class="form-control" value="{{ filters.steamid }}">
        </div>
        <div class="col">
          <label for="filter-disputed" class="form-label">Disputed</label>
          <select id="filter-disputed" name="disputed" class="form-select">
            <option value="" {{ filters.disputed == '' ? 'selected' }}>All</option>
            <option value="1" {{ filters.disputed == '1' ? 'selected' }}>Yes</option>
            <option value="0" {{ filters.disputed == '0' ? 'selected' }}>No</option>
          </select>
        </div>
        <div class="col">
          <label for="filter-dateFrom" class="form-label">Date From</label>
          <input type="date" id="filter-dateFrom" name="dateFrom" class="form-control" value="{{ filters.dateFrom }}">
        </div>
        <div class="col">
          <label for="filter-dateTo" class="form-label">Date To</label>
          <input type="date" id="filter-dateTo" name="dateTo" class="form-control" value="{{ filters.dateTo }}">
        </div>
        <div class="col">
          <button type="submit" class="btn btn-primary w-100">Filter</button>
        </div>
      </form>
    </div>
    <div class="card-body p-0">
      <div class="table-responsive">
        <table class="table table-hover mb-0">
          <thead class="thead-light">
            <tr>
              <th>UUID</th>
              <th>Product</th>
              <th><i class="fas fa-person-walking"></i> Orders</th>
              <th><i class="fas fa-dollar-sign"></i> Actual Amount <i class="fas fa-info-circle" {{ bs.tooltip('This amount is before tax. Takes into account credits and chargebacks', 'top') }}></i></th>
              <th><i class="fas fa-dollar-sign"></i> Expected Amount</th>
              <th><i class="fas fa-clock"></i> Timestamp</th>
              <th class="text-center"><i class="fas fa-user"></i> User</th>
              <th class="text-end"><i class="fas fa-user"></i> Recipient</th>
            </tr>
          </thead>
          <tbody>
            {% for txn in transactions %}
              <tr>
                <td><code class="text-reset">{{ txn.uuid }}</code></td>
                <td><code class="text-reset">{{ product_repository.find(txn.productId).name }}</code></td>
                <td>
                  {% if txn.orders|length > 0 %}
                    <ul class="list-unstyled mb-0">
                      {% for order in txn.orders %}
                        <li>
                          {% set orderStatusIcons = {
                            'PENDING': 'clock-rotate-left text-warning',
                            'CLOSED': 'check text-success',
                            'CANCELED': 'times text-danger'
                          } %}
                          <i class="fas fa-fw fa-{{ orderStatusIcons[order.status.name] }}" {{ bs.tooltip(order.status.name) }}></i>
                          <strong>{{ order.uuid }}</strong> ({{ order.operations|length }} ops)
                          <ul class="list-unstyled mb-0 ps-3">
                            {% for op in order.operations %}
                              <li>
                                <i class="fas fa-fw fa-{{ op.complete ? (op.canceled ? 'times text-danger' : 'check text-success') : 'clock-rotate-left text-warning' }}" {{ bs.tooltip(op.complete ? (op.canceled ? 'Canceled' : 'Completed') : 'Pending') }}></i>
                                <code class="text-secondary badge bg-dark-tertiary border">{{ op.uuid }}</code>
                                {{ op.event|capitalize }}:
                                {{ op.type|capitalize }} <i class="fas fa-message-code" {{ bs.tooltip(op.content, "top") }}></i>
                              </li>
                            {% endfor %}
                          </ul>
                        </li>
                      {% endfor %}
                    </ul>
                  {% else %}
                    <em>No orders</em>
                  {% endif %}
                </td>
                <td>
                  ${{ txn.amount|number_format(2) }}
                  {% if txn.disputed %}
                    <a href="https://dashboard.stripe.com/charges/{{ txn.stripeid }}" target="_blank" class="text-decoration-none">
                      <i class="fas fa-exclamation-circle text-danger" {{ bs.tooltip('This transaction was disputed, click to view on Stripe', 'top') }}></i>
                    </a>
                  {% endif %}
                </td>
                <td>{{ product_repository.find(txn.productId).price|tarin_price(2) }}</td>
                <td>{{ txn.timestamp|date_tz }}</td>
                <td class="text-center"><a href="{{ path('admin.customers', {'steamid': txn.usersteamid}) }}" class="text-decoration-none" {{ bs.tooltip('Search for user...', 'top') }}>{{ get_user_by_steam(txn.usersteamid).username ?? txn.usersteamid }} <sup><i class="fas fa-magnifying-glass"></i></sup></a></td>
                <td class="text-end"><a href="{{ path('admin.customers', {'steamid': txn.recipientsteamid}) }}" class="text-decoration-none" {{ bs.tooltip('Search for user...', 'top') }}>{{ get_user_by_steam(txn.recipientsteamid).username ?? txn.recipientsteamid }} <sup><i class="fas fa-magnifying-glass"></i></sup></a></td>
              </tr>
            {% else %}
              <tr>
                <td colspan="7" class="text-center">No transactions found.</td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
    <div class="card-footer">
      {% set queryParams = app.request.query.all %}
      <nav aria-label="Transaction pagination">
        <ul class="pagination justify-content-center mb-0">
          {% if currentPage > 1 %}
            <li class="page-item">
              <a class="page-link" href="{{ path('admin.transactions', queryParams|merge({'page': currentPage-1})) }}">Previous</a>
            </li>
          {% else %}
            <li class="page-item disabled">
              <span class="page-link">Previous</span>
            </li>
          {% endif %}
          {% for pageNum in 1..pagesCount %}
            <li class="page-item {{ pageNum == currentPage ? 'active' : '' }}">
              <a class="page-link" href="{{ path('admin.transactions', queryParams|merge({'page': pageNum})) }}">{{ pageNum }}</a>
            </li>
          {% endfor %}
          {% if currentPage < pagesCount %}
            <li class="page-item">
              <a class="page-link" href="{{ path('admin.transactions', queryParams|merge({'page': currentPage+1})) }}">Next</a>
            </li>
          {% else %}
            <li class="page-item disabled">
              <span class="page-link">Next</span>
            </li>
          {% endif %}
        </ul>
      </nav>
    </div>
  </div>
{% endblock %}