Skip to content

feat(extension): Auth0 sign-in for the VSCode extension#717

Open
nirooba98 wants to merge 3 commits into
shivasurya:mainfrom
nirooba98:feature/vscode-auth0-github-login
Open

feat(extension): Auth0 sign-in for the VSCode extension#717
nirooba98 wants to merge 3 commits into
shivasurya:mainfrom
nirooba98:feature/vscode-auth0-github-login

Conversation

@nirooba98
Copy link
Copy Markdown
Contributor

Summary

Adds Auth0-backed sign-in to the Code Pathfinder VSCode extension with a redesigned sidepanel login page.

  • PKCE OAuth flow: browser-based universal login against an Auth0 Native (public) app, callback handled via the vscode://codepathfinder.secureflow/auth-callback URI scheme; tokens stored in SecretStorage.
  • Three commits, each independently runnable:
    1. b95b9fe — Initial PKCE flow + AuthService singleton + status bar item + AuthHeader strip in the sidepanel.
    2. 8ba2a51 — Custom /p. codicon registered via contributes.icons; replaces \$(github) in the status bar. Includes npm run build:icon-font for regenerating the WOFF.
    3. f35ae59 — Dedicated sidepanel login gate (Google, GitHub, Microsoft, Continue as Guest) and ProfileMenu widget; AuthService generalized to a Session union, multi-provider connection arg, and guest mode.
  • No secrets committed: Auth0 domain and Native-app Client ID are public identifiers — PKCE means no client_secret exists for this app type.
  • Microsoft button is committed but currently hidden via a Svelte comment, pending the `windowslive` social connection in Auth0.

Test plan

  • Reload the Extension Development Host; sidepanel shows the login page when no session.
  • Sign in with Google → browser opens → consent → callback → ProfileMenu in top-right shows Google handle.
  • Sign in with GitHub → same, with GitHub handle.
  • Continue as Guest → no browser; instant switch to Page 2 with "Guest" in ProfileMenu.
  • Click ProfileMenu → Sign out → returns to login gate.
  • Status bar shows `/p.` icon + username / Guest / Sign in across all three states.
  • Existing onboarding/profiles/settings/profileDetails views render unchanged below ProfileMenu.

🤖 Generated with Claude Code

nirooba98 and others added 3 commits May 26, 2026 13:26
Add a browser-based Auth0 login flow targeting GitHub as the identity
provider. The extension opens the Auth0 universal-login URL in the
user's default browser, receives the authorization code back via a
vscode://codepathfinder.secureflow/auth-callback URI handler, and
exchanges it for tokens using PKCE — no client secret is embedded
since the Auth0 application is a Native (public) client.

Tokens and the userinfo payload are stored in SecretStorage; an
AuthService singleton fans out session changes to a status bar item
(\$(github) <handle> / Sign in) and to a thin AuthHeader strip at the
top of the sidepanel webview that exposes Sign in / Sign out controls.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Replace the built-in \$(github) glyph in the Code Pathfinder status bar
item with the brand /p. mark, registered as a custom codicon via
contributes.icons. A new scripts/build-icon-font.mjs flattens the
source SVG's transforms and merges its paths through svgpath (because
svgicons2svgfont, used internally by svgtofont, ignores transforms,
honors only the first <path>, and assumes a zero-origin viewBox),
then emits .woff/.woff2 into resources/icon-font/. The font is
~1 KB and ships with the published vsix; the scripts/ directory is
excluded.

Re-run with: npm run build:icon-font

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Replace the thin AuthHeader strip with a dedicated, gating login page
inspired by the developer's mockup: centered /p. logo, tagline, and
provider buttons (Google, GitHub, Microsoft) plus Continue as Guest.
Once a session exists, the existing onboarding/profiles/settings/
profileDetails views render below a top-right ProfileMenu (avatar,
handle, click-to-open dropdown with Sign out).

AuthService.login() now takes an Auth0Connection ('github' |
'google-oauth2' | 'windowslive') instead of relying on a hardcoded
constant. A tagged Session union ({kind:'user'|'guest'|'none'}) is
broadcast through onDidChangeSession and persisted alongside
SecretStorage tokens via a globalState flag for guest mode. The
webview gates rendering on session.kind, leaving the panel blank
until the initial auth:state reply lands to avoid a login-page
flash.

The Microsoft button is committed but currently hidden via comment;
re-enable after the Auth0 windowslive social connection is wired.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@safedep
Copy link
Copy Markdown

safedep Bot commented May 26, 2026

SafeDep Report Summary

Green Malicious Packages Badge Green Vulnerable Packages Badge Green Risky License Badge

Package Details
Package Malware Vulnerability Risky License Report
@isaacs/fs-minipass @ 4.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
@npmcli/agent @ 3.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
@npmcli/fs @ 4.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
@types/sax @ 1.2.7
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
@xmldom/xmldom @ 0.9.10
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
a-sync-waterfall @ 1.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
abbrev @ 3.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
any-promise @ 1.3.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
asap @ 2.0.6
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
auto-config-loader @ 2.0.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
bindings @ 1.5.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
boolbase @ 1.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
bufferstreams @ 4.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
cacache @ 19.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
cheerio @ 1.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
cheerio-select @ 2.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
chownr @ 3.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
colors-cli @ 1.0.33
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
css-select @ 5.2.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
css-tree @ 2.3.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
css-what @ 6.2.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
csso @ 5.0.5
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
cubic2quad @ 1.2.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
data-uri-to-buffer @ 4.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
dom-serializer @ 2.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
domelementtype @ 2.3.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
domhandler @ 5.0.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
domutils @ 3.2.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
encoding @ 0.1.13
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
encoding-sniffer @ 0.2.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
entities @ 4.5.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
env-paths @ 2.2.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
err-code @ 2.0.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
exponential-backoff @ 3.1.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
fetch-blob @ 3.2.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
file-uri-to-path @ 1.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
formdata-polyfill @ 4.0.10
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
fs-extra @ 11.2.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
fs-minipass @ 3.0.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
htmlparser2 @ 9.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
http-cache-semantics @ 4.2.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
iconv-lite @ 0.6.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
image2uri @ 2.1.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ini @ 5.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ip-address @ 10.2.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
jiti @ 2.7.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
jsonc-eslint-parser @ 2.4.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
jsonfile @ 6.2.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
lines-and-columns @ 1.2.4
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
lodash @ 4.18.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
make-fetch-happen @ 14.0.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
mdn-data @ 2.0.30
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
microbuffer @ 1.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
minipass-collect @ 2.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
minipass-fetch @ 4.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
minipass-flush @ 1.0.7
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
minipass-pipeline @ 1.2.4
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
minipass-sized @ 1.0.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
minizlib @ 3.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
mz @ 2.7.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
nan @ 2.27.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
negotiator @ 1.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
node-domexception @ 1.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
node-fetch @ 3.3.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
node-gyp @ 11.5.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
nopt @ 8.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
nth-check @ 2.1.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
nunjucks @ 3.2.4
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
parse5 @ 7.3.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
parse5-htmlparser2-tree-adapter @ 7.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
parse5-parser-stream @ 7.1.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
pirates @ 4.0.7
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
proc-log @ 5.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
promise-retry @ 2.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
retry @ 0.12.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
safer-buffer @ 2.1.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
sax @ 1.6.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
smart-buffer @ 4.2.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
socks @ 2.8.9
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
socks-proxy-agent @ 8.0.5
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ssri @ 12.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
sucrase @ 3.35.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
svg-pathdata @ 7.2.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
svg2ttf @ 6.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
svgicons2svgfont @ 15.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
svgo @ 3.3.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
svgpath @ 2.6.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
svgtofont @ 6.5.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
tar @ 7.5.15
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
thenify @ 3.3.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
thenify-all @ 1.6.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
toml-eslint-parser @ 0.10.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
transformation-matrix @ 3.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ts-interface-checker @ 0.1.13
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ttf2eot @ 3.1.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ttf2woff @ 3.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
ttf2woff2 @ 8.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
undici @ 6.25.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
unique-filename @ 4.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
unique-slug @ 5.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
universalify @ 2.0.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
web-streams-polyfill @ 3.3.3
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
whatwg-encoding @ 3.1.1
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
whatwg-mimetype @ 4.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
yallist @ 5.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
yaml @ 2.9.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
yaml-eslint-parser @ 1.3.2
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗
yerror @ 8.0.0
npm extension/secureflow/package-lock.json
✔️ ✔️ ✔️ 🔗

View complete scan results →

This report is generated by SafeDep Github App

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