Revize 1865a0be
Přidáno uživatelem Pavel Fidransky před více než 4 roky(ů)
client/src/Nav.js | ||
---|---|---|
1 | 1 |
import React from 'react'; |
2 | 2 |
import './App.css'; |
3 | 3 |
import { Link } from 'react-router-dom'; |
4 |
import * as api_fetch from './api'
|
|
4 |
import * as api from './api';
|
|
5 | 5 |
|
6 |
function Nav(props) { |
|
7 |
return ( |
|
8 |
props.currentUser === undefined |
|
9 |
? |
|
6 |
export default function Nav(props) { |
|
7 |
if (props.currentUser === undefined) { |
|
8 |
return ( |
|
10 | 9 |
<nav className="top-nav"> |
11 | 10 |
<Link className="link-nav" to="/login"><h1>YOSO</h1></Link> |
12 | 11 |
</nav> |
13 |
: |
|
14 |
<nav className="top-nav"> |
|
15 |
<Link className="link-nav" to="/"><h1>YOSO</h1></Link> |
|
16 |
<div className="profile-comp"> |
|
17 |
<img src={props.currentUser.photo} className="img-avatar" alt="profile_photo"></img> |
|
18 |
<h2>{props.currentUser.name}</h2> |
|
19 |
<ul> |
|
20 |
{props.currentUser.role === 'EMPLOYER' ? |
|
21 |
<li> |
|
22 |
<Link to="/setting"> |
|
23 |
<svg className="bi bi-gear-fill navIcon" width="20px" height="20px" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> |
|
24 |
<path fillRule="evenodd" d="M8.837 1.626c-.246-.835-1.428-.835-1.674 0l-.094.319A1.873 1.873 0 0 1 4.377 3.06l-.292-.16c-.764-.415-1.6.42-1.184 1.185l.159.292a1.873 1.873 0 0 1-1.115 2.692l-.319.094c-.835.246-.835 1.428 0 1.674l.319.094a1.873 1.873 0 0 1 1.115 2.693l-.16.291c-.415.764.42 1.6 1.185 1.184l.292-.159a1.873 1.873 0 0 1 2.692 1.116l.094.318c.246.835 1.428.835 1.674 0l.094-.319a1.873 1.873 0 0 1 2.693-1.115l.291.16c.764.415 1.6-.42 1.184-1.185l-.159-.291a1.873 1.873 0 0 1 1.116-2.693l.318-.094c.835-.246.835-1.428 0-1.674l-.319-.094a1.873 1.873 0 0 1-1.115-2.692l.16-.292c.415-.764-.42-1.6-1.185-1.184l-.291.159A1.873 1.873 0 0 1 8.93 1.945l-.094-.319zm-2.633-.283c.527-1.79 3.065-1.79 3.592 0l.094.319a.873.873 0 0 0 1.255.52l.292-.16c1.64-.892 3.434.901 2.54 2.541l-.159.292a.873.873 0 0 0 .52 1.255l.319.094c1.79.527 1.79 3.065 0 3.592l-.319.094a.873.873 0 0 0-.52 1.255l.16.292c.893 1.64-.902 3.434-2.541 2.54l-.292-.159a.873.873 0 0 0-1.255.52l-.094.319c-.527 1.79-3.065 1.79-3.592 0l-.094-.319a.873.873 0 0 0-1.255-.52l-.292.16c-1.64.893-3.433-.902-2.54-2.541l.159-.292a.873.873 0 0 0-.52-1.255l-.319-.094c-1.79-.527-1.79-3.065 0-3.592l.319-.094a.873.873 0 0 0 .52-1.255l-.16-.292c-.892-1.64.902-3.433 2.541-2.54l.292.159a.873.873 0 0 0 1.255-.52l.094-.319z"/> |
|
25 |
<path fillRule="evenodd" d="M8 5.754a2.246 2.246 0 1 0 0 4.492 2.246 2.246 0 0 0 0-4.492zM4.754 8a3.246 3.246 0 1 1 6.492 0 3.246 3.246 0 0 1-6.492 0z"/> |
|
26 |
</svg> |
|
27 |
</Link> |
|
28 |
</li> |
|
29 |
: null } |
|
30 |
<li> |
|
31 |
<button className="btn-logout" onClick={() => api_fetch.logOut()}> |
|
32 |
<svg className="bi bi-power navIcon" width="20px" height="20px" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> |
|
33 |
<path fillRule="evenodd" d="M5.578 4.437a5 5 0 1 0 4.922.044l.5-.866a6 6 0 1 1-5.908-.053l.486.875z"/> |
|
34 |
<path fillRule="evenodd" d="M7.5 8V1h1v7h-1z"/> |
|
35 |
</svg> |
|
36 |
</button> |
|
37 |
</li> |
|
38 |
</ul> |
|
39 |
</div> |
|
40 |
</nav> |
|
41 |
) |
|
42 |
} |
|
12 |
); |
|
13 |
} |
|
43 | 14 |
|
44 |
|
|
45 |
export default Nav; |
|
15 |
return ( |
|
16 |
<nav className="top-nav"> |
|
17 |
<Link className="link-nav" to="/"><h1>YOSO</h1></Link> |
|
18 |
<div className="profile-comp"> |
|
19 |
<img src={props.currentUser.photo} className="img-avatar" alt="profile_photo"></img> |
|
20 |
<h2>{props.currentUser.name}</h2> |
|
21 |
<ul> |
|
22 |
{props.currentUser.role === 'EMPLOYER' ? ( |
|
23 |
<li> |
|
24 |
<Link to="/setting"> |
|
25 |
<svg className="bi bi-gear-fill navIcon" width="20px" height="20px" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> |
|
26 |
<path fillRule="evenodd" d="M8.837 1.626c-.246-.835-1.428-.835-1.674 0l-.094.319A1.873 1.873 0 0 1 4.377 3.06l-.292-.16c-.764-.415-1.6.42-1.184 1.185l.159.292a1.873 1.873 0 0 1-1.115 2.692l-.319.094c-.835.246-.835 1.428 0 1.674l.319.094a1.873 1.873 0 0 1 1.115 2.693l-.16.291c-.415.764.42 1.6 1.185 1.184l.292-.159a1.873 1.873 0 0 1 2.692 1.116l.094.318c.246.835 1.428.835 1.674 0l.094-.319a1.873 1.873 0 0 1 2.693-1.115l.291.16c.764.415 1.6-.42 1.184-1.185l-.159-.291a1.873 1.873 0 0 1 1.116-2.693l.318-.094c.835-.246.835-1.428 0-1.674l-.319-.094a1.873 1.873 0 0 1-1.115-2.692l.16-.292c.415-.764-.42-1.6-1.185-1.184l-.291.159A1.873 1.873 0 0 1 8.93 1.945l-.094-.319zm-2.633-.283c.527-1.79 3.065-1.79 3.592 0l.094.319a.873.873 0 0 0 1.255.52l.292-.16c1.64-.892 3.434.901 2.54 2.541l-.159.292a.873.873 0 0 0 .52 1.255l.319.094c1.79.527 1.79 3.065 0 3.592l-.319.094a.873.873 0 0 0-.52 1.255l.16.292c.893 1.64-.902 3.434-2.541 2.54l-.292-.159a.873.873 0 0 0-1.255.52l-.094.319c-.527 1.79-3.065 1.79-3.592 0l-.094-.319a.873.873 0 0 0-1.255-.52l-.292.16c-1.64.893-3.433-.902-2.54-2.541l.159-.292a.873.873 0 0 0-.52-1.255l-.319-.094c-1.79-.527-1.79-3.065 0-3.592l.319-.094a.873.873 0 0 0 .52-1.255l-.16-.292c-.892-1.64.902-3.433 2.541-2.54l.292.159a.873.873 0 0 0 1.255-.52l.094-.319z"/> |
|
27 |
<path fillRule="evenodd" d="M8 5.754a2.246 2.246 0 1 0 0 4.492 2.246 2.246 0 0 0 0-4.492zM4.754 8a3.246 3.246 0 1 1 6.492 0 3.246 3.246 0 0 1-6.492 0z"/> |
|
28 |
</svg> |
|
29 |
</Link> |
|
30 |
</li> |
|
31 |
) : null} |
|
32 |
<li> |
|
33 |
<button className="btn-logout" onClick={() => api.logOut()}> |
|
34 |
<svg className="bi bi-power navIcon" width="20px" height="20px" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> |
|
35 |
<path fillRule="evenodd" d="M5.578 4.437a5 5 0 1 0 4.922.044l.5-.866a6 6 0 1 1-5.908-.053l.486.875z"/> |
|
36 |
<path fillRule="evenodd" d="M7.5 8V1h1v7h-1z"/> |
|
37 |
</svg> |
|
38 |
</button> |
|
39 |
</li> |
|
40 |
</ul> |
|
41 |
</div> |
|
42 |
</nav> |
|
43 |
); |
|
44 |
} |
Také k dispozici: Unified diff
re #58 massive code formatting