Added a small description to all pages

client/src/pages/AppWrapper.tsx

@@ -19,6 +19,10 @@ const Teams = lazy(() => import('pages/Teams'));
 const TeamsCreate = lazy(() => import('pages/Teams/TeamsCreate'));
 const Settings = lazy(() => import('pages/Settings'));
 
+/**
+ * This component is a wrapper for all pages for the main application. It includes the header,
+ * sidebar and navigation. It also does the routing for the main application.
+ */
 export default function AppWrapper() {
     return (
         <Header>

client/src/pages/Introduction/index.tsx

@@ -12,6 +12,10 @@ import TeamForm from 'components/forms/TeamForm';
 
 import './intro.scss';
 
+/**
+ * This page is shown to a user if he is not yet a member of any team. It allows the user to create
+ * a new team of suggests to ask someone to add the user as a team member of a existing team.
+ */
 export default function Introduction() {
     const [username, setUsername] = useState('');
     const [showForm, setShowForm] = useState(false);

client/src/pages/Landing/partials/AboutApp/index.tsx → client/src/pages/Landing/AboutApp/index.tsx

@@ -5,6 +5,9 @@ import Project from 'components/ui/Project';
 
 import './about-app.scss';
 
+/**
+ * This is a small section containing information about the application.
+ */
 export default function AboutApp() {
     return (
         <section className="about-app-section content-container">

client/src/pages/Landing/partials/Contact/index.tsx → client/src/pages/Landing/Contact/index.tsx

@@ -3,6 +3,10 @@ import ContactForm from 'components/forms/ContactForm';
 
 import './contact.scss';
 
+/**
+ * This is a section with a form that allows users to contact the ryoko team. When send is pressed,
+ * a new email link is opened.
+ */
 export default function Contact() {
     return (
         <section className="contact-section content-container">

client/src/pages/Landing/partials/Features/index.tsx → client/src/pages/Landing/Features/index.tsx

 
 import './features.scss';
 
+/**
+ * This is a small section displaying three features of the application on the landing page.
+ */
 export default function Features() {
     return (
         <section className="features-section content-container">

client/src/pages/Landing/partials/Intro/index.tsx → client/src/pages/Landing/Intro/index.tsx

@@ -7,6 +7,10 @@ import ProjectsImage from 'images/preview/projects.jpg';
 
 import './intro.scss';
 
+/**
+ * This is the intro section of the landing page, containing the example images and the
+ * "Get started"-button.
+ */
 export default function Intro() {
     return (
         <section className="intro-section content-container">

client/src/pages/Landing/partials/Team/index.tsx → client/src/pages/Landing/Team/index.tsx

@@ -6,6 +6,10 @@ import ImageDaniel from 'images/daniel-planoetscher.jpg';
 
 import './team.scss';
 
+/**
+ * This is the team section of the landing page. It contains information on the team members of the
+ * project.
+ */
 export default function Team() {
     return (
         <section className="team-section content-container">

client/src/pages/Landing/index.tsx

@@ -2,14 +2,18 @@
 import Page from 'components/layout/Page';
 import Logo from 'images/logo.svg';
 
-import Intro from './partials/Intro';
-import Features from './partials/Features';
-import AboutApp from './partials/AboutApp';
-import Team from './partials/Team';
-import Contact from './partials/Contact';
+import Intro from './Intro';
+import Features from './Features';
+import AboutApp from './AboutApp';
+import Team from './Team';
+import Contact from './Contact';
 
 import './landing.scss';
 
+/**
+ * This page is the landing page of the project. It shows some information on the project and
+ * the team. It also includes a contact section with a contact form.
+ */
 export default function LandingPage(): JSX.Element {
     return (
         <Page className="landing-page">

client/src/pages/Login/index.tsx

@@ -10,6 +10,10 @@ import LoginForm from 'components/forms/LoginForm';
 
 import './login.scss';
 
+/**
+ * This page contains the ability for the user to login. It also contains a link to the
+ * register page.
+ */
 export default function Login() {
     const [error, setError] = useState<string>('');
     const history = useHistory();

client/src/pages/Projects/ProjectCreate/index.tsx

@@ -9,6 +9,9 @@ import { Status } from "adapters/common";
 import Callout from 'components/ui/Callout';
 import ProjectForm from "components/forms/ProjectForm";
 
+/**
+ * This page should allow the user to create a new project by requesting all required information.
+ */
 export default function ProjectCreate() {
     const [error, setError] = useState('');
     const history = useHistory();

client/src/pages/Projects/ProjectDetail/ProjectDetails/index.tsx

@@ -27,6 +27,10 @@ interface Props {
     project: Project
 }
 
+/**
+ * This is a tab of the project details page. It contains some details and stats for the given
+ * project.
+ */
 export default function ProjectDetails({ project }: Props) {
     const [teams, setTeams] = useState<string[]>([]);
     const [activity, setActivity] = useState<ChartItem[]>([]);

client/src/pages/Projects/ProjectDetail/ProjectTasks/index.tsx

@@ -16,6 +16,10 @@ interface Props {
     project: Project
 }
 
+/**
+ * This is a tab of the project details page. It contains the list of all tasks that belong to the
+ * project and filtering options for the tasks.
+ */
 export default function ProjectTasks({ project }: Props) {
     const [filter, setFilter] = useState({ term: '', tags: Object.values(Status) });
     const [allTasks, setAllTasks] = useState<Task[]>([]);

client/src/pages/Projects/ProjectDetail/index.tsx

@@ -21,6 +21,10 @@ export interface Params {
     projectId: string;
 }
 
+/**
+ * This page includes information on a project. It should show the projects stats and the projects
+ * tasks.
+ */
 export default function ProjectDetail() {
     const [project, setProject] = useState<Project>();
     const [tabs, setTabs] = useState<Tab[]>([]);

client/src/pages/Projects/ProjectEdit/index.tsx

@@ -14,6 +14,9 @@ interface Params {
     projectId: string;
 }
 
+/**
+ * This page should allow the user to edit the information for a project.
+ */
 export default function ProjectEdit() {
     const [project, setProject] = useState<Project>();
     const [error, setError] = useState('');

client/src/pages/Projects/index.tsx

@@ -11,6 +11,10 @@ import ProjectsSlider from 'components/layout/ProjectsSlider';
 
 import './projects.scss';
 
+/**
+ * This page should show all projects a user is a part of. It should also facilitate the creation of
+ * new projects.
+ */
 export default function Projects() {
     const [filter, setFilter] = useState({ term: '', tags: Object.values(Status) });
     const [allProjects, setAllProjects] = useState<Project[]>([]);