Merge main back into develop

src/components/jobApplications/JobApplicationCard.jsx

@@ -28,6 +28,16 @@ import EditApplicationModal from './JobApplicationModal';
 import DeleteApplicationModal from './JobApplicationWarning';
 import { FORMAT_STATUS } from '../../constants/jobApplications';
 
+function formatDate(date) {
+  const [year, month, day] = date.split('-');
+
+  return new Date(year, month - 1, day).toLocaleDateString('en-GB', {
+    day: '2-digit',
+    month: 'long',
+    year: 'numeric',
+  });
+}
+
 const JobApplicationCard = ({
   jobApplication,
   onUpdated,
@@ -45,15 +55,6 @@ const JobApplicationCard = ({
 
   const { request: editJobApplicationCallback } = useApi(editApplication);
 
-  function formatDate(date) {
-    const [year, month, day] = date.split('-');
-
-    return new Date(year, month - 1, day).toLocaleDateString('en-GB', {
-      day: '2-digit',
-      month: 'long',
-      year: 'numeric',
-    });
-  }
   const deadlineDate = formatDate(jobApplication.applicationDeadline);
 
   function getCompany() {
@@ -128,15 +129,13 @@ const JobApplicationCard = ({
 
   if (isLoading) {
     return (
-      <>
-        <Card
-          className={styles['application-card']}
-          style={{ borderLeftColor: 'var(--bs-info)' }}>
-          <Card.Body className="text-center">
-            <Spinner animation="border" />
-          </Card.Body>
-        </Card>
-      </>
+      <Card
+        className={styles['application-card']}
+        style={{ borderLeftColor: 'var(--bs-info)' }}>
+        <Card.Body className="text-center">
+          <Spinner animation="border" />
+        </Card.Body>
+      </Card>
     );
   }
 
@@ -158,8 +157,7 @@ const JobApplicationCard = ({
                 style={{ width: '10vw', overflowX: 'auto', overflowY: 'auto' }}>
                 {!jobApplication.dateApplied ? (
                   <span className="text-muted fs-6">
-                    Due
-                    <span className="text-dark">{' ' + deadlineDate}</span>
+                    Due <span className="text-dark">{' ' + deadlineDate}</span>
                   </span>
                 ) : (
                   <span className="text-muted fs-6">

src/components/jobApplications/JobApplicationWarning.jsx

@@ -33,46 +33,44 @@ function JobApplicationWarning({ onShow, onHide, data, onSaved }) {
   };
 
   return (
-    <>
-      <Modal
-        show={onShow}
-        onHide={onHide}
-        centered>
-        <Modal.Header
-          closeButton
-          className="border-0"></Modal.Header>
+    <Modal
+      show={onShow}
+      onHide={onHide}
+      centered>
+      <Modal.Header
+        closeButton
+        className="border-0"></Modal.Header>
 
-        <Modal.Body className="text-center">
-          <FontAwesomeIcon
-            className="me-1 text-danger"
-            icon={faCircleXmark}
-            size="5x"
-          />
-          <Modal.Title className="p-2 fs-2">Are you sure?</Modal.Title>
-          <p className="text-muted">
-            Do you really want to delete this job application?
-            <br />
-            This process cannot be undone.
-          </p>
-          {error && <span className="text-danger mt-3">{error}</span>}
-        </Modal.Body>
+      <Modal.Body className="text-center">
+        <FontAwesomeIcon
+          className="me-1 text-danger"
+          icon={faCircleXmark}
+          size="5x"
+        />
+        <Modal.Title className="p-2 fs-2">Are you sure?</Modal.Title>
+        <p className="text-muted">
+          Do you really want to delete this job application?
+          <br />
+          This process cannot be undone.
+        </p>
+        {error && <span className="text-danger mt-3">{error}</span>}
+      </Modal.Body>
 
-        <Modal.Footer className="border-0">
-          <Button
-            variant="info"
-            onClick={onHide}
-            disabled={isDeleteLoading}>
-            Cancel
-          </Button>
-          <Button
-            variant="danger"
-            onClick={handleSubmit}
-            disabled={isDeleteLoading}>
-            {isDeleteLoading && <Spinner size="sm" />} Delete
-          </Button>
-        </Modal.Footer>
-      </Modal>
-    </>
+      <Modal.Footer className="border-0">
+        <Button
+          variant="info"
+          onClick={onHide}
+          disabled={isDeleteLoading}>
+          Cancel
+        </Button>
+        <Button
+          variant="danger"
+          onClick={handleSubmit}
+          disabled={isDeleteLoading}>
+          {isDeleteLoading && <Spinner size="sm" />} Delete
+        </Button>
+      </Modal.Footer>
+    </Modal>
   );
 }
 

src/components/jobApplications/Searchbar.jsx

@@ -15,18 +15,16 @@ const Searchbar = ({ handleSearch }) => {
   };
 
   return (
-    <>
-      <InputGroup>
-        <InputGroup.Text>
-          <FontAwesomeIcon icon={faMagnifyingGlass} />
-        </InputGroup.Text>
-        <Form.Control
-          placeholder="Search"
-          value={searchValue}
-          onChange={(e) => onSearchInput(e.target.value)}
-        />
-      </InputGroup>
-    </>
+    <InputGroup>
+      <InputGroup.Text>
+        <FontAwesomeIcon icon={faMagnifyingGlass} />
+      </InputGroup.Text>
+      <Form.Control
+        placeholder="Search"
+        value={searchValue}
+        onChange={(e) => onSearchInput(e.target.value)}
+      />
+    </InputGroup>
   );
 };
 

src/components/rateMyCoop/CompaniesDisplay.jsx

@@ -47,19 +47,17 @@ const CompaniesDisplay = ({
             topFilteredCompanies.length != 0 &&
             otherFilteredCompanies.length !== companies.length &&
             otherFilteredCompanies.length == 0 && (
-              <>
-                <Container className="m-0 p-0">
-                  {topFilteredCompanies.map((company) => (
-                    <Row
-                      className="py-2 px-0"
-                      key={company}>
-                      <Col key={company}>
-                        <CompanyCard company={company} />
-                      </Col>
-                    </Row>
-                  ))}
-                </Container>
-              </>
+              <Container className="m-0 p-0">
+                {topFilteredCompanies.map((company) => (
+                  <Row
+                    className="py-2 px-0"
+                    key={company}>
+                    <Col key={company}>
+                      <CompanyCard company={company} />
+                    </Col>
+                  </Row>
+                ))}
+              </Container>
             )}
 
           {/* Case 3: Yes other filters, no top filters */}

src/components/rateMyCoop/CompanyReviewModalComponents/ViewReviews.jsx

@@ -34,56 +34,52 @@ function ViewReviews({ company, showModal }) {
     <>
       <h4>Reviews</h4>
       {reviews ? (
-        <>
-          <div className="d-flex justify-content-end">
-            <InputGroup className="w-auto d-inline-flex mx-1">
-              <InputGroup.Text>Reviews per page:</InputGroup.Text>
+        <div className="d-flex justify-content-end">
+          <InputGroup className="w-auto d-inline-flex mx-1">
+            <InputGroup.Text>Reviews per page:</InputGroup.Text>
 
-              <Form.Select
-                value={reviewsPerPage}
-                onChange={(e) => {
-                  setReviewsPerPage(Number(e.target.value));
-                  getReviewsCallback(company.companyId, 0, e.target.value);
-                }}
-                disabled={getReviewsLoading}
-                className="w-auto">
-                {[1, 5, 10, 50].map((num) => (
-                  <option
-                    key={num}
-                    value={num}>
-                    {num}
-                  </option>
-                ))}
-              </Form.Select>
-            </InputGroup>
-            <Button
-              className="mx-1"
-              onClick={() => {
-                const currPage = reviews.reviewsPagination.currentPage;
-                getReviewsCallback(company.companyId, currPage - 1, reviewsPerPage);
+            <Form.Select
+              value={reviewsPerPage}
+              onChange={(e) => {
+                setReviewsPerPage(Number(e.target.value));
+                getReviewsCallback(company.companyId, 0, e.target.value);
               }}
-              disabled={!reviews.reviewsPagination.hasPrevious}>
-              <FontAwesomeIcon icon={faCaretLeft} />
-            </Button>
-            <Button
-              className="mx-1"
-              onClick={() => {
-                const currPage = reviews.reviewsPagination.currentPage;
-                getReviewsCallback(company.companyId, currPage + 1, reviewsPerPage);
-              }}
-              disabled={!reviews.reviewsPagination.hasNext}>
-              <FontAwesomeIcon icon={faCaretRight} />
-            </Button>
-          </div>
-        </>
+              disabled={getReviewsLoading}
+              className="w-auto">
+              {[1, 5, 10, 50].map((num) => (
+                <option
+                  key={num}
+                  value={num}>
+                  {num}
+                </option>
+              ))}
+            </Form.Select>
+          </InputGroup>
+          <Button
+            className="mx-1"
+            onClick={() => {
+              const currPage = reviews.reviewsPagination.currentPage;
+              getReviewsCallback(company.companyId, currPage - 1, reviewsPerPage);
+            }}
+            disabled={!reviews.reviewsPagination.hasPrevious}>
+            <FontAwesomeIcon icon={faCaretLeft} />
+          </Button>
+          <Button
+            className="mx-1"
+            onClick={() => {
+              const currPage = reviews.reviewsPagination.currentPage;
+              getReviewsCallback(company.companyId, currPage + 1, reviewsPerPage);
+            }}
+            disabled={!reviews.reviewsPagination.hasNext}>
+            <FontAwesomeIcon icon={faCaretRight} />
+          </Button>
+        </div>
       ) : (
-        <>
-          <div className="d-flex justify-content-end">
-            <Placeholder
-              className="mx-1"
-              xs={3}></Placeholder>
-          </div>
-        </>
+        <div className="d-flex justify-content-end">
+          <Placeholder
+            className="mx-1"
+            xs={3}></Placeholder>
+        </div>
       )}
       <div className={styles['reviews-container']}>
         {reviews && !getReviewsLoading ? (

src/components/rateMyCoop/CompanyReviewModalComponents/WriteOrEditReview.jsx

@@ -18,6 +18,14 @@ import styles from '../../styling/rateMyCoop/CompanyReviewModal.module.css';
 import useApi from '../../../hooks/useApi';
 import { getErrorMessage } from '../../../utils/errorUtils';
 
+function capitalizeFirstLetter(string) {
+  if (string.length === 0) {
+    return ''; // Empty string
+  }
+  const toLowerCaseString = string.toLowerCase();
+  return toLowerCaseString.charAt(0).toUpperCase() + toLowerCaseString.slice(1);
+}
+
 function WriteOrEditReviews({
   company,
   showModal,
@@ -38,14 +46,6 @@ function WriteOrEditReviews({
     comment: '',
   });
 
-  function capitalizeFirstLetter(string) {
-    if (string.length === 0) {
-      return ''; // Empty string
-    }
-    const toLowerCaseString = string.toLowerCase();
-    return toLowerCaseString.charAt(0).toUpperCase() + toLowerCaseString.slice(1);
-  }
-
   const onJobTitleChange = (e) => {
     setFormData({ ...formData, jobTitle: e.target.value });
   };
@@ -101,9 +101,9 @@ function WriteOrEditReviews({
   const validateTermYear = (term) => {
     return (
       term.trim() != '' &&
-      parseInt(term) &&
-      parseInt(term) >= termYearBounds.lowerBound &&
-      parseInt(term) <= termYearBounds.upperBound
+      Number.parseInt(term) &&
+      Number.parseInt(term) >= termYearBounds.lowerBound &&
+      Number.parseInt(term) <= termYearBounds.upperBound
     );
   };
 

src/pages/ForgotPasswordPage.jsx

@@ -52,6 +52,7 @@ const ForgotPasswordPage = () => {
           className="p-4 border rounded d-flex flex-column align-items-center"
           style={{ maxWidth: '19rem' }}>
           <img
+            alt="Co-App"
             src={LogoImage}
             width={220}
           />

src/pages/LoginPage.jsx

@@ -69,6 +69,7 @@ const LoginPage = () => {
           className="p-4 border rounded d-flex flex-column align-items-center"
           style={{ maxWidth: '19rem' }}>
           <img
+            alt="Co-App"
             src={LogoImage}
             width={220}
           />

src/pages/ResetPasswordPage.jsx

@@ -76,6 +76,7 @@ const ResetPasswordPage = () => {
           className="p-4 border rounded d-flex flex-column align-items-center"
           style={{ maxWidth: '19rem' }}>
           <img
+            alt="Co-App"
             src={LogoImage}
             width={220}
           />

src/pages/SignupPage.jsx

@@ -1,7 +1,7 @@
 // Component developed in part using Gemini: https://gemini.google.com/share/6cf46cb9feaa
 
 import { useState } from 'react';
-import { Button, Form, InputGroup, Row, Spinner } from 'react-bootstrap';
+import { Button, Form, Row, Spinner } from 'react-bootstrap';
 import { Link, useNavigate } from 'react-router-dom';
 import LogoImage from '../assets/coapp_logo.png';
 import Col from 'react-bootstrap/Col';
@@ -112,6 +112,7 @@ const SignupPage = () => {
           className="p-4 border rounded d-flex flex-column align-items-center"
           style={{ maxWidth: '30rem' }}>
           <img
+            alt="Co-App"
             src={LogoImage}
             width={220}
           />