From 6ac9628ea27a66a94d184e68fb6f99e87e119434 Mon Sep 17 00:00:00 2001 From: Jad Date: Tue, 12 Dec 2023 10:11:15 -0800 Subject: [PATCH 1/3] Make in progress default --- .../src/components/NoResultsFound/index.tsx | 6 ++-- .../myWorkplans/Filters/NameFilter.tsx | 2 +- .../myWorkplans/Filters/WorkStateFilter.tsx | 10 ++++-- .../components/myWorkplans/Filters/index.tsx | 10 +++--- .../src/components/shared/constants.tsx | 31 +++++++++++++++---- .../shared/filterSelect/FilterSelect.tsx | 29 ++++++++++------- 6 files changed, 59 insertions(+), 29 deletions(-) diff --git a/epictrack-web/src/components/NoResultsFound/index.tsx b/epictrack-web/src/components/NoResultsFound/index.tsx index 5990a4ece..c35103cde 100644 --- a/epictrack-web/src/components/NoResultsFound/index.tsx +++ b/epictrack-web/src/components/NoResultsFound/index.tsx @@ -1,8 +1,8 @@ import React from "react"; -import { Container, Grid } from "@mui/material"; +import { Box, Container, Grid } from "@mui/material"; import { ETHeading1, ETHeading3, ETPageContainer } from "../shared"; import { Palette } from "../../styles/theme"; -import SearchIcon from "@mui/icons-material/Search"; +import SearchIcon from "../../assets/images/search.svg"; const NoResultsFound = () => { return ( @@ -23,7 +23,7 @@ const NoResultsFound = () => { spacing={2} > - + { const { setSearchOptions } = useContext(MyWorkplansContext); const options = Object.values(WORK_STATE).map((state) => ({ - label: state, - value: state, + label: state.label, + value: state.value, })); return ( @@ -27,6 +27,12 @@ export const WorkStateFilter = () => { name="workState" isMulti info={true} + defaultValue={[ + { + label: WORK_STATE.IN_PROGRESS.label, + value: WORK_STATE.IN_PROGRESS.value, + }, + ]} /> ); }; diff --git a/epictrack-web/src/components/myWorkplans/Filters/index.tsx b/epictrack-web/src/components/myWorkplans/Filters/index.tsx index 669b30f0a..aaf5b2fd8 100644 --- a/epictrack-web/src/components/myWorkplans/Filters/index.tsx +++ b/epictrack-web/src/components/myWorkplans/Filters/index.tsx @@ -19,19 +19,19 @@ const Filters = () => { - + - + - + - + - + diff --git a/epictrack-web/src/components/shared/constants.tsx b/epictrack-web/src/components/shared/constants.tsx index 3beb6eaec..6c329308c 100644 --- a/epictrack-web/src/components/shared/constants.tsx +++ b/epictrack-web/src/components/shared/constants.tsx @@ -1,10 +1,29 @@ export const WORK_STATE = Object.freeze({ - SUSPENDED: "SUSPENDED", - IN_PROGRESS: "IN_PROGRESS", - WITHDRAWN: "WITHDRAWN", - TERMINATED: "TERMINATED", - CLOSED: "CLOSED", - COMPLETED: "COMPLETED", + SUSPENDED: { + value: "SUSPENDED", + label: "Suspended", + }, + IN_PROGRESS: { + value: "IN_PROGRESS", + label: "In Progress", + }, + WITHDRAWN: { + value: "WITHDRAWN", + label: "Withdrawn", + }, + + TERMINATED: { + value: "TERMINATED", + label: "Terminated", + }, + CLOSED: { + value: "CLOSED", + label: "Closed", + }, + COMPLETED: { + value: "COMPLETED", + label: "Completed", + }, }); export const REGIONS = Object.freeze({ diff --git a/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx b/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx index 31df1d61b..ed793016e 100644 --- a/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx +++ b/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx @@ -8,7 +8,6 @@ import { Palette } from "../../../styles/theme"; import SingleValue from "./components/SingleValueContainer"; import DropdownIndicator from "./components/DropDownIndicator"; import { MET_Header_Font_Weight_Regular } from "../../../styles/constants"; -import clsx from "clsx"; // const useStyle = makeStyles({ // infoSelect: { @@ -25,10 +24,13 @@ import clsx from "clsx"; const FilterSelect = (props: SelectProps) => { // const classes = useStyle(); - const { name, isMulti } = props; + const { name, isMulti, defaultValue } = props; + const standardDefault = isMulti ? [] : ""; const [options, setOptions] = React.useState([]); const [selectedOptions, setSelectedOptions] = React.useState(); - const [selectValue, setSelectValue] = React.useState(isMulti ? [] : ""); + const [selectValue, setSelectValue] = React.useState( + props.defaultValue || standardDefault + ); const [menuIsOpen, setMenuIsOpen] = React.useState( !!props.menuIsOpen ); @@ -48,10 +50,6 @@ const FilterSelect = (props: SelectProps) => { const isOptionSelected = (o: OptionType) => isMulti ? selectedOptions.includes(o.value) : selectedOptions === o.value; - React.useEffect(() => { - setSelectValue(isMulti ? [] : ""); - }, []); - React.useEffect(() => { const currentValues = isMulti ? selectValue.map((v: OptionType) => v.value) @@ -60,6 +58,7 @@ const FilterSelect = (props: SelectProps) => { }, [menuIsOpen]); const handleChange = (newValue: any, actionMeta: any) => { + console.log("changing"); if (!isMulti) { if (isOptionSelected(newValue)) { setSelectedOptions(""); @@ -141,6 +140,11 @@ const FilterSelect = (props: SelectProps) => { setOptions(filterOptions); }, [props.options]); + React.useEffect(() => { + console.log("selectValue", selectValue); + // setSelectValue(defaultValue || standardDefault); + }, [selectValue]); + return ( { fontWeight: 700, }), }), - // menuPortal: (base, props) => ({ - // ...base, - // zIndex: 2, - // marginTop: "4px", - // }), + menuPortal: (base, props) => ({ + ...base, + zIndex: 2, + marginTop: "4px", + }), input: (base, props) => ({ ...base, fontWeight: "400", From 6f4caed5dbcb8d656f6b949c25928dd5c73a4314 Mon Sep 17 00:00:00 2001 From: Jad Date: Tue, 12 Dec 2023 10:50:29 -0800 Subject: [PATCH 3/3] Remove unused prop --- .../src/components/shared/filterSelect/FilterSelect.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx b/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx index f4679dfb1..9da51be0f 100644 --- a/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx +++ b/epictrack-web/src/components/shared/filterSelect/FilterSelect.tsx @@ -147,7 +147,6 @@ const FilterSelect = (props: SelectProps) => { name={name} options={options} isMulti={isMulti} - defaultValue={defaultValue} onChange={handleChange} components={{ Option,