diff --git a/frontend/src/Pages/AdminPages/AdminAddProject.tsx b/frontend/src/Pages/AdminPages/AdminAddProject.tsx
index aedbd3f..f565cde 100644
--- a/frontend/src/Pages/AdminPages/AdminAddProject.tsx
+++ b/frontend/src/Pages/AdminPages/AdminAddProject.tsx
@@ -2,6 +2,12 @@ import AddProject from "../../Components/AddProject";
 import BackButton from "../../Components/BackButton";
 import BasicWindow from "../../Components/BasicWindow";
 
+/**
+ * Renders a window for the admin to add a new project.
+ * This window includes the AddProject component for adding a project,
+ * as well as a BackButton component for navigation.
+ * @returns {JSX.Element} The JSX element representing the admin add project window.
+ */
 function AdminAddProject(): JSX.Element {
   const content = <AddProject />;
 
diff --git a/frontend/src/Pages/AdminPages/AdminAddUser.tsx b/frontend/src/Pages/AdminPages/AdminAddUser.tsx
index 4af2eb7..8d28810 100644
--- a/frontend/src/Pages/AdminPages/AdminAddUser.tsx
+++ b/frontend/src/Pages/AdminPages/AdminAddUser.tsx
@@ -2,6 +2,12 @@ import BackButton from "../../Components/BackButton";
 import BasicWindow from "../../Components/BasicWindow";
 import Register from "../../Components/Register";
 
+/**
+ * Renders a window for the admin to add a new user.
+ * This window includes the Register component for user registration,
+ * as well as a BackButton component for navigation.
+ * @returns {JSX.Element} The JSX element representing the admin add user window.
+ */
 function AdminAddUser(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/AdminPages/AdminChangeUsername.tsx b/frontend/src/Pages/AdminPages/AdminChangeUsername.tsx
index b130fae..19964ff 100644
--- a/frontend/src/Pages/AdminPages/AdminChangeUsername.tsx
+++ b/frontend/src/Pages/AdminPages/AdminChangeUsername.tsx
@@ -3,6 +3,11 @@ import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 import ChangeUsername from "../../Components/ChangeUsername";
 
+/**
+ * Renders an admin interface for changing a user's username.
+ * Allows the admin to change the username and navigate back.
+ * @returns JSX.Element representing the admin interface for changing username.
+ */
 function AdminChangeUsername(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/AdminPages/AdminManageProjects.tsx b/frontend/src/Pages/AdminPages/AdminManageProjects.tsx
index 177f55b..ac5c60a 100644
--- a/frontend/src/Pages/AdminPages/AdminManageProjects.tsx
+++ b/frontend/src/Pages/AdminPages/AdminManageProjects.tsx
@@ -3,6 +3,11 @@ import BackButton from "../../Components/BackButton";
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders an admin interface for managing projects.
+ * Allows the admin to add a new project and navigate back.
+ * @returns JSX.Element representing the admin interface for managing projects.
+ */
 function AdminManageProjects(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminManageUsers.tsx b/frontend/src/Pages/AdminPages/AdminManageUsers.tsx
index 353fddc..8ca7ade 100644
--- a/frontend/src/Pages/AdminPages/AdminManageUsers.tsx
+++ b/frontend/src/Pages/AdminPages/AdminManageUsers.tsx
@@ -6,6 +6,11 @@ import { useNavigate } from "react-router-dom";
 import GetAllUsers from "../../Components/GetAllUsers";
 import { useState } from "react";
 
+/**
+ * Renders an admin interface for managing users.
+ * Allows the admin to view and add users.
+ * @returns JSX.Element representing the admin interface for managing users.
+ */
 function AdminManageUsers(): JSX.Element {
   const [users, setUsers] = useState<string[]>([]);
   GetAllUsers({ setUsersProp: setUsers });
diff --git a/frontend/src/Pages/AdminPages/AdminMenuPage.tsx b/frontend/src/Pages/AdminPages/AdminMenuPage.tsx
index ed2118d..afe8bb1 100644
--- a/frontend/src/Pages/AdminPages/AdminMenuPage.tsx
+++ b/frontend/src/Pages/AdminPages/AdminMenuPage.tsx
@@ -1,6 +1,11 @@
 import { Link } from "react-router-dom";
 import BasicWindow from "../../Components/BasicWindow";
 
+/**
+ * Renders the administrator menu page.
+ * Provides links to manage users and projects.
+ * @returns JSX.Element representing the administrator menu page.
+ */
 function AdminMenuPage(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/AdminPages/AdminProjectAddMember.tsx b/frontend/src/Pages/AdminPages/AdminProjectAddMember.tsx
index 96167cb..c0b28da 100644
--- a/frontend/src/Pages/AdminPages/AdminProjectAddMember.tsx
+++ b/frontend/src/Pages/AdminPages/AdminProjectAddMember.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders the page for adding members to a project by an admin.
+ * @returns JSX.Element representing the project member addition page.
+ */
 function AdminProjectAddMember(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminProjectChangeUserRole.tsx b/frontend/src/Pages/AdminPages/AdminProjectChangeUserRole.tsx
index dd355e8..76a85eb 100644
--- a/frontend/src/Pages/AdminPages/AdminProjectChangeUserRole.tsx
+++ b/frontend/src/Pages/AdminPages/AdminProjectChangeUserRole.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders the page for changing user roles within a project by an admin.
+ * @returns JSX.Element representing the page for changing user roles.
+ */
 function AdminProjectChangeUserRole(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminProjectManageMembers.tsx b/frontend/src/Pages/AdminPages/AdminProjectManageMembers.tsx
index c89e4c4..1e17807 100644
--- a/frontend/src/Pages/AdminPages/AdminProjectManageMembers.tsx
+++ b/frontend/src/Pages/AdminPages/AdminProjectManageMembers.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders the page for managing members within a project by an admin.
+ * @returns JSX.Element representing the page for managing project members.
+ */
 function AdminProjectManageMembers(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminProjectPage.tsx b/frontend/src/Pages/AdminPages/AdminProjectPage.tsx
index a1266ad..904b68f 100644
--- a/frontend/src/Pages/AdminPages/AdminProjectPage.tsx
+++ b/frontend/src/Pages/AdminPages/AdminProjectPage.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders the page for managing a project by an admin.
+ * @returns JSX.Element representing the page for managing a project.
+ */
 function AdminProjectPage(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminProjectStatistics.tsx b/frontend/src/Pages/AdminPages/AdminProjectStatistics.tsx
index dbf3428..8a76fdf 100644
--- a/frontend/src/Pages/AdminPages/AdminProjectStatistics.tsx
+++ b/frontend/src/Pages/AdminPages/AdminProjectStatistics.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders the page for viewing project statistics by an admin.
+ * @returns JSX.Element representing the page for project statistics.
+ */
 function AdminProjectStatistics(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminProjectViewMemberInfo.tsx b/frontend/src/Pages/AdminPages/AdminProjectViewMemberInfo.tsx
index 1c9f28c..d9d8bb2 100644
--- a/frontend/src/Pages/AdminPages/AdminProjectViewMemberInfo.tsx
+++ b/frontend/src/Pages/AdminPages/AdminProjectViewMemberInfo.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
+/**
+ * Renders the page for viewing member information within a project by an admin.
+ * @returns JSX.Element representing the page for viewing member information.
+ */
 function AdminProjectViewMemberInfo(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/AdminPages/AdminViewUserInfo.tsx b/frontend/src/Pages/AdminPages/AdminViewUserInfo.tsx
index fc678e2..4e86751 100644
--- a/frontend/src/Pages/AdminPages/AdminViewUserInfo.tsx
+++ b/frontend/src/Pages/AdminPages/AdminViewUserInfo.tsx
@@ -3,6 +3,10 @@ import Button from "../../Components/Button";
 import BackButton from "../../Components/BackButton";
 import UserProjectListAdmin from "../../Components/UserProjectListAdmin";
 
+/**
+ * Renders the page for viewing user information by an admin.
+ * @returns JSX.Element representing the page for viewing user information.
+ */
 function AdminViewUserInfo(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/App.tsx b/frontend/src/Pages/App.tsx
index 62e1b36..b980291 100644
--- a/frontend/src/Pages/App.tsx
+++ b/frontend/src/Pages/App.tsx
@@ -3,6 +3,11 @@ import { useState, useEffect } from "react";
 import LoginPage from "./LoginPage";
 import { useNavigate } from "react-router-dom";
 
+/**
+ * Main component of the application.
+ * Handles user authority and redirects accordingly.
+ * @returns {JSX.Element} The JSX element representing the main application component.
+ */
 function App(): JSX.Element {
   const navigate = useNavigate();
   const [authority, setAuthority] = useState(0);
diff --git a/frontend/src/Pages/LoginPage.tsx b/frontend/src/Pages/LoginPage.tsx
index 1ff8c9c..d282162 100644
--- a/frontend/src/Pages/LoginPage.tsx
+++ b/frontend/src/Pages/LoginPage.tsx
@@ -5,6 +5,12 @@ import BackgroundAnimation from "../Components/BackgroundAnimation";
 import LoginField from "../Components/LoginField";
 import LoginCheck from "../Components/LoginCheck";
 
+/**
+ * Represents the login page of the application.
+ * @param {Object} props - The properties passed to the component.
+ * @param {Dispatch<SetStateAction<number>>} props.setAuthority - The function to update user authority.
+ * @returns {JSX.Element} The JSX element representing the login page.
+ */
 function LoginPage(props: {
   setAuthority: Dispatch<SetStateAction<number>>;
 }): JSX.Element {
diff --git a/frontend/src/Pages/NotFoundPage.tsx b/frontend/src/Pages/NotFoundPage.tsx
index cae9861..f201241 100644
--- a/frontend/src/Pages/NotFoundPage.tsx
+++ b/frontend/src/Pages/NotFoundPage.tsx
@@ -1,5 +1,9 @@
 import Button from "../Components/Button";
 
+/**
+ * Represents the 404 Not Found page.
+ * @returns {JSX.Element} The JSX element representing the 404 Not Found page.
+ */
 export default function NotFoundPage(): JSX.Element {
   return (
     <div className="flex flex-col items-center justify-center min-h-screen bg-white">
diff --git a/frontend/src/Pages/ProjectManagerPages/PMChangeRole.tsx b/frontend/src/Pages/ProjectManagerPages/PMChangeRole.tsx
index c2c1370..0ccebb5 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMChangeRole.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMChangeRole.tsx
@@ -2,6 +2,10 @@ import BasicWindow from "../../Components/BasicWindow";
 import BackButton from "../../Components/BackButton";
 import ChangeRoles from "../../Components/ChangeRoles";
 
+/**
+ * Renders the page for changing user roles.
+ * @returns JSX.Element representing the page for changing user roles.
+ */
 function ChangeRole(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/ProjectManagerPages/PMOtherUsersTR.tsx b/frontend/src/Pages/ProjectManagerPages/PMOtherUsersTR.tsx
index c76947b..ee25243 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMOtherUsersTR.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMOtherUsersTR.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import BackButton from "../../Components/BackButton";
 
+/**
+ * Renders the page for project manager to view time reports of other users.
+ * @returns JSX.Element representing the page for project manager to view time reports of other users.
+ */
 function PMOtherUsersTR(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx b/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx
index 11b8636..4640243 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx
@@ -4,6 +4,10 @@ import BackButton from "../../Components/BackButton";
 import { Link, useParams } from "react-router-dom";
 import ProjectMembers from "../../Components/ProjectMembers";
 
+/**
+ * Renders the page for project manager to view all members in a project.
+ * @returns JSX.Element representing the page for project manager to view all members in a project.
+ */
 function PMProjectMembers(): JSX.Element {
   const { projectName } = useParams();
   const content = (
diff --git a/frontend/src/Pages/ProjectManagerPages/PMProjectPage.tsx b/frontend/src/Pages/ProjectManagerPages/PMProjectPage.tsx
index 3d550f6..e48ac75 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMProjectPage.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMProjectPage.tsx
@@ -3,6 +3,10 @@ import { JSX } from "react/jsx-runtime";
 import PMProjectMenu from "../../Components/PMProjectMenu";
 import BackButton from "../../Components/BackButton";
 
+/**
+ * Renders the page for project manager's project menu.
+ * @returns JSX.Element representing the page for project manager's project menu.
+ */
 function PMProjectPage(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/ProjectManagerPages/PMTotalTimeActivity.tsx b/frontend/src/Pages/ProjectManagerPages/PMTotalTimeActivity.tsx
index 676ea28..5becb9f 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMTotalTimeActivity.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMTotalTimeActivity.tsx
@@ -2,6 +2,10 @@ import BackButton from "../../Components/BackButton";
 import BasicWindow from "../../Components/BasicWindow";
 import TimeReport from "../../Components/NewWeeklyReport";
 
+/**
+ * Renders the page for project manager's total time per activity.
+ * @returns JSX.Element representing the page for project manager's total time per activity.
+ */
 function PMTotalTimeActivity(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/ProjectManagerPages/PMUnsignedReports.tsx b/frontend/src/Pages/ProjectManagerPages/PMUnsignedReports.tsx
index 713efec..89ffa77 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMUnsignedReports.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMUnsignedReports.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../../Components/BasicWindow";
 import BackButton from "../../Components/BackButton";
 
+/**
+ * Renders the page for project manager's unsigned reports.
+ * @returns JSX.Element representing the page for project manager's unsigned reports.
+ */
 function PMUnsignedReports(): JSX.Element {
   const content = <></>;
 
diff --git a/frontend/src/Pages/ProjectManagerPages/PMViewUnsignedReport.tsx b/frontend/src/Pages/ProjectManagerPages/PMViewUnsignedReport.tsx
index aea25fb..8f518f8 100644
--- a/frontend/src/Pages/ProjectManagerPages/PMViewUnsignedReport.tsx
+++ b/frontend/src/Pages/ProjectManagerPages/PMViewUnsignedReport.tsx
@@ -3,6 +3,10 @@ import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 import TimeReport from "../../Components/NewWeeklyReport";
 
+/**
+ * Renders the page for project manager's unsigned reports.
+ * @returns JSX.Element representing the page for project manager's unsigned reports.
+ */
 function PMViewUnsignedReport(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/UnauthorizedPage.tsx b/frontend/src/Pages/UnauthorizedPage.tsx
index 37e3d2c..8a1018b 100644
--- a/frontend/src/Pages/UnauthorizedPage.tsx
+++ b/frontend/src/Pages/UnauthorizedPage.tsx
@@ -1,5 +1,9 @@
 import Button from "../Components/Button";
 
+/**
+ * Represents the Unauthorized page.
+ * @returns {JSX.Element} The JSX element representing the Unauthorized page.
+ */
 export default function UnauthorizedPage(): JSX.Element {
   return (
     <div className="flex flex-col items-center justify-center min-h-screen bg-white">
diff --git a/frontend/src/Pages/UserPages/UserEditTimeReportPage.tsx b/frontend/src/Pages/UserPages/UserEditTimeReportPage.tsx
index 317cec8..90a842a 100644
--- a/frontend/src/Pages/UserPages/UserEditTimeReportPage.tsx
+++ b/frontend/src/Pages/UserPages/UserEditTimeReportPage.tsx
@@ -2,6 +2,10 @@ import BasicWindow from "../../Components/BasicWindow";
 import BackButton from "../../Components/BackButton";
 import EditWeeklyReport from "../../Components/EditWeeklyReport";
 
+/**
+ * Renders the page for the user to edit a time report.
+ * @returns JSX.Element representing the page for the user to edit a time report.
+ */
 function UserEditTimeReportPage(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx b/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx
index cd69b3b..3be52e9 100644
--- a/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx
+++ b/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx
@@ -2,6 +2,10 @@ import BackButton from "../../Components/BackButton";
 import BasicWindow from "../../Components/BasicWindow";
 import NewWeeklyReport from "../../Components/NewWeeklyReport";
 
+/**
+ * Renders the page for the user to create a new time report.
+ * @returns JSX.Element representing the page for the user to create a new time report.
+ */
 function UserNewTimeReportPage(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/UserPages/UserProjectPage.tsx b/frontend/src/Pages/UserPages/UserProjectPage.tsx
index b9578b4..17e303c 100644
--- a/frontend/src/Pages/UserPages/UserProjectPage.tsx
+++ b/frontend/src/Pages/UserPages/UserProjectPage.tsx
@@ -2,6 +2,11 @@ import BasicWindow from "../../Components/BasicWindow";
 import BackButton from "../../Components/BackButton";
 import UserProjectMenu from "../../Components/UserProjectMenu";
 
+/**
+ * Renders a page for the user to interact with project-related menu options.
+ * Includes options for viewing project information, managing activities, etc.
+ * @returns {JSX.Element} The JSX element representing the user project page.
+ */
 function UserProjectPage(): JSX.Element {
   const content = (
     <>
diff --git a/frontend/src/Pages/UserPages/UserViewTimeReportsPage.tsx b/frontend/src/Pages/UserPages/UserViewTimeReportsPage.tsx
index cc12902..f3f0c99 100644
--- a/frontend/src/Pages/UserPages/UserViewTimeReportsPage.tsx
+++ b/frontend/src/Pages/UserPages/UserViewTimeReportsPage.tsx
@@ -3,6 +3,10 @@ import BackButton from "../../Components/BackButton";
 import { useParams } from "react-router-dom";
 import AllTimeReportsInProject from "../../Components/AllTimeReportsInProject";
 
+/**
+ * Renders a page for the user to view all time reports related to a specific project.
+ * @returns {JSX.Element} The JSX element representing the user view time reports page.
+ */
 function UserViewTimeReportsPage(): JSX.Element {
   const { projectName } = useParams();
 
diff --git a/frontend/src/Pages/YourProjectsPage.tsx b/frontend/src/Pages/YourProjectsPage.tsx
index c048746..3bdb922 100644
--- a/frontend/src/Pages/YourProjectsPage.tsx
+++ b/frontend/src/Pages/YourProjectsPage.tsx
@@ -1,6 +1,10 @@
 import BasicWindow from "../Components/BasicWindow";
 import DisplayUserProjects from "../Components/DisplayUserProjects";
 
+/**
+ * Represents the User Project Page.
+ * @returns {JSX.Element} The JSX element representing the User Project Page.
+ */
 function UserProjectPage(): JSX.Element {
   const content = (
     <>