From ef58cd17b0fff31311097094701a61475de3a3f8 Mon Sep 17 00:00:00 2001 From: dlford Date: Fri, 12 Jan 2024 11:50:52 -0700 Subject: [PATCH] hotfix: hydration errors --- components/Layout.tsx | 8 +++++++- data/sponsors.ts | 16 ++++++++-------- pages/_app.tsx | 21 +++++++++++++++------ pages/_document.tsx | 4 ---- 4 files changed, 30 insertions(+), 19 deletions(-) diff --git a/components/Layout.tsx b/components/Layout.tsx index 8ba4f2f..b0d833e 100644 --- a/components/Layout.tsx +++ b/components/Layout.tsx @@ -18,6 +18,7 @@ import MenuItem from '@mui/material/MenuItem'; import TextField from '@mui/material/TextField'; import Toolbar from '@mui/material/Toolbar'; import Typography from '@mui/material/Typography'; +import dynamic from 'next/dynamic'; import Head from 'next/head'; import Image from 'next/image'; import { useRouter } from 'next/router'; @@ -124,7 +125,7 @@ function LanguageToggle() { ); } -export default function Layout({ +function Layout({ title, children, }: { @@ -558,3 +559,8 @@ export default function Layout({ ); } + +const NoSSRLayout = dynamic(() => Promise.resolve(Layout), { + ssr: false, +}); +export default NoSSRLayout; diff --git a/data/sponsors.ts b/data/sponsors.ts index 2e88ad5..8754411 100644 --- a/data/sponsors.ts +++ b/data/sponsors.ts @@ -1,11 +1,11 @@ -import idyllicDigital from '../resources/sponsors/idyllic-digital.png'; +// import idyllicDigital from '../resources/sponsors/idyllic-digital.png'; -const sponsors = [ - { - title: 'Idyllic Digital', - logo: idyllicDigital, - link: 'https://www.facebook.com/IdyllicDigitalServices/', - }, -]; +export type Sponsor = { + title: string; + logo: string; + link: string; +}; + +const sponsors: Sponsor[] = []; export default sponsors; diff --git a/pages/_app.tsx b/pages/_app.tsx index 0242284..97b4143 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -7,6 +7,7 @@ import '../styles/globals.css'; import { CacheProvider, EmotionCache } from '@emotion/react'; import { createTheme, CssBaseline, ThemeProvider } from '@mui/material'; import type { AppProps } from 'next/app'; +import Head from 'next/head'; import { appWithTranslation } from 'next-i18next'; import React from 'react'; @@ -29,12 +30,20 @@ function MyApp(props: MyAppProps) { } = props; return ( - - - - - - + <> + + + + + + + + + + ); } diff --git a/pages/_document.tsx b/pages/_document.tsx index 83abe70..196fba5 100644 --- a/pages/_document.tsx +++ b/pages/_document.tsx @@ -10,10 +10,6 @@ export default class MyDocument extends Document { return ( -