Making tests for the validate application and the fetch company appli…

…cation services Making tests for the validate application and the fetch company application services
NIAEFEUP · Sep 11, 2023 · 4198681 · 4198681
1 parent 95794d0
commit 4198681
Show file tree

Hide file tree

Showing 13 changed files with 254 additions and 145 deletions.
diff --git a/src/components/Apply/Company/ApplicationConfirmation.js b/src/components/Apply/Company/ApplicationConfirmation.js
@@ -23,7 +23,8 @@ const ApplicationConfirmation = () => {
             <CardContent className={classes.content}>
                 <Typography variant="body2">
                     Application Submitted: You should receive an email containing a confirmation link for your application.
-                    Please confirm it within 10 minutes; otherwise, the link will expire. If you have not received an email, please contact us at
+                    Please confirm it within 10 minutes; otherwise, the link will expire. If you have not received an email,
+                    please contact us at
                     {" "}
                     <Link color="secondary" href={`mailto:${Constants.CONTACT_US_EMAIL}`}>
                         {Constants.CONTACT_US_EMAIL}

diff --git a/src/components/Offers/Form/form-components/OfferForm.js b/src/components/Offers/Form/form-components/OfferForm.js
@@ -7,9 +7,9 @@ import {
     FormControl,
     Typography,
     Collapse,
-    Button, makeStyles,
+    Button,
 } from "@material-ui/core";
-import React, {useState, useCallback, useContext, useEffect} from "react";
+import React, { useState, useCallback, useContext, useEffect } from "react";
 import { Redirect } from "react-router-dom";
 import PropTypes from "prop-types";
 import MultiOptionTextField from "../../../utils/form/MultiOptionTextField";
@@ -37,7 +37,7 @@ import { useMobile } from "../../../../utils/media-queries";
 import "../editor.css";
 import ApplyURLComponent from "./ApplyURLComponent";
 import { Alert } from "../../../utils/Alert";
-import { fetchCompanyApplicationState } from "../../../../services/companyService";
+import { fetchCompanyApplication } from "../../../../services/companyService";
 import useSession from "../../../../hooks/useSession.js";
 import { addSnackbar } from "../../../../actions/notificationActions";
 
@@ -97,14 +97,14 @@ const OfferForm = ({ context, title }) => {
     const Content = isMobile ? DialogContent : CardContent;
     const classes = useOfferFormStyles(isMobile)();
 
-    const [state, setState] = useState( "APPROVED");
+    const [state, setState] = useState("APPROVED");
     const session = useSession();
 
     useEffect(() => {
-        if(!session.isValidating && session.isLoggedIn) {
-            const request = fetchCompanyApplicationState(session.data?.company?._id)
-                .then((state) => {
-                    setState(state);
+        if (!session.isValidating && session.isLoggedIn) {
+            fetchCompanyApplication(session.data?.company?._id)
+                .then((application) => {
+                    setState(application.state);
                 })
                 .catch(() => {
                     addSnackbar({
@@ -113,7 +113,7 @@ const OfferForm = ({ context, title }) => {
                     });
                 });
         }
-    }, [addSnackbar, session.isValidating, session.isLoggedIn]);
+    }, [session.isValidating, session.isLoggedIn, session.data.company._id]);
 
     const showOwnerComponent = isAdmin && showCompanyField;
 
@@ -130,9 +130,17 @@ const OfferForm = ({ context, title }) => {
             ? <Redirect to={`/offer/${offerId}`} push />
             :
             <div className={classes.formCard}>
-                {(state !== "APPROVED") && session.isLoggedIn && <Alert type={"warning"}
-                                                  fontSize={1.2}>{"This offer will stay hidden from the public until your account is approved!"}</Alert>}
-                <CardHeader title={!isMobile && title}/>
+                {(state !== "APPROVED") && session.isLoggedIn &&
+                <Alert
+                    type={"warning"}
+                    fontSize={1.2}
+                >
+                    {
+                        "This offer will stay hidden from the public until your account is approved!"
+                    }
+                </Alert>
+                }
+                <CardHeader title={!isMobile && title} />
                 <Content className={classes.formContent}>
                     <ConnectedLoginAlert
                         isLoggedIn={isLoggedIn}

diff --git a/src/components/Offers/Form/form-components/offerStyles.js b/src/components/Offers/Form/form-components/offerStyles.js
@@ -73,12 +73,12 @@ export default (isMobile) => makeStyles((theme) => ({
         paddingTop: theme.spacing(2),
         marginTop: theme.spacing(2),
     },
-    warning:{
-        fontSize:"1.2em",
+    warning: {
+        fontSize: "1.2em",
         "& .MuiAlert-icon": {
-            fontSize: "1.5em"
+            fontSize: "1.5em",
         },
-        marginBottom:"1em"
+        marginBottom: "1em",
 
 
     },

diff --git a/src/components/Offers/New/CreateOfferForm.spec.js b/src/components/Offers/New/CreateOfferForm.spec.js
@@ -3,7 +3,7 @@ import { createTheme } from "@material-ui/core/styles";
 import useComponentController from "../../../hooks/useComponentController";
 import { CreateOfferController, CreateOfferControllerContext } from "./CreateOfferForm";
 import { BrowserRouter } from "react-router-dom";
-import { screen, fireEvent, renderWithStoreAndTheme, render } from "../../../test-utils";
+import { screen, fireEvent, renderWithStoreAndTheme } from "../../../test-utils";
 import useSession from "../../../hooks/useSession";
 import CreateOfferPage from "../../../pages/CreateOfferPage";
 import { MuiPickersUtilsProvider } from "@material-ui/pickers";
@@ -14,13 +14,7 @@ import { act } from "@testing-library/react";
 import { DAY_IN_MS } from "../../../utils/TimeUtils";
 import { PAID_OPTIONS } from "../Form/form-components/OfferForm";
 import { HumanValidationReasons } from "../../../utils";
-import { validateApplication } from "../../../services/companyApplicationService";
-import { ThemeProvider } from "@material-ui/core";
-import AppTheme from "../../../AppTheme";
-import ValidationPage from "../../../pages/ValidationPage";
-import { getValidationMessage } from "../../Apply/Company/CompanyApplicationUtils";
-import { fetchCompanyApplicationState } from "../../../services/companyService";
-import { Alert } from "../../utils/Alert";
+import { fetchCompanyApplication } from "../../../services/companyService";
 
 jest.mock("../../../hooks/useSession");
 jest.mock("../../../services/locationSearchService");
@@ -48,7 +42,8 @@ describe("Create Offer Form", () => {
 
     const initialState = {};
     const theme = createTheme({});
-    fetchCompanyApplicationState.mockImplementation(async () =>"APPROVED");
+    // eslint-disable-next-line require-await
+    fetchCompanyApplication.mockImplementation(async () => "APPROVED");
 
     // it("Should edit description", () => {
     // As of today, it is not possible to test contenteditable elements (such as the awesome description editor)
@@ -229,7 +224,8 @@ describe("Create Offer Form", () => {
 
         it("Should render alert if company is not approved", async () => {
             useSession.mockImplementation(() => ({ isLoggedIn: true, data: { company: { name: "Company Name" } } }));
-            fetchCompanyApplicationState.mockImplementation(async () =>"UNVERIFIED");
+            // eslint-disable-next-line require-await
+            fetchCompanyApplication.mockImplementation(async () => ({ state: "PENDING" }));
 
             await renderWithStoreAndTheme(
                 <BrowserRouter>
@@ -241,13 +237,14 @@ describe("Create Offer Form", () => {
                 </BrowserRouter>,
                 { initialState, theme }
             );
-            expect( screen.queryByTestId( 'Alert')).toBeInTheDocument();
+            expect(screen.queryByTestId("Alert")).toBeInTheDocument();
 
         });
 
         it("Should not render alert if company is approved", async () => {
             useSession.mockImplementation(() => ({ isLoggedIn: true, data: { company: { name: "Company Name" } } }));
-            fetchCompanyApplicationState.mockImplementation(async () =>"APPROVED");
+            // eslint-disable-next-line require-await
+            fetchCompanyApplication.mockImplementation(async () => ({ state: "APPROVED" }));
 
             await renderWithStoreAndTheme(
                 <BrowserRouter>

diff --git a/src/components/Review/Applications/ApplicationsReviewWidget.spec.js b/src/components/Review/Applications/ApplicationsReviewWidget.spec.js
@@ -286,10 +286,10 @@ describe("Application Review Widget", () => {
                     </SnackbarProvider>
                 </MuiPickersUtilsProvider>, { initialState: {}, theme })
         );
-        
+
         expect(screen.queryByLabelText("Approve Application")).not.toBeInTheDocument();
         expect(screen.queryByLabelText("Reject Application")).not.toBeInTheDocument();
-    })
+    });
 
     it("Should maintain state filter after rejecting an application", async () => {
         const applications = generateApplications(1, "PENDING");

diff --git a/src/components/utils/Alert.js b/src/components/utils/Alert.js
@@ -1,33 +1,37 @@
-import {Alert as MUI_Alert, AlertTitle} from "@material-ui/lab";
-import {makeStyles} from "@material-ui/core";
+
+import { Alert as MUIAlert, AlertTitle } from "@material-ui/lab";
+import { makeStyles } from "@material-ui/core";
 import PropTypes from "prop-types";
 import { Warning as WarningIcon } from "@material-ui/icons";
-import React from 'react';
+import React from "react";
 
-const useStyles = (props) => makeStyles((theme) => ({
+const useStyles = (props) => makeStyles(() => ({
 
-    content:{
-        fontSize: props.fontSize+"em",
+    content: {
+        fontSize: `${props.fontSize}em`,
         "& .MuiAlert-icon": {
-            fontSize: (props.fontSize+0.3)+"em"
+            fontSize: `${props.fontSize + 0.3}em`,
         },
-        margin:"0.5em 0em"
+        margin: "0.5em 0em",
     },
 }));
 
-export const Alert = ({type, title, fontSize = 1, children}) => {
-    const classes = useStyles({fontSize: fontSize})();
+export const Alert = ({ type, title, fontSize = 1, children }) => {
+    const classes = useStyles({ fontSize: fontSize })();
     return (
-        <MUI_Alert severity={type} className={classes.content} icon={<WarningIcon />} data-testid="Alert">
-            {title ? <AlertTitle>{title}</AlertTitle> : null}
+        <MUIAlert severity={type} className={classes.content} icon={<WarningIcon />} data-testid="Alert">
+            {title ?
+                <AlertTitle>
+                    {title}
+                </AlertTitle> : null}
             {children}
-        </MUI_Alert>
-    )
-}
+        </MUIAlert>
+    );
+};
 
 Alert.propTypes = {
     type: PropTypes.oneOf(["error", "warning", "info", "success"]),
     title: PropTypes.string,
     children: PropTypes.string,
     fontSize: PropTypes.number,
-}
+};
diff --git a/src/pages/CompanyOffersManagementPage.js b/src/pages/CompanyOffersManagementPage.js
@@ -1,9 +1,9 @@
-import React, {useEffect, useState} from "react";
+import React, { useEffect, useState } from "react";
 import CompanyOffersManagementWidget from "../components/Company/Offers/Manage/CompanyOffersManagementWidget";
 import { CardContent, makeStyles } from "@material-ui/core";
 import { useMobile } from "../utils/media-queries";
 import { Alert } from "../components/utils/Alert";
-import { fetchCompanyApplicationState } from "../services/companyService";
+import { fetchCompanyApplication } from "../services/companyService";
 import useSession from "../hooks/useSession";
 import { addSnackbar } from "../actions/notificationActions";
 
@@ -17,19 +17,14 @@ const useStyles = (isMobile) => makeStyles((theme) => ({
 const CompanyOffersManagementPage = () => {
     const isMobile = useMobile();
     const classes = useStyles(isMobile)();
-    const [state, setState_] = useState( "APPROVED");
+    const [state, setState_] = useState("APPROVED");
     const session = useSession();
 
     useEffect(() => {
-        if(!session.isValidating && session.isLoggedIn) {
-            const request = fetchCompanyApplicationState(session.data?.company?._id)
-                .then((state_) => {
-                    console.log(state_);
-                    console.log("Tipo");
-                    console.log(typeof state_);
-                    setState_(state_);
-                    console.log(state);
-
+        if (!session.isValidating && session.isLoggedIn) {
+            fetchCompanyApplication(session.data?.company?._id)
+                .then((application) => {
+                    setState_(application.state);
                 })
                 .catch(() => {
                     addSnackbar({
@@ -38,13 +33,20 @@ const CompanyOffersManagementPage = () => {
                     });
                 });
         }
-    }, [addSnackbar, session.isLoggedIn, session.isValidating]);
+    }, [session.data.company._id, session.isLoggedIn, session.isValidating]);
 
     return (
         <CardContent className={classes.content}>
-            {(state !== "APPROVED") && session.isLoggedIn && <Alert type={"warning"}
-                                              fontSize={1.2}>{"Your offers will stay hidden from the public until your account is approved!"}</Alert>}
-            <CompanyOffersManagementWidget isMobile={isMobile}/>
+            {
+                (state !== "APPROVED") && session.isLoggedIn &&
+                <Alert
+                    type={"warning"}
+                    fontSize={1.2}
+                >
+                    {"Your offers will stay hidden from the public until your account is approved!"}
+                </Alert>
+            }
+            <CompanyOffersManagementWidget isMobile={isMobile} />
         </CardContent>
     );
 };

diff --git a/src/pages/CompanyOffersManagementPage.spec.js b/src/pages/CompanyOffersManagementPage.spec.js
@@ -3,7 +3,7 @@ import { createTheme } from "@material-ui/core/styles";
 import { BrowserRouter } from "react-router-dom";
 import { renderWithStoreAndTheme, screen } from "../test-utils";
 import useSession from "../hooks/useSession";
-import { fetchCompanyApplicationState } from "../services/companyService";
+import { fetchCompanyApplication } from "../services/companyService";
 import { MuiPickersUtilsProvider } from "@material-ui/pickers";
 import DateFnsUtils from "@date-io/date-fns";
 import CompanyOffersManagementPage from "./CompanyOffersManagementPage";
@@ -19,7 +19,8 @@ describe("Company Offers Management Page", () => {
 
     it("Should render alert if company is not approved", async () => {
         useSession.mockImplementation(() => ({ isLoggedIn: true, data: { company: { name: "Company Name" } } }));
-        fetchCompanyApplicationState.mockImplementation(async () =>"UNVERIFIED");
+        // eslint-disable-next-line require-await
+        fetchCompanyApplication.mockImplementation(async () => ({ state: "PENDING" }));
 
         await renderWithStoreAndTheme(
             <BrowserRouter>
@@ -29,13 +30,14 @@ describe("Company Offers Management Page", () => {
             </BrowserRouter>,
             { initialState: {}, theme }
         );
-        expect( screen.queryByTestId( 'Alert')).toBeInTheDocument();
+        expect(screen.queryByTestId("Alert")).toBeInTheDocument();
 
     });
 
     it("Should not render alert if company is approved", async () => {
         useSession.mockImplementation(() => ({ isLoggedIn: true, data: { company: { name: "Company Name" } } }));
-        fetchCompanyApplicationState.mockImplementation(async () =>"APPROVED");
+        // eslint-disable-next-line require-await
+        fetchCompanyApplication.mockImplementation(async () => ({ state: "APPROVED" }));
 
         await renderWithStoreAndTheme(
             <BrowserRouter>
@@ -45,6 +47,6 @@ describe("Company Offers Management Page", () => {
             </BrowserRouter>,
             { initialState: {}, theme }
         );
-        expect(await screen.queryByTestId("Alert")).not.toBeInTheDocument();
+        expect(screen.queryByTestId("Alert")).not.toBeInTheDocument();
     });
 });