feat(web): integrate Clerk authentication with Convex#30
Merged
Conversation
Add end-to-end Clerk authentication to apps/web, wire it into the Convex backend via ConvexProviderWithClerk, and gate the add mutation behind identity verification. apps/web — authentication integration - package.json: add @clerk/nextjs ^7.5.9 - app/layout.tsx: wrap root layout with ClerkProvider - app/page.tsx: guard UI with Authenticated/Unauthenticated components; show UserButton when signed in and SignInButton when signed out - components/theme-provider.tsx: replace ConvexProvider with ConvexProviderWithClerk (useAuth from @clerk/nextjs) so Convex receives the active Clerk session token; remove dead ThemeHotkey, isTypingTarget, NextThemesProvider, and useTheme code - proxy.ts (Next.js 16 middleware): add clerkMiddleware() protecting all non-public routes; public routes: /sign-in(.*), /sign-up(.*) - app/(auth)/layout.tsx: centered layout for auth pages - app/(auth)/sign-in/[[...sign-in]]/page.tsx: Clerk hosted SignIn component - app/(auth)/sign-up/[[...sign-up]]/page.tsx: Clerk hosted SignUp component apps/widget — cleanup - components/theme-provider.tsx: remove dead ThemeHotkey, isTypingTarget, NextThemesProvider, and useTheme code; simplify to bare ConvexProvider packages/backend — auth configuration and hardening - convex/auth.config.ts: Clerk JWT provider config using CLERK_JWT_ISSUER_DOMAIN; node types via triple-slash reference since this file runs in Node.js (Convex CLI), not the V8 function runtime - convex/users.ts: gate add mutation behind ctx.auth.getUserIdentity() — throws "Not Authenticated" for unauthenticated callers - package.json: add @types/node ^20.19.41 (needed for auth.config.ts) - tsconfig.json: remove deprecated baseUrl (not required for paths in TS 5+) CI/tooling - ci.yml, release.yml, codeql.yml: add NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY to build env (read from GitHub repo variable NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY) so ClerkProvider initialises without throwing during next build in CI Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
|
Caution Review failedAn error occurred during the review process. Please try again later. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
apps/webwith protected routes, sign-in/sign-up pages, and middlewareConvexProviderWithClerkaddmutation behindctx.auth.getUserIdentity()inpackages/backendbaseUrlin backend tsconfig and add node types forauth.config.tsChanges Made
apps/web— authenticationpackage.json— added@clerk/nextjs ^7.5.9app/layout.tsx—ClerkProviderwraps the entire appapp/page.tsx—Authenticated/Unauthenticatedguards;UserButtonwhen signed in,SignInButtonwhen notcomponents/theme-provider.tsx— replacedConvexProviderwithConvexProviderWithClerk; removed deadThemeHotkey/isTypingTarget/NextThemesProvidercodeproxy.ts— Clerk middleware (Next.js 16 filename); protects all routes except/sign-inand/sign-upapp/(auth)/layout.tsx— centered layout for auth pagesapp/(auth)/sign-in/[[...sign-in]]/page.tsx— Clerk hosted SignIn UIapp/(auth)/sign-up/[[...sign-up]]/page.tsx— Clerk hosted SignUp UIapps/widget— cleanupcomponents/theme-provider.tsx— removed deadThemeHotkey,isTypingTarget,NextThemesProvidercodepackages/backend— auth hardeningconvex/auth.config.ts— Clerk JWT provider config;/// <reference types=node />forprocess.envin CLI contextconvex/users.ts—addmutation now requires authentication viactx.auth.getUserIdentity()package.json— added@types/node ^20.19.41tsconfig.json— removed deprecatedbaseUrl(unnecessary in TS 5+)CI
ci.yml,release.yml,codeql.yml—NEXT_PUBLIC_CLERK_PUBLISHABLE_KEYadded to build env from GitHub repo variableTesting
pnpm lint— clean (0 errors)pnpm typecheck— clean (0 errors)pnpm build— all 4 routes built:/,/_not-found,/sign-in,/sign-upƒ Proxy (Middleware)in build outputTest environment:
Checklist
.env.localgitignored)🤖 Generated with Claude Code