{# Step 2 - billing project. Spec 150: optional choice made before
   the audit target so a fresh-install admin's first scan can't
   accidentally bill the analysed project. Submitting forwards to
   step 3 (/setup/target) carrying the value as a query param;
   submitting blank also forwards (analysed project pays = legacy). #}
{% extends "setup/layout.html" %}
{% from "components/_project_combobox.html" import project_combobox, project_combobox_script %}

{% block content %}
<div class="ui-pane">
  <h2 class="ui-section-title">Step 2 · Choose a billing project</h2>
  <p class="ui-section-subtitle">
    Optional - pick a GCP project to bill <code class="font-mono">governor-audit</code>'s
    BigQuery <code class="font-mono">INFORMATION_SCHEMA</code> scans to.
    Leave blank and the analysed project pays for its own metadata
    queries (the default). Most operators auditing production projects
    set this to a separate tooling project they own, so the scan cost
    never lands on the audited project's bill.
  </p>

  {% if errors and errors.get('_general') %}
    <div class="mt-4 border border-red-300 dark:border-red-500/30 bg-red-50 dark:bg-red-950/40 px-4 py-3 text-sm text-red-600 dark:text-red-300 whitespace-pre-line">
      {{ errors['_general'] }}
    </div>
  {% endif %}

  {% if discovery_error %}
    <div class="mt-4 border border-amber-300 dark:border-amber-500/30 bg-amber-50 dark:bg-amber-950/40 px-4 py-3 text-sm text-amber-700 dark:text-amber-300">
      {{ discovery_error }}
    </div>
  {% endif %}

  <form method="post" action="/setup/billing" class="ui-form-scope mt-6 space-y-5">
    <div>
      <label for="billing_project_id" class="block text-sm font-medium text-slate-600 dark:text-slate-300">
        Billing project <span class="text-slate-400 dark:text-slate-500 font-normal">(optional)</span>
        {% if gcp_projects %}
          <span class="ml-2 text-sm font-normal text-slate-400 dark:text-slate-500">{{ gcp_projects | length }} {% if principal %}visible to {{ principal }}{% else %}discovered{% endif %}</span>
        {% endif %}
      </label>
      {{ project_combobox("billing_project_id", gcp_projects, value=(form_data.billing_project_id if form_data and form_data.billing_project_id else ""), pattern="^[a-z][-a-z0-9]{4,28}[a-z0-9]$", placeholder="leave blank to bill the analysed project") }}
      <p class="mt-2 text-sm text-slate-500 dark:text-slate-400">
        When set to a different project than the one you'll choose on the next step, the BigQuery scan job runs in (and is billed to) this project - while still reading the analysed project's job history. The calling ADC identity needs <code class="font-mono">bigquery.jobs.create</code> on this project and <code class="font-mono">bigquery.resourceViewer</code> (or equivalent <code class="font-mono">JOBS_BY_PROJECT</code> read) on the analysed project.
      </p>
      {% if errors and errors.get('billing_project_id') %}
        <p class="mt-1 text-sm text-red-500 dark:text-red-400">{{ errors['billing_project_id'] }}</p>
      {% endif %}
    </div>

    <div class="flex items-center gap-3 pt-2">
      <a href="/setup/account" class="ui-btn-secondary">Back</a>
      <button type="submit" class="ui-btn-primary transition-colors">
        <span class="btn-label">Continue</span>
        <svg class="btn-spinner h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
          <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-8V0C5.373 0 0 5.373 0 12h4z"></path>
        </svg>
      </button>
    </div>
  </form>
</div>
{{ project_combobox_script() }}
{% endblock %}