// `#cicd` — explainer for the Sekura GitHub Actions integration.

function GithubActionsPage() {
  const { React } = window;
  const { useEffect } = React;

  useEffect(() => {
    document.title = 'Sekura — CI/CD with GitHub Actions';
  }, []);

  const workflow = `name: Sekura Security Scan

on:
  push:
    branches: [main, master]
  pull_request:
  workflow_dispatch:

permissions:
  contents: read
  pull-requests: write
  security-events: write

jobs:
  sekura:
    runs-on: ubuntu-latest
    timeout-minutes: 30
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - uses: sekuraai/sekura-scan-action@v1
        with:
          scan-type: sast
          intensity: standard
          min-severity: medium
          sekura-token: \${{ secrets.SEKURA_TOKEN }}
          auto-fix-pr: false`;

  return (
    <div className="cicd-page">
      <header className="cicd-header">
        <a href="#" className="cicd-logo">SEKURA</a>
        <nav>
          <a href="#init">get started</a>
          <a href="#pricing">pricing</a>
        </nav>
      </header>

      <section className="cicd-hero">
        <h1>Sekura runs on your GitHub Actions runner.</h1>
        <p>
          Source code never leaves your repo. We dispatch a workflow, the
          runner executes the scan, and we receive only the findings. SARIF
          flows back into the GitHub Security tab; PR review comments arrive
          inline on the lines we found issues on.
        </p>
      </section>

      <section className="cicd-howto">
        <h2>What gets installed</h2>
        <p>
          When you run <code>npx sekura@latest init</code>, the Sekura GitHub App
          commits this file to your repo's default branch:
        </p>
        <pre className="cicd-yaml">{workflow}</pre>
        <p>
          The <code>SEKURA_TOKEN</code> repo secret is provisioned automatically
          via the GitHub Actions secrets API (encrypted with the repo's
          public key). You never have to paste a token by hand.
        </p>
      </section>

      <section className="cicd-flow">
        <h2>What runs on every push and PR</h2>
        <ol>
          <li>GitHub triggers the workflow on push to main / pull_request.</li>
          <li>actions/checkout@v4 clones your code into the runner's workspace.</li>
          <li>sekuraai/sekura-scan-action@v1 pulls our slim Docker image and runs the scan against the workspace.</li>
          <li>LLM calls are routed through proxy.sekura.ai using SEKURA_TOKEN — the only metered resource.</li>
          <li>SARIF is uploaded via github/codeql-action/upload-sarif. Review comments are posted by the Sekura GitHub App.</li>
          <li>If <code>auto-fix-pr: true</code> (Pro tier), a follow-up PR opens with proposed code changes for the fixable findings.</li>
        </ol>
      </section>

      <section className="cicd-cta">
        <a href="#init" className="cicd-cta-button">Wire Sekura into a repo now →</a>
      </section>

      <window.SiteFooter />
    </div>
  );
}

window.GithubActionsPage = GithubActionsPage;