Merge pull request #1443 from jadmsaadaot/TRACK-task#1440

Make in progress default
bcgov · Dec 12, 2023 · 1189db0 · 1189db0
2 parents 2218dba + 6f4caed
commit 1189db0
Show file tree

Hide file tree

Showing 6 changed files with 47 additions and 24 deletions.
diff --git 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}
         >
           <Grid item>
-            <SearchIcon sx={{ height: "3em", width: "3em" }} />
+            <Box component="img" src={SearchIcon} alt="Search" width="32px" />
           </Grid>
           <Grid item>
             <ETHeading1

diff --git a/epictrack-web/src/components/myWorkplans/Filters/NameFilter.tsx b/epictrack-web/src/components/myWorkplans/Filters/NameFilter.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef } from "react";
+import React, { useRef } from "react";
 import { TextField } from "@mui/material";
 import debounce from "lodash/debounce";
 import {

diff --git a/epictrack-web/src/components/myWorkplans/Filters/WorkStateFilter.tsx b/epictrack-web/src/components/myWorkplans/Filters/WorkStateFilter.tsx
@@ -7,8 +7,8 @@ export const WorkStateFilter = () => {
   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
@@ -19,19 +19,19 @@ const Filters = () => {
         <NameFilter />
       </Grid>
       <Grid item xs container spacing={2} justifyContent="flex-end">
-        <Grid item>
+        <Grid item xs={2}>
           <TeamFilter />
         </Grid>
-        <Grid item>
+        <Grid item xs={2}>
           <WorkTypeFilter />
         </Grid>
-        <Grid item>
+        <Grid item xs={2}>
           <ProjectTypeFilter />
         </Grid>
-        <Grid item>
+        <Grid item xs={2}>
           <EnvRegionFilter />
         </Grid>
-        <Grid item>
+        <Grid item xs={2}>
           <WorkStateFilter />
         </Grid>
       </Grid>

diff --git 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
@@ -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<OptionType[]>([]);
   const [selectedOptions, setSelectedOptions] = React.useState<any>();
-  const [selectValue, setSelectValue] = React.useState<any>(isMulti ? [] : "");
+  const [selectValue, setSelectValue] = React.useState<any>(
+    props.defaultValue || standardDefault
+  );
   const [menuIsOpen, setMenuIsOpen] = React.useState<boolean>(
     !!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)