Skip to content

fix(inspector): rework auth gate and request code from newer devframe hosts - #5349

Merged
antfu merged 1 commit into
unocss:mainfrom
antfubot:feat/inspector-auth-ui
Sep 16, 2026
Merged

antfu merged 1 commit into
unocss:mainfrom
antfubot:feat/inspector-auth-ui

Conversation

@antfubot

@antfubot antfubot commented Sep 15, 2026 •

Copy link
Copy Markdown
Contributor

Description

Closes #5333. Builds on the merged #5348 by reworking the auth gate UI.

devframe 0.9.14 (devframes/devframe#368) introduced requestAuthCode() and stopped automatically printing the auth banner on plain page loads. The inspector drives its own auth UI with simpleAuth: false, so it must ask the host for a code explicitly. #5348 fixed the missing request; this reworks the gate itself into a proper one-time-code screen.

What changed

  • Reworked the auth gate into a dedicated one-time-code screen, following devframe hub-ui's ViewBuiltinClientAuthNotice for structure and UX:
    • a new OtpInput component: six single-digit boxes with paste, arrow-key, backspace and autofill handling, plus an invalid-state shake;
    • an "Authorize" action, inline error/hint feedback with an aria-live region;
    • a "Re-issue one-time code" control that rotates a fresh code (newer hosts print each code at most once).
  • The code request now fires when the auth screen appears (in the component), so the host prints a usable code the moment it's needed; the call stays guarded (requestAuthCode?.()) so older hosts keep working.

Styling uses the inspector's own UnoCSS tokens (border-main, bg-active, teal accent) rather than pulling in external design deps.

This PR was created with the help of an agent.

@antfubot
antfubot requested review from antfu and zyyv as code owners September 15, 2026 23:50
@netlify

netlify Bot commented Sep 15, 2026 •

Copy link
Copy Markdown

✅ Deploy Preview for unocss ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit 4b966be
🔍 Latest deploy log https://app.netlify.com/projects/unocss/deploys/6aa9d9f04f0813000870a86f
😎 Deploy Preview https://deploy-preview-5349--unocss.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

… hosts

devframe >=0.9.14 no longer prints the auth code banner automatically on
page load, so the inspector's custom auth UI never got a code to enter.
Request the code explicitly when the auth screen appears (guarded for older
hosts) and rework the gate into a dedicated OTP screen: a six-box code input
with paste/keyboard handling, an authorize action, inline error/hint
feedback, and a re-issue control to rotate a fresh code.

closes unocss#5333
@antfubot
antfubot force-pushed the feat/inspector-auth-ui branch from 8c56332 to 4b966be Compare September 15, 2026 23:51
@pkg-pr-new

pkg-pr-new Bot commented Sep 15, 2026

Copy link
Copy Markdown

Open in StackBlitz

commit: 4b966be

@antfu
antfu merged commit eeea815 into unocss:main Sep 16, 2026
11 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.

Inspector auth gate has no terminal code with Devframe 0.9.18

2 participants

Sponsor
SponsoredKunjungi sekarang
Promo