From ca8a4c92719eca64ca198b4eeba4b5a040393ba1 Mon Sep 17 00:00:00 2001
From: Guilherme Freire <guilhermefreire841@gmail.com>
Date: Sun, 16 Jul 2023 13:04:29 -0300
Subject: [PATCH] =?UTF-8?q?:construction:=20Feat:=20implementando=20p?=
 =?UTF-8?q?=C3=A1gina=20para=20conte=C3=BAdo=20n=C3=A3o=20encontrado?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.js                        | 30 ++++++++++++++++++++----------
 src/components/view/NoContent.jsx | 15 +++++++++++++++
 2 files changed, 35 insertions(+), 10 deletions(-)
 create mode 100644 src/components/view/NoContent.jsx

diff --git a/src/App.js b/src/App.js
index 8b31564..42e8d3d 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,22 +1,32 @@
 import './assets/css/App.css';
 import './index.css';
-import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import { BrowserRouter, Route, Router, RouterProvider, Routes, createBrowserRouter } from 'react-router-dom';
 import Home from './components/view/Home';
 import Navegar from './components/view/Navegar';
 import Game from './components/view/Game';
+import NoContent from './components/view/NoContent';
 
 function App() {
+
+  const router = createBrowserRouter([
+    {
+      path: "/",
+      element: <Home></Home>,
+      errorElement: <NoContent></NoContent>
+    },
+    {
+      path: "/navegar",
+      element: <Navegar></Navegar>
+    },
+    {
+      path: "/game/:id",
+      element: <Game></Game>
+    }
+  ]);
+
   return (
     <div className="App bg-stone-900 text-white">
-      <BrowserRouter>
-        <Routes>
-          <Route>
-            <Route index element={<Home></Home>}></Route>
-            <Route path='navegar' element={<Navegar></Navegar>}></Route>
-            <Route path='game/:id' element={<Game></Game>} ></Route>
-          </Route>
-        </Routes>
-      </BrowserRouter>
+      <RouterProvider router={router}></RouterProvider>
     </div>
   );
 }
diff --git a/src/components/view/NoContent.jsx b/src/components/view/NoContent.jsx
new file mode 100644
index 0000000..550fb8c
--- /dev/null
+++ b/src/components/view/NoContent.jsx
@@ -0,0 +1,15 @@
+
+function NoContent() {
+  return (
+    <div className="h-screen flex flex-col items-center justify-center text-center">
+      <div>
+        <h1 className="font-bold text-5xl mb-5">{ "Opss!" }</h1>
+        <h2 className="font-semibold text-2xl mb-3" >{ "Não encontramos a página que você procurava :(" }</h2>
+      </div>
+      <p className="text-stone-400 mb-8">{ "404 Not Found" }</p>
+      <a className="bg-stone-700 pt-3 pr-5 pb-3 pl-5 rounded-xl hover:bg-stone-500" href="/">{ "Voltar a página inicial" }</a>
+    </div>
+  );
+}
+
+export default NoContent;
\ No newline at end of file