Navbar centralize

.gitignore

@@ -17,6 +17,7 @@
 .env.development.local
 .env.test.local
 .env.production.local
+.env
 
 npm-debug.log*
 yarn-debug.log*

package.json

@@ -3,9 +3,23 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "react": "^18.1.0",
+    "@auth0/auth0-react": "^2.1.0",
+    "@emotion/react": "^11.11.0",
+    "@emotion/styled": "^11.11.0",
+    "@material-ui/icons": "^4.11.3",
+    "@mui/joy": "^5.0.0-alpha.82",
+    "@mui/material": "^5.13.3",
+    "@mui/styles": "^5.13.2",
+    "axios": "^1.4.0",
+    "bootstrap": "^5.1.3",
+    "dotenv": "^16.1.3",
+    "react": "^18.2.0",
+    "react-bootstrap": "^2.7.4",
     "react-dom": "^18.1.0",
-    "react-scripts": "5.0.1"
+    "react-router-dom": "^6.11.2",
+    "react-scripts": "5.0.1",
+    "react-select": "^5.7.3",
+    "react-toastify": "^9.1.3"
   },
   "scripts": {
     "start": "react-scripts start",

src/App.js

@@ -1,17 +1,23 @@
-import React from "react";
-import logo from "./logo.png";
+import React, { createContext, useCallback, useEffect, useState } from "react";
+
+import LoginPage from "./components/LoginPage";
+import Listings from "./components/Listings";
+
+import NavBar from "./components/NavBar";
+import ItemListing from "./components/ItemListing";
+
+import { BrowserRouter, Route, Routes, Navigate, Link } from "react-router-dom";
+
+import { ToastContainer } from "react-toastify";
+import "react-toastify/dist/ReactToastify.css";
+
 import "./App.css";
 
 class App extends React.Component {
   render() {
     return (
       <div className="App">
-        <header className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
-          <p>
-            Edit <code>src/App.js</code> and save to reload.
-          </p>
-        </header>
+        <LoginPage />
       </div>
     );
   }

src/components/Carts.js

@@ -0,0 +1,20 @@
+import React, { useState, useContext, useEffect } from "react";
+import { useAuth0 } from "@auth0/auth0-react";
+
+import { useNavigate } from "react-router-dom";
+import { Link } from "react-router-dom";
+import { UserContext } from "../App";
+import { Button, Paper, Stack, TextField, Typography } from "@mui/material";
+import { toast } from "react-toastify";
+import NavBar from "./NavBar";
+
+const Carts = () => {
+	return (
+		<>
+			<NavBar />
+			<div>Carts</div>
+		</>
+	)
+}
+
+export default Carts;