Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve Search Functionality #172

Merged
merged 24 commits into from
May 24, 2022
Merged

Improve Search Functionality #172

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
41d152c
Add: loading offers when the user reaches the last one
TiagooGomess Feb 11, 2022
98e6112
Add: useLoadMoreOffers hook
TiagooGomess Feb 12, 2022
4eeae5f
Add: useLoadMoreOffers hook returning new offers when scrolling
TiagooGomess Feb 12, 2022
dcacd61
Add: useLoadMoreOffers hook main functionality done
TiagooGomess Feb 12, 2022
0fd3010
Fix: new search after seing the results is now working
TiagooGomess Feb 13, 2022
c67e63d
Add: submitNumber property to the redux state, to reset infinite scro…
TiagooGomess Feb 13, 2022
6f7f93e
Add: search offers infinite scrolling working correctly
TiagooGomess Feb 13, 2022
f4ffa45
Remove: unnecessary variables
TiagooGomess Feb 14, 2022
9895fbd
Fix: warning in mobile view regarding PropTypes
TiagooGomess Feb 14, 2022
217fa40
Fix: infinite scroll loading display
TiagooGomess Feb 14, 2022
91fbe5e
Refactor: renamed variables
TiagooGomess Feb 22, 2022
46bf5ef
Refactor: moved infinite scroll to SearchResultsController
TiagooGomess Feb 22, 2022
d20f73d
Update: offer search offset logic to queryToken
TiagooGomess Mar 24, 2022
8b16734
Fix: warning in OfferItem Skeleton circle attribute
TiagooGomess Mar 24, 2022
5b42124
Fix: offer search tests
TiagooGomess Mar 24, 2022
9c2282f
Add: requested changes
TiagooGomess Mar 26, 2022
ac53e0f
Refactor: offer search
TiagooGomess Mar 26, 2022
61624ab
Fix: load more offers in search bug
TiagooGomess Mar 26, 2022
9df8c3f
Refactor: infinite scrolling is now using scroll percentage as a trigger
TiagooGomess Mar 26, 2022
4327588
Fix: load more offers when there is no scroll
TiagooGomess Mar 28, 2022
3d62263
Fix: bug regarding the fact that the search and loadMoreOffers functi…
TiagooGomess Mar 28, 2022
127781d
Fix: search offers tests
TiagooGomess Apr 8, 2022
ecb6b42
Add: test for load more offers feature
TiagooGomess Apr 13, 2022
b004555
Remove: unused file
TiagooGomess May 19, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 8 additions & 1 deletion src/actions/searchOffersActions.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ export const OfferSearchTypes = Object.freeze({
SET_JOB_FIELDS: "SET_JOB_FIELDS",
SET_JOB_TECHS: "SET_JOB_TECHS",
SET_OFFERS_SEARCH_RESULT: "SET_OFFERS_SEARCH_RESULT",
SET_SEARCH_QUERY_TOKEN: "SET_SEARCH_QUERY_TOKEN",
SET_OFFERS_LOADING: "SET_OFFERS_LOADING",
SET_SEARCH_OFFERS_ERROR: "SET_SEARCH_OFFERS_ERROR",
SET_JOB_DURATION_TOGGLE: "SET_JOB_DURATION_TOGGLE",
Expand All @@ -21,9 +22,15 @@ export const setLoadingOffers = (loading) => ({
loading,
});

export const setSearchOffers = (offers) => ({
export const setSearchOffers = (offers, accumulate) => ({
type: OfferSearchTypes.SET_OFFERS_SEARCH_RESULT,
offers,
accumulate,
});

export const setSearchQueryToken = (queryToken) => ({
type: OfferSearchTypes.SET_SEARCH_QUERY_TOKEN,
queryToken,
});

export const setOffersFetchError = (error) => ({
Expand Down
57 changes: 36 additions & 21 deletions src/components/HomePage/SearchArea/AdvancedSearch/AdvancedSearchDesktop.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,14 @@
import React from "react";
import AdvancedSearchDesktop from "./AdvancedSearchDesktop";
import JobOptions from "../../../utils/offers/JobOptions";
import { render, screen } from "../../../../test-utils";
import { renderWithStoreAndTheme, screen } from "../../../../test-utils";
import { AdvancedSearchControllerContext, AdvancedSearchController } from "../SearchArea";
import { fireEvent } from "@testing-library/dom";
import useComponentController from "../../../../hooks/useComponentController";
import FieldOptions from "../../../utils/offers/FieldOptions";
import TechOptions from "../../../utils/offers/TechOptions";
import { INITIAL_JOB_DURATION, INITIAL_JOB_TYPE } from "../../../../reducers/searchOffersReducer";
import { createTheme } from "@material-ui/core/styles";

const AdvancedSearchWrapper = ({
children, enableAdvancedSearchDefault, showJobDurationSlider, setShowJobDurationSlider, jobMinDuration = INITIAL_JOB_DURATION,
Expand Down Expand Up @@ -36,13 +37,18 @@ const AdvancedSearchWrapper = ({
};

describe("AdvancedSearchDesktop", () => {

const theme = createTheme();
const initialState = {};

describe("render", () => {
it("should render a job selector with all job types", () => {

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper enableAdvancedSearchDefault>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

fireEvent.mouseDown(screen.getByLabelText("Job Type"));
Expand All @@ -60,7 +66,7 @@ describe("AdvancedSearchDesktop", () => {

it("should toggle job duration slider (on)", () => {
const setShowJobDurationSliderMock = jest.fn();
render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
jobMinDuration={1}
Expand All @@ -69,7 +75,8 @@ describe("AdvancedSearchDesktop", () => {
setShowJobDurationSlider={setShowJobDurationSliderMock}
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

expect(screen.getByText("Job Duration: 1 - 2 months")).not.toBeVisible();
Expand All @@ -81,7 +88,7 @@ describe("AdvancedSearchDesktop", () => {

it("should toggle job duration slider (off)", () => {
const setShowJobDurationSliderMock = jest.fn();
render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
jobMinDuration={1}
Expand All @@ -90,7 +97,8 @@ describe("AdvancedSearchDesktop", () => {
setShowJobDurationSlider={setShowJobDurationSliderMock}
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);


Expand All @@ -101,10 +109,11 @@ describe("AdvancedSearchDesktop", () => {

it("should render a fields selector with all field types", () => {

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper enableAdvancedSearchDefault>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

fireEvent.mouseDown(screen.getByLabelText("Fields", { selector: "input" }));
Expand All @@ -126,10 +135,11 @@ describe("AdvancedSearchDesktop", () => {

it("should render a technologies selector with all technology types", () => {

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper enableAdvancedSearchDefault>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

fireEvent.mouseDown(screen.getByLabelText("Technologies", { selector: "input" }));
Expand All @@ -151,26 +161,28 @@ describe("AdvancedSearchDesktop", () => {

it("should disable reset button if no advanced field is set", () => {

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

expect(screen.getByRole("button", { name: "Reset Advanced Fields" })).toBeDisabled();
});

it("should enable reset button if some advanced field is set", () => {

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
fields={[Object.keys(FieldOptions)[0]]}
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

expect(screen.getByRole("button", { name: "Reset Advanced Fields" })).not.toBeDisabled();
Expand All @@ -184,14 +196,15 @@ describe("AdvancedSearchDesktop", () => {

const setFieldsMock = jest.fn();

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
fields={[Object.keys(FieldOptions)[0]]}
setFields={setFieldsMock}
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

expect(screen.getAllByTestId("chip-option", {})).toHaveLength(1);
Expand All @@ -213,14 +226,15 @@ describe("AdvancedSearchDesktop", () => {

const setTechsMock = jest.fn();

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
technologies={[Object.keys(TechOptions)[0]]}
setTechs={setTechsMock}
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

expect(screen.getAllByTestId("chip-option", {})).toHaveLength(1);
Expand All @@ -241,7 +255,7 @@ describe("AdvancedSearchDesktop", () => {
it("should call resetAdvancedSearch when Reset button is clicked", () => {
const resetFn = jest.fn();

render(
renderWithStoreAndTheme(
<AdvancedSearchWrapper
enableAdvancedSearchDefault
setJobType={() => {}}
Expand All @@ -253,7 +267,8 @@ describe("AdvancedSearchDesktop", () => {
technologies={[Object.keys(TechOptions)[0]]} // Must have something set to be able to click reset
>
<AdvancedSearchDesktop />
</AdvancedSearchWrapper>
</AdvancedSearchWrapper>,
{ initialState, theme }
);

fireEvent.click(screen.getByRole("button", { name: "Reset Advanced Fields" }));
Expand Down
28 changes: 13 additions & 15 deletions src/components/HomePage/SearchArea/AdvancedSearch/AdvancedSearchMobile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -176,21 +176,19 @@ const AdvancedSearchMobile = () => {
};

AdvancedSearchMobile.propTypes = {
open: PropTypes.bool.isRequired,
close: PropTypes.func.isRequired,
searchValue: PropTypes.string.isRequired,
submitForm: PropTypes.func.isRequired,
setSearchValue: PropTypes.func.isRequired,
resetAdvancedSearch: PropTypes.func.isRequired,
FieldsSelectorProps: PropTypes.object.isRequired,
TechsSelectorProps: PropTypes.object.isRequired,
JobTypeSelectorProps: PropTypes.object.isRequired,
JobDurationSwitchProps: PropTypes.object.isRequired,
ResetButtonProps: PropTypes.object.isRequired,
JobDurationSliderText: PropTypes.string.isRequired,
JobDurationCollapseProps: PropTypes.object.isRequired,
JobDurationSwitchLabel: PropTypes.string.isRequired,
JobDurationSliderProps: PropTypes.object.isRequired,
searchValue: PropTypes.string,
submitForm: PropTypes.func,
setSearchValue: PropTypes.func,
resetAdvancedSearch: PropTypes.func,
FieldsSelectorProps: PropTypes.object,
TechsSelectorProps: PropTypes.object,
JobTypeSelectorProps: PropTypes.object,
JobDurationSwitchProps: PropTypes.object,
ResetButtonProps: PropTypes.object,
JobDurationSliderText: PropTypes.string,
JobDurationCollapseProps: PropTypes.object,
JobDurationSwitchLabel: PropTypes.string,
JobDurationSliderProps: PropTypes.object,
onMobileClose: PropTypes.func,
};

Expand Down
Loading