[dikshantgoyal011]

What this does

FW-601: sign-in state in the header. The header on the landing page and /pricing gets an account slot beside the GitHub button, so visitors can sign in from there and people who are signed in can see that they are.

• Signed out: Sign in, linking to /login.
• Signed in: the account's initial and address. A menu says who is signed in and offers Account, Console and Sign out.
  • An account still on the waitlist gets Waitlist instead of Console.
  • Signing out stays on the page and moves focus to Sign in.
  • A sign-out that fails says so in the menu.
• No wrong state while loading. The landing page is prerendered with no session, so the slot keeps one width and shows nothing until the service answers.
  • Someone signed in never sees "Sign in" flash by, and the links never move.
  • If the service can't be reached, the slot offers Sign in.
• Narrow screens:
  • Below 1100px, the slot narrows to the initial and the GitHub button to its icon. The button's label stays as its accessible name.
  • Below 851px, the menu opens from the header's right edge so it stays inside the window.

Refactor: the "How it works" menu's dismissal (outside press, Escape, tabbing out) moves into a useDismiss hook that both menus use. Its panel animation moves to lib/panel.ts. Its behaviour is unchanged, and the tests cover it.

No service changes: this works with the Worker as it is deployed now.

Testing

• npm --prefix site run check passes, and docs/ matches a rebuild.
• The production build in Edge (prerendered, with its CSP, served as GitHub Pages serves it), against a local service: 62 checks.
  • The prerendered HTML holds an empty slot.
  • The slot goes from empty to Sign in, or from empty to the account, with nothing in between. This is recorded from first paint.
  • The slot's width and the links' positions are the same in all three states.
  • The menu: its contents, Escape (which returns focus to the button), outside press, tabbing out, and the links.
  • "How it works" still closes on Escape and on an outside press.
  • /pricing behaves the same.
  • A failed sign-out, then a real one.
  • A waiting account's menu.
  • The service being down.
  • Dark theme.
  • No hydration, CSP or other console errors.
• Header layout at 11 widths from 1440px to 320px, signed in and out. No sideways scroll, and the links lay out exactly as on preview today, which already wraps them to two rows at 851–899px and on phones. At 900px they now fit on one row.

Merging with the other two PRs

The profile-name PR (FW-602) builds on this one: merge this first. This PR, FW-602 and #43 (FW-603, open sign-up) each rebuild docs/, so whichever merges second needs a rebuild. I merged all three locally and ran every check on the result: everything passes.

🤖 Generated with Claude Code

[ashutosh091]

Landed on preview through #47, which merged this branch together with the other two FW-60x PRs on top of the Paygate billing work. Your commits are unchanged. Changes made during the merge: the profile-name migration is renumbered to 0004_profile_name.sql (preview already had 0003_billing.sql); the /pricing copy now says to start on Free and upgrade, since billing is live; and the billing test suite pins SIGNUP_MODE: "waitlist". Thanks!