<?php
/** comment-form.php */

// Fetch submitter details from cache
$token = $_GET['asana_comms_token'] ?? get_query_var('asana_comms_token');
$plugin_root = dirname(__DIR__, 3);
$cache_path  = $plugin_root . '/cache/tasks-summary-' . $token . '.json';

$submitter_name = isset($submitter_name) ? trim((string) $submitter_name) : '';
$submitter_email = isset($submitter_email) ? trim((string) $submitter_email) : '';

if (($submitter_name === '' || $submitter_email === '') && file_exists($cache_path)) {
  $data = json_decode(file_get_contents($cache_path), true);
  $task = $data['parent'] ?? [];

  if (function_exists('afb_get_submitter_identity_from_task')) {
    $identity = afb_get_submitter_identity_from_task($task);
    if ($submitter_name === '') {
      $submitter_name = trim((string)($identity['name'] ?? ''));
    }
    if ($submitter_email === '') {
      $submitter_email = trim((string)($identity['email'] ?? ''));
    }
  }
}

$is_oauth = false;
?>

<div class="gateway-card" style="position:sticky;top:1.5rem">
  <p class="gateway-label" style="margin-bottom:1rem">Add a Comment</p>

  <!-- Sender identity -->
  <?php if (!$is_oauth && ($submitter_name || $submitter_email)): ?>
  <div style="display:flex;align-items:center;gap:.625rem;background:#f8fafc;border:1px solid #f1f5f9;border-radius:.625rem;padding:.625rem .875rem;margin-bottom:1rem">
    <div style="width:2rem;height:2rem;border-radius:9999px;background:linear-gradient(135deg,#4f46e5,#7c3aed);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.6875rem;font-weight:700;color:#fff">
      <?= esc_html(mb_strtoupper(mb_substr($submitter_name ?: 'U', 0, 1))) ?>
    </div>
    <div style="min-width:0">
      <?php if ($submitter_name): ?>
        <p style="font-size:.8125rem;font-weight:600;color:#1e293b;margin:0;line-height:1.3"><?= esc_html($submitter_name) ?></p>
      <?php endif; ?>
      <?php if ($submitter_email): ?>
        <p style="font-size:.6875rem;color:#64748b;margin:0"><?= esc_html($submitter_email) ?></p>
      <?php endif; ?>
    </div>
    <span style="font-size:.625rem;font-weight:700;background:#dbeafe;color:#1d4ed8;padding:.15rem .5rem;border-radius:9999px;margin-left:auto;flex-shrink:0">CLIENT</span>
  </div>
  <?php endif; ?>

  <form id="comment-form" style="position:relative">
    <?php if (!$is_oauth): ?>
      <input type="hidden" name="guest_name"  value="<?= esc_attr($submitter_name) ?>" />
      <input type="hidden" name="guest_email" value="<?= esc_attr($submitter_email) ?>" />
    <?php else: ?>
      <input type="hidden" name="guest_name"  value="" />
      <input type="hidden" name="guest_email" value="" />
    <?php endif; ?>

    <textarea
      name="comment"
      rows="5"
      required
      placeholder="Type your message here…"
      style="width:100%;background:#f8fafc;border:1px solid #e2e8f0;border-radius:.625rem;padding:.75rem 1rem;font-size:.875rem;color:#1e293b;resize:none;outline:none;box-sizing:border-box;transition:border-color .15s ease,box-shadow .15s ease;line-height:1.6"
      onfocus="this.style.borderColor='#818cf8';this.style.boxShadow='0 0 0 3px rgba(129,140,248,.15)'"
      onblur="this.style.borderColor='#e2e8f0';this.style.boxShadow='none'"
    ></textarea>

    <input type="hidden" name="task_gid" value="<?= esc_attr($task_gid) ?>" />
    <input type="hidden" name="gateway_token" value="<?= esc_attr($token) ?>" />

    <div style="margin-top:.75rem">
      <button id="submit-comment-btn" type="submit" class="gateway-btn-primary">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" style="flex-shrink:0">
          <path stroke-linecap="round" stroke-linejoin="round" d="M6 12 3.269 3.125A59.769 59.769 0 0121.485 12 59.768 59.768 0 013.27 20.875L5.999 12zm0 0h7.5"/>
        </svg>
        Post Comment
      </button>
    </div>

    <div id="comment-spinner" class="hidden" style="display:none;align-items:center;gap:.5rem;font-size:.8125rem;color:#64748b;margin-top:.75rem">
      <svg class="animate-spin" style="width:1rem;height:1rem;color:#4f46e5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
        <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
        <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v8H4z"></path>
      </svg>
      Posting…
    </div>

    <p id="feedback" style="font-size:.8125rem;margin-top:.625rem;color:#64748b"></p>
  </form>
</div>
