|
1 | 1 | import React, { useState, useEffect } from "react";
|
2 |
| -import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom"; |
| 2 | +import { Switch, Route, Link } from "react-router-dom"; |
3 | 3 | import "bootstrap/dist/css/bootstrap.min.css";
|
4 | 4 | import "./App.css";
|
5 | 5 |
|
@@ -33,87 +33,85 @@ const App = () => {
|
33 | 33 | };
|
34 | 34 |
|
35 | 35 | return (
|
36 |
| - <Router> |
37 |
| - <div> |
38 |
| - <nav className="navbar navbar-expand navbar-dark bg-dark"> |
39 |
| - <Link to={"/"} className="navbar-brand"> |
40 |
| - bezKoder |
41 |
| - </Link> |
42 |
| - <div className="navbar-nav mr-auto"> |
| 36 | + <div> |
| 37 | + <nav className="navbar navbar-expand navbar-dark bg-dark"> |
| 38 | + <Link to={"/"} className="navbar-brand"> |
| 39 | + bezKoder |
| 40 | + </Link> |
| 41 | + <div className="navbar-nav mr-auto"> |
| 42 | + <li className="nav-item"> |
| 43 | + <Link to={"/home"} className="nav-link"> |
| 44 | + Home |
| 45 | + </Link> |
| 46 | + </li> |
| 47 | + |
| 48 | + {showModeratorBoard && ( |
43 | 49 | <li className="nav-item">
|
44 |
| - <Link to={"/home"} className="nav-link"> |
45 |
| - Home |
| 50 | + <Link to={"/mod"} className="nav-link"> |
| 51 | + Moderator Board |
46 | 52 | </Link>
|
47 | 53 | </li>
|
| 54 | + )} |
48 | 55 |
|
49 |
| - {showModeratorBoard && ( |
50 |
| - <li className="nav-item"> |
51 |
| - <Link to={"/mod"} className="nav-link"> |
52 |
| - Moderator Board |
53 |
| - </Link> |
54 |
| - </li> |
55 |
| - )} |
| 56 | + {showAdminBoard && ( |
| 57 | + <li className="nav-item"> |
| 58 | + <Link to={"/admin"} className="nav-link"> |
| 59 | + Admin Board |
| 60 | + </Link> |
| 61 | + </li> |
| 62 | + )} |
56 | 63 |
|
57 |
| - {showAdminBoard && ( |
58 |
| - <li className="nav-item"> |
59 |
| - <Link to={"/admin"} className="nav-link"> |
60 |
| - Admin Board |
61 |
| - </Link> |
62 |
| - </li> |
63 |
| - )} |
| 64 | + {currentUser && ( |
| 65 | + <li className="nav-item"> |
| 66 | + <Link to={"/user"} className="nav-link"> |
| 67 | + User |
| 68 | + </Link> |
| 69 | + </li> |
| 70 | + )} |
| 71 | + </div> |
64 | 72 |
|
65 |
| - {currentUser && ( |
66 |
| - <li className="nav-item"> |
67 |
| - <Link to={"/user"} className="nav-link"> |
68 |
| - User |
69 |
| - </Link> |
70 |
| - </li> |
71 |
| - )} |
| 73 | + {currentUser ? ( |
| 74 | + <div className="navbar-nav ml-auto"> |
| 75 | + <li className="nav-item"> |
| 76 | + <Link to={"/profile"} className="nav-link"> |
| 77 | + {currentUser.username} |
| 78 | + </Link> |
| 79 | + </li> |
| 80 | + <li className="nav-item"> |
| 81 | + <a href="/login" className="nav-link" onClick={logOut}> |
| 82 | + LogOut |
| 83 | + </a> |
| 84 | + </li> |
72 | 85 | </div>
|
| 86 | + ) : ( |
| 87 | + <div className="navbar-nav ml-auto"> |
| 88 | + <li className="nav-item"> |
| 89 | + <Link to={"/login"} className="nav-link"> |
| 90 | + Login |
| 91 | + </Link> |
| 92 | + </li> |
73 | 93 |
|
74 |
| - {currentUser ? ( |
75 |
| - <div className="navbar-nav ml-auto"> |
76 |
| - <li className="nav-item"> |
77 |
| - <Link to={"/profile"} className="nav-link"> |
78 |
| - {currentUser.username} |
79 |
| - </Link> |
80 |
| - </li> |
81 |
| - <li className="nav-item"> |
82 |
| - <a href="/login" className="nav-link" onClick={logOut}> |
83 |
| - LogOut |
84 |
| - </a> |
85 |
| - </li> |
86 |
| - </div> |
87 |
| - ) : ( |
88 |
| - <div className="navbar-nav ml-auto"> |
89 |
| - <li className="nav-item"> |
90 |
| - <Link to={"/login"} className="nav-link"> |
91 |
| - Login |
92 |
| - </Link> |
93 |
| - </li> |
94 |
| - |
95 |
| - <li className="nav-item"> |
96 |
| - <Link to={"/register"} className="nav-link"> |
97 |
| - Sign Up |
98 |
| - </Link> |
99 |
| - </li> |
100 |
| - </div> |
101 |
| - )} |
102 |
| - </nav> |
| 94 | + <li className="nav-item"> |
| 95 | + <Link to={"/register"} className="nav-link"> |
| 96 | + Sign Up |
| 97 | + </Link> |
| 98 | + </li> |
| 99 | + </div> |
| 100 | + )} |
| 101 | + </nav> |
103 | 102 |
|
104 |
| - <div className="container mt-3"> |
105 |
| - <Switch> |
106 |
| - <Route exact path={["/", "/home"]} component={Home} /> |
107 |
| - <Route exact path="/login" component={Login} /> |
108 |
| - <Route exact path="/register" component={Register} /> |
109 |
| - <Route exact path="/profile" component={Profile} /> |
110 |
| - <Route path="/user" component={BoardUser} /> |
111 |
| - <Route path="/mod" component={BoardModerator} /> |
112 |
| - <Route path="/admin" component={BoardAdmin} /> |
113 |
| - </Switch> |
114 |
| - </div> |
| 103 | + <div className="container mt-3"> |
| 104 | + <Switch> |
| 105 | + <Route exact path={["/", "/home"]} component={Home} /> |
| 106 | + <Route exact path="/login" component={Login} /> |
| 107 | + <Route exact path="/register" component={Register} /> |
| 108 | + <Route exact path="/profile" component={Profile} /> |
| 109 | + <Route path="/user" component={BoardUser} /> |
| 110 | + <Route path="/mod" component={BoardModerator} /> |
| 111 | + <Route path="/admin" component={BoardAdmin} /> |
| 112 | + </Switch> |
115 | 113 | </div>
|
116 |
| - </Router> |
| 114 | + </div> |
117 | 115 | );
|
118 | 116 | };
|
119 | 117 |
|
|
0 commit comments