Refactor: extract shared PKCE helpers into utils/pkce.ts

[ryan-crabbe-berri]

Summary

• Extracts base64UrlEncode, generateCodeVerifier, and generateCodeChallenge into a shared src/utils/pkce.ts module
• Updates useMcpOAuthFlow and useUserMcpOAuthFlow hooks to import from the shared module instead of defining their own copies
• No behavioral changes — pure deduplication

Test plan

• Verify admin MCP OAuth flow (create-server form) still completes end-to-end
• Verify user MCP OAuth connect flow still completes end-to-end
• Confirm npm run build passes with no type errors

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
litellm	Ready	Preview, Comment	Apr 16, 2026 5:37pm

[greptile-apps]

Greptile Summary

This PR extracts the duplicated PKCE helper functions (base64UrlEncode, generateCodeVerifier, generateCodeChallenge) from useMcpOAuthFlow.tsx and useUserMcpOAuthFlow.tsx into a new shared src/utils/pkce.ts module, following the project's convention of placing shared utilities in src/utils/. The two prior implementations were functionally identical (differing only in local variable names), and the new shared implementation is a direct match — no behavioral changes.

Confidence Score: 5/5

Safe to merge — pure deduplication with no behavioral changes and correct PKCE implementation.

All three implementations (original useMcpOAuthFlow, original useUserMcpOAuthFlow, new shared pkce.ts) are functionally identical. The refactoring follows the project's established src/utils/ convention, and the PKCE primitives correctly implement RFC 7636. No logic was altered.

No files require special attention.

Important Files Changed

Filename	Overview
ui/litellm-dashboard/src/utils/pkce.ts	New shared module exporting generateCodeVerifier and generateCodeChallenge; implementation is correct and matches the RFC 7636 PKCE spec (32-byte random verifier, SHA-256 challenge).
ui/litellm-dashboard/src/hooks/useMcpOAuthFlow.tsx	Removed local PKCE helpers and replaced with imports from utils/pkce; call sites are unchanged (same function names were already used).
ui/litellm-dashboard/src/hooks/useUserMcpOAuthFlow.tsx	Removed local aliases (b64url, genVerifier, genChallenge) and replaced call sites with the canonical names from utils/pkce; behavior is identical.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A["useMcpOAuthFlow.tsx"] -->|"imports generateCodeVerifier\ngenerateCodeChallenge"| C["utils/pkce.ts"]
    B["useUserMcpOAuthFlow.tsx"] -->|"imports generateCodeVerifier\ngenerateCodeChallenge"| C
    C --> D["generateCodeVerifier()\n— 32-byte random, base64url"]
    C --> E["generateCodeChallenge(verifier)\n— SHA-256, base64url"]
    C --> F["base64UrlEncode(buffer)\n— internal helper"]

Loading

_{Reviews (1): Last reviewed commit: "Extract shared PKCE helpers into src/uti..." | Re-trigger Greptile}