From f14a91c0bcfccf297886238826530de804f2477e Mon Sep 17 00:00:00 2001
From: plebbitor <mottoes_recap0u@icloud.com>
Date: Mon, 6 Mar 2023 18:38:33 +0100
Subject: [PATCH] added 404 page

---
 src/App.js                  |  2 ++
 src/components/Home.jsx     |  2 +-
 src/components/NotFound.jsx | 34 ++++++++++++++++++++++++++++++++++
 3 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 src/components/NotFound.jsx

diff --git a/src/App.js b/src/App.js
index b1573ac9..4a656b7e 100644
--- a/src/App.js
+++ b/src/App.js
@@ -5,6 +5,7 @@ import Home from './components/Home';
 import Board from './components/Board';
 import Thread from './components/Thread';
 import Catalog from './components/Catalog';
+import NotFound from './components/NotFound';
 import { createGlobalStyle } from 'styled-components';
 import 'react-tooltip/dist/react-tooltip.css';
 import preloadImages from './utils/preloadImages';
@@ -76,6 +77,7 @@ export default function App() {
         <Route path={`/:subplebbitAddress/catalog`} element={<Catalog setBodyStyle={setBodyStyle} /> }>
           <Route path='post' element={<Catalog />} />
         </Route>
+        <Route path='*' element={<NotFound />} />
       </Routes>
     </BoardContext.Provider>
   </div>
diff --git a/src/components/Home.jsx b/src/components/Home.jsx
index 927a2f06..33fbf019 100644
--- a/src/components/Home.jsx
+++ b/src/components/Home.jsx
@@ -5,7 +5,7 @@ import { BoardContext } from '../App';
 
 const Home = ({ setBodyStyle }) => {
   const [defaultSubplebbits, setDefaultSubplebbits] = useState([]);
-  const { selectedTitle, setSelectedTitle, selectedAddress, setSelectedAddress, selectedStyle, setSelectedStyle } = useContext(BoardContext);
+  const { setSelectedTitle, setSelectedAddress, setSelectedStyle } = useContext(BoardContext);
 
   useEffect(() => {
     setBodyStyle({
diff --git a/src/components/NotFound.jsx b/src/components/NotFound.jsx
new file mode 100644
index 00000000..63b596d6
--- /dev/null
+++ b/src/components/NotFound.jsx
@@ -0,0 +1,34 @@
+import React from 'react';
+import { Link } from "react-router-dom";
+import { Container, Header, Logo, Page, Boards, BoardsTitle } from './styles/Home.styled';
+
+
+const NotFound = ({ setBodyStyle }) => {
+
+  return (
+    <Container>
+      <Header>
+        <Logo>
+          <Link to="/">
+            <img alt="plebchan" src="/assets/logo/logo-transparent.png" />
+          </Link>
+        </Logo>
+      </Header>
+      <Page>
+        <Boards>
+          <BoardsTitle>
+            <h2 style={{textAlign: 'center'}}>404 Not Found</h2>
+          </BoardsTitle>
+          <img src="/assets/plebchan-husbando.jpg" style={{
+            display: "block",
+            margin: "auto",
+            padding: "15px", 
+            width: "50%"
+            }}></img>
+        </Boards>
+      </Page>
+    </Container>
+  );
+}
+
+export default NotFound;
\ No newline at end of file