wip

frontend/src/app/CoreLayout.tsx

@@ -6,6 +6,8 @@ import { UserForm } from './components/UserForm'
 import { TransactionList } from './components/TransactionList'
 import { AccountForm } from './components/AccountForm'
 import { Login } from './components/Login'
+import { AppHeader } from './layout/AppHeader'
+import { AppFooter } from './layout/AppFooter'
 
 export const CoreLayout = () => {
   const { user, selectedAccount } = useUserContext()
@@ -14,13 +16,13 @@ export const CoreLayout = () => {
 
   return (
     <div className="app">
-      <nav>
+      <AppHeader>
         <Link to="/">Home</Link>
         <Link to="/select">Select Budget</Link>
         <Link to="/account">Budget Details</Link>
         <Link to="/details">Transactions</Link>
         <Link to="/user">Profile</Link>
-      </nav>
+      </AppHeader>
 
       <Switch>
         <Route path="/user" component={UserForm} />
@@ -30,14 +32,8 @@ export const CoreLayout = () => {
         <Route path="/" component={Dashboard} />
       </Switch>
 
+      <AppFooter />
       {/* {showingModal && <TransactionModal account={account} />} */}
-
-      <footer>
-        <p>User: {user?.name}</p>
-        <p>|</p>
-        <p>Budget: {selectedAccount?.name}</p>
-        <p>|</p>
-      </footer>
     </div>
   )
 }