Merge pull request #101 from wethmiranasinghe/main

Documentation Added

back-end/src/main/java/com/example/demo/appuser/AppUser.java

@@ -36,7 +36,6 @@ public class AppUser implements UserDetails {
     )
     @Id
     @GeneratedValue(
-
             strategy = GenerationType.SEQUENCE,
             generator = "member_sequence"
     )

back-end/src/main/java/com/example/demo/task/TaskService.java

@@ -66,3 +66,4 @@ public List<Task> findUserTasks(Long userID) {
 //    }
 }
 
+

front-end/src/Pages/Contact.jsx

@@ -4,8 +4,8 @@ import contactImg from '../assets/contactImg.jpg';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faUser, faPhone, faEnvelope} from '@fortawesome/free-solid-svg-icons';
 
+/*Contact Page*/ 
 function Contact() {
-
   return(
     <>
     <div className = "contactTitle"> {/* Page title */}
@@ -55,12 +55,10 @@ function Contact() {
         <a href="mailto:[email protected]"><FontAwesomeIcon className = "contactIcons" icon={faEnvelope} /></a>
       </div>
     </div>
-
     </div>
 
 
     {/* Contact Us form */}
-
     <div className = "ContactUsTitle">
       <h3>Contact Us</h3>
       <p className = "ContactUsSubTitle">For inquiries or support, contact us and we'll respond promptly</p>

front-end/src/Pages/Dashboard.jsx

@@ -1,5 +1,6 @@
 import style from "../components/Dashboard.module.css";
 
+/*Dashboard Page */
 function Dashboard() {
     return(
       <>

front-end/src/Pages/Deliverables.jsx

@@ -9,12 +9,13 @@
 //Auto focus the for input
 
 import { useEffect, useState } from 'react';
-import style from './Deliverables.module.css'
+import style from '../components/Deliverables.module.css'
 import axios from "axios"
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faPen, faEye, faTrash } from '@fortawesome/free-solid-svg-icons';
 import { loggedInUser } from '../components/Header';
 
+/*Deliverables Page */
 function Deliverables() {
 
   /******************** Load information whenever the page loads ********************************* */
@@ -389,4 +390,4 @@ const onViewClick = (deliverable) => {
   );
 }
 
-  export default Deliverables;
+export default Deliverables;

front-end/src/Pages/Downloads.jsx

@@ -7,6 +7,7 @@ import { faDownload ,faTrash, faEye } from '@fortawesome/free-solid-svg-icons';
 
 
 const FileUploadDownload = () => {
+  // State management
   const [selectedFile, setSelectedFile] = useState(null);
   const [displayName, setDisplayName] = useState('');
   const [visibleToAll, setVisibleToAll] = useState(false);
@@ -15,10 +16,12 @@ const FileUploadDownload = () => {
   const [errorMessage, setErrorMessage] = useState('');
   const [showUploadForm, setShowUploadForm] = useState(false);
 
+// Fetch the uploaded files from the backend when the component mounts
   useEffect(() => {
     fetchUploadedFiles();
   }, []);
 
+  // Fetches uploaded files from the backend API
   const fetchUploadedFiles = async () => {
     try {
       const response = await axios.get('http://localhost:8080/api/v1/files');
@@ -28,33 +31,42 @@ const FileUploadDownload = () => {
     }
   };
 
+    // Handler for selecting a file
   const handleFileChange = (event) => {
     setSelectedFile(event.target.files[0]);
   };
 
+   // Handler for setting the display name of the file
   const handleDisplayNameChange = (event) => {
     setDisplayName(event.target.value);
   };
 
+  // Handler for changing the visibility setting (public/private)
   const handleVisibilityChange = (event) => {
     setVisibleToAll(event.target.checked);
   };
 
+  // Handler for inputting YouTube link instead of a file
   const handleYoutubeLinkChange = (event) => {
     setYoutubeLink(event.target.value);
   };
 
+  // Handles file upload or YouTube link submission
   const handleUpload = async () => {
+
+    // Ensure either a file or a YouTube link is provided
     if (!selectedFile && !youtubeLink) {
       alert('Please select a file or enter a URL for the file!');
       return;
     }
 
+    // If a file is uploaded, a display name is required
     if (selectedFile && !displayName) {
       alert('Please enter a display name!');
       return;
     }
 
+    // Prepare the form data for file or YouTube link
     const formData = new FormData();
     if (selectedFile) {
       formData.append('file', selectedFile);
@@ -66,6 +78,7 @@ const FileUploadDownload = () => {
       formData.append('visibleToAll', visibleToAll);
     }
 
+    // Upload file or link to the backend
     try {
       const response = await axios.post('http://localhost:8080/api/v1/files/upload', formData, {
         headers: {
@@ -90,6 +103,7 @@ const FileUploadDownload = () => {
     }
   };
 
+  // Handles file download
   const handleDownload = async (fileId, fileName) => {
     try {
       const response = await axios.get(`http://localhost:8080/api/v1/files/${fileId}`, {
@@ -108,6 +122,7 @@ const FileUploadDownload = () => {
     }
   };
 
+  // Handles file deletion
   const handleDelete = async (fileId) => {
     const confirmDelete = window.confirm('Are you sure you want to delete this file?');
     if (!confirmDelete) return;

front-end/src/Pages/Gallery.jsx

@@ -5,6 +5,11 @@ import '../components/Gallery.css';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; // FontAwesome for icons
 import { faPen, faEye, faTrash } from '@fortawesome/free-solid-svg-icons'; // Import necessary icons
 
+/**
+ * Fetch gallery items from the backend API.
+ * Fetches the list of albums from the gallery API endpoint.
+ * The results are sorted in descending order based on albumID.
+ */
 const fetchGallery = async () => {
   try {
     const response = await axios.get('http://localhost:8080/api/v1/gallery');
@@ -15,11 +20,15 @@ const fetchGallery = async () => {
   }
 };
 
+/**
+ * Gallery component for displaying a list of albums and providing functionality for adding, viewing, editing, and deleting items.
+ */
 const Gallery = () => {
   const [gallery, setGallery] = useState([]); 
   const [showForm, setShowForm] = useState(false); 
   const [file, setFile] = useState(null); 
 
+   // Fetch and load the gallery when the component is first rendered
   useEffect(() => {
     const getGallery = async () => {
       const latestGallery = await fetchGallery(); 
@@ -29,18 +38,25 @@ const Gallery = () => {
     getGallery(); 
   }, []); 
 
+  // Toggles the display of the album addition form
   const toggleForm = () => {
     setShowForm(!showForm); 
   };
 
+  // Handles file input change (for album cover image)
   const handleFileChange = (event) => {
     setFile(event.target.files[0]); 
   };
 
+   /**
+   * Handles form submission to add a new gallery item.
+   * Sends the form data (album name, URL, cover image) to the backend.
+   */
   const handleSubmit = async (event) => {
     event.preventDefault(); 
     const form = event.target;
 
+       // Create a new FormData object to submit the form data
     const formData = new FormData();
     formData.append('albumName', form.albumName.value);
     formData.append('albumURL', form.albumURL.value);
@@ -66,6 +82,10 @@ const Gallery = () => {
     }
   };
 
+   /**
+   * Handles the deletion of a gallery item by albumID.
+   * Sends a DELETE request to remove the item from the backend.
+   */
   const onDeleteClick = async (albumID) => {
     try {
       await axios.delete(`http://localhost:8080/api/v1/gallery/${albumID}`);
@@ -78,6 +98,7 @@ const Gallery = () => {
 
   return (
     <>
+    {/* Breadcrumb navigation for the page */}
       <div className="GalleryTitle">
         <h3>Gallery</h3>
         <nav>
@@ -96,6 +117,8 @@ const Gallery = () => {
           </ol>
         </nav>
         </div>
+
+        {/* Form toggle button for adding a new gallery item */}
         <div className="GalleryAdd">
         {loggedInUser.isLoggedIn && (
           <div>
@@ -104,6 +127,8 @@ const Gallery = () => {
             </button>
           </div>
         )}
+
+        {/* Display the form when showForm is true */}
         {showForm && (
           <div className="add-gallery-form-container">
             <div className="add-gallery-form">
@@ -130,6 +155,7 @@ const Gallery = () => {
         )}
       </div>
 
+      {/* Display the gallery items */}
       <div className="gallery-container">
         {gallery.map((item) => (
           <div key={item.albumID} className="gallery-tile">
@@ -140,10 +166,11 @@ const Gallery = () => {
             <h2>{item.albumName}</h2>
             <a href={item.albumURL} target="_blank" rel="noopener noreferrer">Click here for more images</a>
 
+            {/* Show edit, view, and delete buttons for logged-in users */}
             {loggedInUser.isLoggedIn && (
               <div>
-                <button className="actionButton"><FontAwesomeIcon icon={faPen}/></button>
-                <button className="actionButton"><FontAwesomeIcon icon={faEye}/></button>
+                {/* <button className="actionButton"><FontAwesomeIcon icon={faPen}/></button>
+                <button className="actionButton"><FontAwesomeIcon icon={faEye}/></button> */}
                 <button className="actionButton" onClick={() => onDeleteClick(item.albumID)}><FontAwesomeIcon icon={faTrash} /></button>
               </div>
             )}

front-end/src/Pages/Home.jsx

@@ -1,14 +1,13 @@
 import React from "react";
-import { useNews } from "./NewsContext";
 import Slideshow from "../bodyComponents/SlideShow";
 import NewsGrid from "../bodyComponents/NewsGrid.jsx";
-import style from './Home.module.css';
+import style from '../components./Home.module.css';
 import ParticipantMap from '../bodyComponents/participantMap.jsx';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faBell, faCalendar, faFolder, faMapMarkerAlt, faChartPie, faBullseye, faFolderOpen } from '@fortawesome/free-solid-svg-icons';
 import { faGraduationCap, faShield, faUsers, faBuilding} from '@fortawesome/free-solid-svg-icons';
 import {Link, Outlet} from 'react-router-dom';
-import cylcleLogo from '../assets/CYCLE-logo.png';
+
 // this has to be imported from backend 
 // 1200px height images are ideal
 const fadeImages = [

front-end/src/Pages/Login.jsx

@@ -1,10 +1,9 @@
-//Not used now
-
+/*Not in use now*/
 
 import React, { useEffect, useState } from "react";
 import { useNavigate } from 'react-router-dom';
 import axios from "axios";
-import style from './Login.module.css';
+import style from '../components/Login.module.css';
 import cylcleLogo from '../assets/CYCLE-logo.png';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faEye, faEyeSlash } from '@fortawesome/free-solid-svg-icons';

front-end/src/Pages/NewsContext.jsx

@@ -1,17 +1,22 @@
 import React, { createContext, useState, useEffect, useContext } from 'react';
 
+// Create a context to manage news data
 const NewsContext = createContext();
 
+// Custom hook to consume the NewsContext in other components
 export const useNews = () => useContext(NewsContext);
 
+// NewsProvider component to fetch and provide news data to its children
 export const NewsProvider = ({ children }) => {
   const [news, setNews] = useState([]);
 
+  // useEffect hook to fetch news data on component mount
   useEffect(() => {
     const fetchNews = async () => {
       console.log('Fetching news started');
       const start = performance.now();
 
+      // Send GET request to fetch news from the backend API
       try {
         const response = await fetch('http://localhost:8080/api/v1/news', {
           method: 'GET',
@@ -28,7 +33,6 @@ export const NewsProvider = ({ children }) => {
 
         const data = await response.json();
         setNews(data);
-        localStorage.setItem('news', JSON.stringify(data));
       } catch (error) {
         console.error('Error fetching news:', error);
       }
@@ -37,12 +41,7 @@ export const NewsProvider = ({ children }) => {
       console.log(`Fetching news ended. Time taken: ${end - start} ms`);
     };
 
-    const savedNews = localStorage.getItem('news');
-    if (savedNews) {
-      setNews(JSON.parse(savedNews));
-    } else {
-      fetchNews();
-    }
+    fetchNews(); // Fetch news on component mount
   }, []);
 
   return (

front-end/src/Pages/ProjectManagement.jsx

@@ -126,9 +126,6 @@ const onDeleteClick = async (task_ID) => {
   }
 }
 
-
-
-
 
   //to refresh on admin requirement => get ALL TASKS
   function getAllTaskInfo(){
@@ -174,7 +171,6 @@ const onDeleteClick = async (task_ID) => {
     //   getPersonalTaskInfo();
     //  }
      getAllTaskInfo();     
-
   }
 
 
@@ -286,7 +282,6 @@ const onDeleteClick = async (task_ID) => {
               <button className={style['actionButton']} onClick={() => onDeleteClick(item.task_ID)}><FontAwesomeIcon icon={faTrash} /></button>
           </div>}
               </div>
-
           ))
         }
         {
@@ -300,4 +295,5 @@ const onDeleteClick = async (task_ID) => {
   // }
 
 }
-  export default ProjectManagement;
+
+export default ProjectManagement;