Skip to content
Sign up

flagon-io/g1t

public
0
311 linesCodeBlameRaw

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.

Merge branch 'main' into worktree-agent-a69aeabc4b0deeb971import { ArrowLeft, ChevronRight, ExternalLink, FileText, GitBranch, GitCommitHorizontal, Workflow } from "lucide-react";
2import type { ReactNode } from "react";
Deployments: a preview for every pull request, production on g1t.page3import { Link, data } from "react-router";
4
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb975import type { Deployment, DeploymentDetail, DeploymentStatus } from "@g1t/contracts";
6
Deployments: a preview for every pull request, production on g1t.page7import type { Route } from "./+types/deployment";
Social cards for every page: og.g1t.sh8import { page } from "../../lib/meta";
Deployments: a preview for every pull request, production on g1t.page9import { TimeAgo } from "../../components/ui";
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9710import { Badge } from "../../components/ui/badge";
11import { Hint } from "../../components/ui/hint";
Merge branch 'site-fixes' into fast-push12import { DeployLink, host } from "../../components/deploy";
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9713import { DeploymentStateBadge, DeploymentStateIcon, STATE_TONE, sourceLabel } from "../../components/deployments-panel";
Deployments: a preview for every pull request, production on g1t.page14import { deployments } from "../../lib/services.server";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look15import { getViewer } from "../../lib/session.server";
16import { requireRepo } from "../../lib/access.server";
Merge branch 'site-fixes' into fast-push17import { STATE_WORD, buildError, environmentLabel, hasPayload, isNewestStatus, isPageBuild, shortSha } from "../../lib/deployments";
Deployments: a preview for every pull request, production on g1t.page18
Social cards for every page: og.g1t.sh19export function meta({ params, ...args }: Route.MetaArgs) {
20 return page(args, { title: `Deployment · ${params.owner}/${params.repo} · g1t` });
Deployments: a preview for every pull request, production on g1t.page21}
22
23export async function loader({ params, context }: Route.LoaderArgs) {
24 const viewer = getViewer(context);
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9725 const { repo } = await requireRepo(context, params, "read");
26 const path = { namespace: repo.namespace, name: repo.name };
27 const soft = <T,>(promise: Promise<T>): Promise<T | null> =>
28 promise.catch((error) => (console.warn("deployment:", error), null));
29 // A g1t.page build also has its build log and warnings, for the workspace's members.
30 const [found, build] = await Promise.all([
31 soft(deployments.repoDeployment(path, params.id, viewer)),
32 isPageBuild(params.id) ? soft(deployments.get({ workspace: params.owner, slug: params.repo }, params.id, viewer)) : null,
33 ]);
34 const deployment = found?.ok ? found.value : null;
35 const pageBuild = build?.ok ? build.value : null;
36 if (!deployment && !pageBuild) throw data(null, { status: 404 });
37 return { deployment, build: pageBuild };
Deployments: a preview for every pull request, production on g1t.page38}
39
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9740/** A g1t.page build's status in words. */
41const BUILD_WORDS = {
Deployments: a preview for every pull request, production on g1t.page42 queued: "Waiting for a sandbox",
43 building: "Building",
44 ready: "Live",
Builds say Replaced or Down once they are no longer live45 replaced: "Replaced by a newer build",
46 down: "Taken down",
Deployments: a preview for every pull request, production on g1t.page47 failed: "Failed",
48 skipped: "Skipped",
49} as const;
50
51export default function DeploymentPage({ loaderData, params }: Route.ComponentProps) {
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9752 const { deployment, build } = loaderData;
Deployments: a preview for every pull request, production on g1t.page53 const base = `/${params.owner}/${params.repo}`;
54 return (
55 <div className="mx-auto max-w-5xl">
56 <Link to={`${base}/deployments`} className="inline-flex items-center gap-1 text-sm text-muted hover:text-fg">
57 <ArrowLeft size={14} />
58 Deployments
59 </Link>
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9760 {deployment ? <Reported deployment={deployment} base={base} /> : build && <BuildHeading build={build} base={base} />}
61 {build && <BuildDetails build={build} />}
62 </div>
63 );
64}
65
66function Reported({ deployment, base }: { deployment: DeploymentDetail; base: string }) {
67 const url = deployment.environment_url;
68 const environmentTo = `${base}/deployments?environment=${encodeURIComponent(deployment.environment)}#history`;
69 return (
70 <>
71 <header className="mt-3 flex flex-wrap items-start justify-between gap-4">
72 <div className="min-w-0">
73 <h1 className="flex flex-wrap items-center gap-x-3 gap-y-1 text-xl font-semibold tracking-tight">
74 <Link to={environmentTo} className="hover:text-accent">
75 {environmentLabel(deployment.environment)}
76 </Link>
77 {deployment.number != null && (
78 <Link to={`${base}/pull/${deployment.number}`} className="text-base font-normal text-muted hover:underline">
79 #{deployment.number}
80 </Link>
81 )}
82 <DeploymentStateBadge state={deployment.state} size={16} className="text-sm" />
83 </h1>
84 <p className="mt-1 text-sm text-muted">
85 {deployment.task === "deploy" ? "Deployment" : <span className="font-mono">{deployment.task}</span>} of{" "}
86 <span className="font-mono text-fg-soft">{deployment.ref}</span> by{" "}
87 <span className="text-fg-soft">{deployment.creator}</span> via {sourceLabel(deployment.source)},{" "}
88 <TimeAgo at={deployment.created_at} />
89 </p>
90 </div>
91 {url && (
Merge branch 'site-fixes' into fast-push92 <DeployLink
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9793 href={url}
94 className="inline-flex max-w-full items-center gap-1.5 rounded-md bg-accent px-3.5 py-2 text-sm font-medium text-bg hover:bg-accent-hover"
95 >
96 <span className="truncate">{host(url)}</span>
97 <ExternalLink size={14} className="shrink-0" />
Merge branch 'site-fixes' into fast-push98 </DeployLink>
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb9799 )}
100 </header>
101
102 {deployment.description && (
103 <p className="mt-4 max-w-3xl text-sm text-fg-soft [overflow-wrap:anywhere]">{deployment.description}</p>
104 )}
105
106 <dl className="mt-6 grid grid-cols-1 gap-px overflow-hidden rounded-xl border border-line bg-line text-sm sm:grid-cols-2 lg:grid-cols-4">
107 <Fact label="Environment">
108 <Link to={environmentTo} className="hover:text-accent">
109 {environmentLabel(deployment.environment)}
110 </Link>
111 {deployment.production_environment && deployment.environment !== "production" && <Badge tone="accent">Production</Badge>}
112 {deployment.transient_environment && <Badge>Transient</Badge>}
113 </Fact>
114 <Fact label="Commit">
115 <Link to={`${base}/commit/${deployment.sha}`} className="inline-flex items-center gap-1 font-mono hover:text-accent">
116 <GitCommitHorizontal size={13} className="text-faint" />
117 {shortSha(deployment.sha)}
118 </Link>
119 <span className="inline-flex min-w-0 items-center gap-1 font-mono text-muted">
120 <GitBranch size={12} className="shrink-0 text-faint" />
121 <span className="truncate">{deployment.ref}</span>
122 </span>
123 </Fact>
124 <Fact label="Made by">
125 <span className="truncate">{deployment.creator}</span>
126 <span className="text-muted">
127 via{" "}
128 {deployment.source === "actions" && deployment.run_url ? (
129 <Link to={deployment.run_url} className="text-fg-soft hover:text-accent hover:underline">
130 {sourceLabel(deployment.source)}
131 </Link>
132 ) : (
133 sourceLabel(deployment.source)
134 )}
135 </span>
136 </Fact>
137 <Fact label="Updated">
138 <TimeAgo at={deployment.updated_at} />
139 <span className="text-muted">
140 created <TimeAgo at={deployment.created_at} />
141 </span>
142 </Fact>
143 </dl>
144
145 {(deployment.log_url || deployment.run_url) && (
146 <p className="mt-3 flex flex-wrap gap-x-5 gap-y-1 text-sm">
147 {deployment.run_url && deployment.source === "actions" && (
148 <Link to={deployment.run_url} className="inline-flex items-center gap-1.5 text-muted hover:text-fg">
149 <Workflow size={14} className="text-faint" />
150 Workflow run
151 </Link>
152 )}
153 {deployment.log_url && !isPageBuild(deployment.id) && (
154 <a href={deployment.log_url} className="inline-flex items-center gap-1.5 text-muted hover:text-fg">
155 <FileText size={14} className="text-faint" />
156 Log
157 <ExternalLink size={12} className="text-faint" />
158 </a>
159 )}
160 </p>
161 )}
162
163 <section aria-labelledby="statuses" className="mt-8">
164 <h2 id="statuses" className="text-sm font-semibold">
165 Statuses <span className="font-normal text-faint">{deployment.statuses.length}</span>
166 </h2>
167 {deployment.statuses.length === 0 ? (
168 <p className="mt-3 text-sm text-muted">No statuses yet.</p>
169 ) : (
170 <ol className="mt-4">
171 {deployment.statuses.map((status, index) => (
Merge branch 'site-fixes' into fast-push172 <StatusItem
173 key={status.id}
174 status={status}
175 last={index === deployment.statuses.length - 1}
176 over={!isNewestStatus(deployment.statuses, index)}
177 />
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97178 ))}
179 </ol>
180 )}
181 </section>
182
183 {hasPayload(deployment.payload) && (
184 <details className="group mt-8 rounded-xl border border-line bg-surface">
185 <summary className="flex cursor-pointer list-none items-center gap-2 px-4 py-3 text-sm font-semibold [&::-webkit-details-marker]:hidden">
186 <ChevronRight size={14} className="text-faint transition-transform group-open:rotate-90" />
187 Payload
188 <span className="font-normal text-faint">{Object.keys(deployment.payload).length} keys</span>
189 </summary>
190 <pre className="max-h-[60vh] overflow-auto border-t border-line p-4 font-mono text-xs leading-relaxed text-muted whitespace-pre-wrap [overflow-wrap:anywhere]">
191 {JSON.stringify(deployment.payload, null, 2)}
192 </pre>
193 </details>
194 )}
195 </>
196 );
197}
198
199function Fact({ label, children }: { label: string; children: ReactNode }) {
200 return (
201 <div className="min-w-0 bg-surface px-4 py-3">
202 <dt className="text-[0.6875rem] text-faint">{label}</dt>
203 <dd className="mt-1 flex min-w-0 flex-wrap items-center gap-x-2 gap-y-0.5">{children}</dd>
204 </div>
205 );
206}
207
208/** One status on the timeline, oldest at the top, with a line down to the next. */
Merge branch 'site-fixes' into fast-push209function StatusItem({ status, last, over }: { status: DeploymentStatus; last: boolean; over: boolean }) {
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97210 return (
211 <li className="relative flex gap-3 pb-5 last:pb-0">
212 {!last && <span aria-hidden="true" className="absolute top-6 bottom-1 left-[9px] w-px bg-line" />}
213 <span className="relative mt-0.5 flex size-[19px] shrink-0 items-center justify-center bg-bg">
Merge branch 'site-fixes' into fast-push214 <DeploymentStateIcon state={status.state} size={18} over={over} />
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97215 </span>
216 <div className="min-w-0 grow">
217 <p className="flex flex-wrap items-baseline gap-x-2 text-sm">
Merge branch 'site-fixes' into fast-push218 <span className={`font-medium ${over && status.state === "in_progress" ? "text-muted" : STATE_TONE[status.state]}`}>{STATE_WORD[status.state]}</span>
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97219 <span className="text-xs text-faint">
220 {status.creator} ·{" "}
221 <Hint label={new Date(status.created_at).toUTCString()}>
222 <span tabIndex={0}>
223 <TimeAgo at={status.created_at} />
224 </span>
225 </Hint>
226 </span>
227 </p>
228 {status.description && <p className="mt-0.5 text-sm text-muted [overflow-wrap:anywhere]">{status.description}</p>}
229 {(status.environment_url || status.log_url) && (
230 <p className="mt-1 flex flex-wrap gap-x-4 gap-y-0.5 text-xs">
231 {status.environment_url && (
Merge branch 'site-fixes' into fast-push232 <DeployLink href={status.environment_url} className="inline-flex min-w-0 items-center gap-1 font-mono text-accent hover:underline">
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97233 <span className="truncate">{host(status.environment_url)}</span>
234 <ExternalLink size={11} className="shrink-0" />
Merge branch 'site-fixes' into fast-push235 </DeployLink>
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97236 )}
237 {status.log_url && (
238 <a href={status.log_url} className="inline-flex items-center gap-1 text-muted hover:text-fg">
239 <FileText size={11} />
240 Log
241 </a>
242 )}
243 </p>
244 )}
245 </div>
246 </li>
247 );
248}
249
250/** A g1t.page build with no deployment record to head it: its own heading, as before. */
251function BuildHeading({ build, base }: { build: Deployment; base: string }) {
252 return (
253 <>
Deployments: a preview for every pull request, production on g1t.page254 <h1 className="mt-3 text-xl font-semibold tracking-tight">
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97255 {build.kind === "production" ? (
256 "Production"
257 ) : (
Deployments: a preview for every pull request, production on g1t.page258 <>
Projects: what a workspace builds and runs, first on every page259 Preview of <span className="font-mono">{build.branch}</span>
260 {build.number != null && (
261 <Link to={`${base}/pull/${build.number}`} className="ml-2 text-base font-normal text-muted hover:underline">
262 #{build.number}
263 </Link>
264 )}
Deployments: a preview for every pull request, production on g1t.page265 </>
266 )}
267 <span className="ml-3 font-mono text-sm font-normal text-faint">{build.commit.slice(0, 12)}</span>
268 </h1>
269 <p className="mt-1 text-sm text-muted">
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97270 {BUILD_WORDS[build.status]} · started <TimeAgo at={build.createdAt} /> by {build.createdBy}
Deployments: a preview for every pull request, production on g1t.page271 </p>
272 {build.status === "ready" && (
Merge branch 'site-fixes' into fast-push273 <DeployLink href={build.url} className="mt-3 inline-flex items-center gap-1.5 font-mono text-sm text-accent hover:underline">
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97274 {host(build.url)}
Deployments: a preview for every pull request, production on g1t.page275 <ExternalLink size={12} />
Merge branch 'site-fixes' into fast-push276 </DeployLink>
Deployments: a preview for every pull request, production on g1t.page277 )}
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97278 </>
279 );
280}
281
282/** What only a g1t.page build has: why it failed, its warnings, and its build log. */
283function BuildDetails({ build }: { build: Deployment & { log: string | null } }) {
284 const error = buildError(build);
285 return (
286 <section aria-labelledby="build" className="mt-8">
287 <h2 id="build" className="flex flex-wrap items-baseline gap-x-2 text-sm font-semibold">
288 Build on g1t.page
289 <span className="text-xs font-normal text-muted">
290 {BUILD_WORDS[build.status]}
291 {build.buildSeconds != null && ` · built in ${build.buildSeconds} s`}
292 </span>
293 </h2>
Usage, Billing settings and prepaid AI credit; fixes from the UX audit294 {error && (
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97295 <p className="mt-3 rounded-lg border border-danger/30 bg-danger/5 px-4 py-3 text-sm [overflow-wrap:anywhere]">{error}</p>
Deployments: a preview for every pull request, production on g1t.page296 )}
297 {build.warnings.length > 0 && (
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97298 <ul className="mt-3 space-y-1 rounded-lg border border-warn/30 bg-warn/5 px-4 py-3 text-sm">
Deployments: a preview for every pull request, production on g1t.page299 {build.warnings.map((warning) => (
300 <li key={warning}>{warning}</li>
301 ))}
302 </ul>
303 )}
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97304 <h3 className="mt-5 text-sm font-medium text-muted">Build log</h3>
Usage, Billing settings and prepaid AI credit; fixes from the UX audit305 {/* Long lines wrap, so a narrow screen shows the whole log without scrolling sideways. */}
306 <pre className="mt-3 max-h-[70vh] overflow-auto whitespace-pre-wrap rounded-xl border border-line bg-bg p-4 font-mono text-xs leading-relaxed text-muted [overflow-wrap:anywhere]">
Deployments: a preview for every pull request, production on g1t.page307 {build.log || (build.status === "queued" || build.status === "building" ? "The log appears when the build finishes." : "No log.")}
308 </pre>
Merge branch 'main' into worktree-agent-a69aeabc4b0deeb97309 </section>
Deployments: a preview for every pull request, production on g1t.page310 );
311}

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