<?php
require __DIR__ . '/../_boot.php';
require __DIR__ . '/../partials/nav.php';

$canManagePushPresets = $user && (
    \App\Core\Auth::hasPermission('notifications.manage', $user)
    || \App\Core\Auth::hasPermission('walks.manage', $user)
    || \App\Core\Auth::hasPermission('walks.edit', $user)
);
if (!$canManagePushPresets) {
    header('Location: dashboard.php');
    exit;
}
?>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Push Notification Presets | Pyrk Admin</title>
  <link rel="stylesheet" href="../assets/css/app.css">
  <link rel="stylesheet" href="../assets/css/admin_push_notification_presets.css?v=1">
</head>
<body>
<?php pyrk_render_nav('admin'); ?>
<main class="container enterprise-page push-preset-page">
  <section class="page-hero admin-hero enterprise-hero push-preset-hero">
    <div>
      <p class="eyebrow">Notification Center</p>
      <h1>Push notification presets</h1>
      <p class="muted">Create, edit, duplicate, activate, deactivate and safely remove reusable push notification messages without changing JavaScript or PHP.</p>
    </div>
    <div class="hero-actions">
      <button class="btn" type="button" id="newPushPresetBtn">+ New preset</button>
      <button class="btn btn-light" type="button" id="reloadPushPresetsBtn">Reload</button>
      <a class="btn btn-light" href="manual_notifications.php">Manual notifications</a>
    </div>
  </section>

  <section class="push-preset-summary grid three">
    <article><span>1</span><strong>Manage centrally</strong><small>Replace hardcoded notification copy with a controlled preset library.</small></article>
    <article><span>2</span><strong>Use safely</strong><small>Only approved member and walk variables are accepted.</small></article>
    <article><span>3</span><strong>Stay separate</strong><small>Push presets remain independent from WhatsApp presets and queues.</small></article>
  </section>

  <div class="push-preset-install-warning" id="pushPresetInstallWarning" hidden>
    <strong>One additive database migration is required.</strong>
    <span>Import <code>database/migrations/044_push_notification_presets.sql</code>, then reload this page.</span>
  </div>

  <section class="push-preset-layout">
    <aside class="panel push-preset-library">
      <div class="section-head">
        <div>
          <p class="eyebrow">Preset library</p>
          <h2>Saved push messages</h2>
        </div>
        <span class="push-preset-count" id="pushPresetCount">0</span>
      </div>
      <div class="push-preset-filters">
        <input id="pushPresetSearch" type="search" placeholder="Search presets">
        <select id="pushPresetStatusFilter" aria-label="Filter preset status">
          <option value="all">All statuses</option>
          <option value="active">Active only</option>
          <option value="inactive">Inactive only</option>
        </select>
      </div>
      <div id="pushPresetList" class="push-preset-list">
        <div class="push-preset-empty">Loading presets…</div>
      </div>
    </aside>

    <section class="panel push-preset-editor">
      <div class="section-head">
        <div>
          <p class="eyebrow" id="pushPresetEditorEyebrow">Create</p>
          <h2 id="pushPresetEditorTitle">New push notification preset</h2>
          <p class="muted">Nothing is sent from this page. Saving only changes the reusable preset library.</p>
        </div>
        <span class="push-preset-editor-state" id="pushPresetEditorState">New</span>
      </div>

      <form id="pushPresetForm" class="stack-form">
        <input type="hidden" id="pushPresetId" value="">

        <div class="form-grid two">
          <label>Preset name
            <input id="pushPresetName" maxlength="120" placeholder="Example: Tomorrow walk reminder" required>
          </label>
          <label>Use case
            <select id="pushPresetUseCase" required></select>
          </label>
        </div>

        <div class="form-grid two">
          <label>Sort order
            <input id="pushPresetSort" type="number" min="0" max="9999" value="100">
          </label>
          <div class="push-preset-switches">
            <label class="check"><input id="pushPresetActive" type="checkbox" checked> Active</label>
            <label class="check"><input id="pushPresetDefault" type="checkbox"> Default for this use case</label>
          </div>
        </div>

        <label>Notification subject
          <input id="pushPresetSubject" maxlength="180" placeholder="Example: Reminder: {walk_title}" required>
        </label>

        <div class="push-preset-variable-panel">
          <div>
            <p class="eyebrow">Approved variables</p>
            <strong>Click to insert</strong>
          </div>
          <div id="pushPresetVariables" class="push-preset-variable-grid"></div>
        </div>

        <label>Notification message
          <textarea id="pushPresetMessage" rows="16" maxlength="4000" placeholder="Write the reusable push notification message" required></textarea>
        </label>
        <div class="push-preset-meta">
          <small id="pushPresetCharacterCount">0 / 4000 characters</small>
          <small>Unknown variables are rejected. Walk variables require a selected walk when sending.</small>
        </div>

        <div class="push-preset-preview-card">
          <div class="push-preset-preview-head">
            <span>Live preview</span>
            <small>Sample member and walk data</small>
          </div>
          <article class="push-preset-preview-body">
            <h3 id="pushPresetPreviewSubject">Notification preview</h3>
            <div id="pushPresetPreviewMessage">Start typing to preview the message.</div>
          </article>
        </div>

        <div class="push-preset-editor-actions">
          <button class="btn" type="submit" id="savePushPresetBtn">Save preset</button>
          <button class="btn btn-light" type="button" id="duplicatePushPresetBtn" hidden>Duplicate</button>
          <button class="btn btn-light" type="button" id="togglePushPresetBtn" hidden>Deactivate</button>
          <button class="btn btn-light" type="button" id="clearPushPresetBtn">Clear editor</button>
          <button class="btn btn-danger" type="button" id="deletePushPresetBtn" hidden>Delete preset</button>
        </div>
        <p class="notice" id="pushPresetNotice"></p>
      </form>
    </section>
  </section>
</main>
<script>
window.__PYRK_CSRF__ = <?= json_encode($csrf) ?>;
window.PYRK_PUSH_PRESETS_API = '../../api/push_notification_presets.php';
</script>
<script src="../assets/js/admin_push_notification_presets.js?v=1"></script>
</body>
</html>
