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'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>