140 lines · 5.3 KB
import { createFileRoute, Link, useNavigate } from "@tanstack/react-router";
import { z } from "zod";
import { getCodeAlerts } from "~/fns/security";
import { CodeAlertList } from "~/components/security/CodeAlertList";
import { buttonClass } from "~/ui/Button";
import { SelectField } from "~/ui/Field";
import { Badge } from "~/ui/Badge";
import { EmptyState } from "~/ui/EmptyState";
import { Panel } from "~/ui/Panel";
import { RelativeTime } from "~/ui/RelativeTime";
import { cn } from "~/utils/cn";

const STATES = ["open", "fixed", "dismissed"] as const;

export const Route = createFileRoute("/$owner/$repo/security/code-scanning/")({
  validateSearch: z.object({
    ref: z.string().max(255).optional(),
    state: z.enum(STATES).optional(),
    page: z.number().int().min(1).optional(),
  }),
  loaderDeps: ({ search }) => ({ ref: search.ref, state: search.state ?? "open", page: search.page ?? 1 }),
  loader: ({ params, deps }) => getCodeAlerts({ data: { owner: params.owner, repo: params.repo, ...deps } }),
  component: CodeScanningPage,
});

function UploadHelp({ owner, repo }: { owner: string; repo: string }) {
  const origin = typeof window === "undefined" ? "" : window.location.origin;
  const command = `gzip -c results.sarif | base64 | jq -Rs '{commit_sha: "'$(git rev-parse HEAD)'", ref: "refs/heads/main", sarif: .}' \\
  | curl -X POST -H "Authorization: Bearer $GITFOR_TOKEN" --data-binary @- \\
  ${origin}/api/repos/${owner}/${repo}/code-scanning/sarifs`;
  return (
    <div className="space-y-2 p-4 text-sm text-kumo-subtle">
      <p>
        Upload SARIF 2.1 results from any analyzer (CodeQL, Semgrep, ESLint…) with a personal access token. The API is
        compatible with GitHub&apos;s <code className="font-mono">code-scanning/sarifs</code> endpoint.
      </p>
      <pre className="overflow-x-auto rounded-md border border-kumo-hairline bg-kumo-canvas p-3 font-mono text-xs text-kumo-default">
        {command}
      </pre>
    </div>