Revize db0f300f
Přidáno uživatelem Jaroslav Hrubý před asi 2 roky(ů)
webapp/components/navigation/UserNavBar.tsx | ||
---|---|---|
1 |
import React, { useCallback, useContext } from 'react'; |
|
1 |
import React, { useCallback, useContext, useEffect, useState } from 'react';
|
|
2 | 2 |
import { Menu } from 'antd'; |
3 | 3 |
import { useRouter } from 'next/router'; |
4 | 4 |
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; |
5 | 5 |
import { faFileLines, faUser } from '@fortawesome/free-solid-svg-icons'; |
6 | 6 |
import { LoggedUserContext } from '../../contexts/LoggedUserContext'; |
7 |
import { userController } from '../../controllers'; |
|
7 | 8 |
|
8 | 9 |
const UserNavBar = () => { |
9 | 10 |
const router = useRouter(); |
10 | 11 |
const { logout } = useContext(LoggedUserContext); |
11 | 12 |
const { SubMenu } = Menu; |
13 |
const [name, setName] = useState<string>(''); |
|
12 | 14 |
|
13 | 15 |
const handleLogout = useCallback(() => { |
14 | 16 |
logout(); |
15 | 17 |
router.push('/login'); |
16 | 18 |
}, [logout, router]); |
17 | 19 |
|
20 |
async function fetchUsername() { |
|
21 |
let usr = (await userController.usersMeGet()).data.name; |
|
22 |
setName(usr ? usr : ''); |
|
23 |
} |
|
24 |
|
|
25 |
useEffect(() => { |
|
26 |
fetchUsername(); |
|
27 |
}, []); |
|
28 |
|
|
18 | 29 |
return ( |
19 | 30 |
<Menu theme="dark" mode="horizontal"> |
20 | 31 |
<Menu.Item key="1" onClick={() => router.push('/documents/annotator')}> |
21 | 32 |
<FontAwesomeIcon icon={faFileLines} /> Dokumenty |
22 | 33 |
</Menu.Item> |
23 | 34 |
|
24 |
<SubMenu |
|
25 |
key="account" |
|
26 |
icon={<FontAwesomeIcon icon={faUser} />} |
|
27 |
title={'Anotátor XY'} // TODO show username |
|
28 |
> |
|
35 |
<SubMenu key="account" icon={<FontAwesomeIcon icon={faUser} />} title={name}> |
|
29 | 36 |
<Menu.Item key="setting:2" onClick={() => handleLogout()}> |
30 | 37 |
Odhlásit se |
31 | 38 |
</Menu.Item> |
Také k dispozici: Unified diff
Displaying username in navigation bar