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 { ArrowRight, ChevronDown, CreditCard } from "lucide-react"; |
| 2 | import { useState } from "react"; | |
| 3 | import { Link } from "react-router"; | |
| 4 | ||
| 5 | import { ButtonLink } from "./ui"; | |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 6 | import { Button } from "./ui/button"; |
| 7 | import { Card } from "./ui/card"; | |
| Money is written one way. A single formatter turns millionths of a dollar into dollars, rounding half up on whole micros rather than on a float, so the same sum reads the same on every page: under a cent reads <$0.01 on a total and exactly nothing is $0.00, while the statement's lines, a session's receipt, the price book and an agent's effort costs carry up to four places where the fraction of a cent is the point; the six formatters that each rounded their own way are gone. This month is the calendar month in UTC from its first day to today everywhere, and billing counts the month's not-yet-closed usage in any range that reaches into the current month, so the top bar's pill, Spend, Home and Usage ask for the same days and get the same figure; Home now reads the usage report the others read instead of adding up statements. Usage's pending sentence says what of that usage the close will charge after the discount and included usage, which the billing API returns as pending_charged_micros. A reconciliation test holds the pill, Spend, Home and Usage to one number for one month. The usage and billing guide says how amounts are written and what this month means. | 8 | import { type UsageGlance, share, usageTask } from "../lib/billing"; |
| 9 | import { money, wholeDollars } from "../lib/money"; | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 10 | |
| 11 | /** Line items shown before Show more. */ | |
| 12 | const FIRST_LINES = 3; | |
| 13 | ||
| 14 | /** What the card says the workspace is on, beside its spend. */ | |
| 15 | const STANDING: Record<UsageGlance["kind"], string> = { | |
| 16 | beta: "Free for now", | |
| Billing: credits with a kind and expiry, discounts instead of comped, and safer charging | 17 | comped: "100% discount", |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 18 | plan: "g1t plan", |
| 19 | trial: "Trial", | |
| 20 | forge: "Free", | |
| 21 | }; | |
| 22 | ||
| 23 | /** | |
| 24 | * A thin meter of `used` against `of`. The trial warns near its end; the | |
| 25 | * plan's included usage running out is ordinary, as on-demand takes over. | |
| 26 | */ | |
| 27 | function Bar({ used, of, warns }: { used: number; of: number; warns: boolean }) { | |
| 28 | const part = share(used, of); | |
| Merge branch 'worktree-agent-ad7c6d88d93adc817' | 29 | const tone = !warns ? "bg-success" : part >= 1 ? "bg-danger" : part >= 0.75 ? "bg-warn" : "bg-success"; |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 30 | return ( |
| 31 | <span className="mt-1.5 block h-1 overflow-hidden rounded-full bg-line" role="presentation"> | |
| 32 | <span className={`block h-full rounded-full ${tone}`} style={{ width: `${Math.max(part * 100, part > 0 ? 2 : 0)}%` }} /> | |
| 33 | </span> | |
| 34 | ); | |
| 35 | } | |
| 36 | ||
| 37 | /** | |
| 38 | * The workspace's month on its overview: what it has spent, what pays | |
| 39 | * first and how much of it is left, what was charged past that, and what | |
| 40 | * it went on, with the way to Billing. | |
| 41 | */ | |
| 42 | export function UsageCard({ slug, glance, owner }: { slug: string; glance: UsageGlance; owner: boolean }) { | |
| 43 | const [all, setAll] = useState(false); | |
| 44 | const lines = all ? glance.lines : glance.lines.slice(0, FIRST_LINES); | |
| 45 | const more = glance.lines.length - FIRST_LINES; | |
| 46 | return ( | |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 47 | <Card asChild> |
| 48 | <section aria-labelledby="usage-card"> | |
| 49 | <div className="p-5 pb-4"> | |
| 50 | <div className="flex items-baseline justify-between gap-3"> | |
| 51 | <h2 id="usage-card" className="font-medium"> | |
| 52 | <Link to={`/${slug}/-/usage`} className="hover:underline"> | |
| 53 | Usage | |
| 54 | </Link> | |
| 55 | </h2> | |
| 56 | <span className="text-xs text-faint">This month</span> | |
| 57 | </div> | |
| 58 | <p className="mt-3 flex items-baseline justify-between gap-3"> | |
| Money is written one way. A single formatter turns millionths of a dollar into dollars, rounding half up on whole micros rather than on a float, so the same sum reads the same on every page: under a cent reads <$0.01 on a total and exactly nothing is $0.00, while the statement's lines, a session's receipt, the price book and an agent's effort costs carry up to four places where the fraction of a cent is the point; the six formatters that each rounded their own way are gone. This month is the calendar month in UTC from its first day to today everywhere, and billing counts the month's not-yet-closed usage in any range that reaches into the current month, so the top bar's pill, Spend, Home and Usage ask for the same days and get the same figure; Home now reads the usage report the others read instead of adding up statements. Usage's pending sentence says what of that usage the close will charge after the discount and included usage, which the billing API returns as pending_charged_micros. A reconciliation test holds the pill, Spend, Home and Usage to one number for one month. The usage and billing guide says how amounts are written and what this month means. | 59 | <span className="text-2xl font-semibold tracking-tight tabular-nums">{money(glance.spentMicros)}</span> |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 60 | <span |
| 61 | className={`rounded-full px-2 py-0.5 text-xs ${ | |
| 62 | glance.kind === "forge" ? "border border-line text-muted" : "bg-accent/15 text-accent" | |
| 63 | }`} | |
| 64 | > | |
| 65 | {STANDING[glance.kind]} | |
| 66 | </span> | |
| 67 | </p> | |
| 68 | <p className="mt-1 text-xs text-faint"> | |
| 69 | {glance.kind === "beta" | |
| 70 | ? "At cost. Nothing is charged while g1t is being built out." | |
| 71 | : glance.kind === "comped" | |
| 72 | ? "At price, with a 100% discount: nothing is charged to this workspace." | |
| 73 | : glance.kind === "forge" | |
| 74 | ? "The forge is free. Agents, workflows and deployments need the plan or the trial." | |
| 75 | : "Charged so far, from the 1st."} | |
| 76 | </p> | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 77 | |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 78 | {glance.credit && ( |
| 79 | <div className="mt-4 text-sm"> | |
| 80 | <div className="flex justify-between gap-3"> | |
| 81 | <span className="text-muted">{glance.credit.label}</span> | |
| 82 | <span className="tabular-nums"> | |
| Money is written one way. A single formatter turns millionths of a dollar into dollars, rounding half up on whole micros rather than on a float, so the same sum reads the same on every page: under a cent reads <$0.01 on a total and exactly nothing is $0.00, while the statement's lines, a session's receipt, the price book and an agent's effort costs carry up to four places where the fraction of a cent is the point; the six formatters that each rounded their own way are gone. This month is the calendar month in UTC from its first day to today everywhere, and billing counts the month's not-yet-closed usage in any range that reaches into the current month, so the top bar's pill, Spend, Home and Usage ask for the same days and get the same figure; Home now reads the usage report the others read instead of adding up statements. Usage's pending sentence says what of that usage the close will charge after the discount and included usage, which the billing API returns as pending_charged_micros. A reconciliation test holds the pill, Spend, Home and Usage to one number for one month. The usage and billing guide says how amounts are written and what this month means. | 83 | {money(glance.credit.usedMicros)} |
| 84 | <span className="text-faint"> / {money(glance.credit.ofMicros)}</span> | |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 85 | </span> |
| 86 | </div> | |
| 87 | <Bar used={glance.credit.usedMicros} of={glance.credit.ofMicros} warns={glance.kind === "trial"} /> | |
| 88 | </div> | |
| 89 | )} | |
| 90 | {glance.onDemand && ( | |
| 91 | <div className="mt-3 flex justify-between gap-3 text-sm"> | |
| 92 | <span className="text-muted">On-demand charges</span> | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 93 | <span className="tabular-nums"> |
| Money is written one way. A single formatter turns millionths of a dollar into dollars, rounding half up on whole micros rather than on a float, so the same sum reads the same on every page: under a cent reads <$0.01 on a total and exactly nothing is $0.00, while the statement's lines, a session's receipt, the price book and an agent's effort costs carry up to four places where the fraction of a cent is the point; the six formatters that each rounded their own way are gone. This month is the calendar month in UTC from its first day to today everywhere, and billing counts the month's not-yet-closed usage in any range that reaches into the current month, so the top bar's pill, Spend, Home and Usage ask for the same days and get the same figure; Home now reads the usage report the others read instead of adding up statements. Usage's pending sentence says what of that usage the close will charge after the discount and included usage, which the billing API returns as pending_charged_micros. A reconciliation test holds the pill, Spend, Home and Usage to one number for one month. The usage and billing guide says how amounts are written and what this month means. | 94 | {money(glance.onDemand.micros)} |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 95 | {glance.onDemand.limitMicros != null && ( |
| Money is written one way. A single formatter turns millionths of a dollar into dollars, rounding half up on whole micros rather than on a float, so the same sum reads the same on every page: under a cent reads <$0.01 on a total and exactly nothing is $0.00, while the statement's lines, a session's receipt, the price book and an agent's effort costs carry up to four places where the fraction of a cent is the point; the six formatters that each rounded their own way are gone. This month is the calendar month in UTC from its first day to today everywhere, and billing counts the month's not-yet-closed usage in any range that reaches into the current month, so the top bar's pill, Spend, Home and Usage ask for the same days and get the same figure; Home now reads the usage report the others read instead of adding up statements. Usage's pending sentence says what of that usage the close will charge after the discount and included usage, which the billing API returns as pending_charged_micros. A reconciliation test holds the pill, Spend, Home and Usage to one number for one month. The usage and billing guide says how amounts are written and what this month means. | 96 | <span className="text-faint"> / {wholeDollars(glance.onDemand.limitMicros)}</span> |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 97 | )} |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 98 | </span> |
| 99 | </div> | |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 100 | )} |
| 101 | </div> | |
| 102 | ||
| 103 | {glance.lines.length > 0 && ( | |
| 104 | <div className="border-t border-line px-5 py-3"> | |
| 105 | <ul className="space-y-2 text-sm"> | |
| 106 | {lines.map((line) => ( | |
| 107 | <li key={line.key} className="flex items-center gap-2"> | |
| 108 | <span className="size-2 shrink-0 rounded-sm" style={{ background: usageTask(line.key).color }} /> | |
| 109 | <span className="min-w-0 grow truncate text-muted">{line.label}</span> | |
| Money is written one way. A single formatter turns millionths of a dollar into dollars, rounding half up on whole micros rather than on a float, so the same sum reads the same on every page: under a cent reads <$0.01 on a total and exactly nothing is $0.00, while the statement's lines, a session's receipt, the price book and an agent's effort costs carry up to four places where the fraction of a cent is the point; the six formatters that each rounded their own way are gone. This month is the calendar month in UTC from its first day to today everywhere, and billing counts the month's not-yet-closed usage in any range that reaches into the current month, so the top bar's pill, Spend, Home and Usage ask for the same days and get the same figure; Home now reads the usage report the others read instead of adding up statements. Usage's pending sentence says what of that usage the close will charge after the discount and included usage, which the billing API returns as pending_charged_micros. A reconciliation test holds the pill, Spend, Home and Usage to one number for one month. The usage and billing guide says how amounts are written and what this month means. | 110 | <span className="shrink-0 font-mono text-xs tabular-nums">{money(line.micros)}</span> |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 111 | </li> |
| 112 | ))} | |
| 113 | </ul> | |
| 114 | {more > 0 && ( | |
| 115 | <Button | |
| 116 | type="button" | |
| 117 | onClick={() => setAll((open) => !open)} | |
| 118 | aria-expanded={all} | |
| 119 | variant="link" | |
| 120 | size="inline" | |
| 121 | className="mt-2 gap-1 text-xs text-muted hover:text-fg font-normal" | |
| 122 | > | |
| 123 | <ChevronDown size={13} className={`transition-transform ${all ? "rotate-180" : ""}`} /> | |
| 124 | {all ? "Show less" : `Show ${more} more`} | |
| 125 | </Button> | |
| 126 | )} | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 127 | </div> |
| 128 | )} | |
| 129 | ||
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 130 | <div className="flex flex-wrap items-center justify-between gap-2 border-t border-line px-5 py-3"> |
| 131 | <Link to={`/${slug}/-/usage`} className="inline-flex items-center gap-1 text-xs text-muted hover:text-fg"> | |
| 132 | Usage, run by run <ArrowRight size={12} /> | |
| 133 | </Link> | |
| 134 | {glance.kind === "forge" || glance.kind === "trial" ? ( | |
| 135 | owner ? ( | |
| 136 | <ButtonLink to={`/${slug}/-/billing#plan`} variant="accent"> | |
| 137 | Start the plan | |
| 138 | </ButtonLink> | |
| 139 | ) : ( | |
| 140 | <ButtonLink to={`/${slug}/-/billing`} variant="outline"> | |
| 141 | <CreditCard size={14} /> | |
| 142 | Billing | |
| 143 | </ButtonLink> | |
| 144 | ) | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 145 | ) : ( |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 146 | <ButtonLink to={`/${slug}/-/billing`} variant="outline"> |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 147 | <CreditCard size={14} /> |
| 148 | Billing | |
| 149 | </ButtonLink> | |
| The site is built from its shared components: one Button with its variants and sizes, one Badge, Card for every panel, Alert for notices, Kbd for keys, Table for the security tables, and Avatar, Command, Progress, ScrollArea, ToggleGroup, Collapsible and Accordion in the kit; raw buttons, hand-drawn cards and pills and per-file button class lists are gone, outline buttons stand the same height as filled ones, and the phone's Ask g1t loses its tile. Every page was compared pixel by pixel before and after. | 150 | )} |
| 151 | </div> | |
| 152 | </section> | |
| 153 | </Card> | |
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 154 | ); |
| 155 | } |
This file's history is long; its oldest lines are credited to the oldest commit read.