diff --git a/apps/next-template/.gitignore b/apps/next-template/.gitignore new file mode 100644 index 0000000..4e4766d --- /dev/null +++ b/apps/next-template/.gitignore @@ -0,0 +1,3 @@ + +# clerk configuration (can include secrets) +/.clerk/ diff --git a/apps/next-template/package.json b/apps/next-template/package.json index 07039fe..b6cd03e 100644 --- a/apps/next-template/package.json +++ b/apps/next-template/package.json @@ -12,6 +12,7 @@ "clean": "rm -rf .next" }, "dependencies": { + "@clerk/nextjs": "^6.22.0", "@repo/logger": "*", "@repo/ui": "*", "next": "^15.3.0", diff --git a/apps/next-template/src/app/clerk/page.tsx b/apps/next-template/src/app/clerk/page.tsx new file mode 100644 index 0000000..7a8aa4a --- /dev/null +++ b/apps/next-template/src/app/clerk/page.tsx @@ -0,0 +1,23 @@ +import { + Card, + CardHeader, + CardTitle, + CardContent, +} from "@repo/ui/components/card"; + +export default function ClerkTestPage() { + return ( +
+ + + Welcome, you are logged in! + + +

+ This is a protected test page. +

+ + +
+ ); +} diff --git a/apps/next-template/src/app/layout.tsx b/apps/next-template/src/app/layout.tsx index ac4f087..33e9b0c 100644 --- a/apps/next-template/src/app/layout.tsx +++ b/apps/next-template/src/app/layout.tsx @@ -1,5 +1,14 @@ import "@repo/ui/styles/styles.css"; import "@repo/ui/styles/global.css"; +import { + ClerkProvider, + SignInButton, + SignUpButton, + SignedIn, + SignedOut, + UserButton, +} from "@clerk/nextjs"; +import { Button } from "@repo/ui/components/button"; export default function RootLayout({ children, @@ -7,8 +16,24 @@ export default function RootLayout({ children: React.ReactNode; }) { return ( - - {children} - + + + +
+
+ + + + + + + + +
+
+ {children} + + + ); } diff --git a/apps/next-template/src/middleware.ts b/apps/next-template/src/middleware.ts new file mode 100644 index 0000000..800429b --- /dev/null +++ b/apps/next-template/src/middleware.ts @@ -0,0 +1,28 @@ +import { clerkMiddleware, createRouteMatcher } from "@clerk/nextjs/server"; + +const isProtectedRoute = createRouteMatcher(["/clerk(.*)"]); + +export default clerkMiddleware(async (auth, req) => { + // Uncomment the following line to enable Clerk's default behavior | Redirect to sign-in page if the user is not authenticated + // if (isProtectedRoute(req)) await auth.protect(); + + // More control over authentication flow + const { userId, redirectToSignIn } = await auth(); + + if (!userId && isProtectedRoute(req)) { + // Add custom logic to run before redirecting + console.log( + "User is not authenticated, redirecting to sign-in page..." + ); + return redirectToSignIn(); + } +}); + +export const config = { + matcher: [ + // Skip Next.js internals and all static files, unless found in search params + "/((?!_next|[^?]*\\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).*)", + // Always run for API routes + "/(api|trpc)(.*)", + ], +}; diff --git a/package-lock.json b/package-lock.json index 8225977..e1ab148 100644 --- a/package-lock.json +++ b/package-lock.json @@ -125,6 +125,7 @@ "apps/next-template": { "version": "0.0.0", "dependencies": { + "@clerk/nextjs": "^6.22.0", "@repo/logger": "*", "@repo/ui": "*", "next": "^15.3.0", @@ -1080,6 +1081,28 @@ "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-0" } }, + "node_modules/@clerk/nextjs": { + "version": "6.22.0", + "resolved": "https://registry.npmjs.org/@clerk/nextjs/-/nextjs-6.22.0.tgz", + "integrity": "sha512-Lh+hq4iuvuSgiWSDHDM9BAM8+YZU/wtADGo2TAU7FBVEZ6I3SwyXo5JEY4F7s30TpH3kS9qC/Ye3YA6VIOOu7Q==", + "license": "MIT", + "dependencies": { + "@clerk/backend": "^2.1.0", + "@clerk/clerk-react": "^5.32.0", + "@clerk/shared": "^3.9.7", + "@clerk/types": "^4.60.1", + "server-only": "0.0.1", + "tslib": "2.8.1" + }, + "engines": { + "node": ">=18.17.0" + }, + "peerDependencies": { + "next": "^13.5.7 || ^14.2.25 || ^15.2.3", + "react": "^18.0.0 || ^19.0.0 || ^19.0.0-0", + "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-0" + } + }, "node_modules/@clerk/remix": { "version": "4.8.1", "resolved": "https://registry.npmjs.org/@clerk/remix/-/remix-4.8.1.tgz", @@ -15457,6 +15480,12 @@ "node": ">= 0.8.0" } }, + "node_modules/server-only": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/server-only/-/server-only-0.0.1.tgz", + "integrity": "sha512-qepMx2JxAa5jjfzxG79yPPq+8BuFToHd1hm7kI+Z4zAq1ftQiP7HcxMhDDItrbtwVeLg/cY2JnKnrcFkmiswNA==", + "license": "MIT" + }, "node_modules/set-cookie-parser": { "version": "2.7.1", "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",