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.
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 1 | import { Mail, ShieldCheck } from "lucide-react"; |
| 2 | import { Form } from "react-router"; | |
| 3 | ||
| 4 | import { type AccountEmails, type SecurityEvent, securityEventLabel } from "@g1t/contracts"; | |
| 5 | ||
| 6 | import { addressActions, backupChoices } from "../lib/emails"; | |
| 7 | import type { EmailActionData } from "../lib/emails.server"; | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 8 | import { ErrorText, Field, Input, Pill, SubmitButton, TimeAgo } from "./ui"; |
| Chat controls, public profiles, shadcn selects, and no Docs tab in a project | 9 | import { SelectField } from "./ui/select"; |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 10 | import { SwitchCard } from "./ui/switch"; |
| 11 | ||
| 12 | /** One small form posting one intent about one address. */ | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 13 | function AddressButton({ intent, email, label, pending }: { intent: string; email: string; label: string; pending: string }) { |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 14 | return ( |
| 15 | <Form method="post"> | |
| 16 | <input type="hidden" name="intent" value={intent} /> | |
| 17 | <input type="hidden" name="email" value={email} /> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 18 | <SubmitButton variant="quiet" pending={pending} match={{ intent, email }}> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 19 | {label} |
| Merge branch 'worktree-agent-a985c01f43538af01' | 20 | </SubmitButton> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 21 | </Form> |
| 22 | ); | |
| 23 | } | |
| 24 | ||
| 25 | /** What a waiting change does, for the line that asks for the password. */ | |
| 26 | function describe(intent: string): string { | |
| 27 | switch (intent) { | |
| 28 | case "add-email": | |
| 29 | return "adding"; | |
| 30 | case "remove-email": | |
| 31 | return "removing"; | |
| 32 | case "primary-email": | |
| 33 | return "making primary"; | |
| 34 | default: | |
| 35 | return "for"; | |
| 36 | } | |
| 37 | } | |
| 38 | ||
| 39 | /** Asks for the password before a sensitive change goes through. */ | |
| Merge main (membership, two-factor, GitHub repo roles) into tokens | 40 | export function ConfirmItIsYou({ pending, hasPassword }: { pending: NonNullable<EmailActionData>["reauth"]; hasPassword: boolean }) { |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 41 | if (!pending) return null; |
| 42 | return ( | |
| 43 | <div role="alert" className="rounded-xl border border-accent/40 bg-surface p-4"> | |
| 44 | <p className="flex items-center gap-2 text-sm font-medium"> | |
| 45 | <ShieldCheck size={16} className="text-accent" /> Confirm it is you | |
| 46 | </p> | |
| 47 | {hasPassword ? ( | |
| 48 | <Form method="post" className="mt-3 space-y-3"> | |
| 49 | <p className="text-sm text-muted"> | |
| 50 | {pending.message} | |
| 51 | {pending.fields.email ? ( | |
| 52 | <> | |
| 53 | {" "} | |
| 54 | ({describe(pending.intent)} <span className="text-fg">{pending.fields.email}</span>) | |
| 55 | </> | |
| 56 | ) : null} | |
| 57 | </p> | |
| 58 | <input type="hidden" name="intent" value={pending.intent} /> | |
| 59 | {Object.entries(pending.fields).map(([name, value]) => ( | |
| 60 | <input key={name} type="hidden" name={name} value={value} /> | |
| 61 | ))} | |
| 62 | <div className="flex flex-col gap-3 sm:flex-row sm:items-end"> | |
| 63 | <div className="grow"> | |
| 64 | <Field label="Password"> | |
| 65 | <Input name="password" type="password" autoComplete="current-password" required autoFocus /> | |
| 66 | </Field> | |
| 67 | </div> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 68 | <SubmitButton pending="Confirming…" match={{ intent: pending.intent }}> |
| 69 | Confirm | |
| 70 | </SubmitButton> | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 71 | </div> |
| 72 | <p className="text-xs text-faint">You will not be asked again for 10 minutes.</p> | |
| 73 | </Form> | |
| 74 | ) : ( | |
| 75 | <p className="mt-2 text-sm text-muted"> | |
| 76 | Your account signs in with GitHub only. Sign out, sign in with GitHub again, and make this change within 10 | |
| 77 | minutes. Or set a password with Forgot your password on the sign-in page. | |
| 78 | </p> | |
| 79 | )} | |
| 80 | </div> | |
| 81 | ); | |
| 82 | } | |
| 83 | ||
| Merge branch 'worktree-agent-a985c01f43538af01' | 84 | /** The answer to one form's post, under that form: what went wrong, or that it worked. */ |
| 85 | function Answer({ actionData }: { actionData: EmailActionData | undefined }) { | |
| 86 | return ( | |
| 87 | <> | |
| 88 | <ErrorText>{actionData?.emailError}</ErrorText> | |
| 89 | {actionData?.emailNotice && ( | |
| 90 | <p role="status" className="mt-2 text-sm text-muted"> | |
| 91 | {actionData.emailNotice} | |
| 92 | </p> | |
| 93 | )} | |
| 94 | </> | |
| 95 | ); | |
| 96 | } | |
| 97 | ||
| 98 | /** | |
| 99 | * A person's email addresses, in their account settings. `intent` is the | |
| 100 | * form that last posted, so its answer shows beside it. | |
| 101 | */ | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 102 | export function EmailsSection({ |
| 103 | data, | |
| 104 | actionData, | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 105 | intent, |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 106 | hasPassword, |
| 107 | }: { | |
| 108 | data: AccountEmails | null; | |
| 109 | actionData: EmailActionData | undefined; | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 110 | intent?: string; |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 111 | hasPassword: boolean; |
| 112 | }) { | |
| 113 | if (!data) return null; | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 114 | const answerFor = (one: string) => (intent === one ? actionData : undefined); |
| 115 | const elsewhere = intent === "backup-email" || intent === "email-privacy"; | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 116 | const backups = backupChoices(data.emails); |
| 117 | const backup = data.emails.find((email) => email.backup); | |
| 118 | const full = data.emails.length >= data.limit; | |
| 119 | return ( | |
| 120 | <section id="emails" className="scroll-mt-20"> | |
| 121 | {actionData?.reauth && ( | |
| status.g1t.sh with incident management, invites that land you in the workspace, settings as pages, usage without quotas | 122 | <div className="mb-4"> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 123 | <ConfirmItIsYou pending={actionData.reauth} hasPassword={hasPassword} /> |
| 124 | </div> | |
| 125 | )} | |
| 126 | ||
| status.g1t.sh with incident management, invites that land you in the workspace, settings as pages, usage without quotas | 127 | <ul className="divide-y divide-line rounded-md border border-line"> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 128 | {data.emails.map((email) => { |
| 129 | const can = addressActions(email, data.emails); | |
| 130 | return ( | |
| 131 | <li key={email.email} className="flex flex-col gap-3 px-4 py-3 sm:flex-row sm:items-center"> | |
| 132 | <div className="flex min-w-0 grow items-start gap-3"> | |
| 133 | <Mail size={16} className="mt-0.5 shrink-0 text-faint" /> | |
| 134 | <div className="min-w-0"> | |
| 135 | <p className="truncate text-sm">{email.email}</p> | |
| 136 | <p className="mt-1 flex flex-wrap items-center gap-1.5 text-xs text-faint"> | |
| 137 | {email.primary && <Pill>Primary</Pill>} | |
| 138 | {email.backup && <Pill>Backup</Pill>} | |
| 139 | {email.verified ? ( | |
| 140 | <span> | |
| 141 | Confirmed {email.verifiedAt ? <TimeAgo at={email.verifiedAt} /> : null} | |
| 142 | </span> | |
| 143 | ) : ( | |
| 144 | <span className="text-warn">Unconfirmed: check your inbox for the link</span> | |
| 145 | )} | |
| 146 | </p> | |
| 147 | </div> | |
| 148 | </div> | |
| 149 | <div className="flex shrink-0 flex-wrap gap-2 sm:justify-end"> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 150 | {can.resend && <AddressButton intent="resend-email" email={email.email} label="Resend link" pending="Sending…" />} |
| 151 | {can.makePrimary && <AddressButton intent="primary-email" email={email.email} label="Make primary" pending="Saving…" />} | |
| 152 | {can.remove && <AddressButton intent="remove-email" email={email.email} label="Remove" pending="Removing…" />} | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 153 | </div> |
| 154 | </li> | |
| 155 | ); | |
| 156 | })} | |
| 157 | </ul> | |
| 158 | ||
| Merge branch 'worktree-agent-a985c01f43538af01' | 159 | {/* Keyed on the list, so an address once added leaves the field empty. */} |
| 160 | <Form key={data.emails.length} method="post" className="mt-4"> | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 161 | <input type="hidden" name="intent" value="add-email" /> |
| 162 | <div className="flex flex-col gap-3 sm:flex-row sm:items-end"> | |
| 163 | <div className="grow"> | |
| 164 | <Field label="Add an email address"> | |
| 165 | <Input name="email" type="email" autoComplete="email" placeholder="you@example.com" required disabled={full} /> | |
| 166 | </Field> | |
| 167 | </div> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 168 | <SubmitButton pending="Adding…" match={{ intent: "add-email" }} disabled={full}> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 169 | Add |
| Merge branch 'worktree-agent-a985c01f43538af01' | 170 | </SubmitButton> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 171 | </div> |
| 172 | <p className="mt-1.5 text-xs text-faint"> | |
| 173 | {full ? `You have ${data.limit} addresses, the most an account can have.` : "g1t sends it a link to confirm it."} | |
| 174 | </p> | |
| 175 | </Form> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 176 | <Answer actionData={elsewhere ? undefined : actionData} /> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 177 | |
| 178 | <div className="mt-8"> | |
| status.g1t.sh with incident management, invites that land you in the workspace, settings as pages, usage without quotas | 179 | <h2 className="font-medium">Backup address</h2> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 180 | <p className="mt-1 text-sm text-muted"> |
| 181 | Security notices, such as a new address or a changed password, go to your primary and to this address. | |
| 182 | </p> | |
| 183 | <Form method="post" className="mt-3 flex flex-col gap-3 sm:flex-row sm:items-end"> | |
| 184 | <input type="hidden" name="intent" value="backup-email" /> | |
| Chat controls, public profiles, shadcn selects, and no Docs tab in a project | 185 | <div className="block grow"> |
| 186 | <SelectField | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 187 | name="backup" |
| Chat controls, public profiles, shadcn selects, and no Docs tab in a project | 188 | aria-label="Backup address" |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 189 | defaultValue={backup?.email ?? ""} |
| 190 | disabled={backups.length === 0} | |
| Chat controls, public profiles, shadcn selects, and no Docs tab in a project | 191 | className="h-auto py-2" |
| 192 | options={[{ value: "", label: "Primary address only" }, ...backups.map((email) => ({ value: email.email, label: email.email }))]} | |
| 193 | /> | |
| 194 | </div> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 195 | <SubmitButton variant="quiet" pending="Saving…" match={{ intent: "backup-email" }} disabled={backups.length === 0}> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 196 | Save |
| Merge branch 'worktree-agent-a985c01f43538af01' | 197 | </SubmitButton> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 198 | </Form> |
| Merge branch 'worktree-agent-a985c01f43538af01' | 199 | <Answer actionData={answerFor("backup-email")} /> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 200 | {backups.length === 0 && ( |
| 201 | <p className="mt-2 text-xs text-faint">Add and confirm a second address to choose a backup.</p> | |
| 202 | )} | |
| 203 | </div> | |
| 204 | ||
| 205 | <div className="mt-8"> | |
| status.g1t.sh with incident management, invites that land you in the workspace, settings as pages, usage without quotas | 206 | <h2 className="font-medium">Privacy</h2> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 207 | <Form method="post" className="mt-3 space-y-3"> |
| 208 | <input type="hidden" name="intent" value="email-privacy" /> | |
| 209 | <SwitchCard name="private" defaultChecked={data.privateEmail} title="Keep my email address private"> | |
| 210 | Merges and other commits g1t makes for you on the web, or an agent makes for you, use{" "} | |
| 211 | <span className="font-mono text-fg [overflow-wrap:anywhere]">{data.noreply}</span> instead of your primary address. | |
| 212 | </SwitchCard> | |
| 213 | <SwitchCard name="block" defaultChecked={data.blockPrivatePushes} title="Block pushes that expose my email"> | |
| 214 | While your address is private, a push is refused if a commit in it has one of your confirmed | |
| 215 | addresses as its author or committer. Commit with your noreply address instead. | |
| 216 | </SwitchCard> | |
| 217 | <div className="flex flex-wrap items-center justify-between gap-3"> | |
| 218 | <p className="text-xs text-faint"> | |
| 219 | Commits g1t makes for you now carry <span className="font-mono [overflow-wrap:anywhere]">{data.commitEmail}</span>. | |
| 220 | </p> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 221 | <SubmitButton variant="quiet" pending="Saving…" match={{ intent: "email-privacy" }}> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 222 | Save |
| Merge branch 'worktree-agent-a985c01f43538af01' | 223 | </SubmitButton> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 224 | </div> |
| 225 | </Form> | |
| Merge branch 'worktree-agent-a985c01f43538af01' | 226 | <Answer actionData={answerFor("email-privacy")} /> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 227 | </div> |
| 228 | </section> | |
| 229 | ); | |
| 230 | } | |
| 231 | ||
| 232 | /** What happened to the account's security, newest first. */ | |
| 233 | export function SecurityLogSection({ log }: { log: SecurityEvent[] }) { | |
| 234 | return ( | |
| 235 | <section id="security-log" className="scroll-mt-20"> | |
| 236 | {log.length === 0 ? ( | |
| status.g1t.sh with incident management, invites that land you in the workspace, settings as pages, usage without quotas | 237 | <p className="text-sm text-faint">Nothing yet.</p> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 238 | ) : ( |
| status.g1t.sh with incident management, invites that land you in the workspace, settings as pages, usage without quotas | 239 | <ul className="divide-y divide-line rounded-md border border-line"> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 240 | {log.map((event, at) => ( |
| 241 | <li key={`${event.createdAt}:${at}`} className="flex flex-col gap-1 px-4 py-3 sm:flex-row sm:items-center sm:gap-4"> | |
| 242 | <p className="min-w-0 grow truncate text-sm"> | |
| 243 | {securityEventLabel(event)} | |
| 244 | {event.byStaff && <span className="text-muted"> · by g1t staff{event.reason ? `: ${event.reason}` : ""}</span>} | |
| 245 | </p> | |
| 246 | <p className="shrink-0 text-xs text-faint"> | |
| 247 | <TimeAgo at={event.createdAt} /> | |
| 248 | </p> | |
| 249 | </li> | |
| 250 | ))} | |
| 251 | </ul> | |
| 252 | )} | |
| 253 | </section> | |
| 254 | ); | |
| 255 | } |
This file's history is long; its oldest lines are credited to the oldest commit read.