Skip to content

Fix onboarding UI jank (Loading flash + canonicalize double-hop)#1007

Merged
RhysSullivan merged 1 commit into
mainfrom
claude/onboarding-jank
Jun 13, 2026
Merged

Fix onboarding UI jank (Loading flash + canonicalize double-hop)#1007
RhysSullivan merged 1 commit into
mainfrom
claude/onboarding-jank

Conversation

@RhysSullivan

Copy link
Copy Markdown
Collaborator

Two render flashes in the cloud onboarding flow, both surfaced by watching the
recording from the new auth-routing flow test (#1006). Both are pre-existing —
not introduced by the slug work.

1. create-org: "Create your organization" → "Loading" → back

The whole /create-org header was gated on the pending-invitations atom being
initial or waiting. That atom is keyed on ReactivityKey.auth, so the
create-org submit — which invalidates authWriteKeys — put it into waiting
and flipped the page to "Loading" and back. Invitations are empty for ~every
new user, so a full-page "Loading" was never the right thing to show.

Now the create form renders immediately; the header defaults to "Create your
organization" (→ "You've been invited" only once invitations resolve to >0),
and the skeleton shows only on the genuine first load (initial), in the
invitations slot. A refetch is waiting, not initial, so it no longer
replaces the page.

2. connect-MCP: the app sidebar flashes in

Continue to app / Skip for now navigated to the bare /{-$orgSlug},
which mounts the shell at / and then OrgSlugGate fires a second
navigation to canonicalize //<slug>. That double hop is the window where
the shell paints over the still-mounted connect-MCP page. Now it navigates
straight to /<slug> (the page already has the org slug from useAuth), so the
shell mounts once.

Verification

Typecheck, lint, format clean. Re-ran the #1006 auth-routing flow scenario
against this branch's code (green) and re-watched the recording — the
create→loading→create flicker and the sidebar flash on the connect step are
gone. Independent of #1006 (different files); either can merge first.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jun 13, 2026

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
executor-marketing 3e44329 Commit Preview URL

Branch Preview URL
Jun 13 2026, 07:36 PM

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jun 13, 2026

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
executor-cloud 3e44329 Jun 13 2026, 07:37 PM

@github-actions

github-actions Bot commented Jun 13, 2026

Copy link
Copy Markdown
Contributor

Cloudflare preview

Torn down — the PR is closed.

@pkg-pr-new

pkg-pr-new Bot commented Jun 13, 2026

Copy link
Copy Markdown

Open in StackBlitz

@executor-js/cli

npm i https://pkg.pr.new/@executor-js/cli@1007

@executor-js/config

npm i https://pkg.pr.new/@executor-js/config@1007

@executor-js/execution

npm i https://pkg.pr.new/@executor-js/execution@1007

@executor-js/sdk

npm i https://pkg.pr.new/@executor-js/sdk@1007

@executor-js/codemode-core

npm i https://pkg.pr.new/@executor-js/codemode-core@1007

@executor-js/runtime-quickjs

npm i https://pkg.pr.new/@executor-js/runtime-quickjs@1007

@executor-js/plugin-file-secrets

npm i https://pkg.pr.new/@executor-js/plugin-file-secrets@1007

@executor-js/plugin-graphql

npm i https://pkg.pr.new/@executor-js/plugin-graphql@1007

@executor-js/plugin-keychain

npm i https://pkg.pr.new/@executor-js/plugin-keychain@1007

@executor-js/plugin-mcp

npm i https://pkg.pr.new/@executor-js/plugin-mcp@1007

@executor-js/plugin-onepassword

npm i https://pkg.pr.new/@executor-js/plugin-onepassword@1007

@executor-js/plugin-openapi

npm i https://pkg.pr.new/@executor-js/plugin-openapi@1007

executor

npm i https://pkg.pr.new/executor@1007

commit: 3e44329

Two flashes visible in the onboarding flow:

1. create-org flickered 'Create your organization' → 'Loading' → back. The
   header was gated on the pending-invitations atom being initial OR waiting,
   and that atom is keyed on auth — so the create-org submit (which invalidates
   the auth keys) put it into 'waiting' and flipped the whole page to 'Loading'.
   Almost no new user has a pending invitation, so we now show NO loading
   placeholder at all: the create form renders immediately and stays put, and
   invitations (when they exist) just appear above it once the fetch resolves.
   Removed the InvitationsSkeleton entirely.

2. The connect-MCP step flashed the app sidebar. 'Continue to app' / 'Skip'
   navigated to the BARE /{-$orgSlug}, which mounts the shell at / and then
   OrgSlugGate fires a SECOND navigation to canonicalize / → /<slug>. That
   double hop is the window where the shell paints over the still-mounted
   onboarding page. Now it navigates straight to /<slug> (the page already has
   the org slug), so the shell mounts once.

Both pre-existing; the new auth-routing flow test (#1006) made them visible.
@RhysSullivan RhysSullivan force-pushed the claude/onboarding-jank branch from b0b86f9 to 3e44329 Compare June 13, 2026 19:34
@RhysSullivan RhysSullivan merged commit 84ad401 into main Jun 13, 2026
14 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant