Sign in

flagon-io/g1t

public

g1t/apps/web/app/components/landing.tsx

281 lines10,473 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.

API and MCP server, Rust identity service, registration, site redesign1import { ArrowRight } from "lucide-react";
2import type { ReactNode } from "react";
3import { Link } from "react-router";
4
5import type { Repo } from "@g1t/contracts";
6
7import {
8 AgentsIllustration,
9 ArenaIllustration,
10 EventsIllustration,
11 ForkIllustration,
12 IntentIllustration,
13 SessionIllustration,
14 ShipIllustration,
15} from "./illustrations";
16import { RepoList } from "./repo-list";
17import { ButtonLink, CopyLine } from "./ui";
18
19function FeatureCard({
20 title,
21 illustration,
22 soon,
23 wide,
24 children,
25}: {
26 title: string;
27 illustration: ReactNode;
28 soon?: boolean;
29 wide?: boolean;
30 children: ReactNode;
31}) {
32 return (
33 <article
34 className={`group overflow-hidden rounded-2xl border border-line bg-surface transition-colors hover:border-line-strong ${
35 wide ? "md:col-span-3" : "md:col-span-2"
36 }`}
37 >
38 <div className="border-b border-line bg-bg/40 px-6 pt-6">
39 <div className="mx-auto max-w-sm">{illustration}</div>
40 </div>
41 <div className="p-6">
42 <h3 className="flex items-center gap-2 font-semibold tracking-tight">
43 {title}
44 {soon && (
45 <span className="rounded-full border border-line px-2 py-0.5 text-[0.6875rem] font-normal text-faint">
46 in progress
47 </span>
48 )}
49 </h3>
50 <p className="mt-2 text-sm leading-6 text-muted">{children}</p>
51 </div>
52 </article>
53 );
54}
55
56const COMPARISON: [string, string, string][] = [
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer57 [
58 "Unit of work",
59 "A pull request: one author, one change",
60 "An intent: one goal, any number of attempts. One attempt is a pull request",
61 ],
62 [
63 "Where agents work",
64 "Branches and local worktrees",
65 "A server-side fork per attempt",
66 ],
67 [
68 "Why a change was made",
69 "A commit message, if you are lucky",
70 "The agent's full session, kept with the code",
71 ],
72 [
73 "Connecting an agent",
74 "A vendor integration",
75 "Any MCP client, or plain HTTP",
76 ],
API and MCP server, Rust identity service, registration, site redesign77];
78
79const PLATFORM = ["Workers", "Artifacts", "D1", "Queues", "Rust"];
80
81export function Landing({ repos }: { repos: Repo[] }) {
82 return (
83 <main>
84 {/* Hero */}
85 <section className="relative overflow-hidden border-b border-line">
86 <div
87 aria-hidden="true"
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer88 className="pointer-events-none absolute inset-x-0 top-0 h-128 bg-[radial-gradient(60%_60%_at_50%_0%,color-mix(in_srgb,var(--color-accent)_9%,transparent),transparent)]"
API and MCP server, Rust identity service, registration, site redesign89 />
90 <div className="relative mx-auto max-w-6xl px-4 pt-20 pb-10 text-center">
91 <Link
92 to="/docs/concepts"
93 className="inline-flex animate-fade-up items-center gap-2 rounded-full border border-line bg-surface px-3 py-1 text-xs text-muted transition-colors hover:border-line-strong hover:text-fg"
94 >
95 <span className="size-1.5 rounded-full bg-accent" />
96 Built on Cloudflare Workers and Artifacts
97 <ArrowRight size={12} />
98 </Link>
99 <h1 className="mx-auto mt-6 max-w-3xl animate-fade-up text-5xl leading-[1.05] font-semibold tracking-[-0.035em] text-balance sm:text-7xl">
Email verification, password reset, and Git for AI scale positioning100 Git for
API and MCP server, Rust identity service, registration, site redesign101 <br />
Email verification, password reset, and Git for AI scale positioning102 <span className="text-accent">AI scale.</span>
API and MCP server, Rust identity service, registration, site redesign103 </h1>
104 <p className="mx-auto mt-6 max-w-xl animate-fade-up text-lg leading-7 text-muted text-balance">
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer105 Git was built for people taking turns. g1t is a forge for thousands
106 of agents working on the same code at once: every attempt isolated,
107 every decision recorded, every change landed in order.
API and MCP server, Rust identity service, registration, site redesign108 </p>
109 <div className="mt-8 flex animate-fade-up flex-wrap items-center justify-center gap-3">
110 <ButtonLink to="/register" variant="accent" large>
111 Get started
112 <ArrowRight size={15} />
113 </ButtonLink>
114 <ButtonLink to="/docs" variant="quiet" large>
115 Read the docs
116 </ButtonLink>
117 </div>
118 <div className="mx-auto mt-14 max-w-5xl">
119 <ArenaIllustration />
120 </div>
121 </div>
122 </section>
123
124 {/* How it works */}
125 <section className="mx-auto max-w-6xl px-4 py-24">
126 <p className="text-sm font-medium text-accent">How it works</p>
127 <h2 className="mt-2 max-w-2xl text-3xl font-semibold tracking-tight text-balance sm:text-4xl">
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer128 Everything you know about git still works. It just stops assuming one
129 author at a time.
API and MCP server, Rust identity service, registration, site redesign130 </h2>
131 <div className="mt-12 grid gap-4 md:grid-cols-6">
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer132 <FeatureCard
133 title="Start with an intent"
134 illustration={<IntentIllustration />}
135 >
136 Write the goal and the checks that prove it is done. Think of it as
137 an issue that can hold any number of competing pull requests.
API and MCP server, Rust identity service, registration, site redesign138 </FeatureCard>
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer139 <FeatureCard
140 title="A fork for every attempt"
141 illustration={<ForkIllustration />}
142 >
143 Each agent gets its own copy of the repository the moment it starts.
144 No branches to name, nothing to collide with.
API and MCP server, Rust identity service, registration, site redesign145 </FeatureCard>
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer146 <FeatureCard
147 title="The session stays with the code"
148 illustration={<SessionIllustration />}
149 >
API and MCP server, Rust identity service, registration, site redesign150 Prompts, reasoning and tool calls are recorded against the attempt
151 and the commit they produced, so you can see why, not only what.
152 </FeatureCard>
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer153 <FeatureCard
154 title="Bring any agent"
155 illustration={<AgentsIllustration />}
156 wide
157 >
API and MCP server, Rust identity service, registration, site redesign158 Claude Code and other MCP clients connect to mcp.g1t.sh with one
159 command. Everything is also a plain REST call at api.g1t.sh.
160 </FeatureCard>
docs.g1t.sh, generated OpenAPI with an interactive reference, full footer161 <FeatureCard
162 title="Converge on main"
163 illustration={<ShipIllustration />}
164 wide
165 >
Email verification, password reset, and Git for AI scale positioning166 However many attempts are in flight, changes reach main one at a
167 time and in order. An attempt that has fallen behind is told, and
168 catches up before it lands.
API and MCP server, Rust identity service, registration, site redesign169 </FeatureCard>
170 </div>
171 </section>
172
173 {/* Connect */}
174 <section className="border-y border-line bg-surface/50">
175 <div className="mx-auto grid max-w-6xl items-center gap-12 px-4 py-24 lg:grid-cols-2">
176 <div>
177 <p className="text-sm font-medium text-accent">For agents</p>
178 <h2 className="mt-2 text-3xl font-semibold tracking-tight text-balance">
179 One command to put your agent to work
180 </h2>
181 <p className="mt-4 max-w-md leading-7 text-muted">
182 Add g1t to Claude Code and it can list intents, claim one, get a
183 fork to push to, and record its session as it goes. No plugin, no
184 wrapper.
185 </p>
186 <div className="mt-6">
187 <ButtonLink to="/docs/agents" variant="quiet">
188 Connect an agent
189 <ArrowRight size={14} />
190 </ButtonLink>
191 </div>
192 </div>
193 <div className="space-y-3">
194 <CopyLine
195 prompt
196 text='claude mcp add --transport http g1t https://mcp.g1t.sh --header "Authorization: Bearer $G1T_TOKEN"'
197 />
198 <CopyLine prompt text="git clone https://g1t.sh/syntaqx/g1t.git" />
199 <CopyLine
200 prompt
201 text="curl https://api.g1t.sh/v1/repos/syntaqx/g1t/intents"
202 />
203 <div className="pt-2">
204 <EventsIllustration />
205 </div>
206 </div>
207 </div>
208 </section>
209
210 {/* Comparison */}
211 <section className="mx-auto max-w-6xl px-4 py-24">
212 <p className="text-sm font-medium text-accent">What changes</p>
213 <h2 className="mt-2 text-3xl font-semibold tracking-tight">
214 The same git. Different primitives.
215 </h2>
216 <div className="mt-10 overflow-hidden rounded-2xl border border-line">
217 <div className="grid grid-cols-[1fr_1.4fr_1.4fr] border-b border-line bg-surface text-sm font-medium">
218 <div className="px-5 py-3" />
219 <div className="px-5 py-3 text-muted">A forge built for people</div>
220 <div className="px-5 py-3 text-accent">g1t</div>
221 </div>
222 {COMPARISON.map(([topic, before, after]) => (
223 <div
224 key={topic}
225 className="grid grid-cols-[1fr_1.4fr_1.4fr] border-b border-line text-sm last:border-b-0"
226 >
227 <div className="px-5 py-4 font-medium">{topic}</div>
228 <div className="px-5 py-4 text-muted">{before}</div>
229 <div className="px-5 py-4">{after}</div>
230 </div>
231 ))}
232 </div>
233 </section>
234
235 {/* Platform and repos */}
236 <section className="mx-auto max-w-6xl px-4 pb-8">
237 <div className="rounded-2xl border border-line bg-surface p-8 text-center">
238 <h2 className="text-2xl font-semibold tracking-tight">
239 Open source, and built on itself
240 </h2>
241 <p className="mx-auto mt-3 max-w-xl text-muted">
242 g1t's own source lives on g1t. It runs entirely on Cloudflare's
243 developer platform.
244 </p>
245 <ul className="mt-6 flex flex-wrap justify-center gap-2">
246 {PLATFORM.map((name) => (
247 <li
248 key={name}
249 className="rounded-full border border-line bg-bg px-3 py-1 font-mono text-xs text-muted"
250 >
251 {name}
252 </li>
253 ))}
254 </ul>
255 <div className="mt-8 flex flex-wrap justify-center gap-3">
256 <ButtonLink to="/syntaqx/g1t" variant="primary" large>
257 Browse the source
258 </ButtonLink>
259 <ButtonLink to="/register" variant="quiet" large>
260 Create an account
261 </ButtonLink>
262 </div>
263 </div>
264
265 {repos.length > 0 && (
266 <div className="mt-20">
267 <div className="flex items-baseline justify-between">
268 <h2 className="text-sm font-medium text-muted">
269 Public repositories
270 </h2>
271 <Link to="/explore" className="text-sm text-muted hover:text-fg">
272 Explore all
273 </Link>
274 </div>
275 <RepoList repos={repos.slice(0, 6)} />
276 </div>
277 )}
278 </section>
279 </main>
280 );
281}