Revize 8c45ccb0

Token management implemented, redirections

webapp/components/navigation/UserNavBar.tsx

@@ -1 @@
-/**
- * Creates a navigation bar of a normal user (annotator).
- * @returns Navigation bar of a user.
- */
-export function UserNavBar() {
+import React, { useCallback, useContext } from 'react';
+import { Menu } from 'antd';
+import { useRouter } from 'next/router';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faFileLines, faUser } from '@fortawesome/free-solid-svg-icons';
+import { LoggedUserContext } from '../../contexts/LoggedUserContext';
+
+const UserNavBar = () => {
+    const router = useRouter();
+    const { logout } = useContext(LoggedUserContext);
+    const { SubMenu } = Menu;
+
+    const handleLogout = useCallback(() => {
+        logout();
+        router.push('/login');
+    }, [logout, router]);
+
     return (
-        <div>
-            <p>Navigation bar of a normal user.</p>
-        </div>
+        <Menu theme="dark" mode="horizontal">
+            <Menu.Item key="1" onClick={() => router.push('/documents/annotator')}>
+                <FontAwesomeIcon icon={faFileLines} /> Dokumenty
+            </Menu.Item>
+
+            <SubMenu
+                key="account"
+                icon={<FontAwesomeIcon icon={faUser} />}
+                title={'Anotátor XY'} // TODO show username
+            >
+                <Menu.Item key="setting:2" onClick={() => handleLogout()}>
+                    Odhlásit se
+                </Menu.Item>
+            </SubMenu>
+        </Menu>
     );
-}
+};
+
+export default UserNavBar;