<?php
// Shared "edit expense" modal — required by both index.php (dashboard) and
// expenses.php (All Expenses), so tapping any expense row anywhere in the
// app opens the exact same editable form (Phase 6). The including page
// must have $visibleCategories, $hiddenCategories, $paymentMethods in scope.
// $month is optional (only the dashboard is month-scoped); when absent, the
// hidden viewed_month field is left blank and the API falls back sensibly.
?>
<div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="editModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content" style="border-radius:var(--r-lg);border:1px solid var(--line);">
      <form id="editForm" action="api/expense_save.php" method="post" novalidate>
        <div class="modal-header">
          <h5 class="modal-title fw-bold" id="editModalLabel">Edit expense</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
          <?= csrf_field() ?>
          <input type="hidden" name="id" id="editId">
          <input type="hidden" name="viewed_month" value="<?= e($month ?? '') ?>">

          <label class="visually-hidden" for="editAmount">Amount</label>
          <div class="amount-wrap" id="editAmountWrap">
            <span class="amount-cur"><?= e(get_setting('currency_symbol', '¥')) ?></span>
            <input class="amount-in tnum" id="editAmount" name="amount" type="text" inputmode="decimal" autocomplete="off">
          </div>

          <div class="field-label">Category</div>
          <?php render_category_grid($visibleCategories, $hiddenCategories, 0, 'editCategoryId', 'category_id', 'editCatGrid', 'editMoreCats'); ?>

          <label class="field-label" for="editDesc">Description</label>
          <input class="form-control" id="editDesc" name="description" type="text" required maxlength="255">

          <div class="row g-2">
            <div class="col-6">
              <label class="field-label" for="editDate">Date</label>
              <input class="form-control tnum" id="editDate" name="expense_date" type="date">
            </div>
            <div class="col-6">
              <label class="field-label" for="editMethod">Paid with</label>
              <select class="form-select" id="editMethod" name="payment_method_id">
                <?php foreach ($paymentMethods as $method): ?>
                  <option value="<?= e((string) $method['id']) ?>"><?= e($method['name']) ?></option>
                <?php endforeach; ?>
              </select>
            </div>
          </div>
        </div>
        <div class="modal-footer justify-content-between">
          <button type="button" class="btn btn-outline-danger" id="deleteBtn"><i class="bi bi-trash3 me-1"></i>Delete</button>
          <button type="submit" class="btn-save" style="width:auto;margin-top:0;" id="editSaveBtn">Save changes</button>
        </div>
      </form>
    </div>
  </div>
</div>
