mirror of
https://github.com/opus-tango/webapp-template.git
synced 2026-03-20 03:55:27 +00:00
add clerk as convex auth provider
This commit is contained in:
8
convex/auth.config.ts
Normal file
8
convex/auth.config.ts
Normal file
@@ -0,0 +1,8 @@
|
||||
export default {
|
||||
providors: [
|
||||
{
|
||||
domain: process.env.NEXT_PUBLIC_CLERK_FRONTEND_API_URL,
|
||||
applicationId: process.env.NEXTAUTH_ID,
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,6 +1,8 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Geist, Geist_Mono } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import { ClerkProvider } from "@clerk/nextjs";
|
||||
import ConvexClientProvider from "@/providors/ConvexClientProvider";
|
||||
|
||||
const geistSans = Geist({
|
||||
variable: "--font-geist-sans",
|
||||
@@ -23,12 +25,16 @@ export default function RootLayout({
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
>
|
||||
{children}
|
||||
</body>
|
||||
</html>
|
||||
<ClerkProvider>
|
||||
<ConvexClientProvider>
|
||||
<html lang="en">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
>
|
||||
{children}
|
||||
</body>
|
||||
</html>
|
||||
</ConvexClientProvider>
|
||||
</ClerkProvider>
|
||||
);
|
||||
}
|
||||
|
||||
18
src/middleware.ts
Normal file
18
src/middleware.ts
Normal file
@@ -0,0 +1,18 @@
|
||||
import { clerkMiddleware, createRouteMatcher } from '@clerk/nextjs/server'
|
||||
|
||||
const isPublicRoute = createRouteMatcher(['/'])
|
||||
|
||||
export default clerkMiddleware(async ( auth, req ) => {
|
||||
if (!isPublicRoute(req)) {
|
||||
await auth.protect()
|
||||
}
|
||||
})
|
||||
|
||||
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)(.*)',
|
||||
],
|
||||
}
|
||||
22
src/providors/ConvexClientProvider.tsx
Normal file
22
src/providors/ConvexClientProvider.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
"use client"
|
||||
|
||||
'use client'
|
||||
|
||||
import { ReactNode } from 'react'
|
||||
import { ConvexReactClient } from 'convex/react'
|
||||
import { ConvexProviderWithClerk } from 'convex/react-clerk'
|
||||
import { useAuth } from '@clerk/nextjs'
|
||||
|
||||
if (!process.env.NEXT_PUBLIC_CONVEX_URL) {
|
||||
throw new Error('Missing NEXT_PUBLIC_CONVEX_URL in your .env file')
|
||||
}
|
||||
|
||||
const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL)
|
||||
|
||||
export default function ConvexClientProvider({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
<ConvexProviderWithClerk client={convex} useAuth={useAuth}>
|
||||
{children}
|
||||
</ConvexProviderWithClerk>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user