From 4cae14b9f86609b8c1f74d97a033e7091af49cb4 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Mon, 13 Dec 2021 12:06:06 +0100 Subject: chore: change app to use a layout I can now insert header/footer on each pages. --- src/pages/_app.tsx | 7 ++++--- src/pages/index.tsx | 10 ++++++++-- 2 files changed, 12 insertions(+), 5 deletions(-) (limited to 'src/pages') diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 6f08a02..8194b10 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -1,8 +1,9 @@ +import { AppPropsWithLayout } from '@ts/types/app'; import '../styles/globals.scss'; -import type { AppProps } from 'next/app'; -function MyApp({ Component, pageProps }: AppProps) { - return ; +function MyApp({ Component, pageProps }: AppPropsWithLayout) { + const getLayout = Component.getLayout ?? ((page) => page); + return getLayout(); } export default MyApp; diff --git a/src/pages/index.tsx b/src/pages/index.tsx index da31f7d..6022497 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,9 +1,11 @@ -import type { NextPage } from 'next'; +import Layout from '@components/Layouts/Layout'; +import { NextPageWithLayout } from '@ts/types/app'; import Head from 'next/head'; import Image from 'next/image'; +import type { ReactElement } from 'react'; import styles from '../styles/Home.module.css'; -const Home: NextPage = () => { +const Home: NextPageWithLayout = () => { return (
@@ -69,4 +71,8 @@ const Home: NextPage = () => { ); }; +Home.getLayout = function getLayout(page: ReactElement) { + return {page}; +}; + export default Home; -- cgit v1.2.3