Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 76f8ff9

Browse files
presleyppresleyp
authored
feat: Add Footer to every page with nav (#1009)
* Add Footer to AuthAndNav, rename * Fix in preferences layout * Remove double footer
1 parent 82275a8 commit 76f8ff9

File tree

8 files changed

+38
-36
lines changed

8 files changed

+38
-36
lines changed

‎site/src/AppRouter.tsx‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from "react"
22
import { Route, Routes } from "react-router-dom"
3-
import { AuthAndNav, RequireAuth } from "./components"
3+
import { RequireAuth } from "./components"
4+
import { AuthAndFrame } from "./components/AuthAndFrame/AuthAndFrame"
45
import { PreferencesLayout } from "./components/Preferences/Layout"
56
import { IndexPage } from "./pages"
67
import { NotFoundPage } from "./pages/404"
@@ -39,18 +40,18 @@ export const AppRouter: React.FC = () => (
3940
<Route
4041
index
4142
element={
42-
<AuthAndNav>
43+
<AuthAndFrame>
4344
<TemplatesPage />
44-
</AuthAndNav>
45+
</AuthAndFrame>
4546
}
4647
/>
4748
<Route path=":organization/:template">
4849
<Route
4950
index
5051
element={
51-
<AuthAndNav>
52+
<AuthAndFrame>
5253
<TemplatePage />
53-
</AuthAndNav>
54+
</AuthAndFrame>
5455
}
5556
/>
5657
<Route
@@ -68,35 +69,35 @@ export const AppRouter: React.FC = () => (
6869
<Route
6970
path=":workspace"
7071
element={
71-
<AuthAndNav>
72+
<AuthAndFrame>
7273
<WorkspacePage />
73-
</AuthAndNav>
74+
</AuthAndFrame>
7475
}
7576
/>
7677
</Route>
7778

7879
<Route
7980
path="users"
8081
element={
81-
<AuthAndNav>
82+
<AuthAndFrame>
8283
<UsersPage />
83-
</AuthAndNav>
84+
</AuthAndFrame>
8485
}
8586
/>
8687
<Route
8788
path="orgs"
8889
element={
89-
<AuthAndNav>
90+
<AuthAndFrame>
9091
<OrganizationsPage />
91-
</AuthAndNav>
92+
</AuthAndFrame>
9293
}
9394
/>
9495
<Route
9596
path="settings"
9697
element={
97-
<AuthAndNav>
98+
<AuthAndFrame>
9899
<SettingsPage />
99-
</AuthAndNav>
100+
</AuthAndFrame>
100101
}
101102
/>
102103

‎site/src/components/AuthAndFrame/AuthAndFrame.tsx‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import React from "react"
2+
import { Navbar } from "../Navbar"
3+
import { Footer } from "../Page/Footer"
4+
import { RequireAuth } from "../Page/RequireAuth"
5+
6+
interface AuthAndFrameProps {
7+
children: JSX.Element
8+
}
9+
10+
/**
11+
* Wraps page in RequireAuth and renders it between Navbar and Footer
12+
*/
13+
export const AuthAndFrame: React.FC<AuthAndFrameProps> = ({ children }) => (
14+
<RequireAuth>
15+
<>
16+
<Navbar />
17+
{children}
18+
<Footer />
19+
</>
20+
</RequireAuth>
21+
)

‎site/src/components/Page/AuthAndNav.tsx‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

‎site/src/components/Page/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,2 @@
1-
export * from "./AuthAndNav"
21
export * from "./Footer"
32
export * from "./RequireAuth"

‎site/src/components/Preferences/Layout.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import Box from "@material-ui/core/Box"
22
import React from "react"
33
import { Outlet } from "react-router-dom"
4-
import { AuthAndNav } from "../Page"
4+
import { AuthAndFrame } from "../AuthAndFrame/AuthAndFrame"
55
import { TabPanel } from "../TabPanel"
66

77
export const Language = {
@@ -21,14 +21,14 @@ const menuItems = [
2121

2222
export const PreferencesLayout: React.FC = () => {
2323
return (
24-
<AuthAndNav>
24+
<AuthAndFrame>
2525
<Box display="flex" flexDirection="column">
2626
<Box style={{ maxWidth: "1380px", margin: "1em auto" }}>
2727
<TabPanel title={Language.preferencesLabel} menuItems={menuItems}>
2828
<Outlet />
2929
</TabPanel>
3030
</Box>
3131
</Box>
32-
</AuthAndNav>
32+
</AuthAndFrame>
3333
)
3434
}

‎site/src/pages/templates/[organization]/[template]/index.tsx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import { EmptyState } from "../../../../components/EmptyState"
88
import { ErrorSummary } from "../../../../components/ErrorSummary"
99
import { Header } from "../../../../components/Header"
1010
import { FullScreenLoader } from "../../../../components/Loader/FullScreenLoader"
11-
import { Footer } from "../../../../components/Page"
1211
import { Column, Table } from "../../../../components/Table"
1312
import { unsafeSWRArgument } from "../../../../util"
1413
import { firstOrItem } from "../../../../util/array"
@@ -98,7 +97,6 @@ export const TemplatePage: React.FC = () => {
9897
<Paper style={{ maxWidth: "1380px", margin: "1em auto", width: "100%" }}>
9998
<Table {...tableProps} />
10099
</Paper>
101-
<Footer />
102100
</div>
103101
)
104102
}

‎site/src/pages/templates/index.tsx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import { CodeExample } from "../../components/CodeExample/CodeExample"
99
import { ErrorSummary } from "../../components/ErrorSummary"
1010
import { Header } from "../../components/Header"
1111
import { FullScreenLoader } from "../../components/Loader/FullScreenLoader"
12-
import { Footer } from "../../components/Page"
1312
import { Column, Table } from "../../components/Table"
1413

1514
export const TemplatesPage: React.FC = () => {
@@ -74,7 +73,6 @@ export const TemplatesPage: React.FC = () => {
7473
<Paper style={{ maxWidth: "1380px", margin: "1em auto", width: "100%" }}>
7574
<Table {...tableProps} />
7675
</Paper>
77-
<Footer />
7876
</div>
7977
)
8078
}

‎site/src/pages/workspaces/[workspace].tsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import useSWR from "swr"
55
import * as Types from "../../api/types"
66
import { ErrorSummary } from "../../components/ErrorSummary"
77
import { FullScreenLoader } from "../../components/Loader/FullScreenLoader"
8-
import { Footer } from "../../components/Page"
98
import { Workspace } from "../../components/Workspace"
109
import { unsafeSWRArgument } from "../../util"
1110
import { firstOrItem } from "../../util/array"
@@ -50,8 +49,6 @@ export const WorkspacePage: React.FC = () => {
5049
<div className={styles.inner}>
5150
<Workspace organization={organization} template={template} workspace={workspace} />
5251
</div>
53-
54-
<Footer />
5552
</div>
5653
)
5754
}

0 commit comments

Comments
 (0)