<?php
require_once __DIR__ . '/includes/settings_helpers.php';

settings_require_auth();
settings_ensure_tables($conn);
settings_get_current_org($conn);

$tab = trim((string) ($_GET['tab'] ?? 'alerts'));
$mode = trim((string) ($_GET['mode'] ?? 'list'));
$tabs = [
    'alerts' => 'Alerts',
    'webhooks' => 'Webhooks',
    'custom_functions' => 'Custom Functions',
    'field_updates' => 'Field Updates',
];
if (!isset($tabs[$tab])) {
    $tab = 'alerts';
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
<base href="<?php echo billing_escape(billing_base_href()); ?>">
  <title>Actions | Settings</title>
  <link rel="stylesheet" href="assets/fontawesome/css/all.min.css">
  <link rel="stylesheet" href="assets/font-inter.css">
  <link rel="stylesheet" href="orgprofile.css">
  <style>
    .inner-tabs{display:flex;gap:32px;border-bottom:1px solid var(--border);margin-bottom:24px;flex-wrap:wrap;}
    .inner-tabs a{padding:0 0 14px;color:#2563eb;text-decoration:none;font-size:16px;}
    .inner-tabs a.active{color:#111827;border-bottom:3px solid #3b82f6;font-weight:600;}
    .top-tools{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:16px;flex-wrap:wrap;}
    .empty-state{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
    .empty-state i{font-size:96px;color:#c7d2fe;margin-bottom:16px;}
    .empty-state h2{margin:0 0 12px;font-size:22px;}
    .empty-state p{max-width:700px;font-size:16px;line-height:1.6;color:#4b5563;}
    .form-card{max-width:1120px;}
    .form-card label{display:block;font-size:16px;font-weight:600;margin:18px 0 8px;}
    .form-card input,.form-card textarea,.form-card select{width:100%;border:1px solid #d7dce7;border-radius:12px;padding:14px 16px;font-size:15px;}
    .form-card textarea{min-height:96px;resize:vertical;}
    .grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
    .code-box{border:1px solid #d7dce7;border-radius:14px;background:#fbfdff;padding:18px;font-family:Consolas,monospace;font-size:15px;min-height:220px;white-space:pre-wrap;}
    @media (max-width: 860px){.grid-two{grid-template-columns:1fr;}}
  </style>
</head>
<body class="orgprofile-page">
  <?php settings_render_header($_SESSION['org_name'] ?? 'demo', 'dashboard.php', 'fa-gears'); ?>
  <main class="profile-layout">
    <?php settings_render_sidebar('actions'); ?>
    <section class="profile-main">
      <div class="profile-head"><h1>Actions</h1></div>
      <div class="profile-card">
        <div class="inner-tabs">
          <?php foreach ($tabs as $tabKey => $label): ?>
            <a class="<?php echo $tabKey === $tab ? 'active' : ''; ?>" href="actions.php?tab=<?php echo urlencode($tabKey); ?>"><?php echo htmlspecialchars($label); ?></a>
          <?php endforeach; ?>
        </div>
        <div class="top-tools">
          <div><?php if ($tab === 'alerts' || $tab === 'webhooks'): ?><a class="config-link" href="#">Configure Failure Preferences</a><?php endif; ?></div>
          <a class="save-btn" href="actions.php?tab=<?php echo urlencode($tab); ?>&mode=new"><?php echo $tab === 'alerts' ? 'Add Alert' : ($tab === 'webhooks' ? 'Add Webhook' : ($tab === 'custom_functions' ? 'New' : 'Add Field Updates')); ?></a>
        </div>

        <?php if ($mode === 'new' && $tab === 'alerts'): ?>
          <div class="form-card">
            <h2 style="margin:0 0 8px;">New Alert</h2>
            <label for="alert_name">Name</label>
            <input id="alert_name" type="text">
            <label for="alert_module">Module</label>
            <select id="alert_module"><option>Select</option><option>Employee</option><option>Pay Runs</option><option>Loan</option></select>
            <div style="display:flex;gap:14px;margin-top:22px;"><a class="save-btn" href="actions.php?tab=alerts">Save</a><a class="cancel-btn" href="actions.php?tab=alerts">Cancel</a></div>
          </div>
        <?php elseif ($mode === 'new' && $tab === 'webhooks'): ?>
          <div class="form-card">
            <h2 style="margin:0 0 8px;">New Webhook</h2>
            <label for="webhook_name">Name</label>
            <input id="webhook_name" type="text">
            <label for="webhook_module">Module</label>
            <select id="webhook_module"><option>Select</option><option>Employee</option><option>Pay Runs</option><option>Loan</option></select>
            <label for="webhook_description">Description</label>
            <textarea id="webhook_description"></textarea>
            <label for="webhook_url">URL To Notify</label>
            <input id="webhook_url" type="text" placeholder="https://example.com/webhook">
            <div class="grid-two">
              <div>
                <label for="webhook_method">Method</label>
                <select id="webhook_method"><option>POST</option><option>PUT</option></select>
              </div>
              <div>
                <label for="webhook_auth">Authorization Type</label>
                <select id="webhook_auth"><option>Self Authorization</option><option>Connections</option></select>
              </div>
            </div>
            <label for="webhook_preview">URL Preview</label>
            <textarea id="webhook_preview" placeholder="Preview URL will appear here."></textarea>
            <div style="display:flex;gap:14px;margin-top:22px;"><a class="save-btn" href="actions.php?tab=webhooks">Save</a><a class="save-btn" href="actions.php?tab=webhooks" style="background:#7aa7ff;">Save and Execute</a><a class="cancel-btn" href="actions.php?tab=webhooks">Cancel</a></div>
          </div>
        <?php elseif ($mode === 'new' && $tab === 'custom_functions'): ?>
          <div class="form-card">
            <h2 style="margin:0 0 8px;">New Custom Function</h2>
            <label for="function_name">Function Name</label>
            <input id="function_name" type="text">
            <label for="function_description">Description</label>
            <textarea id="function_description"></textarea>
            <label for="function_module">Module</label>
            <select id="function_module"><option>Select</option><option>Employee</option><option>Pay Runs</option><option>Loan</option><option>Reimbursement Claim</option></select>
            <label>Deluge Script</label>
            <div class="code-box">Void My_Custom_Function(Map organization) {
    organizationID = organization.get("organization_id");
}</div>
            <div style="display:flex;gap:14px;margin-top:22px;"><a class="save-btn" href="actions.php?tab=custom_functions">Proceed</a><a class="cancel-btn" href="actions.php?tab=custom_functions">Cancel</a></div>
          </div>
        <?php elseif ($mode === 'new' && $tab === 'field_updates'): ?>
          <div class="form-card">
            <h2 style="margin:0 0 8px;">New Field Updates</h2>
            <label for="field_update_name">Name</label>
            <input id="field_update_name" type="text">
            <div class="grid-two">
              <div>
                <label for="field_update_module">Module</label>
                <select id="field_update_module"><option>Select</option><option>Employee</option><option>Pay Runs</option></select>
              </div>
              <div>
                <label for="field_update_target">Update</label>
                <select id="field_update_target"><option>Select</option><option>Status</option><option>Department</option></select>
              </div>
            </div>
            <div style="display:flex;gap:14px;margin-top:22px;"><a class="save-btn" href="actions.php?tab=field_updates">Save</a><a class="cancel-btn" href="actions.php?tab=field_updates">Cancel</a></div>
          </div>
        <?php else: ?>
          <div class="empty-state">
            <i class="fa-regular <?php echo $tab === 'alerts' ? 'fa-bell' : ($tab === 'webhooks' ? 'fa-paper-plane' : 'fa-file-code'); ?>"></i>
            <h2><?php echo $tab === 'field_updates' ? "You haven't created any Field Updates yet" : ($tab === 'custom_functions' ? "You haven't created any Custom Functions yet" : ($tab === 'webhooks' ? "You haven't created any Webhooks yet" : "You haven't created any Alerts yet")); ?></h2>
            <p><?php echo $tab === 'field_updates'
                ? 'Field Updates allow you to automate data entry by automatically updating fields based on the specific conditions you specify.'
                : ($tab === 'custom_functions'
                    ? 'Create custom functions to automate logic across Employee, Pay Runs, Loan and Reimbursement modules.'
                    : ($tab === 'webhooks'
                        ? 'Webhooks are a powerful tool that allow Payroll to communicate with other apps in real time.'
                        : 'Alerts allow you to set up automated notifications and emails for important payroll events.')); ?></p>
          </div>
        <?php endif; ?>
      </div>
    </section>
  </main>
</body>
</html>

