fix: change branding title tag on homepage

I forgot to pass isHome arg...

4 files changed, 20 insertions, 20 deletions

diff --git a/src/components/Branding/Branding.tsx b/src/components/Branding/Branding.tsx
index a8adf9b..d1f1ad7 100644
--- a/src/components/Branding/Branding.tsx
+++ b/src/components/Branding/Branding.tsx
@@ -6,9 +6,11 @@ import photo from '@assets/images/armand-philippot.jpg';
 import { config } from '@config/website';
 import styles from './Branding.module.scss';
 
-type BrandingReturn = ({ isHome }: { isHome?: boolean }) => ReactElement;
+type BrandingReturn = ({ isHome }: { isHome: boolean }) => ReactElement;
 
 const Branding: BrandingReturn = ({ isHome = false }) => {
+  const TitleTag = isHome ? 'h1' : 'p';
+
   return (
     <div className={styles.wrapper}>
       <div className={styles.logo}>
@@ -21,19 +23,11 @@ const Branding: BrandingReturn = ({ isHome = false }) => {
           layout="intrinsic"
         />
       </div>
-      {isHome ? (
-        <h1 className={styles.name}>
-          <Link href="/">
-            <a>{config.name}</a>
-          </Link>
-        </h1>
-      ) : (
-        <p className={styles.name}>
-          <Link href="/">
-            <a>{config.name}</a>
-          </Link>
-        </p>
-      )}
+      <TitleTag className={styles.name}>
+        <Link href="/">
+          <a>{config.name}</a>
+        </Link>
+      </TitleTag>
       <p className={styles.job}>{config.baseline}</p>
     </div>
   );
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 52da2e8..6691eb9 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -2,11 +2,11 @@ import Branding from '@components/Branding/Branding';
 import MainNav from '@components/MainNav/MainNav';
 import styles from './Header.module.scss';
 
-const Header = () => {
+const Header = ({ isHome }: { isHome: boolean }) => {
   return (
     <header className={styles.wrapper}>
       <div className={styles.body}>
-        <Branding />
+        <Branding isHome={isHome} />
         <MainNav />
       </div>
     </header>
diff --git a/src/components/Layouts/Layout.tsx b/src/components/Layouts/Layout.tsx
index 4270a17..7f8ab9d 100644
--- a/src/components/Layouts/Layout.tsx
+++ b/src/components/Layouts/Layout.tsx
@@ -1,12 +1,18 @@
-import { FunctionComponent } from 'react';
+import { ReactNode } from 'react';
 import Footer from '@components/Footer/Footer';
 import Header from '@components/Header/Header';
 import Main from '@components/Main/Main';
 
-const Layout: FunctionComponent = ({ children }) => {
+const Layout = ({
+  children,
+  isHome = false,
+}: {
+  children: ReactNode;
+  isHome?: boolean;
+}) => {
   return (
     <>
-      <Header />
+      <Header isHome={isHome} />
       <Main>{children}</Main>
       <Footer />
     </>
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 6654617..f51dec9 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -21,7 +21,7 @@ const Home: NextPageWithLayout<HomePageProps> = ({ data }) => {
 };
 
 Home.getLayout = function getLayout(page: ReactElement) {
-  return <Layout>{page}</Layout>;
+  return <Layout isHome={true}>{page}</Layout>;
 };
 
 export const getStaticProps: GetStaticProps = async (ctx) => {