| 1 | import { ArrowUpRight } from "lucide-react"; |
| 2 | |
| 3 | import { type FeaturePlan, type FreeTier, MICROS_PER_DOLLAR, type Price } from "@g1t/contracts"; |
| 4 | |
| 5 | import type { Route } from "./+types/pricing"; |
| 6 | import { wholeDollars } from "../lib/billing"; |
| 7 | import { page } from "../lib/meta"; |
| 8 | import { application, faqPage } from "../lib/structured-data"; |
| 9 | import { TimeAgo } from "../components/ui"; |
| 10 | import { billing } from "../lib/services.server"; |
| 11 | |
| 12 | export function meta(args: Route.MetaArgs) { |
| 13 | const plan = args.loaderData?.book?.plans?.find((p) => p.feature === "plan") ?? DEFAULT_PLAN; |
| 14 | return [ |
| 15 | ...page(args, { |
| 16 | title: `g1t pricing - $${plan.monthlyCents / 100} per workspace, never per seat, models at cost`, |
| 17 | description: |
| 18 | "People chat free on every plan, and the forge is free. One plan, $20 a month per workspace with $10 of usage included. Models at the provider's price, plus a flat agent rate for what g1t runs around every model call; everything else g1t runs at cost plus 20%. Your own runners are free. No seats, ever.", |
| 19 | }), |
| 20 | application(plan.monthlyCents / 100), |
| 21 | faqPage(FAQ), |
| 22 | ]; |
| 23 | } |
| 24 | |
| 25 | export async function loader() { |
| 26 | const [book, status] = await Promise.all([billing.prices().catch(() => null), billing.status().catch(() => null)]); |
| 27 | return { book, free: status?.free ?? false }; |
| 28 | } |
| 29 | |
| 30 | /** A price in dollars, with as many digits as it needs to say anything. */ |
| 31 | function money(micros: number): string { |
| 32 | const dollars = micros / MICROS_PER_DOLLAR; |
| 33 | if (dollars >= 1) return `$${dollars.toFixed(2)}`; |
| 34 | // Three places for a fraction of a cent ($0.024), two when the third is 0 ($0.25). |
| 35 | if (dollars >= 0.01) return `$${dollars.toFixed(3).replace(/(\.\d\d)0$/, "$1")}`; |
| 36 | return `$${dollars.toPrecision(2)}`; |
| 37 | } |
| 38 | |
| 39 | /** Per second is easier to read per minute. */ |
| 40 | function perUnit(price: Price, micros: number): string { |
| 41 | return price.unit === "second" ? `${money(micros * 60)} a minute` : `${money(micros)} per ${price.unit}`; |
| 42 | } |
| 43 | |
| 44 | function gigabytes(bytes: number): string { |
| 45 | return `${Math.round((bytes / 1e9) * 10) / 10} GB`; |
| 46 | } |
| 47 | |
| 48 | function count(n: number): string { |
| 49 | return n.toLocaleString("en-US"); |
| 50 | } |
| 51 | |
| 52 | /** Price-book rows the table shows in rows of their own, or not at all. */ |
| 53 | const SHOWN_APART = new Set([ |
| 54 | "app_month", |
| 55 | "agent_models", |
| 56 | "agent_tokens", |
| 57 | "agent_tokens_own", |
| 58 | "agent_token_weight_input", |
| 59 | "agent_token_weight_output", |
| 60 | "agent_token_weight_cache_read", |
| 61 | "agent_token_weight_cache_write", |
| 62 | "gateway_models", |
| 63 | "card_fee_percent", |
| 64 | "card_fee_fixed", |
| 65 | "security_activation", |
| 66 | ]); |
| 67 | |
| 68 | /** How each kind of token counts toward the agent rate, from the price book: `input ×1, …`. */ |
| 69 | function tokenWeights(prices: { meter: string; costMicros: number }[]): string { |
| 70 | const weight = (kind: string) => { |
| 71 | const row = prices.find((p) => p.meter === `agent_token_weight_${kind}`); |
| 72 | return row ? Number((row.costMicros / 1_000_000).toFixed(3)) : 1; |
| 73 | }; |
| 74 | return `input ×${weight("input")}, output ×${weight("output")}, cache reads ×${weight("cache_read")}, cache writes ×${weight("cache_write")}`; |
| 75 | } |
| 76 | |
| 77 | /** What the page says when billing cannot be reached: the published defaults. */ |
| 78 | const DEFAULT_FREE: Required<FreeTier> = { |
| 79 | trialWorkspaceMicros: 5_000_000, |
| 80 | trialMonthlyPoolMicros: 100_000_000, |
| 81 | ossPoolMicros: 25_000_000, |
| 82 | ossRepoMicros: 2_000_000, |
| 83 | freePrivateStorageBytes: 1_000_000_000, |
| 84 | auditRetentionDays: 7, |
| 85 | planAuditRetentionDays: 90, |
| 86 | minChargeMicros: 5_000_000, |
| 87 | gitOperationsIncluded: 50_000, |
| 88 | paidStartCeilingMicros: 100_000_000, |
| 89 | overageForgiveCostMicros: 50_000_000, |
| 90 | }; |
| 91 | |
| 92 | const DEFAULT_PLAN: FeaturePlan = { |
| 93 | feature: "plan", |
| 94 | title: "g1t", |
| 95 | monthlyCents: 2000, |
| 96 | includes: [ |
| 97 | "$10 of usage each month, used first: models at the provider's price with the g1t agent rate, everything else g1t runs at cost plus 20%", |
| 98 | "Everyone in the workspace at one price, never per person", |
| 99 | "Unlimited projects, previews and repositories", |
| 100 | "Agents, checks, workflows, the merge queue, deployments, semantic search, and Security and quality on private repositories", |
| 101 | "Usage past $10 is charged the same way, up to your spend limit", |
| 102 | ], |
| 103 | overage: |
| 104 | "Everything g1t runs is metered from the first unit at what it costs g1t plus 20%. Models are billed at the provider's price, with no markup, plus the g1t agent rate on their tokens, on your own model keys too. Your own runners cost nothing. Unused included usage does not roll over.", |
| 105 | }; |
| 106 | |
| 107 | /** How each part of a workspace is charged. */ |
| 108 | const WORKSPACE_CHARGES: { what: string; how: string; soon?: boolean }[] = [ |
| 109 | { |
| 110 | what: "People chatting", |
| 111 | how: "Included on every plan, the free one too: channels, direct messages, threads, mentions and live delivery. No seats, and history is never cut off.", |
| 112 | }, |
| 113 | { what: "Docs", how: "Included on every plan, like chat: pages, live editing and history.", soon: true }, |
| 114 | { |
| 115 | what: "An agent replying in chat", |
| 116 | how: "The model provider's price, with no markup, plus the g1t agent rate on the tokens it used. Paid from the plan's included usage, then AI credit, and counted against that agent's budget.", |
| 117 | }, |
| 118 | { |
| 119 | what: "An agent working on code", |
| 120 | how: "The same model price and agent rate, plus sandbox time at cost plus 20%. On your own runner, that time is free.", |
| 121 | }, |
| 122 | { |
| 123 | what: "An agent on your own provider", |
| 124 | how: "Your provider bills you for the model directly. g1t charges the agent rate, for passing its calls through g1t's model gateway with your key kept secret.", |
| 125 | }, |
| 126 | { |
| 127 | what: "How hard an agent works", |
| 128 | how: "Each agent has an effort setting, Auto, Low, Medium, High or Max, shown with what a typical task has cost at each level. Lower effort starts on a cheaper model, reasons less and takes fewer steps.", |
| 129 | }, |
| 130 | { |
| 131 | what: "Files in chat and Docs", |
| 132 | how: "The storage meter, at cost plus 20%, past what is free.", |
| 133 | soon: true, |
| 134 | }, |
| 135 | { what: "An idle agent", how: "Nothing. An agent costs money only while it is answering or working." }, |
| 136 | ]; |
| 137 | |
| 138 | const FAQ: { q: string; a: string }[] = [ |
| 139 | { |
| 140 | q: "Do people pay to use Chat?", |
| 141 | a: "No. Messages, channels, threads and live delivery are included on every plan, with no per-person price and no limit on history. A workspace on the plan can add as many people as it likes at the same price.", |
| 142 | }, |
| 143 | { |
| 144 | q: "Who pays for an agent's reply?", |
| 145 | a: "The workspace the agent belongs to. Each reply is charged as the model's price plus the agent rate, and counts against that agent's monthly budget, whoever asked it.", |
| 146 | }, |
| 147 | { |
| 148 | q: "What does an agent cost when nobody talks to it?", |
| 149 | a: "Nothing. Agents have no monthly fee. They are charged only for replies and work, so an agent you made and forgot costs nothing.", |
| 150 | }, |
| 151 | { |
| 152 | q: "How do I stop an agent from spending too much?", |
| 153 | a: "Give it a monthly budget and a cap per task. At its budget it stops taking new work and says so in the channel. The workspace's spend limit and the per-run caps still apply above it.", |
| 154 | }, |
| 155 | { |
| 156 | q: "How do I spend less without worse work?", |
| 157 | a: "Lower an agent's effort, or let Spend suggest it. Every week g1t checks each agent's finished sessions: when a cheaper effort level was accepted as often on the same agent's work, Spend shows the suggestion with the numbers and an Apply button. With too little history, it says so instead.", |
| 158 | }, |
| 159 | { |
| 160 | q: "Why is there an agent rate on my own model keys?", |
| 161 | a: "Your agents' calls still go through g1t: its model gateway keeps your key out of every sandbox, routes each call, adds the context and passes it to your provider. The agent rate pays for running that. Your provider bills the model itself.", |
| 162 | }, |
| 163 | { |
| 164 | q: "Can agents use our own model provider?", |
| 165 | a: "Yes. Connect a provider in Integrations and limit an agent to it. The provider bills you for the model; g1t charges the agent rate for your own model key only.", |
| 166 | }, |
| 167 | { |
| 168 | q: "Does adding the whole company cost more?", |
| 169 | a: "No. There are no seats. People who only chat, and ask agents questions, cost nothing until their questions use an agent; then the agent's reply is charged like any other.", |
| 170 | }, |
| 171 | { |
| 172 | q: "What does moving from GitHub cost, and can we leave again?", |
| 173 | a: "Moving in is an import: bring repositories across from GitHub with every branch, tag and their issues, or keep a mirror that follows GitHub while you try g1t. Your code is plain git and g1t is MIT licensed, so leaving is a git clone, and the core forge runs on your own machine with Docker Compose.", |
| 174 | }, |
| 175 | { |
| 176 | q: "Is Docs included?", |
| 177 | a: "Docs is coming soon. When it ships, pages, editing and history are included on every plan, like chat. Files are on the storage meter.", |
| 178 | }, |
| 179 | ]; |
| 180 | |
| 181 | /** The ways to reach g1t about an enterprise account. */ |
| 182 | const ENTERPRISE_MAIL = "mailto:hey@flagon.io?subject=Enterprise%20billing%20for%20g1t"; |
| 183 | |
| 184 | const HOW = [ |
| 185 | { |
| 186 | title: "Our cost, passed through", |
| 187 | body: "Every sandbox second, build and app request costs g1t money at Cloudflare. Each is metered and charged at that cost plus 20%, from the first second and the first request. Models are charged at the provider's price with no markup, plus a flat agent rate per million tokens for what g1t runs around every model call, from prepaid AI credit. Use a little, pay a little.", |
| 188 | }, |
| 189 | { |
| 190 | title: "Prices follow costs, by themselves", |
| 191 | body: "Model runs are charged at what Cloudflare's AI Gateway priced each request at, so a provider's price change reaches you the same day. Every day, sandbox, build and app costs are checked against what Cloudflare billed g1t; when one moves, its price moves with it, and the change is listed below. The rest are Cloudflare's published prices, marked as such.", |
| 192 | }, |
| 193 | { |
| 194 | title: "The 20% is the overhead", |
| 195 | body: "It pays for running g1t and for building and keeping up the features you use. The same 20% on everything but models, whose overhead is the agent rate, and nothing bundled in.", |
| 196 | }, |
| 197 | { |
| 198 | title: "Your own runners are free", |
| 199 | body: "Agents, checks and workflows on your own hardware cost nothing here. On your own model keys, your provider bills the model and g1t charges only the agent rate.", |
| 200 | }, |
| 201 | { |
| 202 | title: "No seats, ever", |
| 203 | body: "Once a workspace is on the plan, add as many people and agents as you like. It pays one flat price for the plan, and for what it uses past what the plan includes.", |
| 204 | }, |
| 205 | { |
| 206 | title: "Prices exclude tax", |
| 207 | body: "Every price here is before tax. Stripe adds sales tax, VAT or GST where it applies, worked out from the billing address, and shows it as its own line before you pay and on every receipt and invoice. A valid business tax ID is applied where the law says so.", |
| 208 | }, |
| 209 | { |
| 210 | title: "Card fees are passed on, nothing more", |
| 211 | body: "Paying by card adds Stripe's card processing fee as its own line, shown before you pay, so the 20% is never spent on fees. A bank transfer or invoiced billing has no card fee.", |
| 212 | }, |
| 213 | ]; |
| 214 | |
| 215 | /** One row of the free-and-plan table. */ |
| 216 | type Row = { what: string; free: string; plan: string; note?: string }; |
| 217 | |
| 218 | function rows(tier: Required<FreeTier>): Row[] { |
| 219 | return [ |
| 220 | { |
| 221 | what: "Chat", |
| 222 | free: "Included, for the people already in the workspace", |
| 223 | plan: "Included, for unlimited members", |
| 224 | note: "Channels, direct messages, threads, mentions and live delivery. History is never cut off.", |
| 225 | }, |
| 226 | { |
| 227 | what: "Docs (coming soon)", |
| 228 | free: "Included", |
| 229 | plan: "Included", |
| 230 | note: "Pages, live editing and history, once Docs ships.", |
| 231 | }, |
| 232 | { |
| 233 | what: "Workspace agents", |
| 234 | free: "After a card check, from the trial", |
| 235 | plan: "From the plan's included usage, then AI credit, under each agent's budget", |
| 236 | note: "Replies and work are charged as model price plus the g1t agent rate. An idle agent costs nothing.", |
| 237 | }, |
| 238 | { |
| 239 | what: "The forge", |
| 240 | free: "Free", |
| 241 | plan: "Included", |
| 242 | note: "Public and private repositories, issues, pull requests, reviews, protected branches, code owners, search and Explore.", |
| 243 | }, |
| 244 | { |
| 245 | what: "Agents, checks, workflows, merge queue", |
| 246 | free: "After a card check: the trial, and the open-source pool for checks, workflows and the merge queue on public repositories", |
| 247 | plan: "From the plan's included usage, then at cost plus 20%", |
| 248 | }, |
| 249 | { |
| 250 | what: "Projects and previews", |
| 251 | free: "Not available: deployments run on g1t's machines", |
| 252 | plan: "Unlimited, and never charged for. An app no one visits costs nothing.", |
| 253 | }, |
| 254 | { |
| 255 | what: "Deployments", |
| 256 | free: "Not available", |
| 257 | plan: "Builds by the second, app requests, CPU time and custom domains, each from the first at cost plus 20%", |
| 258 | }, |
| 259 | { |
| 260 | what: "Semantic search", |
| 261 | free: "After a card check, from the trial", |
| 262 | plan: "From the plan's included usage, then at cost plus 20%", |
| 263 | }, |
| 264 | { |
| 265 | what: "Private storage", |
| 266 | free: `${gigabytes(tier.freePrivateStorageBytes)}, never charged. Past it, pushes to private repositories stop until you make room or start the plan.`, |
| 267 | plan: `${gigabytes(tier.freePrivateStorageBytes)} free, then at cost plus 20%. Pushes never stop.`, |
| 268 | note: "Public repositories are never charged for storage.", |
| 269 | }, |
| 270 | { |
| 271 | what: "Git operations", |
| 272 | free: `${count(tier.gitOperationsIncluded)} a month, never charged. Past it, slowed to 60 an hour until the month turns.`, |
| 273 | plan: `${count(tier.gitOperationsIncluded)} a month free, then at cost plus 20%. Never slowed.`, |
| 274 | note: "Clones, fetches and pushes through g1t.", |
| 275 | }, |
| 276 | { |
| 277 | what: "Actions cache", |
| 278 | free: "2 GiB an entry and 10 GiB a repository, never charged", |
| 279 | plan: "The same limits, with what it stores at cost plus 20%", |
| 280 | }, |
| 281 | { |
| 282 | what: "Audit log", |
| 283 | free: `${tier.auditRetentionDays} days, with export`, |
| 284 | plan: `${tier.planAuditRetentionDays} days, with export`, |
| 285 | note: "Longer by arrangement. Older entries are deleted each day.", |
| 286 | }, |
| 287 | { |
| 288 | what: "Secret scanning, push protection, vulnerability alerts, security updates", |
| 289 | free: "Included", |
| 290 | plan: "Included", |
| 291 | note: "Custom patterns, validity checks, code scanning, dependency review and the security overview on private repositories come with the plan, with no price of their own: their scans are charged at cost plus 20%. On public repositories they are free.", |
| 292 | }, |
| 293 | { what: "Single sign-on", free: "On every plan, once it is built", plan: "On every plan, once it is built" }, |
| 294 | { |
| 295 | what: "Members", |
| 296 | free: "Only the people already in it: a free workspace cannot add members, invite people or invite outside collaborators", |
| 297 | plan: "Unlimited, never per seat", |
| 298 | note: "Each person can own one free workspace. More workspaces need the plan.", |
| 299 | }, |
| 300 | { |
| 301 | what: "Usage past what is included", |
| 302 | free: "Not possible: a free workspace never runs up a bill", |
| 303 | plan: "Charged at cost plus 20%, up to a spend limit you set. No quotas: only your limit stops anything.", |
| 304 | }, |
| 305 | ]; |
| 306 | } |
| 307 | |
| 308 | export default function Pricing({ loaderData }: Route.ComponentProps) { |
| 309 | const { book, free } = loaderData; |
| 310 | const checked = book?.prices.map((p) => p.checkedAt).filter((at): at is string => !!at).sort().at(-1); |
| 311 | const given = Object.fromEntries(Object.entries(book?.free ?? {}).filter(([, value]) => value != null)); |
| 312 | const tier: Required<FreeTier> = { ...DEFAULT_FREE, ...given }; |
| 313 | const plan = book?.plans?.find((p) => p.feature === "plan") ?? DEFAULT_PLAN; |
| 314 | const price = plan.monthlyCents / 100; |
| 315 | const dollars = wholeDollars; |
| 316 | // What g1t's own metered work is marked up, from the price book: one figure today. |
| 317 | const runMarkups = (book?.prices ?? []) |
| 318 | .filter((p) => !SHOWN_APART.has(p.meter) && p.meter !== "security_activation" && p.costMicros > 0) |
| 319 | .map((p) => p.markupPercent); |
| 320 | const markup = runMarkups.length && Math.min(...runMarkups) === Math.max(...runMarkups) ? `${runMarkups[0]}%` : "20%"; |
| 321 | const modelMarkup = book?.modelMarginPercent ?? 0; |
| 322 | const agentRate = book?.prices.find((p) => p.meter === "agent_tokens"); |
| 323 | const agentRateComing = book?.changes.find((c) => c.meter === "agent_tokens" && c.effectiveAt); |
| 324 | const agentRateLine = |
| 325 | agentRate && agentRate.priceMicros > 0 |
| 326 | ? `${money(agentRate.priceMicros)} per million tokens` |
| 327 | : agentRateComing |
| 328 | ? `$0, and ${money(agentRateComing.newCostMicros)} per million tokens from ${agentRateComing.effectiveAt!.slice(0, 10)}` |
| 329 | : "as listed under Usage below"; |
| 330 | // The summary tile: the rate in force, or the one coming and its day ("from Oct 22"). |
| 331 | const comingDay = agentRateComing |
| 332 | ? new Date(agentRateComing.effectiveAt!).toLocaleDateString("en-US", { month: "short", day: "numeric", timeZone: "UTC" }) |
| 333 | : null; |
| 334 | const agentRateTile = |
| 335 | agentRate && agentRate.priceMicros > 0 |
| 336 | ? `${money(agentRate.priceMicros)} per million tokens` |
| 337 | : agentRateComing |
| 338 | ? `${money(agentRateComing.newCostMicros)} per million tokens from ${comingDay}` |
| 339 | : "Per million tokens"; |
| 340 | return ( |
| 341 | <main className="mx-auto max-w-4xl px-4 py-12"> |
| 342 | <p className="text-sm font-medium text-accent">Pricing</p> |
| 343 | <h1 className="mt-2 text-3xl font-semibold tracking-tight sm:text-4xl">Models at cost. What g1t runs, at cost plus {markup}.</h1> |
| 344 | <p className="mt-3 max-w-2xl text-muted"> |
| 345 | People chatting and the forge are free for everyone. Models are billed at the provider's price |
| 346 | {modelMarkup ? ` plus ${modelMarkup}%` : ", with no markup"}. The agent rate pays for what g1t runs around every model |
| 347 | call: the model gateway, secrets, routing, context and pass-through to your own provider, so it applies on your own |
| 348 | keys too. Everything else g1t runs is billed at what it costs g1t plus {markup}. Your own runners are free, and there |
| 349 | are no seats. The numbers on this page are the live price book g1t charges from. Prices exclude tax, which is added |
| 350 | where it applies. |
| 351 | </p> |
| 352 | <ul className="mt-6 grid gap-px overflow-hidden rounded-xl border border-line bg-line text-sm sm:grid-cols-2 lg:grid-cols-5"> |
| 353 | {[ |
| 354 | ["Models", modelMarkup ? `Provider price + ${modelMarkup}%` : "The provider's price", "No markup on tokens"], |
| 355 | ["Agent rate", agentRateTile, "Gateway, secrets, routing and pass-through, on your own keys too"], |
| 356 | ["Everything else g1t runs", `At cost + ${markup}`, "Sandboxes, builds, hosting, storage, search and scans"], |
| 357 | ["Your own runners", "Free", "Agents, checks and workflows on your hardware"], |
| 358 | ["People", "No seats", "Everyone in the workspace at one price"], |
| 359 | ].map(([what, price, about]) => ( |
| 360 | <li key={what} className="bg-surface px-4 py-3"> |
| 361 | <p className="text-xs text-muted">{what}</p> |
| 362 | <p className="mt-0.5 font-medium">{price}</p> |
| 363 | <p className="mt-0.5 text-xs text-faint">{about}</p> |
| 364 | </li> |
| 365 | ))} |
| 366 | </ul> |
| 367 | {free && ( |
| 368 | <div className="mt-5 rounded-xl border border-accent/30 bg-accent/5 px-4 py-3 text-sm"> |
| 369 | <span className="font-medium">Free while g1t is being built out.</span>{" "} |
| 370 | <span className="text-muted">Usage is recorded at these prices but not charged for now. The plan is charged.</span> |
| 371 | </div> |
| 372 | )} |
| 373 | |
| 374 | <section className="mt-10 rounded-xl border border-accent/40 bg-surface p-6"> |
| 375 | <div className="flex flex-wrap items-baseline justify-between gap-3"> |
| 376 | <h2 className="flex flex-wrap items-center gap-2 text-xl font-semibold tracking-tight"> |
| 377 | {plan.title} |
| 378 | <span className="rounded-full bg-accent/15 px-2 py-0.5 text-xs font-medium tracking-normal text-accent">Recommended</span> |
| 379 | </h2> |
| 380 | <p> |
| 381 | <span className="text-3xl font-semibold tabular-nums">${price}</span>{" "} |
| 382 | <span className="text-sm text-muted">a month per workspace</span> |
| 383 | <span className="block text-right text-xs text-faint"> |
| 384 | {plan.cardFeeCents ? `+ $${(plan.cardFeeCents / 100).toFixed(2)} card processing fee, plus tax where it applies` : "Plus tax where it applies"} |
| 385 | </span> |
| 386 | </p> |
| 387 | </div> |
| 388 | <p className="mt-2 text-sm text-muted"> |
| 389 | The plan for a team whose agents do real work: unlimited members, agents, checks, the merge queue and |
| 390 | deployments. |
| 391 | </p> |
| 392 | <p className="mt-3 text-sm text-fg-soft"> |
| 393 | One price for the whole team: a 10-person team pays ${price} a month, not ${price} a person. |
| 394 | </p> |
| 395 | <ul className="mt-4 space-y-1.5 text-sm text-muted"> |
| 396 | {plan.includes.map((line) => ( |
| 397 | <li key={line} className="flex gap-2"> |
| 398 | <span aria-hidden className="text-accent"> |
| 399 | ✓ |
| 400 | </span> |
| 401 | {line} |
| 402 | </li> |
| 403 | ))} |
| 404 | </ul> |
| 405 | <p className="mt-3 text-xs text-faint">{plan.overage}</p> |
| 406 | <div className="mt-5 grid gap-5 border-t border-line pt-5 text-sm sm:grid-cols-2"> |
| 407 | <div> |
| 408 | <p className="font-medium">Where the ${price} goes</p> |
| 409 | <p className="mt-1 text-muted"> |
| 410 | $10 comes back to you as usage: agents, sandboxes, builds and deployments at cost plus 20%, used before |
| 411 | anything else. The other $10 pays for running g1t, the free forge for everyone, and the people building it. |
| 412 | </p> |
| 413 | </div> |
| 414 | <div> |
| 415 | <p className="font-medium">No quotas</p> |
| 416 | <p className="mt-1 text-muted"> |
| 417 | No count of projects, previews, builds, requests or git operations ever stops a workspace on the plan. Past |
| 418 | the $10, usage is charged at cost plus 20%, and only your spend limit stops it. Unused included usage does |
| 419 | not roll over. |
| 420 | </p> |
| 421 | </div> |
| 422 | </div> |
| 423 | <p className="mt-5 text-sm text-muted">An owner starts the plan from the workspace's Billing page.</p> |
| 424 | </section> |
| 425 | |
| 426 | <section id="workspace" className="mt-14"> |
| 427 | <h2 className="text-xl font-semibold tracking-tight">Chat, Docs and agents</h2> |
| 428 | <p className="mt-1 max-w-3xl text-sm text-muted"> |
| 429 | People talking costs g1t very little, so it is included. Agents use models, so they are charged for what they |
| 430 | use, to the agent that used it. |
| 431 | </p> |
| 432 | <div className="mt-4 overflow-hidden rounded-xl border border-line"> |
| 433 | <dl className="divide-y divide-line text-sm"> |
| 434 | {WORKSPACE_CHARGES.map((row) => ( |
| 435 | <div key={row.what} className="grid gap-1 px-4 py-3 sm:grid-cols-[14rem_1fr] sm:gap-4"> |
| 436 | <dt className="font-medium"> |
| 437 | {row.what} |
| 438 | {row.soon && ( |
| 439 | <span className="ml-2 inline-block rounded bg-raised px-1.5 py-0.5 text-xs font-normal whitespace-nowrap text-muted">Coming soon</span> |
| 440 | )} |
| 441 | </dt> |
| 442 | <dd className="text-muted">{row.how}</dd> |
| 443 | </div> |
| 444 | ))} |
| 445 | </dl> |
| 446 | </div> |
| 447 | <p className="mt-3 text-sm text-muted"> |
| 448 | The agent rate today: {agentRateLine}. A chat reply is usually a few thousand tokens on a fast model, so most |
| 449 | replies cost a fraction of a cent. See{" "} |
| 450 | <a href="https://docs.g1t.sh/guides/agents/#what-an-agent-costs" className="text-accent hover:underline"> |
| 451 | what an agent costs |
| 452 | </a> |
| 453 | . |
| 454 | </p> |
| 455 | </section> |
| 456 | |
| 457 | <section id="spend-less" className="mt-14"> |
| 458 | <h2 className="text-xl font-semibold tracking-tight">Help spending less</h2> |
| 459 | <p className="mt-1 max-w-3xl text-sm text-muted">Prices near cost are half of it. The other half is not spending more than the work needs.</p> |
| 460 | <div className="mt-4 grid gap-4 sm:grid-cols-3"> |
| 461 | <section className="rounded-xl border border-line bg-surface p-5"> |
| 462 | <h3 className="font-medium">Effort per agent</h3> |
| 463 | <p className="mt-1.5 text-sm text-muted"> |
| 464 | Auto, Low, Medium, High or Max: how hard an agent works, from the model tier it starts on to how hard it reasons and how |
| 465 | many steps a session takes. Each level shows what a typical task has cost that agent. |
| 466 | </p> |
| 467 | </section> |
| 468 | <section className="rounded-xl border border-line bg-surface p-5"> |
| 469 | <h3 className="font-medium">Suggestions checked against your work</h3> |
| 470 | <p className="mt-1.5 text-sm text-muted"> |
| 471 | Every week, each agent's finished sessions are checked. A cheaper level is suggested only when its work was accepted |
| 472 | as often, with the numbers it rests on and an Apply button. With too little history, Spend says so instead. |
| 473 | </p> |
| 474 | </section> |
| 475 | <section className="rounded-xl border border-line bg-surface p-5"> |
| 476 | <h3 className="font-medium">Budgets that hold</h3> |
| 477 | <p className="mt-1.5 text-sm text-muted"> |
| 478 | Workspace, team, person, agent and task budgets are checked before work starts. An agent at its budget stops taking new |
| 479 | work and says so. |
| 480 | </p> |
| 481 | </section> |
| 482 | </div> |
| 483 | </section> |
| 484 | |
| 485 | <h2 className="mt-14 text-xl font-semibold tracking-tight">Free and the plan, side by side</h2> |
| 486 | <p className="mt-1 text-sm text-muted"> |
| 487 | Secret scanning, push protection, vulnerability alerts and security updates are free everywhere, on every plan. |
| 488 | </p> |
| 489 | {/* On a phone, one row at a time with both answers under it; a table that wide would scroll. */} |
| 490 | <ul className="mt-4 divide-y divide-line rounded-xl border border-line text-sm sm:hidden"> |
| 491 | {rows(tier).map((row) => ( |
| 492 | <li key={row.what} className="px-4 py-3"> |
| 493 | <p className="font-medium">{row.what}</p> |
| 494 | {row.note && <p className="text-xs text-faint">{row.note}</p>} |
| 495 | <dl className="mt-2 grid grid-cols-[4.5rem_1fr] gap-x-3 gap-y-1.5"> |
| 496 | <dt className="text-xs leading-5 text-faint">Free</dt> |
| 497 | <dd className="text-muted">{row.free}</dd> |
| 498 | <dt className="text-xs leading-5 text-faint">{plan.title}</dt> |
| 499 | <dd className="text-muted">{row.plan}</dd> |
| 500 | </dl> |
| 501 | </li> |
| 502 | ))} |
| 503 | </ul> |
| 504 | <div className="mt-4 hidden overflow-x-auto rounded-xl border border-line sm:block"> |
| 505 | <table className="w-full min-w-[36rem] text-left text-sm"> |
| 506 | <thead className="border-b border-line text-xs text-muted"> |
| 507 | <tr> |
| 508 | <th className="px-4 py-2.5 font-medium"> |
| 509 | <span className="sr-only">What</span> |
| 510 | </th> |
| 511 | <th className="px-4 py-2.5 font-medium">Free</th> |
| 512 | <th className="px-4 py-2.5 font-medium"> |
| 513 | {plan.title}, ${price} a month |
| 514 | </th> |
| 515 | </tr> |
| 516 | </thead> |
| 517 | <tbody className="divide-y divide-line"> |
| 518 | {rows(tier).map((row) => ( |
| 519 | <tr key={row.what} className="align-top"> |
| 520 | <td className="px-4 py-3"> |
| 521 | <p className="font-medium">{row.what}</p> |
| 522 | {row.note && <p className="text-xs text-faint">{row.note}</p>} |
| 523 | </td> |
| 524 | <td className="px-4 py-3 text-muted">{row.free}</td> |
| 525 | <td className="px-4 py-3 text-muted">{row.plan}</td> |
| 526 | </tr> |
| 527 | ))} |
| 528 | </tbody> |
| 529 | </table> |
| 530 | </div> |
| 531 | <p className="mt-3 text-sm text-muted"> |
| 532 | Git operations cost g1t money too: Cloudflare charges g1t $0.15 per 1,000. {count(tier.gitOperationsIncluded)} a |
| 533 | month is far more than an active workspace uses; an agent run takes two to four. |
| 534 | </p> |
| 535 | |
| 536 | <h2 className="mt-14 text-xl font-semibold tracking-tight">No card, no compute</h2> |
| 537 | <div className="mt-3 max-w-3xl space-y-3 text-sm text-muted"> |
| 538 | <p> |
| 539 | Agents, checks, workflows, the merge queue, deployments and semantic search run on g1t's machines. They need |
| 540 | the plan, or a card check. |
| 541 | </p> |
| 542 | <p> |
| 543 | The reason: compute costs g1t real money from the first second, and free compute draws people who use it to |
| 544 | mine cryptocurrency. A card check is the smallest gate that stops that, with one trial per card. |
| 545 | </p> |
| 546 | <p> |
| 547 | A card check is never charged. Stripe saves and verifies the card, with 3-D Secure where your bank asks for it. |
| 548 | Nothing is charged until an owner starts the plan, and then the same card is used, without asking for it again. |
| 549 | The trial needs a credit or debit card; prepaid cards can still pay for the plan. |
| 550 | </p> |
| 551 | </div> |
| 552 | |
| 553 | <div className="mt-5 grid gap-4 sm:grid-cols-2"> |
| 554 | <section className="rounded-xl border border-line bg-surface p-5"> |
| 555 | <h3 className="font-medium">The trial</h3> |
| 556 | <p className="mt-1.5 text-sm text-muted"> |
| 557 | {dollars(tier.trialWorkspaceMicros)} of usage, once per workspace and once per card, after a card check with a credit or |
| 558 | debit card. It comes from a{" "} |
| 559 | {dollars(tier.trialMonthlyPoolMicros)} pool each month for everyone; when a month's pool is given out, new |
| 560 | trials wait until the 1st. The trial does not cover deployments and never turns into a charge. If the last |
| 561 | run on a trial goes past it, g1t covers the difference. |
| 562 | </p> |
| 563 | </section> |
| 564 | <section className="rounded-xl border border-line bg-surface p-5"> |
| 565 | <h3 className="font-medium">The open-source pool</h3> |
| 566 | <p className="mt-1.5 text-sm text-muted"> |
| 567 | Checks, workflows and the merge queue on public repositories, after a card check:{" "} |
| 568 | {dollars(tier.ossPoolMicros)} a month in all, up to {dollars(tier.ossRepoMicros)} a month per repository. |
| 569 | Agents do not run from the pool. When the pool or a repository's share is used up, the work waits for the |
| 570 | month to turn, or the workspace pays as usual. |
| 571 | </p> |
| 572 | </section> |
| 573 | </div> |
| 574 | |
| 575 | <h2 className="mt-14 text-xl font-semibold tracking-tight">Limits, and how to raise them</h2> |
| 576 | <p className="mt-1 max-w-3xl text-sm text-muted"> |
| 577 | g1t lets usage run ahead of payment only so far. Limits keep a mistake small, for you and for g1t. |
| 578 | </p> |
| 579 | <ul className="mt-4 grid gap-3 text-sm sm:grid-cols-2"> |
| 580 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 581 | <p className="font-medium">{dollars(tier.paidStartCeilingMicros)} in the first month</p> |
| 582 | <p className="mt-1 text-muted"> |
| 583 | A workspace on the plan can use up to {dollars(tier.paidStartCeilingMicros)} in its first month. After that, |
| 584 | the limit grows with payments that clear. |
| 585 | </p> |
| 586 | </li> |
| 587 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 588 | <p className="font-medium">Your own spend limit</p> |
| 589 | <p className="mt-1 text-muted"> |
| 590 | Owners set a monthly spend limit anywhere up to the highest limit the workspace has had, with no approval. |
| 591 | Once, you can raise it yourself to twice that. |
| 592 | </p> |
| 593 | </li> |
| 594 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 595 | <p className="font-medium">Prepay to raise it now</p> |
| 596 | <p className="mt-1 text-muted"> |
| 597 | Prepaying from $25 raises what you can use by the same amount, at once. From $1,000 you can also pay by bank |
| 598 | transfer. |
| 599 | </p> |
| 600 | </li> |
| 601 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 602 | <p className="font-medium">Raise my limit</p> |
| 603 | <p className="mt-1 text-muted"> |
| 604 | Need more? Ask from Billing with the amount, why, and what you expect to spend. You get an answer within one |
| 605 | business day, in the app and by email. |
| 606 | </p> |
| 607 | </li> |
| 608 | </ul> |
| 609 | |
| 610 | <h2 className="mt-14 text-xl font-semibold tracking-tight">When usage runs high</h2> |
| 611 | <ul className="mt-4 grid gap-3 text-sm sm:grid-cols-2"> |
| 612 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 613 | <p className="font-medium">A spike pauses new work</p> |
| 614 | <p className="mt-1 text-muted"> |
| 615 | When an hour's spend is five times your usual hour, and at least $5, new compute waits for an owner to choose |
| 616 | Keep going or Stop. Runs already going finish. |
| 617 | </p> |
| 618 | </li> |
| 619 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 620 | <p className="font-medium">Caps per run and per issue</p> |
| 621 | <p className="mt-1 text-muted"> |
| 622 | One agent run stops at $2 and the agents on one issue at $10 in all, so a run stuck in a loop stops on its own. |
| 623 | Owners change both on Billing. |
| 624 | </p> |
| 625 | </li> |
| 626 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 627 | <p className="font-medium">Alerts at 50, 75, 90 and 100%</p> |
| 628 | <p className="mt-1 text-muted"> |
| 629 | Of the plan's included usage, your spend limit and g1t's limit: in the app and by email. |
| 630 | </p> |
| 631 | </li> |
| 632 | <li className="rounded-xl border border-line bg-surface p-4"> |
| 633 | <p className="font-medium">Spent more than you meant to? Tell us</p> |
| 634 | <p className="mt-1 text-muted"> |
| 635 | Tell us from Billing what happened. Once in 12 months, g1t can credit back usage you did not mean, always |
| 636 | including its 20% on it. Larger credits, or a second one within 12 months, are reviewed by a person. |
| 637 | </p> |
| 638 | </li> |
| 639 | </ul> |
| 640 | <p className="mt-3 text-sm text-muted"> |
| 641 | No card is charged less than {dollars(tier.minChargeMicros)} when a month closes, so a payment's fee is never most |
| 642 | of it. Smaller amounts carry over to the next invoice. Charges at a limit always go through. |
| 643 | </p> |
| 644 | |
| 645 | <div className="mt-14 grid gap-4 sm:grid-cols-2"> |
| 646 | {HOW.map((item) => ( |
| 647 | <section key={item.title} className="rounded-xl border border-line bg-surface p-5"> |
| 648 | <h2 className="font-medium">{item.title}</h2> |
| 649 | <p className="mt-1.5 text-sm text-muted">{item.body}</p> |
| 650 | </section> |
| 651 | ))} |
| 652 | </div> |
| 653 | |
| 654 | <h2 className="mt-14 text-xl font-semibold tracking-tight">Usage</h2> |
| 655 | <p className="mt-1 text-sm text-muted"> |
| 656 | {checked ? ( |
| 657 | <> |
| 658 | Last checked against Cloudflare's bill <TimeAgo at={checked} />. |
| 659 | </> |
| 660 | ) : ( |
| 661 | "Starting from Cloudflare's published prices; checked against its bill daily." |
| 662 | )} |
| 663 | </p> |
| 664 | <div className="mt-4 overflow-x-auto rounded-xl border border-line"> |
| 665 | <table className="w-full text-left text-sm sm:min-w-[36rem]"> |
| 666 | <thead className="border-b border-line text-xs text-muted"> |
| 667 | <tr> |
| 668 | <th className="px-4 py-2.5 font-medium">What</th> |
| 669 | <th className="px-4 py-2.5 font-medium">Costs g1t</th> |
| 670 | {/* The markup is in what you pay; on a phone the column gives way. */} |
| 671 | <th className="hidden px-4 py-2.5 font-medium sm:table-cell">Markup</th> |
| 672 | <th className="px-4 py-2.5 font-medium">You pay</th> |
| 673 | </tr> |
| 674 | </thead> |
| 675 | <tbody className="divide-y divide-line"> |
| 676 | <tr> |
| 677 | <td className="px-4 py-3"> |
| 678 | <p className="font-medium">Agent models</p> |
| 679 | <p className="text-xs text-faint">g1t's hosted models for agent runs, the cheapest that can do each job, paid from AI credit</p> |
| 680 | </td> |
| 681 | <td className="px-4 py-3 text-muted">What the provider charges, per request</td> |
| 682 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">{book?.modelMarginPercent ?? 0}%</td> |
| 683 | <td className="px-4 py-3 text-muted">{book?.modelMarginPercent ? `Cost + ${book.modelMarginPercent}%` : "The provider's price"}</td> |
| 684 | </tr> |
| 685 | {(() => { |
| 686 | const rate = book?.prices.find((p) => p.meter === "agent_tokens"); |
| 687 | const gateway = book?.prices.find((p) => p.meter === "gateway_models"); |
| 688 | const feePercent = book?.prices.find((p) => p.meter === "card_fee_percent"); |
| 689 | const feeFixed = book?.prices.find((p) => p.meter === "card_fee_fixed"); |
| 690 | const coming = book?.changes.find((c) => c.meter === "agent_tokens" && c.effectiveAt); |
| 691 | const ownRate = book?.prices.find((p) => p.meter === "agent_tokens_own"); |
| 692 | const ownComing = book?.changes.find((c) => c.meter === "agent_tokens_own" && c.effectiveAt); |
| 693 | return ( |
| 694 | <> |
| 695 | <tr> |
| 696 | <td className="px-4 py-3"> |
| 697 | <p className="font-medium">g1t agent rate</p> |
| 698 | <p className="text-xs text-faint">The model gateway, secrets, routing, context and pass-through, on every token an agent run uses</p> |
| 699 | <p className="text-xs text-faint">Tokens count by kind: {tokenWeights(book?.prices ?? [])}</p> |
| 700 | </td> |
| 701 | <td className="px-4 py-3 text-muted">A flat rate</td> |
| 702 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">—</td> |
| 703 | <td className="px-4 py-3 font-mono text-xs tabular-nums"> |
| 704 | {rate && rate.priceMicros > 0 ? `${money(rate.priceMicros)} per million tokens` : coming ? `${money(coming.newCostMicros)} per million tokens from ${coming.effectiveAt!.slice(0, 10)}` : "$0.25 per million tokens"} |
| 705 | </td> |
| 706 | </tr> |
| 707 | <tr> |
| 708 | <td className="px-4 py-3"> |
| 709 | <p className="font-medium">g1t agent rate, your own model key</p> |
| 710 | <p className="text-xs text-faint">The same, on runs that pass through to your own provider; its models are billed by your provider, not g1t</p> |
| 711 | </td> |
| 712 | <td className="px-4 py-3 text-muted">A flat rate</td> |
| 713 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">—</td> |
| 714 | <td className="px-4 py-3 font-mono text-xs tabular-nums"> |
| 715 | {ownRate && ownRate.priceMicros > 0 ? `${money(ownRate.priceMicros)} per million tokens` : ownComing ? `${money(ownComing.newCostMicros)} per million tokens from ${ownComing.effectiveAt!.slice(0, 10)}` : "$0.25 per million tokens"} |
| 716 | </td> |
| 717 | </tr> |
| 718 | <tr> |
| 719 | <td className="px-4 py-3"> |
| 720 | <p className="font-medium"> |
| 721 | AI Gateway <span className="ml-1 rounded bg-accent/15 px-1.5 py-0.5 text-xs text-accent">Free during beta</span> |
| 722 | </p> |
| 723 | <p className="text-xs text-faint">Your own code calling Claude and open models through g1t, in Anthropic's or OpenAI's format, paid from AI credit; on your own providers, free</p> |
| 724 | </td> |
| 725 | <td className="px-4 py-3 text-muted">What the provider charges</td> |
| 726 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">{gateway?.markupPercent ?? 0}%</td> |
| 727 | <td className="px-4 py-3 text-muted">{gateway?.markupPercent ? `Cost + ${gateway.markupPercent}%` : "The provider's price"}</td> |
| 728 | </tr> |
| 729 | {feePercent && feeFixed && ( |
| 730 | <tr> |
| 731 | <td className="px-4 py-3"> |
| 732 | <p className="font-medium">Card processing fee</p> |
| 733 | <p className="text-xs text-faint"> |
| 734 | On every card payment, as its own line shown before you pay; never on bank transfers or invoiced billing |
| 735 | </p> |
| 736 | </td> |
| 737 | <td className="px-4 py-3 text-muted">Stripe's fee</td> |
| 738 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">—</td> |
| 739 | <td className="px-4 py-3 font-mono text-xs tabular-nums"> |
| 740 | {(feePercent.priceMicros / 10_000).toFixed(1)}% + {money(feeFixed.priceMicros)} |
| 741 | </td> |
| 742 | </tr> |
| 743 | )} |
| 744 | </> |
| 745 | ); |
| 746 | })()} |
| 747 | <tr> |
| 748 | <td className="px-4 py-3"> |
| 749 | <p className="font-medium">Your own runners</p> |
| 750 | <p className="text-xs text-faint">Agents, checks and workflows on your own hardware</p> |
| 751 | </td> |
| 752 | <td className="px-4 py-3 text-muted">Nothing</td> |
| 753 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">—</td> |
| 754 | <td className="px-4 py-3 text-muted">Free</td> |
| 755 | </tr> |
| 756 | <tr> |
| 757 | <td className="px-4 py-3"> |
| 758 | <p className="font-medium">Projects, previews and apps</p> |
| 759 | <p className="text-xs text-faint">Having them. An app's requests and CPU time are charged below.</p> |
| 760 | </td> |
| 761 | <td className="px-4 py-3 text-muted">Next to nothing</td> |
| 762 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">—</td> |
| 763 | <td className="px-4 py-3 text-muted">Not charged</td> |
| 764 | </tr> |
| 765 | {(book?.prices ?? []).filter((price) => !SHOWN_APART.has(price.meter)).map((price) => ( |
| 766 | <tr key={price.meter}> |
| 767 | <td className="px-4 py-3"> |
| 768 | <p className="font-medium">{price.title}</p> |
| 769 | <p className="text-xs text-faint"> |
| 770 | {price.meter === "actions_cache" ? "On the plan only. A free workspace is never charged for it. " : ""} |
| 771 | {price.source === "cloudflare" ? "Measured from Cloudflare's bill" : "Cloudflare's published price"} |
| 772 | </p> |
| 773 | </td> |
| 774 | <td className="px-4 py-3 font-mono text-xs tabular-nums text-muted">{perUnit(price, price.costMicros)}</td> |
| 775 | <td className="hidden px-4 py-3 tabular-nums sm:table-cell">{price.markupPercent}%</td> |
| 776 | <td className="px-4 py-3 font-mono text-xs tabular-nums">{perUnit(price, price.priceMicros)}</td> |
| 777 | </tr> |
| 778 | ))} |
| 779 | </tbody> |
| 780 | </table> |
| 781 | </div> |
| 782 | |
| 783 | <h2 className="mt-14 text-xl font-semibold tracking-tight">Enterprise</h2> |
| 784 | <p className="mt-1 text-sm text-muted"> |
| 785 | For organizations with several workspaces: one invoice and one limit. The prices are the ones on this page. |
| 786 | </p> |
| 787 | <section className="mt-4 rounded-xl border border-line bg-surface p-5"> |
| 788 | <ul className="grid gap-3 text-sm sm:grid-cols-2"> |
| 789 | <li> |
| 790 | <p className="font-medium">Consolidated invoicing</p> |
| 791 | <p className="text-muted">One monthly invoice for every workspace, paid by card or bank transfer.</p> |
| 792 | </li> |
| 793 | <li> |
| 794 | <p className="font-medium">Custom terms</p> |
| 795 | <p className="text-muted">One limit across every workspace, invoice terms and a billing contact, set with you.</p> |
| 796 | </li> |
| 797 | <li> |
| 798 | <p className="font-medium">Security on every plan</p> |
| 799 | <p className="text-muted"> |
| 800 | The audit log with export, {tier.planAuditRetentionDays} days or longer by arrangement, and secret push |
| 801 | protection, for every workspace. |
| 802 | </p> |
| 803 | </li> |
| 804 | <li> |
| 805 | <p className="font-medium"> |
| 806 | Single sign-on <span className="ml-1 rounded bg-raised px-1.5 py-0.5 text-xs text-muted">Coming</span> |
| 807 | </p> |
| 808 | <p className="text-muted">Through your identity provider, on every plan once it is built. Not available yet.</p> |
| 809 | </li> |
| 810 | </ul> |
| 811 | <a |
| 812 | href={ENTERPRISE_MAIL} |
| 813 | className="mt-5 inline-flex items-center gap-1.5 rounded-md border border-line px-3 py-1.5 text-sm hover:border-line-strong" |
| 814 | > |
| 815 | Write to us about enterprise |
| 816 | <ArrowUpRight size={14} /> |
| 817 | </a> |
| 818 | </section> |
| 819 | |
| 820 | <h2 className="mt-14 text-xl font-semibold tracking-tight">Price changes</h2> |
| 821 | {book && book.changes.length > 0 ? ( |
| 822 | <ul className="mt-4 divide-y divide-line rounded-xl border border-line"> |
| 823 | {book.changes.map((change) => { |
| 824 | const title = book.prices.find((p) => p.meter === change.meter)?.title ?? change.meter; |
| 825 | // What you pay moved: the cost, the markup, or both. |
| 826 | const before = change.oldCostMicros * (100 + (change.oldMarkupPercent ?? change.markupPercent)); |
| 827 | const after = change.newCostMicros * (100 + change.markupPercent); |
| 828 | const up = after > before; |
| 829 | const fresh = after === before || before === 0; |
| 830 | return ( |
| 831 | <li key={`${change.meter}-${change.createdAt}`} className="px-4 py-3 text-sm"> |
| 832 | <p> |
| 833 | <span className="font-medium">{title}</span>{" "} |
| 834 | {fresh ? ( |
| 835 | <span className="text-muted">new</span> |
| 836 | ) : ( |
| 837 | <span className={up ? "text-warn" : "text-accent"}> |
| 838 | {up ? "up" : "down"} {Math.abs((after / before - 1) * 100).toFixed(1)}% |
| 839 | </span> |
| 840 | )} |
| 841 | </p> |
| 842 | <p className="mt-0.5 text-xs text-faint"> |
| 843 | {change.effectiveAt ? ( |
| 844 | <> |
| 845 | {change.reason} · <span className="text-fg-soft">takes effect {change.effectiveAt.slice(0, 10)}</span> |
| 846 | </> |
| 847 | ) : ( |
| 848 | <> |
| 849 | {change.reason} · <TimeAgo at={change.createdAt} /> |
| 850 | </> |
| 851 | )} |
| 852 | </p> |
| 853 | </li> |
| 854 | ); |
| 855 | })} |
| 856 | </ul> |
| 857 | ) : ( |
| 858 | <p className="mt-2 text-sm text-muted">None yet. When a price moves, it is listed here with why.</p> |
| 859 | )} |
| 860 | |
| 861 | <h2 id="faq" className="mt-14 text-xl font-semibold tracking-tight">Questions</h2> |
| 862 | <dl className="mt-4 divide-y divide-line rounded-xl border border-line"> |
| 863 | {FAQ.map((item) => ( |
| 864 | <div key={item.q} className="px-4 py-4 text-sm"> |
| 865 | <dt className="font-medium">{item.q}</dt> |
| 866 | <dd className="mt-1.5 text-muted">{item.a}</dd> |
| 867 | </div> |
| 868 | ))} |
| 869 | </dl> |
| 870 | |
| 871 | <a |
| 872 | href="https://docs.g1t.sh/guides/usage-and-billing/" |
| 873 | className="mt-12 inline-flex items-center gap-1.5 text-sm text-accent hover:underline" |
| 874 | > |
| 875 | How usage and billing work |
| 876 | <ArrowUpRight size={14} /> |
| 877 | </a> |
| 878 | </main> |
| 879 | ); |
| 880 | } |