Skip to content
Sign up

flagon-io/g1t

public
0
667 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.

Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar1import { Mail, UserPlus, Users } from "lucide-react";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look2import { useEffect, useState } from "react";
Merge branch 'worktree-agent-a985c01f43538af01'3import { Form, Link, useFetcher } from "react-router";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look4
5import {
6 BASE_PERMISSION_LABELS,
7 REPO_ROLES,
8 REPO_ROLE_LABELS,
9 type Collaborator,
10 type RepoInvitation,
11 type RepoRole,
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar12 type RepoTeam,
13 type Team,
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look14 baseRole,
15} from "@g1t/contracts";
16
17import type { Route } from "./+types/settings-access";
18import { RoleSelect, RolesTable } from "../../components/access";
19import { RepoSettingsHeading } from "../../components/repo-settings-heading";
Merge Stripe Tax, the card fee on card payments, and one free workspace per person20import { StartPlanToInvite } from "../../components/start-plan";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look21import { SettingsSection as Section } from "../../components/settings-section";
Merge branch 'worktree-agent-a985c01f43538af01'22import { Avatar, Button, ErrorText, Field, Input, SubmitButton } from "../../components/ui";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look23import { Badge } from "../../components/ui/badge";
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar24import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../components/ui/select";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look25import {
26 AlertDialog,
27 AlertDialogCancel,
28 AlertDialogContent,
29 AlertDialogDescription,
30 AlertDialogFooter,
31 AlertDialogHeader,
32 AlertDialogTitle,
33} from "../../components/ui/alert-dialog";
34import { page } from "../../lib/meta";
35import { refusal, requireInsider } from "../../lib/access.server";
Merge Stripe Tax, the card fee on card payments, and one free workspace per person36import { billing, identity } from "../../lib/services.server";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look37import { assertSameOrigin, requireUser, roleIn, unwrap } from "../../lib/session.server";
Merge commit authors and hovercards: commits show their accounts, every name opens a card (repos 0016)38import { UserCard } from "../../components/user-card";
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look39
40export function meta({ params, ...args }: Route.MetaArgs) {
41 return page(args, { title: `Access · ${params.owner}/${params.repo} · g1t` });
42}
43
44export async function loader({ params, context }: Route.LoaderArgs) {
45 // Write and up see who has access; Admins change it. To anyone without a
46 // role here the page does not exist.
47 const { viewer, access } = await requireInsider(context, params, "push");
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar48 const manage = access.can.manage_access;
49 // The workspace's teams, for Add team: only Admins add one, and a
50 // failure there leaves the rest of the page as it is.
Merge Stripe Tax, the card fee on card payments, and one free workspace per person51 const [found, teams, free] = await Promise.all([
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar52 identity.repoAccess(params.owner, params.repo, viewer),
53 manage ? identity.listTeams(viewer, params.owner).catch(() => null) : Promise.resolve(null),
Merge Stripe Tax, the card fee on card payments, and one free workspace per person54 // A free workspace invites no one from outside; identity refuses it
55 // either way, so a failure here only hides the note.
56 manage ? billing.freeWorkspaces([params.owner]).catch(() => [] as string[]) : Promise.resolve([] as string[]),
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar57 ]);
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look58 return {
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar59 access: unwrap(found),
60 teams: teams?.ok ? teams.value : ([] as Team[]),
61 manage,
Merge Stripe Tax, the card fee on card payments, and one free workspace per person62 free: free.includes(params.owner.toLowerCase()),
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look63 // Owners change the base permission, on the workspace's People page.
64 owner: roleIn(viewer, params.owner) === "owner",
65 };
66}
67
68/** What a form on this page came back with. */
69type Outcome = { intent: string; ok: boolean; message: string | null; error: string | null };
70
71const isRole = (value: string): value is RepoRole => (REPO_ROLES as readonly string[]).includes(value);
72
73export async function action({ request, params, context }: Route.ActionArgs): Promise<Outcome> {
74 assertSameOrigin(request);
75 const user = requireUser(context, request);
76 const form = await request.formData();
77 const intent = String(form.get("intent") ?? "");
78 const text = (name: string) => String(form.get(name) ?? "").trim();
79 const failed = (error: string): Outcome => ({ intent, ok: false, message: null, error });
80 const refused = await refusal(context, params, "manage_access");
81 if (refused) return failed(refused);
82 const role = text("role");
83
84 switch (intent) {
85 case "add": {
86 const invitee = text("invitee");
87 if (!invitee) return failed("Enter a username or an email address.");
88 if (!isRole(role)) return failed("Choose a role.");
89 const added = await identity.addCollaborator(user, params.owner, params.repo, invitee, role);
90 if (!added.ok) return failed(added.error.message);
91 const label = REPO_ROLE_LABELS[role];
92 if (added.value.result === "granted") {
93 return { intent, ok: true, error: null, message: `${added.value.collaborator.username} now has the ${label} role.` };
94 }
95 const invitation = added.value.invitation;
96 return {
97 intent,
98 ok: true,
99 error: null,
100 message: invitation.invitee
101 ? `We sent ${invitation.invitee} an invitation. They get the ${label} role when they accept it.`
102 : `We sent an invite to ${invitation.email ?? invitee}. They get the ${label} role once they make an account and join.`,
103 };
104 }
105 case "role": {
106 if (!isRole(role)) return failed("Choose a role.");
107 const changed = await identity.setCollaboratorRole(user, params.owner, params.repo, text("username"), role);
108 return changed.ok
109 ? { intent, ok: true, error: null, message: `${changed.value.username} has the ${REPO_ROLE_LABELS[changed.value.role]} role.` }
110 : failed(changed.error.message);
111 }
112 case "remove": {
113 const removed = await identity.removeCollaborator(user, params.owner, params.repo, text("username"));
Merge branch 'worktree-agent-af9f0f386d52b6a73'114 return removed.ok
115 ? { intent, ok: true, error: null, message: `${text("username")} no longer has a role given here.` }
116 : failed(removed.error.message);
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look117 }
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar118 case "team-add":
119 case "team-role": {
120 const team = text("team");
121 if (!team) return failed("Choose a team.");
122 if (!isRole(role)) return failed("Choose a role.");
123 const set = await identity.setTeamRepo(user, params.owner, team, params.owner, params.repo, role);
124 return set.ok
125 ? { intent, ok: true, error: null, message: `${team} has the ${REPO_ROLE_LABELS[set.value.role]} role.` }
126 : failed(set.error.message);
127 }
128 case "team-remove": {
129 const team = text("team");
130 const removed = await identity.removeTeamRepo(user, params.owner, team, params.owner, params.repo);
131 return removed.ok
132 ? { intent, ok: true, error: null, message: `${team} no longer has a role here.` }
133 : failed(removed.error.message);
134 }
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look135 case "revoke": {
136 const revoked = await identity.revokeRepoInvitation(user, params.owner, params.repo, text("id"));
137 return revoked.ok ? { intent, ok: true, error: null, message: null } : failed(revoked.error.message);
138 }
139 default:
140 return failed("Unknown request.");
141 }
142}
143
144const SOURCE: Record<Collaborator["source"], string> = {
145 owner: "Owner of the workspace",
146 base: "Member, by the base permission",
147 direct: "Given a role here",
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar148 team: "Through a team",
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look149};
150
151export default function RepoAccessSettings({ loaderData, actionData, params }: Route.ComponentProps) {
Merge Stripe Tax, the card fee on card payments, and one free workspace per person152 const { access, manage, owner, teams, free } = loaderData;
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look153 const base = `/${params.owner}/${params.repo}`;
154 const full = `${params.owner}/${params.repo}`;
155 const pending = access.invitations.filter((invitation) => invitation.status === "pending");
156 const people = [...access.people].sort(
157 (a, b) => REPO_ROLES.indexOf(b.role) - REPO_ROLES.indexOf(a.role) || a.username.localeCompare(b.username),
158 );
159 const result = actionData?.intent === "add" ? actionData : undefined;
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar160 const teamResult = actionData?.intent === "team-add" ? actionData : undefined;
161 const repoTeams = [...(access.teams ?? [])].sort(
162 (a, b) => REPO_ROLES.indexOf(b.role) - REPO_ROLES.indexOf(a.role) || a.name.localeCompare(b.name),
163 );
164 const listed = new Set(repoTeams.map((team) => team.slug));
165 const addable = teams.filter((team) => !listed.has(team.slug));
Merge branch 'worktree-agent-af9f0f386d52b6a73'166 // Roles are changed and people removed from their own rows, which say
167 // what went wrong; what went right is said once, under the list.
168 const [notice, setNotice] = useState<string | null>(null);
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look169 return (
170 <>
171 <RepoSettingsHeading base={base} />
172 <div className="max-w-4xl space-y-8">
173 <Section
174 title="Base permission"
175 about={`What every member of ${params.owner} gets on its repositories.`}
176 >
177 <div className="rounded-xl border border-line bg-surface p-4 text-sm">
178 <p>
179 Members have{" "}
180 <span className="font-medium text-fg">
181 {access.base_permission === "none" ? "no permission" : `the ${BASE_PERMISSION_LABELS[access.base_permission]} role`}
182 </span>{" "}
183 on {full}
184 {access.base_permission === "none" ? " unless they are given a role here." : ", or the higher role they are given here."}{" "}
185 Owners of the workspace are Admins on every repository.
186 </p>
187 <p className="mt-2 text-muted">
188 {owner ? (
189 <Link to={`/${params.owner}/-/people#base-permission`} className="text-accent hover:underline">
190 Change the base permission
191 </Link>
192 ) : (
193 "Owners of the workspace choose it."
194 )}
195 </p>
196 </div>
197 </Section>
198
199 {manage && (
200 <Section
201 title="Add people"
202 about="A member of the workspace gets the role at once. Anyone else gets an invitation, by email, and has the role once they accept it."
203 >
Merge Stripe Tax, the card fee on card payments, and one free workspace per person204 {free && <StartPlanToInvite workspace={params.owner} owner={owner} outside />}
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look205 <AddForm result={result} />
206 </Section>
207 )}
208
209 <Section
210 title="People with access"
211 about={
212 manage
213 ? "Who can see the repository, and what each can do. Outside collaborators are not members of the workspace; they see only the repositories shared with them."
214 : "Who can see the repository, and what each can do. Changing who has access needs the Admin role."
215 }
216 >
217 <ul className="divide-y divide-line rounded-xl border border-line">
218 {people.map((person) => (
Merge branch 'worktree-agent-af9f0f386d52b6a73'219 <PersonRow
220 key={person.username}
221 person={person}
222 manage={manage}
223 base={access.base_permission}
224 full={full}
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar225 workspace={params.owner}
Merge branch 'worktree-agent-af9f0f386d52b6a73'226 onDone={setNotice}
227 />
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look228 ))}
229 </ul>
Merge branch 'worktree-agent-af9f0f386d52b6a73'230 {notice && (
Merge branch 'worktree-agent-ad7c6d88d93adc817'231 <p className="text-sm text-success" role="status">
Merge branch 'worktree-agent-af9f0f386d52b6a73'232 {notice}
233 </p>
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look234 )}
235 </Section>
236
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar237 <Section
238 title="Teams with access"
239 about={
240 manage
241 ? `Teams of ${params.owner} with a role here. Everyone on a team gets its role, and the team can be asked to review.`
242 : `Teams of ${params.owner} with a role here. Everyone on a team gets its role. Changing them needs the Admin role.`
243 }
244 >
245 {repoTeams.length === 0 ? (
246 <p className="rounded-xl border border-dashed border-line px-4 py-6 text-center text-sm text-muted">
247 No team has a role here.
248 </p>
249 ) : (
250 <ul className="divide-y divide-line rounded-xl border border-line">
251 {repoTeams.map((team) => (
252 <TeamRow key={team.slug} team={team} workspace={params.owner} full={full} manage={manage} onDone={setNotice} />
253 ))}
254 </ul>
255 )}
256 {manage && <AddTeamForm teams={addable} result={teamResult} workspace={params.owner} />}
257 </Section>
258
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look259 {manage && (
260 <Section title="Pending invitations" about="Invitations not yet accepted. Each expires after 7 days.">
261 {pending.length === 0 ? (
262 <p className="rounded-xl border border-dashed border-line px-4 py-6 text-center text-sm text-muted">
263 No invitations are waiting.
264 </p>
265 ) : (
266 <ul className="divide-y divide-line rounded-xl border border-line">
267 {pending.map((invitation) => (
268 <InvitationRow key={invitation.id} invitation={invitation} />
269 ))}
270 </ul>
271 )}
272 </Section>
273 )}
274
275 <Section
276 title="Roles"
277 about="What each role can do. Each role can do everything the one before it can. Transferring and deleting also need an owner of the workspace."
278 >
279 <RolesTable />
280 </Section>
281 </div>
282 </>
283 );
284}
285
286/** A username or an address, and the role to give. */
287function AddForm({ result }: { result: Outcome | undefined }) {
288 const [role, setRole] = useState<RepoRole>("write");
289 const [key, setKey] = useState(0);
290 // Cleared once someone was added, ready for the next.
291 useEffect(() => {
292 if (result?.ok) setKey((k) => k + 1);
293 }, [result]);
294 return (
295 <Form method="post" className="space-y-3 rounded-xl border border-line bg-surface p-4">
296 <input type="hidden" name="intent" value="add" />
297 <div className="grid gap-3 sm:grid-cols-[minmax(0,1fr)_11rem_auto] sm:items-end">
298 <Field label="Username or email address">
299 <Input key={key} name="invitee" required maxLength={254} placeholder="username or name@example.com" />
300 </Field>
301 <div>
302 <span className="mb-1.5 block text-sm font-medium text-muted">Role</span>
303 <RoleSelect name="role" label="Role" value={role} onValueChange={(value) => setRole(value as RepoRole)} />
304 </div>
Merge branch 'worktree-agent-a985c01f43538af01'305 <SubmitButton match={{ intent: "add" }} pending="Adding…">
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look306 <UserPlus size={15} />
Merge branch 'worktree-agent-a985c01f43538af01'307 Add
308 </SubmitButton>
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look309 </div>
310 <p className="text-xs text-faint">{REPO_ROLE_LABELS[role]}: {roleLine(role)}</p>
311 {result &&
312 (result.ok ? (
313 <p className="flex items-start gap-2 text-sm text-fg" role="status">
314 <Mail size={14} className="mt-0.5 shrink-0 text-accent" />
315 {result.message}
316 </p>
317 ) : (
318 <ErrorText>{result.error}</ErrorText>
319 ))}
320 </Form>
321 );
322}
323
324function roleLine(role: RepoRole): string {
325 return {
326 read: "they can see and clone it, open issues and pull requests, and comment.",
Merge main (membership, two-factor, GitHub repo roles) into tokens327 triage: "they can also apply labels and milestones, and assign, close and reopen issues and pull requests.",
328 write: "they can also push, merge, manage labels and milestones, see security alerts and put agents to work.",
329 maintain: "they can also change its settings and topics.",
330 admin: "they can do everything, including branch protection, webhooks, secrets, deployments and who has access.",
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look331 }[role];
332}
333
334/** One person: who they are, how they have access, and their role. */
335function PersonRow({
336 person,
337 manage,
338 base,
339 full,
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar340 workspace,
Merge branch 'worktree-agent-af9f0f386d52b6a73'341 onDone,
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look342}: {
343 person: Collaborator;
344 manage: boolean;
345 base: Parameters<typeof baseRole>[0];
346 full: string;
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar347 workspace: string;
Merge branch 'worktree-agent-af9f0f386d52b6a73'348 onDone: (notice: string | null) => void;
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look349}) {
350 const fetcher = useFetcher<Outcome>();
Merge branch 'worktree-agent-af9f0f386d52b6a73'351 useEffect(() => {
352 if (fetcher.data) onDone(fetcher.data.ok ? fetcher.data.message : null);
353 }, [fetcher.data, onDone]);
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look354 const outside = person.workspace_role == null;
355 // A member keeps the base permission whatever role they are given here,
356 // so only higher roles mean anything for them.
357 const floor = outside ? null : baseRole(base);
358 const roles = floor ? REPO_ROLES.filter((role) => REPO_ROLES.indexOf(role) >= REPO_ROLES.indexOf(floor)) : REPO_ROLES;
359 const shown = fetcher.formData?.get("intent") === "role" ? String(fetcher.formData.get("role")) : person.role;
360 const editable = manage && person.source !== "owner";
361 return (
362 <li className="flex flex-wrap items-center gap-x-3 gap-y-2 px-4 py-3">
363 <Avatar name={person.username} image={person.avatar} size={32} />
364 <div className="min-w-0 grow basis-40">
365 <p className="flex flex-wrap items-center gap-x-2 gap-y-1">
Merge commit authors and hovercards: commits show their accounts, every name opens a card (repos 0016)366 <UserCard username={person.username}>
367 <Link to={`/u/${person.username}`} className="font-mono text-sm hover:text-accent">
368 {person.username}
369 </Link>
370 </UserCard>
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look371 {person.name && <span className="truncate text-sm text-muted">{person.name}</span>}
372 {person.source === "owner" && <Badge tone="accent">Owner</Badge>}
373 {outside && <Badge tone="info">Outside collaborator</Badge>}
374 </p>
375 <p className="mt-0.5 text-xs text-faint">
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar376 {person.source === "team" && person.team ? (
377 <>
378 Through team{" "}
379 <Link to={`/${workspace}/-/teams/${person.team}`} className="text-muted hover:text-accent hover:underline">
380 {person.team}
381 </Link>
382 </>
383 ) : (
384 SOURCE[person.source]
385 )}
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look386 {!outside && person.direct != null && person.source !== "direct" ? ` · given ${REPO_ROLE_LABELS[person.direct]} here` : ""}
387 </p>
388 {fetcher.data && !fetcher.data.ok && <ErrorText>{fetcher.data.error}</ErrorText>}
389 </div>
390 <div className="flex shrink-0 items-center gap-2">
391 {editable ? (
392 <RoleSelect
393 size="sm"
394 label={`Role of ${person.username}`}
395 roles={roles}
396 value={shown}
397 className="w-32"
398 disabled={fetcher.state !== "idle"}
399 onValueChange={(role) =>
400 fetcher.submit({ intent: "role", username: person.username, role }, { method: "post" })
401 }
402 />
403 ) : (
404 <span className="inline-flex h-8 w-32 items-center rounded-md border border-line px-2.5 text-[0.8125rem] text-muted">
405 {REPO_ROLE_LABELS[person.role]}
406 </span>
407 )}
408 {/* The same room for Remove on every row, so the roles line up. */}
409 {manage && (
410 <span className="flex w-[5.5rem] justify-end">
Merge branch 'worktree-agent-af9f0f386d52b6a73'411 {editable && person.direct != null && (
412 <RemoveButton person={person} full={full} outside={outside} onDone={onDone} />
413 )}
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look414 </span>
415 )}
416 </div>
417 </li>
418 );
419}
420
421/** Taking someone's role here away, after saying what that means. */
Merge branch 'worktree-agent-af9f0f386d52b6a73'422function RemoveButton({
423 person,
424 full,
425 outside,
426 onDone,
427}: {
428 person: Collaborator;
429 full: string;
430 outside: boolean;
431 onDone: (notice: string | null) => void;
432}) {
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look433 const fetcher = useFetcher<Outcome>();
434 const [open, setOpen] = useState(false);
Merge branch 'worktree-agent-af9f0f386d52b6a73'435 // Said as soon as the answer comes, before the row leaves the list.
436 useEffect(() => {
437 if (fetcher.data) onDone(fetcher.data.ok ? fetcher.data.message : null);
438 }, [fetcher.data, onDone]);
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look439 useEffect(() => {
440 if (fetcher.state === "idle" && fetcher.data?.ok) setOpen(false);
441 }, [fetcher.state, fetcher.data]);
442 return (
443 <AlertDialog open={open} onOpenChange={setOpen}>
444 <Button type="button" variant="quiet" onClick={() => setOpen(true)}>
445 Remove
446 </Button>
447 <AlertDialogContent>
448 <fetcher.Form method="post" className="grid gap-4">
449 <input type="hidden" name="intent" value="remove" />
450 <input type="hidden" name="username" value={person.username} />
451 <AlertDialogHeader>
452 <AlertDialogTitle>
453 Remove {person.username} from {full}?
454 </AlertDialogTitle>
455 <AlertDialogDescription>
456 {outside
457 ? "They lose access to the repository at once, and stop seeing it in Shared with you. Their issues, pull requests and comments stay."
458 : "They lose the role given to them here, and keep what the workspace's base permission gives every member."}
459 </AlertDialogDescription>
460 </AlertDialogHeader>
461 {fetcher.data && !fetcher.data.ok && <ErrorText>{fetcher.data.error}</ErrorText>}
462 <AlertDialogFooter>
463 <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
Merge branch 'worktree-agent-a985c01f43538af01'464 <SubmitButton variant="danger" fetcher={fetcher} pending="Removing…">
465 Remove
466 </SubmitButton>
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look467 </AlertDialogFooter>
468 </fetcher.Form>
469 </AlertDialogContent>
470 </AlertDialog>
471 );
472}
473
474function day(at: string): string {
475 return new Date(at).toISOString().slice(0, 10);
476}
477
478/** A pending invitation: to whom, with which role, until when. */
479function InvitationRow({ invitation }: { invitation: RepoInvitation }) {
480 const fetcher = useFetcher<Outcome>();
481 const who = invitation.invitee ?? invitation.email ?? "Someone";
482 return (
483 <li className="flex flex-wrap items-center gap-x-3 gap-y-2 px-4 py-3">
484 {invitation.invitee ? (
485 <Avatar name={invitation.invitee} size={32} />
486 ) : (
487 <span className="flex size-8 shrink-0 items-center justify-center rounded-full bg-raised text-muted ring-1 ring-line">
488 <Mail size={14} />
489 </span>
490 )}
491 <div className="min-w-0 grow basis-40">
492 <p className="flex flex-wrap items-center gap-x-2 gap-y-1">
493 <span className={`min-w-0 truncate text-sm ${invitation.invitee ? "font-mono" : ""}`}>{who}</span>
494 <Badge>{REPO_ROLE_LABELS[invitation.role]}</Badge>
495 </p>
496 <p className="mt-0.5 text-xs text-faint">
497 Invited by {invitation.invited_by ?? "g1t"} on {day(invitation.created_at)} · expires {day(invitation.expires_at)}
498 </p>
499 {fetcher.data && !fetcher.data.ok && <ErrorText>{fetcher.data.error}</ErrorText>}
500 </div>
501 <fetcher.Form method="post" className="shrink-0">
502 <input type="hidden" name="intent" value="revoke" />
503 <input type="hidden" name="id" value={invitation.id} />
Merge branch 'worktree-agent-a985c01f43538af01'504 <SubmitButton variant="quiet" fetcher={fetcher} pending="Revoking…">
505 Revoke
506 </SubmitButton>
Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look507 </fetcher.Form>
508 </li>
509 );
510}
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar511
512/** A team with a role here: its name, handle, size, and the role it gives. */
513function TeamRow({
514 team,
515 workspace,
516 full,
517 manage,
518 onDone,
519}: {
520 team: RepoTeam;
521 workspace: string;
522 full: string;
523 manage: boolean;
524 onDone: (notice: string | null) => void;
525}) {
526 const fetcher = useFetcher<Outcome>();
527 const [open, setOpen] = useState(false);
528 useEffect(() => {
529 if (fetcher.data) onDone(fetcher.data.ok ? fetcher.data.message : null);
530 }, [fetcher.data, onDone]);
531 useEffect(() => {
532 if (fetcher.state === "idle" && fetcher.data?.ok) setOpen(false);
533 }, [fetcher.state, fetcher.data]);
534 const shown = fetcher.formData?.get("intent") === "team-role" ? String(fetcher.formData.get("role")) : team.role;
535 const href = `/${workspace}/-/teams/${team.slug}`;
536 return (
537 <li className="flex flex-wrap items-center gap-x-3 gap-y-2 px-4 py-3">
538 <span className="flex size-8 shrink-0 items-center justify-center rounded-md bg-raised text-muted ring-1 ring-line">
539 <Users size={15} />
540 </span>
541 <div className="min-w-0 grow basis-40">
542 <p className="flex flex-wrap items-center gap-x-2 gap-y-1">
543 <Link to={href} className="text-sm font-medium hover:text-accent">
544 {team.name}
545 </Link>
546 <span className="truncate font-mono text-xs text-muted">
547 @{workspace}/{team.slug}
548 </span>
549 {team.visibility === "secret" && <Badge tone="warn">Secret</Badge>}
550 </p>
551 <p className="mt-0.5 text-xs text-faint">
552 {team.members_count === 1 ? "1 member" : `${team.members_count} members`}
553 </p>
554 {fetcher.data && !fetcher.data.ok && !open && <ErrorText>{fetcher.data.error}</ErrorText>}
555 </div>
556 <div className="flex shrink-0 items-center gap-2">
557 {manage ? (
558 <RoleSelect
559 size="sm"
560 label={`Role of team ${team.name}`}
561 value={shown}
562 className="w-32"
563 disabled={fetcher.state !== "idle"}
564 onValueChange={(role) => fetcher.submit({ intent: "team-role", team: team.slug, role }, { method: "post" })}
565 />
566 ) : (
567 <span className="inline-flex h-8 w-32 items-center rounded-md border border-line px-2.5 text-[0.8125rem] text-muted">
568 {REPO_ROLE_LABELS[team.role]}
569 </span>
570 )}
571 {manage && (
572 <span className="flex w-[5.5rem] justify-end">
573 <AlertDialog open={open} onOpenChange={setOpen}>
574 <Button type="button" variant="quiet" onClick={() => setOpen(true)}>
575 Remove
576 </Button>
577 <AlertDialogContent>
578 <fetcher.Form method="post" className="grid gap-4">
579 <input type="hidden" name="intent" value="team-remove" />
580 <input type="hidden" name="team" value={team.slug} />
581 <AlertDialogHeader>
582 <AlertDialogTitle>
583 Remove {team.name} from {full}?
584 </AlertDialogTitle>
585 <AlertDialogDescription>
586 Its people lose the role it gave them here, and keep any role they have otherwise. The team itself stays.
587 </AlertDialogDescription>
588 </AlertDialogHeader>
589 {fetcher.data && !fetcher.data.ok && <ErrorText>{fetcher.data.error}</ErrorText>}
590 <AlertDialogFooter>
591 <AlertDialogCancel type="button">Cancel</AlertDialogCancel>
592 <SubmitButton variant="danger" fetcher={fetcher} pending="Removing…">
593 Remove
594 </SubmitButton>
595 </AlertDialogFooter>
596 </fetcher.Form>
597 </AlertDialogContent>
598 </AlertDialog>
599 </span>
600 )}
601 </div>
602 </li>
603 );
604}
605
606/** One of the workspace's teams without a role here yet, and the role to give it. */
607function AddTeamForm({ teams, result, workspace }: { teams: Team[]; result: Outcome | undefined; workspace: string }) {
608 const [team, setTeam] = useState("");
609 const [role, setRole] = useState<RepoRole>("write");
610 // Cleared once the team was added, ready for the next.
611 useEffect(() => {
612 if (result?.ok) setTeam("");
613 }, [result]);
614 if (teams.length === 0) {
615 return (
616 <p className="text-sm text-muted">
617 No other team of {workspace} to add.{" "}
618 <Link to={`/${workspace}/-/teams`} className="text-accent hover:underline">
619 See its teams
620 </Link>
621 </p>
622 );
623 }
624 return (
625 <Form method="post" className="space-y-3 rounded-xl border border-line bg-surface p-4">
626 <input type="hidden" name="intent" value="team-add" />
627 <div className="grid gap-3 sm:grid-cols-[minmax(0,1fr)_11rem_auto] sm:items-end">
628 <div>
629 <span className="mb-1.5 block text-sm font-medium text-muted">Team</span>
630 <Select name="team" value={team} onValueChange={setTeam} required>
631 <SelectTrigger aria-label="Team">
632 <SelectValue placeholder="Choose a team" />
633 </SelectTrigger>
634 <SelectContent align="start">
635 {teams.map((option) => (
636 <SelectItem
637 key={option.slug}
638 value={option.slug}
639 description={`@${option.workspace}/${option.slug} · ${option.members_count === 1 ? "1 member" : `${option.members_count} members`}`}
640 >
641 {option.name}
642 </SelectItem>
643 ))}
644 </SelectContent>
645 </Select>
646 </div>
647 <div>
648 <span className="mb-1.5 block text-sm font-medium text-muted">Role</span>
649 <RoleSelect name="role" label="Role" value={role} onValueChange={(value) => setRole(value as RepoRole)} />
650 </div>
651 <SubmitButton match={{ intent: "team-add" }} pending="Adding…" disabled={!team}>
652 <Users size={15} />
653 Add team
654 </SubmitButton>
655 </div>
656 <p className="text-xs text-faint">{REPO_ROLE_LABELS[role]}: everyone on the team {roleLine(role).replace(/^they /, "")}</p>
657 {result &&
658 (result.ok ? (
Merge branch 'worktree-agent-ad7c6d88d93adc817'659 <p className="text-sm text-success" role="status">
Teams and CODEOWNERS, labels and milestones, dependency updates, the security suite, and a clearer top bar660 {result.message}
661 </p>
662 ) : (
663 <ErrorText>{result.error}</ErrorText>
664 ))}
665 </Form>
666 );
667}

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