ContacList page created and route added

src/App.jsx

@@ -2,6 +2,8 @@ import { Container } from "react-bootstrap";
 import { Route, Routes } from "react-router-dom";
 import AuthRoute from "./components/AuthRoute";
 import NavBar from "./components/NavBar";
+import ContactProvider from "./context/ContactProvider";
+import ContactList from "./pages/ContactList";
 import Home from "./pages/Home";
 import Login from "./pages/Login";
 import PasswordReset from "./pages/PasswordReset";
@@ -18,6 +20,14 @@ const App = () => {
             <Route element={<AuthRoute />}>
               <Route path="/" element={<Home />} />
               <Route path="/home" element={<Home />} />
+              <Route
+                path="/contacts"
+                element={
+                  <ContactProvider>
+                    <ContactList />
+                  </ContactProvider>
+                }
+              />
             </Route>
             <Route path="/register" element={<Register />} />
             <Route path="/login" element={<Login />} />

src/pages/ContactList.jsx

@@ -0,0 +1,21 @@
+import { Button } from "react-bootstrap";
+
+const ContactList = () => {
+  return (
+    <div>
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "row",
+          justifyContent: "space-between",
+          marginTop: "10px",
+          marginBottom: "10px"
+        }}>
+        <h2 className="text-center">Contact List</h2>
+        <Button>Add Contact</Button>
+      </div>
+    </div>
+  );
+};
+
+export default ContactList;