commit 6d10fe14e1013d130522d45e9df47c7e04739164
Author: Dominik Poch <dpoch@email.cz>
Date:   Thu Apr 14 19:21:46 2022 +0200

    Refactored directory structure
    
    Refactored directory structure and changed structure of layouts of the annotation screen

diff --git a/webapp/components/annotation/annotationPanel.tsx b/webapp/components/annotation/annotationPanel.tsx
index 15e41f2..6dda582 100644
--- a/webapp/components/annotation/annotationPanel.tsx
+++ b/webapp/components/annotation/annotationPanel.tsx
@@ -2,12 +2,10 @@
  * Creates a panel in the annotation screen that contains a list of annotations.
  * @returns Panel with a list of annotations.
  */
-function AnnotationPanel() {
+export function AnnotationPanel() {
     return (
         <div>
             <p>Panel with a list of annotations</p>
         </div>
     );
 }
-
-export default AnnotationPanel;
diff --git a/webapp/components/annotation/documentAnnotationView.tsx b/webapp/components/annotation/documentAnnotationView.tsx
index 1032f77..2369e46 100644
--- a/webapp/components/annotation/documentAnnotationView.tsx
+++ b/webapp/components/annotation/documentAnnotationView.tsx
@@ -2,12 +2,10 @@
  * Creates an annotation view of a document.
  * @returns The annotation view.
  */
-function DocumentAnnotationView() {
+export function DocumentAnnotationView() {
     return (
         <div>
             <p>Main view with a rendered document</p>
         </div>
     );
 }
-
-export default DocumentAnnotationView;
diff --git a/webapp/components/annotation/tagPanel.tsx b/webapp/components/annotation/tagPanel.tsx
index 93109a1..aa86ccd 100644
--- a/webapp/components/annotation/tagPanel.tsx
+++ b/webapp/components/annotation/tagPanel.tsx
@@ -2,12 +2,10 @@
  * Creates a panel in the annotation screen that contains a list of tag.
  * @returns Panel with a list of tags.
  */
-function TagPanel() {
+export function TagPanel() {
     return (
         <div>
             <p>Panel with a list of tags</p>
         </div>
     );
 }
-
-export default TagPanel;
diff --git a/webapp/components/modals/addDocument.tsx b/webapp/components/modals/addDocument.tsx
index 89c48ec..f01fefd 100644
--- a/webapp/components/modals/addDocument.tsx
+++ b/webapp/components/modals/addDocument.tsx
@@ -9,7 +9,7 @@ const { Dragger } = Upload;
  * Creates a modal window that loads documents to the app.
  * @returns The modal window.
  */
-function AddDocument() {
+export function AddDocument() {
     const [visible, setVisible] = useState(true);
 
     /**
@@ -86,5 +86,3 @@ function AddDocument() {
         </Modal>
     );
 }
-
-export default AddDocument;
diff --git a/webapp/components/models/layoutProps.tsx b/webapp/components/models/layoutProps.tsx
deleted file mode 100644
index 1e9b0ba..0000000
--- a/webapp/components/models/layoutProps.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-import React from 'react';
-
-/**
- * Props prepared for a react stucture that is passed to a layout.
- */
-export type LayoutProps = {
-    children: React.ReactNode;
-};
diff --git a/webapp/components/navigation/adminNavBar.tsx b/webapp/components/navigation/adminNavBar.tsx
new file mode 100644
index 0000000..f9036cc
--- /dev/null
+++ b/webapp/components/navigation/adminNavBar.tsx
@@ -0,0 +1,11 @@
+/**
+ * Creates a navigation bar of an admin.
+ * @returns Navigation bar of an admin.
+ */
+export function AdminNavBar() {
+    return (
+        <div>
+            <p>Navigation bar of an admin.</p>
+        </div>
+    );
+}
diff --git a/webapp/components/navigation/userNavBar.tsx b/webapp/components/navigation/userNavBar.tsx
index c80bca1..e59e350 100644
--- a/webapp/components/navigation/userNavBar.tsx
+++ b/webapp/components/navigation/userNavBar.tsx
@@ -2,12 +2,10 @@
  * Creates a navigation bar of a normal user (annotator).
  * @returns Navigation bar of a user.
  */
-function UserNavBar() {
+export function UserNavBar() {
     return (
         <div>
             <p>Navigation bar of a normal user.</p>
         </div>
     );
 }
-
-export default UserNavBar;
diff --git a/webapp/components/types/layoutProps.tsx b/webapp/components/types/layoutProps.tsx
new file mode 100644
index 0000000..1e9b0ba
--- /dev/null
+++ b/webapp/components/types/layoutProps.tsx
@@ -0,0 +1,8 @@
+import React from 'react';
+
+/**
+ * Props prepared for a react stucture that is passed to a layout.
+ */
+export type LayoutProps = {
+    children: React.ReactNode;
+};
diff --git a/webapp/layouts/annotationLayout.tsx b/webapp/layouts/annotationLayout.tsx
deleted file mode 100644
index e079905..0000000
--- a/webapp/layouts/annotationLayout.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Layout } from 'antd';
-import AnnotationPanel from '../components/annotation/annotationPanel';
-import DocumentAnnotationView from '../components/annotation/documentAnnotationView';
-import TagPanel from '../components/annotation/tagPanel';
-import 'antd/dist/antd.css';
-import styles from '/styles/annotation.module.scss';
-import UserNavBar from '../components/navigation/userNavBar';
-
-const { Header, Content, Footer, Sider } = Layout;
-
-/**
- * Creates a layout of a document annotation screen. It contains a panel with a list of tags and a panel with a list of annotations.
- * @returns Annotation layout.
- */
-function AnnotationLayout() {
-    return (
-        <Layout>
-            <Header>
-                <UserNavBar />
-            </Header>
-            <Layout hasSider>
-                <Sider className={styles.leftSidePanel}>
-                    <TagPanel />
-                </Sider>
-                <Content className={styles.mainView}>
-                    <DocumentAnnotationView />
-                </Content>
-                <Sider className={styles.rightSidePanel}>
-                    <AnnotationPanel />
-                </Sider>
-            </Layout>
-            <Footer></Footer>
-        </Layout>
-    );
-}
-
-export default AnnotationLayout;
diff --git a/webapp/layouts/loginLayout.tsx b/webapp/layouts/loginLayout.tsx
index 54d6c53..0059309 100644
--- a/webapp/layouts/loginLayout.tsx
+++ b/webapp/layouts/loginLayout.tsx
@@ -2,7 +2,7 @@ import logo from '/public/usp-logo.svg';
 import Image from 'next/image';
 import styles from '/styles/login.module.scss';
 import { Col, Container, Row, Stack } from 'react-bootstrap';
-import { LayoutProps } from 'antd';
+import { LayoutProps } from '../components/models/layoutProps';
 
 /**
  * Creates layout of a login screen.
diff --git a/webapp/layouts/mainLayout.tsx b/webapp/layouts/mainLayout.tsx
new file mode 100644
index 0000000..83a5efb
--- /dev/null
+++ b/webapp/layouts/mainLayout.tsx
@@ -0,0 +1,30 @@
+import { LayoutProps } from '../components/models/layoutProps';
+import { Layout } from 'antd';
+import { UserNavBar } from '../components/navigation/userNavBar';
+import { AdminNavBar } from '../components/navigation/adminNavBar';
+import 'antd/dist/antd.css';
+
+const { Header, Content, Footer } = Layout;
+
+/**
+ * Creates layout of main screens.
+ * @param props Html structure of a login form.
+ * @returns The login screen.
+ */
+export function MainLayout(props: LayoutProps) {
+    return (
+        <Layout>
+            <Header>
+                {/**
+                 @todo: Select correct navigation bar
+                 {user && <UserNavBar />}
+                 {admin && <AdminNavBar />}
+                **/}
+            </Header>
+            <Content>
+                <main>{props.children}</main>
+            </Content>
+            <Footer></Footer>
+        </Layout>
+    );
+}
diff --git a/webapp/pages/annotation.tsx b/webapp/pages/annotation.tsx
deleted file mode 100644
index 6b2b9e5..0000000
--- a/webapp/pages/annotation.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import AnnotationLayout from '../layouts/annotationLayout';
-
-/**
- * Creates an annotation screen.
- * @returns The annotation screen.
- */
-function Annotation() {
-    return <AnnotationLayout />;
-}
-
-export default Annotation;
diff --git a/webapp/pages/annotation/index.tsx b/webapp/pages/annotation/index.tsx
new file mode 100644
index 0000000..58b3b21
--- /dev/null
+++ b/webapp/pages/annotation/index.tsx
@@ -0,0 +1,33 @@
+import { Layout } from 'antd';
+import { AnnotationPanel } from '../../components/annotation/annotationPanel';
+import { DocumentAnnotationView } from '../../components/annotation/documentAnnotationView';
+import { TagPanel } from '../../components/annotation/tagPanel';
+import { MainLayout } from '../../layouts/mainLayout';
+import 'antd/dist/antd.css';
+import styles from '/styles/annotation.module.scss';
+
+const { Content, Sider } = Layout;
+
+/**
+ * Creates an annotation screen.
+ * @returns The annotation screen.
+ */
+function Annotation() {
+    return (
+        <MainLayout>
+            <Layout hasSider>
+                <Sider className={styles.leftSidePanel}>
+                    <TagPanel />
+                </Sider>
+                <Content className={styles.mainView}>
+                    <DocumentAnnotationView />
+                </Content>
+                <Sider className={styles.rightSidePanel}>
+                    <AnnotationPanel />
+                </Sider>
+            </Layout>
+        </MainLayout>
+    );
+}
+
+export default Annotation;
