wkadmin/the-tip-top-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: move GoogleOAuthProvider to client component to fix SSR errors

Browse Source
This commit is contained in:
soufiane 2025-11-18 19:03:33 +01:00
parent 7995b65ebe
commit 666fb1a1ac
2 changed files with 30 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
app/layout.tsx
View File

@ -1,9 +1,8 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import "./globals.css"; import "./globals.css";
import { AuthProvider } from "@/contexts/AuthContext";
import { Toaster } from "react-hot-toast"; import { Toaster } from "react-hot-toast";
import LayoutClient from "./layout-client"; import LayoutClient from "./layout-client";
import { GoogleOAuthProvider } from "@react-oauth/google"; import { Providers } from "./providers";
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Thé Tip Top - Jeu Concours", title: "Thé Tip Top - Jeu Concours",
@ -35,26 +34,14 @@ export const metadata: Metadata = {
}, },
}; };
const googleClientId = process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID || '';
export default function RootLayout({ children }: { children: React.ReactNode }) { export default function RootLayout({ children }: { children: React.ReactNode }) {
const content = (
<AuthProvider>
<LayoutClient>{children}</LayoutClient>
</AuthProvider>
);
return ( return (
<html lang="fr"> <html lang="fr">
<body className="min-h-screen flex flex-col bg-gray-50"> <body className="min-h-screen flex flex-col bg-gray-50">
{googleClientId ? ( <Providers>
<GoogleOAuthProvider clientId={googleClientId}> <LayoutClient>{children}</LayoutClient>
{content} </Providers>
</GoogleOAuthProvider> <Toaster
) : (
content
)}
<Toaster
position="top-right" position="top-right"
toastOptions={{ toastOptions={{
duration: 4000, duration: 4000,

25
app/providers.tsx Normal file
View File

@ -0,0 +1,25 @@
"use client";
import { GoogleOAuthProvider } from "@react-oauth/google";
import { AuthProvider } from "@/contexts/AuthContext";
import { ReactNode } from "react";
export function Providers({ children }: { children: ReactNode }) {
const googleClientId = process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID || '';
const content = (
<AuthProvider>
{children}
</AuthProvider>
);
if (googleClientId) {
return (
<GoogleOAuthProvider clientId={googleClientId}>
{content}
</GoogleOAuthProvider>
);
}
return content;
}