Merge pull request #216 from jaison080/dev

Fixed some issues
IEDCMEC · Dec 31, 2022 · bc0130d · bc0130d
2 parents 5fef744 + 6b07a98
commit bc0130d
Show file tree

Hide file tree

Showing 15 changed files with 336 additions and 185 deletions.
diff --git a/src/Components/ConfirmEmail/ConfirmEmail.js b/src/Components/ConfirmEmail/ConfirmEmail.js
@@ -1,4 +1,4 @@
-function ConfirmEmail({ request,status }) {
+function ConfirmEmail({ request, status }) {
   return (
     <>
       <div>
@@ -18,7 +18,7 @@ function ConfirmEmail({ request,status }) {
           their team for the project{"  "}
           <i>
             <a
-              href={`https://iedc-collab-frontend.pages.dev/${request.project_id}`}
+              href={`https://iedc-collab-frontend.pages.dev/projects/${request.project_id}`}
               target="_blank"
               rel="noreferrer"
             >
@@ -39,9 +39,6 @@ function ConfirmEmail({ request,status }) {
             </a>
           </p>
         </div>
-        <br />
-        <p>Thank You</p>
-        <br />
         <p>Regards</p>
         <p>IEDC MEC Collab Team</p>
         <br />

diff --git a/src/Components/DescriptionDetails/DescriptionDetails.js b/src/Components/DescriptionDetails/DescriptionDetails.js
@@ -126,28 +126,47 @@ const DescriptionDetails = (props) => {
         ) : (
           ""
         )}
-        <div className="description__tag_phone">
-          <i className="fa fa-phone"></i>
-          <span className="ml-2">{props.selectedProject.contactNo}</span>
-        </div>
+        {currentUser ? (
+          <div className="description__tag_phone">
+            <i className="fa fa-phone"></i>
+            <span className="ml-2">{props.selectedProject.contactNo}</span>
+          </div>
+        ) : (
+          ""
+        )}
+
         <div className="description-container__controls">
-          <a
-            href={`tel:${props.selectedProject.contactNo}`}
-            className="description__tag_phone_mobile"
-          >
-            <FaPhoneAlt
-              color="white"
-              size={40}
-              style={{
-                backgroundColor: "#9e0000",
-                borderRadius: "50%",
-                padding: "8px",
-              }}
-            />
-          </a>
-          <a href={`mailto: ${props.selectedProject.leaderEmail}`}>
-            <IoMdMail color="#9e0000" size={49} style={{ marginTop: "3px" }} />
-          </a>
+          {currentUser ? (
+            <a
+              href={`tel:${props.selectedProject.contactNo}`}
+              className="description__tag_phone_mobile"
+            >
+              <FaPhoneAlt
+                color="white"
+                size={40}
+                style={{
+                  backgroundColor: "#9e0000",
+                  borderRadius: "50%",
+                  padding: "8px",
+                }}
+              />
+            </a>
+          ) : (
+            ""
+          )}
+
+          {currentUser ? (
+            <a href={`mailto: ${props.selectedProject.leaderEmail}`}>
+              <IoMdMail
+                color="#9e0000"
+                size={49}
+                style={{ marginTop: "3px" }}
+              />
+            </a>
+          ) : (
+            ""
+          )}
+
           {props.selectedProject.githubLink.length ? (
             <a
               href={props.selectedProject.githubLink}

diff --git a/src/Components/Email/Email.js b/src/Components/Email/Email.js
@@ -1,4 +1,3 @@
-/* eslint-disable react/jsx-no-target-blank */
 function Email({ request }) {
   return (
     <>
@@ -17,8 +16,9 @@ function Email({ request }) {
           join their team for the project{"  "}
           <i>
             <a
-              href={`https://iedc-collab-frontend.pages.dev/${request.project_id}`}
+              href={`https://iedc-collab-frontend.pages.dev/projects/${request.project_id}`}
               target="_blank"
+              rel="noreferrer"
             >
               {request.project}
             </a>
@@ -55,14 +55,12 @@ function Email({ request }) {
             <a
               href="https://iedc-collab-frontend.pages.dev"
               target="_blank"
+              rel="noreferrer"
             >
               https://iedc-collab-frontend.pages.dev
             </a>
           </p>
         </div>
-        <br />
-        <p>Thank You</p>
-        <br />
         <p>Regards</p>
         <p>IEDC MEC Collab Team</p>
         <br />
@@ -73,7 +71,9 @@ function Email({ request }) {
         <p>
           <i>
             For any queries please visit{" "}
-            <a href="https://iedcmec.in" target="_blank">https://iedcmec.in</a>
+            <a href="https://iedcmec.in" target="_blank" rel="noreferrer">
+              https://iedcmec.in
+            </a>
           </i>
         </p>
       </div>

diff --git a/src/Components/NavigateBar/NavigateBar.jsx b/src/Components/NavigateBar/NavigateBar.jsx
@@ -16,8 +16,6 @@ const Navbar = () => {
   const [showProjectModal, setShowProjectModal] = useState(false);
   const { currentUser } = useContext(AuthContext);
   const { handleSearch, handleSearchDevelopers } = useContext(ProjectContext);
-  const [query, setQuery] = useState("");
-  const [query1, setQuery1] = useState("");
   const history = useHistory();
   const [open1, setOpen1] = useState(false);
   const location = useLocation();
@@ -34,16 +32,6 @@ const Navbar = () => {
       alert("Please Login to Continue.");
     }
   };
-  useEffect(() => {
-    const timeOutId = setTimeout(() => handleSearch(query), 500);
-    return () => clearTimeout(timeOutId);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [query]);
-  useEffect(() => {
-    const timeOutId = setTimeout(() => handleSearchDevelopers(query1), 500);
-    return () => clearTimeout(timeOutId);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [query1]);
   const [selectedUser, setSelectedUser] = useState(null);
   const getDev = async (id) => {
     if (id) {
@@ -132,8 +120,10 @@ const Navbar = () => {
               >
                 <input
                   placeholder="Search projects..."
-                  value={query}
-                  onChange={(e) => setQuery(e.target.value)}
+                  onChange={(e) => {
+                    e.preventDefault();
+                    handleSearch(e.target.value);
+                  }}
                   style={{ borderStyle: "none", outline: "none", width: "95%" }}
                 ></input>
                 <i
@@ -152,8 +142,10 @@ const Navbar = () => {
               >
                 <input
                   placeholder="Search developers..."
-                  value={query1}
-                  onChange={(e1) => setQuery1(e1.target.value)}
+                  onChange={(e1) => {
+                    e1.preventDefault();
+                    handleSearchDevelopers(e1.target.value);
+                  }}
                   style={{ borderStyle: "none", outline: "none", width: "95%" }}
                 ></input>
                 <i
@@ -172,7 +164,10 @@ const Navbar = () => {
               >
                 <input
                   placeholder="Search projects..."
-                  onChange={(e) => handleSearch(e.target.value)}
+                  onChange={(e) => {
+                    history.push(`/projects`);
+                    handleSearch(e.target.value);
+                  }}
                   style={{ borderStyle: "none", outline: "none", width: "95%" }}
                 ></input>
                 <i

diff --git a/src/Components/RequirementDetails/RequirementDetails.js b/src/Components/RequirementDetails/RequirementDetails.js
@@ -2,26 +2,87 @@ import "./RequirementDetails.scss";
 import { FaPhoneAlt } from "react-icons/fa";
 import { IoMdMail } from "react-icons/io";
 import { GoMarkGithub } from "react-icons/go";
-// import { ProjectContext } from "../../contexts/ProjectContext";
+import { useHistory } from "react-router-dom";
+import { doDeleteProject } from "../../Firebase/firebase";
+import { toast } from "react-toastify";
+import { useContext, useEffect, useState } from "react";
+import { RiDeleteBin7Line } from "react-icons/ri";
+import { FiEdit } from "react-icons/fi";
+import { AuthContext } from "../../Firebase/Auth/Auth";
+import { ProjectContext } from "../../contexts/ProjectContext";
+import ProjectModal from "../ProjectModal/ProjectModal";
+import DeleteConfirmation from "../DeleteConfirmationModal/DeleteConfirmation";
 // import { useContext } from "react";
 
-const RequirementDetails = ({ selectedProject }) => {
+const RequirementDetails = (props) => {
+  const { fetchData } = useContext(ProjectContext);
+  const { currentUser } = useContext(AuthContext);
+  const [canModifyProject, setCanModifyProject] = useState(false);
+  const [showNewProjectModal, setShowNewProjectModal] = useState(false);
+  const [displayConfirmationModal, setDisplayConfirmationModal] = useState(
+    false
+  );
+  const history = useHistory();
+  const submitDelete = (id) => {
+    doDeleteProject(id, () => {
+      toast("Project deleted successfully");
+      fetchData();
+    });
+    setDisplayConfirmationModal(false);
+    history.go(0);
+  };
+
+  const hideConfirmationModal = () => {
+    setDisplayConfirmationModal(false);
+  };
+  useEffect(() => {
+    if (currentUser?.uid === props.selectedProject.leader_id) {
+      setCanModifyProject(true);
+    } else {
+      setCanModifyProject(false);
+    }
+  }, [currentUser?.uid, props.selectedProject.leader_id]);
+  function deleteProj() {
+    setDisplayConfirmationModal(true);
+  }
   return (
     <>
       <div className="requirement__container">
+        <div className="description-details__headcontrols">
+          {canModifyProject && (
+            <RiDeleteBin7Line
+              size={38}
+              style={{ cursor: "pointer" }}
+              onClick={() => {
+                deleteProj();
+              }}
+              alt="delete project"
+            />
+          )}
+          {canModifyProject && (
+            <FiEdit
+              size={36}
+              style={{ cursor: "pointer" }}
+              onClick={() => {
+                setShowNewProjectModal(true);
+              }}
+            />
+          )}
+        </div>
         <div className="requirement__title">PROJECT REQUIREMENTS</div>
         <div className="requirement__content">
-          {selectedProject?.req || "No Details Entered..."}
+          {props.selectedProject?.req || "No Details Entered..."}
         </div>
       </div>
       <div className="requirement__other">
-        {selectedProject?.hiring?.length === 0 || !selectedProject.hiring ? (
+        {props.selectedProject?.hiring?.length === 0 ||
+        !props.selectedProject.hiring ? (
           ""
         ) : (
           <>
             <div className="requirement__other-hiring">HIRING</div>
             <div className="requirement__other-skills">
-              {selectedProject?.hiring?.map((role, index) => {
+              {props.selectedProject?.hiring?.map((role, index) => {
                 return (
                   <div className="requirement__other-skill" key={index}>
                     o {role}
@@ -33,26 +94,39 @@ const RequirementDetails = ({ selectedProject }) => {
         )}
 
         <div className="requirement-container__controls">
-          <a
-            href={`tel:${selectedProject.contactNo}`}
-            className="description__tag_phone_mobile"
-          >
-            <FaPhoneAlt
-              color="white"
-              size={40}
-              style={{
-                backgroundColor: "#9e0000",
-                borderRadius: "50%",
-                padding: "8px",
-              }}
-            />
-          </a>
-          <a href={`mailto: ${selectedProject.leaderEmail}`}>
-            <IoMdMail color="#9e0000" size={49} style={{ marginTop: "3px" }} />
-          </a>
-          {selectedProject.githubLink.length ? (
+          {currentUser ? (
+            <a
+              href={`tel:${props.selectedProject.contactNo}`}
+              className="description__tag_phone_mobile"
+            >
+              <FaPhoneAlt
+                color="white"
+                size={40}
+                style={{
+                  backgroundColor: "#9e0000",
+                  borderRadius: "50%",
+                  padding: "8px",
+                }}
+              />
+            </a>
+          ) : (
+            ""
+          )}
+          {currentUser ? (
+            <a href={`mailto: ${props.selectedProject.leaderEmail}`}>
+              <IoMdMail
+                color="#9e0000"
+                size={49}
+                style={{ marginTop: "3px" }}
+              />
+            </a>
+          ) : (
+            ""
+          )}
+
+          {props.selectedProject.githubLink.length ? (
             <a
-              href={selectedProject.githubLink}
+              href={props.selectedProject.githubLink}
               target="_blank"
               rel="noreferrer"
             >
@@ -63,6 +137,19 @@ const RequirementDetails = ({ selectedProject }) => {
           )}
         </div>
       </div>
+      <ProjectModal
+        show={showNewProjectModal}
+        onHide={() => setShowNewProjectModal(false)}
+        project={props.selectedProject}
+        setVariable={props.setVariable}
+        variable={props.variable}
+      />
+      <DeleteConfirmation
+        showModal={displayConfirmationModal}
+        confirmModal={submitDelete}
+        hideModal={hideConfirmationModal}
+        id={props.selectedProject.id}
+      />
     </>
   );
 };