Sanjeebani

client/src/api/User.js

@@ -21,7 +21,8 @@ export const handleLogin = () => {
     window.location.href = "http://localhost:8080/api/auth/login"
 };
 export const AddNewCourseAPI = async (code, name) => {
-    const resp = await axios.post(`${serverRoot}/api/user/course`, { code, name });
+    // const resp = await axios.post(`${serverRoot}/api/user/course`, { code, name });
+    const resp = await axios.post(`${serverRoot}/api/user/readonly`, { code, name });
     // console.log(resp);
     return resp;
 };

client/src/screens/browse/components/browsefolder/index.jsx

@@ -13,6 +13,12 @@ const BrowseFolder = ({ type = "file", color, path, name, subject, folderData, p
     const currYear = useSelector((state) => state.fileBrowser.currentYear);
     const isBR = useSelector((state) => state.user.user.isBR);
     const [showConfirm, setShowConfirm] = useState(false);
+    const user = useSelector((state) => state.user.user);
+    const courseCode = subject || folderData?.course;
+    const isReadOnlyCourse = user?.readOnly?.some(
+        (c) => c.code.toLowerCase() === courseCode?.toLowerCase()
+    );
+
     const onClick = (folderData) => {
         // return;
         dispatch(ChangeFolder(folderData));
@@ -121,14 +127,16 @@ const BrowseFolder = ({ type = "file", color, path, name, subject, folderData, p
                     <div className="top">
                         <p className="path">{""}</p>
                         <p className="name">{name ? name : "Name"}</p>
-                        {isBR && <span
-                            className="delete"
-                            onClick={(e) => {
-                                e.stopPropagation();
-                                setShowConfirm(true);
-                            }}
-                            title="Delete folder"
-                        ></span>}
+                        {isBR && !isReadOnlyCourse && (
+                            <span
+                                className="delete"
+                                onClick={(e) => {
+                                    e.stopPropagation();
+                                    setShowConfirm(true);
+                                }}
+                                title="Delete folder"
+                            ></span>
+                        )}
                     </div>
                     <div className="bottom">
                         <p className="subject">
@@ -137,12 +145,14 @@ const BrowseFolder = ({ type = "file", color, path, name, subject, folderData, p
                     </div>
                 </div>
             </div>
-            {isBR &&<ConfirmDialog
-                isOpen={showConfirm}
-                type="delete"
-                onConfirm={handleDelete}
-                onCancel={cancelDelete}
-            />}
+            {isBR && !isReadOnlyCourse && (
+                <ConfirmDialog
+                    isOpen={showConfirm}
+                    type="delete"
+                    onConfirm={handleDelete}
+                    onCancel={cancelDelete}
+                />
+            )}
         </>
     );
 };

client/src/screens/browse/components/file-display/index.jsx

@@ -44,6 +44,9 @@ const FileDisplay = ({ file, path, code }) => {
     const currCourseCode = useSelector((state) => state.fileBrowser?.currentCourseCode);
     const currFolderId = useSelector((state) => state.fileBrowser?.currentFolder?._id);
     const currentUser = useSelector((state) => state.user.user);
+    const isReadOnlyCourse = currentUser?.readOnly?.some(
+        (c) => c.code.toLowerCase() === currCourseCode?.toLowerCase()
+    );
 
     if (!file.isVerified && !currentUser?.isBR) {
         return null;
@@ -180,7 +183,7 @@ const FileDisplay = ({ file, path, code }) => {
                 }}
             >
                 <div className="top">
-                    {user?.isBR && (
+                    {user?.isBR && !isReadOnlyCourse && (
                         <>
                         {!(file.isVerified)? <span className="verify" onClick={handleVerify} title="Verify"></span> : <></>}
                             <span className="unverify" onClick={handleUnverify} title="Delete"></span>

client/src/screens/browse/components/folder-info/index.jsx

@@ -27,6 +27,11 @@ const FolderInfo = ({
     const [newFolderName, setNewFolderName] = useState("");
     const [childType, setChildType] = useState("File"); 
 
+    const user = useSelector((state) => state.user.user);
+    const isReadOnlyCourse = user?.readOnly?.some(
+        (c) => c.code.toLowerCase() === courseCode?.toLowerCase()
+    );
+
     const handleShare = () => {
         const sectionShare = document.getElementById("share");
         sectionShare.classList.add("show");
@@ -97,7 +102,7 @@ const FolderInfo = ({
                         </div>
                     </div>
                 </div>
-                {canDownload ? (
+                {!isReadOnlyCourse && canDownload ? (
                     <div className="btn-container">
                         {/* <button
                             className="btn download"
@@ -116,7 +121,7 @@ const FolderInfo = ({
                 ) : (
                     <></>
                 )}
-                {isBR && !canDownload && (
+                {!isReadOnlyCourse && isBR && !canDownload && (
                     <div className="btn-container">
                         <button className="btn plus" onClick={handleCreateFolder}>
                             <span className="icon plus-icon"></span>

client/src/screens/browse/components/year-info/index.jsx

@@ -1,7 +1,7 @@
 //import "./styles.scss";
 import { toast } from "react-toastify";
 import { useState } from "react";
-import { addYear,deleteYear } from "../../../../api/Year";
+import { useSelector } from "react-redux";import { addYear,deleteYear } from "../../../../api/Year";
 import { getCourse } from "../../../../api/Course";
 import { useDispatch } from "react-redux";
 import { ChangeCurrentYearData,ChangeFolder,LoadCourses,RefreshCurrentFolder} from "../../../../actions/filebrowser_actions";
@@ -19,6 +19,10 @@ const YearInfo = ({
     const [showConfirm, setShowConfirm] = useState(false);
     const [showConfirmDel, setShowConfirmDel] = useState(false);
     const [newYearName, setNewYearName] = useState("");
+    const user = useSelector((state) => state.user.user);
+    const isReadOnlyCourse = user?.readOnly?.some(
+        (c) => c.code.toLowerCase() === courseCode?.toLowerCase()
+    );
 
     const handleAddYear = () => {
         setNewYearName("");
@@ -123,7 +127,7 @@ const YearInfo = ({
                             );
                         })}
                 </div>
-                {isBR?
+                {isBR && !isReadOnlyCourse?
                     <div className="year-content year add-year">
                         {course &&
                             <div>

client/src/screens/browse/index.jsx

@@ -202,29 +202,46 @@ const BrowseScreen = () => {
                         ? ""
                         : user.user?.courses?.map((course, idx) => {
                               return (
-                                  <Collapsible color={getColors(idx)} key={idx} course={course} />
+                                  <Collapsible
+                                      color={getColors(idx)}
+                                      key={idx}
+                                      course={course}
+                                      isReadOnly={false}
+                                  />
                               );
                           })}
                     {user.localCourses?.map((course, idx) => {
                         return <Collapsible color={course.color} key={idx} course={course} />;
                     })}
-                    {user.user?.isBR && (
-                        <h4 className="heading">PREVIOUS COURSES</h4>
+
+                    {user.user?.readOnly?.length > 0 && (
+                        <h4 className="heading">OTHERS</h4>
                     )}
+
+                    {user.user?.readOnly?.map((course, idx) => (
+                        <Collapsible
+                            color={course.color}
+                            key={`readonly-${idx}`}
+                            course={course}
+                            isReadOnly={true}
+                        />
+                    ))}
+
+                    {user.user?.isBR && <h4 className="heading">PREVIOUS COURSES</h4>}
                     {!(user.user?.isBR && user.user?.previousCourses?.length > 0)
                         ? ""
                         : `<h4 className="heading">PREVIOUS COURSES</h4>` &&
-                        user.user?.previousCourses?.map((course, idx) => {
-                            return (
-                                <Collapsible color={getColors(idx)} key={idx} course={course} />
-                            );
-                        })}
+                          user.user?.previousCourses?.map((course, idx) => {
+                              return (
+                                  <Collapsible color={getColors(idx)} key={idx} course={course} />
+                              );
+                          })}
                 </div>
                 <div className="middle">
                     {folderData && (
                         <FolderInfo
                             isBR={user.user.isBR}
-                            path={folderData?.path ? folderData.path :HeaderText}
+                            path={folderData?.path ? folderData.path : HeaderText}
                             name={folderData?.name ? folderData.name : HeaderText}
                             canDownload={folderData?.childType === "File"}
                             contributionHandler={contributionHandler}
@@ -236,9 +253,11 @@ const BrowseScreen = () => {
                         {!folderData ? (
                             <div className="empty-message">{HeaderText}</div>
                         ) : folderData?.childType === "File" ? (
-                                folderData?.children?.length === 0 ? 
-                                    <p className="empty-message">No files available.</p>
-                                    :<FileController files={folderData?.children} />
+                            folderData?.children?.length === 0 ? (
+                                <p className="empty-message">No files available.</p>
+                            ) : (
+                                <FileController files={folderData?.children} />
+                            )
                         ) : folderData?.children?.length === 0 ? (
                             <div className="empty-folder">
                                 <p className="empty-message">No folders available.</p>

client/src/screens/dashboard/components/addcoursemodal/index.jsx

@@ -6,6 +6,7 @@ import "./styles.scss";
 import Space from "../../../../components/space";
 import { useState } from "react";
 import { useEffect } from "react";
+import { useSelector } from "react-redux";
 import { GetSearchResult } from "../../../../api/Search";
 import Result from "./components/result";
 const AddCourseModal = ({ handleAddCourse }) => {
@@ -14,6 +15,14 @@ const AddCourseModal = ({ handleAddCourse }) => {
     const [err, setErr] = useState(null);
     const [results, setResults] = useState([]);
     const [loading, setLoading] = useState(false);
+    const user = useSelector((state) => state.user);
+    const userCourses = user.user?.courses || [];
+    const previousCourses = user.user?.previousCourses || [];
+    const readOnlyCourses = user.user?.readOnly || [];
+
+    const allUserCourseCodes = [...userCourses, ...previousCourses, ...readOnlyCourses].map((c) =>
+        c.code?.replace(/\s+/g, "").toLowerCase()
+    );
 
     useEffect(() => {
         if (code.length > 2) {
@@ -30,12 +39,13 @@ const AddCourseModal = ({ handleAddCourse }) => {
             setLoading(true);
             setErr(null);
             let searchArr;
-            if(/\d/.test(code)){    //if code contains number then pass it as one element array
+            if (/\d/.test(code)) {
+                //if code contains number then pass it as one element array
                 let codeWithoutSpace = code.replace(/\s+/g, "");
-                searchArr= [codeWithoutSpace]
-            }
-            else{                  //if code does not contain number then split it and pass array of words
-                searchArr= code.split(" ")
+                searchArr = [codeWithoutSpace];
+            } else {
+                //if code does not contain number then split it and pass array of words
+                searchArr = code.split(" ");
             }
             const { data } = await GetSearchResult(searchArr);
             if (data?.found === true) {
@@ -61,7 +71,9 @@ const AddCourseModal = ({ handleAddCourse }) => {
     return (
         <SectionC>
             <Wrapper>
-                <div className="head">Add new course</div>
+                <div className="head">Add New Course</div>
+                <div className="info-message">This course will be read only</div>
+                <div className="info-message.secondary">No space between course code, for e.g- CS101</div>
                 <form onSubmit={(e) => e.preventDefault()}>
                     <div className="course">
                         <label htmlFor="course" className="label_course">
@@ -82,16 +94,27 @@ const AddCourseModal = ({ handleAddCourse }) => {
                 {err === null
                     ? loading
                         ? "Loading courses..."
-                        : results.map((course) => (
-                              <Result
-                                  key={course._id}
-                                  _id={course._id}
-                                  code={course.code}
-                                  name={course.name}
-                                  handleClick={handleAddCourse}
-                                  handleModalClose={handleModalClose}
-                              />
-                          ))
+                        : (() => {
+                              const filtered = results.filter(
+                                  (course) =>
+                                      !allUserCourseCodes.includes(
+                                          course.code?.replace(/\s+/g, "").toLowerCase()
+                                      )
+                              );
+                              if (results.length > 0 && filtered.length === 0) {
+                                  return "Course already exists";
+                              }
+                              return filtered.map((course) => (
+                                  <Result
+                                      key={course._id}
+                                      _id={course._id}
+                                      code={course.code}
+                                      name={course.name}
+                                      handleClick={handleAddCourse}
+                                      handleModalClose={handleModalClose}
+                                  />
+                              ));
+                          })()
                     : err}
                 <Space amount={35} />
 

client/src/screens/dashboard/components/addcoursemodal/styles.scss

@@ -6,6 +6,20 @@
 
 }
 
+.info-message {
+    font-family: 'Bold';
+    font-size: 1.2rem;
+
+
+}
+
+.info-message.secondary {
+    font-family: 'Regular';
+    font-size: 1rem;
+    color: grey;
+
+}
+
 .course {
     display: flex;
     align-items: center;

client/src/screens/dashboard/components/coursecard/index.jsx

@@ -21,13 +21,12 @@ const CourseCard = ({ code, color, name, type, setClicked }) => {
         SetCourseAvailability();
     }, []);
     return type === "ADD" ? (
-        // <div className="coursecard ADD" onClick={setClicked}>
-        //     <div className="content">
-        //         <i className="fa fa-xl fa-plus" aria-hidden="true"></i>
-        //         <p>Add Course</p>
-        //     </div>
-        // </div>
-        <></>
+        <div className="coursecard ADD" onClick={setClicked}>
+            <div className="content">
+                <i className="fa fa-xl fa-plus" aria-hidden="true"></i>
+                <p>Add Course</p>
+            </div>
+        </div>
     ) : (
         <div
             className={`coursecard ${isAvailable}`}