Refactor Layout code - Githubissues

Description

Currently, there are two different Layout implementation in the frontend architecture:

The getLayoutmethod:

// _app.js
function MyApp({ Component, pageProps }) {
const getLayout = Component.getLayout || ((page) => page);
return getLayout(
<AuthContextProvider>
  <Component {...pageProps} />
</AuthContextProvider>
);
}

The Include <Navbar/> component in any page that needs it method:

// index.js
<Head>
<title>Homepage</title>
<meta
name="viewport"
content="initial-scale=1.0, width=device-width"
/>
</Head>
<NavBar /> // The Navbar component needs to be included in any page that needs a Navbar
<div className="container mx-auto p-5 lg:p-14">
// some more code.

Proposal

Implement a unifying Navbar structure in the _app.js file. This would also provide the app with a single <AuthContextProvider>, ensuring all states in the app is properly synced.

ManPhamQuang / COSC2769-rmit

Refactor Layout code #86

Description

Proposal