Sign in

flagon-io/g1t

public

g1t/apps/web/app/routes/repo/actions-run.tsx

317 lines14,047 bytesCodeBlame

Pick any line to see why it is the way it is: the commit, the pull request and issue it came from, and what the agent was thinking.

Fast pages, required checks on the branch, self-hosted runners, honest incidents1import { AlertTriangle, ChevronRight, Cloud, Download, GitBranch, GitCommitHorizontal, Info, Package, RotateCw, ServerCog, Square, XCircle } from "lucide-react";
A click away from a live page arrives: pages stop refreshing themselves while a navigation is pending2import { type ReactNode } from "react";
Merge branch 'worktree-agent-a985c01f43538af01'3import { Form, Link, useLoaderData, useSearchParams } from "react-router";
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs4
5import type { Annotation, Job, StepState } from "@g1t/contracts";
6
7import type { Route } from "./+types/actions-run";
Social cards for every page: og.g1t.sh8import { page } from "../../lib/meta";
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs9import { LogText, Notes, StatusIcon, duration, shortRef, standingWord, useJobLog } from "../../components/actions";
Merge branch 'worktree-agent-a985c01f43538af01'10import { ErrorText, SubmitButton, TimeAgo, usePending } from "../../components/ui";
Actions: workflow_run, workflow.completed, artifacts on the run page, Node 2411import { listArtifacts } from "../../lib/artifacts.server";
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs12import { actions } from "../../lib/services.server";
Runners are owner-only: the page, its actions, the Settings entry and the links to it13import { assertSameOrigin, getViewer, requireUser, roleIn, unwrap } from "../../lib/session.server";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look14import { accessTo, refusal } from "../../lib/access.server";
A click away from a live page arrives: pages stop refreshing themselves while a navigation is pending15import { useRefreshWhile } from "../../lib/refresh";
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs16
Social cards for every page: og.g1t.sh17export function meta({ loaderData, params, ...args }: Route.MetaArgs) {
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs18 const run = loaderData?.detail.run;
Social cards for every page: og.g1t.sh19 return page(args, { title: `${run ? `${run.title || run.name} #${run.number}` : "Run"} · ${params.owner}/${params.repo} · g1t` });
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs20}
21
22export async function loader({ params, context }: Route.LoaderArgs) {
23 const viewer = getViewer(context);
24 const detail = unwrap(await actions.run({ namespace: params.owner, name: params.repo }, viewer, params.id));
Actions: workflow_run, workflow.completed, artifacts on the run page, Node 2425 const artifacts = await listArtifacts(params.id).catch(() => []);
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look26 // Cancelling and re-running need Write.
Runners are owner-only: the page, its actions, the Settings entry and the links to it27 return {
28 detail,
29 artifacts,
30 member: (await accessTo(context, params)).can.run,
31 // The runners page is the workspace owners'.
32 runnersPage: roleIn(viewer, params.owner) === "owner",
33 };
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs34}
35
36export async function action({ request, params, context }: Route.ActionArgs) {
37 assertSameOrigin(request);
38 const user = requireUser(context, request);
39 const repo = { namespace: params.owner, name: params.repo };
40 const intent = String((await request.formData()).get("intent"));
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look41 const refused = await refusal(context, params, "run");
42 if (refused) return { error: refused };
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs43 const done =
44 intent === "cancel"
45 ? await actions.cancel(user, repo, params.id)
46 : await actions.rerun(user, repo, params.id, intent === "rerun-failed");
47 return done.ok ? {} : { error: done.error.message };
48}
49
50const ANNOTATION_ICON: Record<Annotation["level"], ReactNode> = {
51 error: <XCircle size={14} className="mt-0.5 shrink-0 text-danger" />,
52 warning: <AlertTriangle size={14} className="mt-0.5 shrink-0 text-warn" />,
53 notice: <Info size={14} className="mt-0.5 shrink-0 text-muted" />,
54};
55
56function StepRow({ step, text, defaultOpen }: { step: StepState; text: string | undefined; defaultOpen: boolean }) {
57 return (
58 <details className="group border-t border-line first:border-t-0" open={defaultOpen}>
59 <summary className="flex cursor-pointer list-none items-center gap-2.5 px-4 py-2 text-sm hover:bg-raised/40">
60 <ChevronRight size={14} className="shrink-0 text-faint transition-transform group-open:rotate-90" />
61 <StatusIcon status={step.status} conclusion={step.conclusion} size={14} />
62 <span className={`min-w-0 truncate ${step.conclusion === "skipped" ? "text-faint" : ""}`}>{step.name}</span>
63 <span className="ml-auto shrink-0 font-mono text-xs text-faint">{duration(step.startedAt, step.finishedAt)}</span>
64 </summary>
65 <div className="border-t border-line bg-bg/60">
66 {text === undefined ? (
67 <p className="px-4 py-2 text-xs text-faint">{step.status === "queued" ? "Not started." : step.conclusion === "skipped" ? "Skipped." : "No output yet."}</p>
68 ) : (
69 <LogText text={text} />
70 )}
71 </div>
72 </details>
73 );
74}
75
New workspaces are told to connect a model, before anything fails76/** Why a job did not run as asked, with "Integrations" linked where it says so. */
77function Reason({ text, workspace }: { text: string; workspace: string }) {
78 const [before, after] = text.split("Integrations");
79 return (
80 <p className="rounded-lg bg-raised px-3 py-2 text-sm text-muted">
81 {after === undefined ? (
82 text
83 ) : (
84 <>
85 {before}
86 <Link to={`/${workspace}/-/integrations`} className="text-accent hover:underline">
87 Integrations
88 </Link>
89 {after}
90 </>
91 )}
92 </p>
93 );
94}
95
Fast pages, required checks on the branch, self-hosted runners, honest incidents96/** Where the job ran: g1t's own runners, or a self-hosted one by name. */
97function RanOn({ job, workspace }: { job: Job; workspace: string }) {
Runners are owner-only: the page, its actions, the Settings entry and the links to it98 const runnersPage = useLoaderData<typeof loader>().runnersPage;
Fast pages, required checks on the branch, self-hosted runners, honest incidents99 if (job.selfHosted) {
Runners are owner-only: the page, its actions, the Settings entry and the links to it100 const badge = "ml-auto inline-flex items-center gap-1.5 rounded-full border border-line px-2.5 py-0.5 text-xs text-muted";
101 const label = (
102 <>
Fast pages, required checks on the branch, self-hosted runners, honest incidents103 <ServerCog size={13} />
104 {job.runner ? `Self-hosted: ${job.runner}` : "Self-hosted"}
Runners are owner-only: the page, its actions, the Settings entry and the links to it105 </>
106 );
107 // A link to the runners for those who manage them, a label for everyone else.
108 return runnersPage ? (
109 <Link to={`/${workspace}/-/runners`} className={`${badge} hover:text-fg`} title="Self-hosted runner">
110 {label}
Fast pages, required checks on the branch, self-hosted runners, honest incidents111 </Link>
Runners are owner-only: the page, its actions, the Settings entry and the links to it112 ) : (
113 <span className={badge} title="Self-hosted runner">
114 {label}
115 </span>
Fast pages, required checks on the branch, self-hosted runners, honest incidents116 );
117 }
118 if (!job.startedAt) return null;
119 return (
120 <span className="ml-auto inline-flex items-center gap-1.5 rounded-full border border-line px-2.5 py-0.5 text-xs text-muted">
121 <Cloud size={13} />
122 g1t
123 </span>
124 );
125}
126
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs127function JobView({ job, base }: { job: Job; base: string }) {
128 const live = job.status !== "completed";
129 const log = useJobLog(`${base}/actions/jobs/${job.id}/log`, live);
130 const failed = job.steps.find((s) => s.conclusion === "failure");
131 const running = job.steps.find((s) => s.status === "in_progress");
132 return (
133 <section className="min-w-0 space-y-4">
134 <div className="flex flex-wrap items-center gap-3">
135 <StatusIcon status={job.status} conclusion={job.conclusion} size={18} />
136 <h3 className="text-base font-semibold">{job.name}</h3>
137 <span className="text-sm text-muted">
138 {standingWord(job)}
139 {job.startedAt && ` · ${duration(job.startedAt, job.finishedAt)}`}
140 </span>
Fast pages, required checks on the branch, self-hosted runners, honest incidents141 <RanOn job={job} workspace={base.split("/")[1]!} />
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs142 </div>
New workspaces are told to connect a model, before anything fails143 {job.reason && <Reason text={job.reason} workspace={base.split("/")[1]} />}
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs144 {job.annotations.length > 0 && (
145 <ul className="space-y-2 rounded-xl border border-line bg-surface p-4 text-sm">
146 {job.annotations.map((note, index) => (
147 <li key={index} className="flex gap-2">
148 {ANNOTATION_ICON[note.level]}
149 <span className="min-w-0">
150 {note.title && <span className="font-medium">{note.title}: </span>}
151 <span className="whitespace-pre-wrap">{note.message}</span>
152 {note.file && (
153 <span className="block font-mono text-xs text-faint">
154 {note.file}
155 {note.line != null && `:${note.line}`}
156 </span>
157 )}
158 </span>
159 </li>
160 ))}
161 </ul>
162 )}
163 <div className="overflow-hidden rounded-xl border border-line bg-surface">
164 <StepRow
165 step={{ number: 0, name: "Set up job", status: job.startedAt ? "completed" : "queued", conclusion: job.startedAt ? "success" : null, startedAt: job.startedAt, finishedAt: job.startedAt }}
166 text={log.get(0)}
167 defaultOpen={false}
168 />
169 {job.steps.map((step) => (
170 <StepRow
171 key={step.number}
172 step={step}
173 text={log.get(step.number)}
174 defaultOpen={step.number === (failed ?? running)?.number}
175 />
176 ))}
177 </div>
178 </section>
179 );
180}
181
182export default function ActionsRun({ loaderData, actionData, params }: Route.ComponentProps) {
Actions: workflow_run, workflow.completed, artifacts on the run page, Node 24183 const { detail, artifacts, member } = loaderData;
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs184 const { run, jobs, notes } = detail;
185 const base = `/${params.owner}/${params.repo}`;
186 const [search] = useSearchParams();
Merge branch 'worktree-agent-a985c01f43538af01'187 // One of the run's buttons is working: the others wait for it.
188 const busy = usePending();
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs189 const live = run.status !== "completed";
A click away from a live page arrives: pages stop refreshing themselves while a navigation is pending190 useRefreshWhile(live, 2500);
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs191
192 // The job asked for, else one that failed, is running, or the first.
193 const selected =
194 jobs.find((job) => job.id === search.get("job")) ??
195 jobs.find((job) => job.conclusion === "failure" && job.steps.length > 0) ??
196 jobs.find((job) => job.status === "in_progress") ??
197 jobs[0];
198 const anyFailed = jobs.some((job) => job.conclusion === "failure" || job.conclusion === "cancelled");
199
200 return (
201 <div className="max-w-6xl space-y-6">
202 <header className="space-y-3">
203 <Link to={`${base}/actions?workflow=${run.workflowId}`} className="text-sm text-muted hover:text-fg">
204 {run.name}
205 </Link>
206 <div className="flex flex-wrap items-start justify-between gap-4">
207 <h2 className="flex min-w-0 items-center gap-2.5 text-xl font-semibold tracking-tight">
208 <StatusIcon status={run.status} conclusion={run.conclusion} size={20} />
209 <span className="min-w-0 truncate">{run.title || run.name}</span>
210 <span className="font-normal text-muted">#{run.number}</span>
211 </h2>
212 {member && !run.error && (
213 <Form method="post" className="flex gap-2">
214 {live ? (
Merge branch 'worktree-agent-a985c01f43538af01'215 <SubmitButton name="intent" value="cancel" variant="quiet" disabled={busy} pending="Cancelling…">
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs216 <Square size={13} />
217 Cancel run
Merge branch 'worktree-agent-a985c01f43538af01'218 </SubmitButton>
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs219 ) : (
220 <>
221 {anyFailed && (
Merge branch 'worktree-agent-a985c01f43538af01'222 <SubmitButton name="intent" value="rerun-failed" variant="quiet" disabled={busy} pending="Re-running…">
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs223 <RotateCw size={13} />
224 Re-run failed jobs
Merge branch 'worktree-agent-a985c01f43538af01'225 </SubmitButton>
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs226 )}
Merge branch 'worktree-agent-a985c01f43538af01'227 <SubmitButton name="intent" value="rerun" variant="quiet" disabled={busy} pending="Re-running…">
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs228 <RotateCw size={13} />
229 Re-run all jobs
Merge branch 'worktree-agent-a985c01f43538af01'230 </SubmitButton>
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs231 </>
232 )}
233 </Form>
234 )}
235 </div>
236 <p className="flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-muted">
237 <span>{standingWord(run)}</span>
238 <span className="inline-flex items-center gap-1 font-mono text-xs">
239 <GitBranch size={12} />
240 {shortRef(run.ref)}
241 </span>
242 <Link to={`${base}/commit/${run.sha}`} className="inline-flex items-center gap-1 font-mono text-xs hover:text-fg">
243 <GitCommitHorizontal size={12} />
244 {run.sha.slice(0, 7)}
245 </Link>
246 {run.pull != null && (
247 <Link to={`${base}/pull/${run.pull}`} className="hover:text-fg">
248 #{run.pull}
249 </Link>
250 )}
251 <span>
252 {run.event}
253 {run.actor && ` by ${run.actor}`} · <TimeAgo at={run.createdAt} />
254 </span>
255 {run.startedAt && <span className="font-mono text-xs">{duration(run.startedAt, run.finishedAt)}</span>}
256 {run.attempt > 1 && <span>Attempt {run.attempt}</span>}
257 </p>
258 </header>
259
260 <ErrorText>{actionData && "error" in actionData ? actionData.error : null}</ErrorText>
261 {run.error && (
262 <div className="rounded-xl border border-danger/30 bg-danger/5 p-4 text-sm">
263 <p className="font-medium text-danger">The workflow file could not be used</p>
264 <p className="mt-1 whitespace-pre-wrap text-fg/85">{run.error}</p>
265 </div>
266 )}
267 <Notes notes={notes} />
Actions: workflow_run, workflow.completed, artifacts on the run page, Node 24268 {artifacts.length > 0 && (
269 <section className="rounded-xl border border-line bg-surface p-4">
270 <h3 className="flex items-center gap-2 text-sm font-medium">
271 <Package size={14} className="text-muted" />
272 Artifacts
273 <span className="font-normal text-faint">· kept for 14 days</span>
274 </h3>
275 <ul className="mt-3 divide-y divide-line text-sm">
276 {artifacts.map((artifact) => (
277 <li key={artifact.name} className="flex items-center gap-3 py-2">
278 <span className="min-w-0 grow truncate font-mono text-[0.8125rem]">{artifact.name}</span>
279 <span className="shrink-0 text-xs text-faint">{Math.max(1, Math.round(artifact.size / 1024))} KB</span>
280 <a
281 href={`${base}/actions/runs/${run.id}/artifacts/${encodeURIComponent(artifact.name)}`}
282 className="inline-flex shrink-0 items-center gap-1 rounded-md px-2 py-1 text-xs text-muted ring-1 ring-line hover:text-fg"
283 >
284 <Download size={12} />
285 Download
286 </a>
287 </li>
288 ))}
289 </ul>
290 </section>
291 )}
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs292
293 {jobs.length > 0 && (
294 <div className="grid gap-6 lg:grid-cols-[15rem_1fr]">
295 <nav aria-label="Jobs" className="space-y-0.5 text-sm">
296 {jobs.map((job) => (
297 <Link
298 key={job.id}
299 to={`?job=${job.id}`}
300 preventScrollReset
301 className={`flex items-center gap-2 rounded-md px-2.5 py-1.5 ${
302 job.id === selected?.id ? "bg-raised text-fg" : "text-muted hover:bg-raised/60 hover:text-fg"
303 }`}
304 >
305 <StatusIcon status={job.status} conclusion={job.conclusion} size={14} />
306 <span className="min-w-0 truncate">{job.name}</span>
307 <span className="ml-auto shrink-0 font-mono text-xs text-faint">{duration(job.startedAt, job.finishedAt)}</span>
308 </Link>
309 ))}
310 </nav>
Merge branch 'worktree-agent-a985c01f43538af01'311 {/* Run again, a job keeps its id but its log starts afresh. */}
312 {selected && <JobView key={`${selected.id}:${run.attempt}`} job={selected} base={base} />}
GitHub Actions on g1t, part three: .g1t/workflows, the pages, the docs313 </div>
314 )}
315 </div>
316 );
317}

This file's history is long; its oldest lines are credited to the oldest commit read.