add: tests for quick collapse edit func in company offers management …

…widget

src/components/Company/Offers/Manage/CompanyOffersManagementWidget.js

@@ -15,24 +15,15 @@ import {
     GenerateTableCellFromField,
 } from "../../../../utils/Table/utils";
 import { columns } from "./CompanyOffersManagementSchema";
-import PropTypes from "prop-types";
-import useSession from "../../../../hooks/useSession";
 import {
     OfferTitleFilter,
     PublishDateFilter,
     PublishEndDateFilter,
     LocationFilter,
 } from "../Filters/index";
-import { Edit as EditIcon } from "@material-ui/icons";
-import { Link } from "react-router-dom";
-import { addSnackbar } from "../../../../actions/notificationActions";
-import { connect } from "react-redux";
-import { RowActions } from "./CompanyOffersActions";
 import Offer from "../../../HomePage/SearchResultsArea/Offer/Offer";
 import { OfferConstants } from "../../../Offers/Form/OfferUtils";
-import { LocationFilter, OfferTitleFilter, PublishDateFilter, PublishEndDateFilter } from "../Filters/index";
 import { RowActions } from "./CompanyOffersActions";
-import { columns } from "./CompanyOffersManagementSchema";
 import OfferTitle from "./CompanyOffersTitle";
 import CompanyOffersVisibilityActions from "./CompanyOffersVisibilityActions";
 import CollapsedQuickOfferEdit from "./CollapsedQuickOfferEdit";
@@ -220,7 +211,12 @@ const CompanyOffersManagementWidget = ({ addSnackbar, isMobile }) => {
                             </Typography>
                         </Grid>
                         <Grid item xs={6} justifyContent="center">
-                            <CompanyOffersVisibilityActions offer={row?.payload.offer} />
+                            <CompanyOffersVisibilityActions
+                                offer={row?.payload.offer}
+                                getOfferVisibility={row?.payload.getOfferVisibility}
+                                setOfferVisibility={row?.payload.setOfferVisibility}
+                                offerId={row?.payload.offerId}
+                            />
                             <Tooltip title="Edit Offer">
                                 <Link to={offerRoute}>
                                     <IconButton aria-label="Edit Offer">

src/components/Company/Offers/Manage/CompanyOffersManagementWidget.spec.js

@@ -1,14 +1,7 @@
 import React from "react";
 import {
-    screen,
-    waitFor,
-    queryByText,
-    getByLabelText,
-    fireEvent,
-    act,
-    getByTestId,
-    queryByTestId,
-    queryByTitle,
+    screen, waitFor, queryByText, getByLabelText,
+    fireEvent, act, getByTestId, queryByTestId, queryByTitle,
 } from "@testing-library/react";
 
 import CompanyOffersManagementWidget from "./CompanyOffersManagementWidget";
@@ -19,10 +12,11 @@ import * as companyOffersService from "../../../../services/companyOffersService
 import {
     hideOffer as hideOfferService,
     enableOffer as enableOfferService,
+    editOffer as editOfferService,
 } from "../../../../services/offerService";
 import useSession from "../../../../hooks/useSession";
 import { BrowserRouter } from "react-router-dom";
-import { addSnackbar } from "../../../../actions/notificationActions";
+import { addSnackbar, NotificationTypes } from "../../../../actions/notificationActions";
 import { createMatchMedia } from "../../../../utils/media-queries";
 import { columns } from "./CompanyOffersManagementSchema";
 import { createTheme } from "@material-ui/core";
@@ -267,28 +261,122 @@ describe("App", () => {
         expect(addSnackbar).toHaveBeenCalledTimes(1);
     });
 
-    it("Loads Empty Offers", async () => {
+    it("Should display a snackbar with an error if a company quick edits one hidden offer with five offers not hidden", async () => {
+        addSnackbar.mockImplementationOnce((notification) => ({
+            type: NotificationTypes.ADD_SNACKBAR,
+            notification: {
+                key: Date.now() + Math.random(),
+                ...notification,
+            },
+        }));
+
+        editOfferService.mockImplementationOnce(
+            () => new Promise((resolve) => resolve({})),
+        );
+
+        const offers = [...MOCK_OFFERS, {
+            _id: "random uuid7",
+            owner: "company_id",
+            title: "Offer title 4",
+            ownerName: "Reddit",
+            ownerLogo: "logo.com",
+            location: "Porto",
+            publishDate: "2019-06",
+            publishEndDate: "2020-09",
+            description: "Offer description 4",
+            isHidden: false,
+        },
+        {
+            _id: "random uuid8",
+            owner: "company_id",
+            title: "Offer title 5",
+            ownerName: "Reddit",
+            ownerLogo: "logo.com",
+            location: "Porto",
+            publishDate: "2019-06",
+            publishEndDate: "2020-09",
+            description: "Offer description 5",
+            isHidden: false,
+        },
+        {
+            _id: "random uuid9",
+            owner: "company_id",
+            title: "Offer title 6",
+            ownerName: "Reddit",
+            ownerLogo: "logo.com",
+            location: "Porto",
+            publishDate: "2019-06",
+            publishEndDate: "2020-09",
+            description: "Offer description 6",
+            isHidden: false,
+        },
+        {
+            _id: "random uuid10",
+            owner: "company_id",
+            title: "Offer title 7",
+            ownerName: "Reddit",
+            ownerLogo: "logo.com",
+            location: "Porto",
+            publishDate: "2019-06",
+            publishEndDate: "2020-09",
+            description: "Offer description 7",
+            isHidden: false,
+        }];
         companyOffersService.fetchCompanyOffers.mockImplementationOnce(
-            () => new Promise((resolve) => resolve([])),
+            () => new Promise((resolve) => resolve(offers)),
         );
-        // By waiting for act it executes all the async code at once
+
         renderWithStoreAndTheme(
-            <MuiPickersUtilsProvider utils={DateFnsUtils}>
-                <CompanyOffersManagementWidget />
-            </MuiPickersUtilsProvider>,
+            <BrowserRouter>
+                <MuiPickersUtilsProvider utils={DateFnsUtils}>
+                    <SnackbarProvider maxSnak={3}>
+                        <CompanyOffersManagementWidget />
+                    </SnackbarProvider>
+                </MuiPickersUtilsProvider>
+            </BrowserRouter>,
             { initialState: {}, theme },
         );
 
+        const newPublishEndDateString = "2020-08-20T22:59:59.000Z";
+        const newPublishEndDate = new Date(Date.parse(newPublishEndDateString));
+
+        let quickOfferEditCollapsableButtons;
         await waitFor(
             () => {
-                expect(screen.getByText("Offers Management")).toBeInTheDocument();
-
-                expect(screen.getByText("No offers here.")).toBeInTheDocument();
+                quickOfferEditCollapsableButtons = screen.getAllByTitle(
+                    "Quick Offer Edit Actions",
+                );
             },
             {
                 timeout: 1000,
             },
         );
+
+        const hiddenOfferQuickEditButton = quickOfferEditCollapsableButtons[1];
+
+        await act(() => {
+            fireEvent.click(hiddenOfferQuickEditButton);
+        });
+
+        const publishEndDateInput = screen.getByLabelText("Publication End Date *");
+        await act(() => {
+            fireEvent.focus(publishEndDateInput);
+            fireEvent.change(publishEndDateInput, {
+                target: { value: format(newPublishEndDate, "yyyyMMdd") },
+            });
+            fireEvent.blur(publishEndDateInput);
+        });
+
+        expect(
+            screen.getByDisplayValue(newPublishEndDateString.split("T")[0]),
+        ).not.toBeNull();
+
+        const submitButton = screen.getByTestId("submit-offer");
+        await act(() => {
+            fireEvent.click(submitButton);
+        });
+
+        expect(addSnackbar).toHaveBeenCalledTimes(1);
     });
 
     it("Error fetching offers", async () => {

src/components/Company/Offers/Manage/QuickOfferEditForm.js

@@ -1,4 +1,4 @@
-import React, { useCallback, useContext } from "react";
+import React, { useContext } from "react";
 import PropTypes from "prop-types";
 import PublicationEndDateComponent from "../../../Offers/Form/form-components/PublicationEndDateComponent";
 import EditOfferSchema from "../../../Offers/Edit/EditOfferSchema";
@@ -14,46 +14,37 @@ export const QuickOfferEditForm = ({ offerId, showTitle = false }) => {
     const { offers, setOffers } = useContext(OfferManagementContext);
 
     const dispatch = useDispatch();
-    const dispatchAddSnackbarAction = useCallback(
-        (notification) => {
-            dispatch(addSnackbar(notification));
-        },
-        [dispatch],
-    );
+    const dispatchAddSnackbarAction = (notification) => {
+        dispatch(addSnackbar(notification));
+    };
 
     const { publishEndDate } = offers[offerId]["fields"];
 
     const { control, fields, errors } = useOfferForm(EditOfferSchema, {
         publishEndDate: publishEndDate.value,
     });
 
-    const isObjectEmpty = useCallback(
-        (object) =>
-            Object.keys(object).length === 0 &&
-            Object.getPrototypeOf(object) === Object.prototype,
-        [],
-    );
+    const isObjectEmpty =
+        (object) => Object.keys(object).length === 0 &&
+            Object.getPrototypeOf(object) === Object.prototype;
 
-    const displaySuccessMessage = useCallback(() => {
+    const displaySuccessMessage = () => {
         dispatchAddSnackbarAction({
             message: "Successfully updated",
         });
-    }, [dispatchAddSnackbarAction]);
+    };
 
-    const displayErrorMessage = useCallback(
-        (err) => {
-            dispatchAddSnackbarAction({
-                message: `${parseRequestErrors(err).generalErrors[0].message}`,
-            });
-        },
-        [dispatchAddSnackbarAction],
-    );
+    const displayErrorMessage = (err) => {
+        dispatchAddSnackbarAction({
+            message: `${parseRequestErrors(err).generalErrors[0].message}`,
+        });
+    };
 
-    const changeOfferValues = useCallback(() => {
+    const changeOfferValues = () => {
         const newDate = fields.publishEndDate?.toISOString();
         publishEndDate.value = newDate.slice(0, newDate.indexOf("T"));
         setOffers({ ...offers });
-    }, [fields.publishEndDate, offers, publishEndDate.value, setOffers]);
+    };
 
     const onSubmit = (e) => {
         e.preventDefault();