Added selected header navigation BOD-164

client/src/components/header/header.component.jsx

@@ -26,7 +26,10 @@ import {
 import { connect } from "react-redux";
 import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
-import { selectRecentItems } from "../../redux/application/application.selectors";
+import {
+  selectRecentItems,
+  selectSelectedHeader,
+} from "../../redux/application/application.selectors";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { signOutStart } from "../../redux/user/user.actions";
 import { selectCurrentUser } from "../../redux/user/user.selectors";
@@ -36,6 +39,7 @@ import "./header.styles.scss";
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
   recentItems: selectRecentItems,
+  selectedHeader: selectSelectedHeader,
 });
 
 const mapDispatchToProps = (dispatch) => ({
@@ -51,6 +55,7 @@ const mapDispatchToProps = (dispatch) => ({
 function Header({
   handleMenuClick,
   currentUser,
+  selectedHeader,
   signOutStart,
   setInvoiceEnterContext,
   setTimeTicketContext,
@@ -64,7 +69,7 @@ function Header({
       mode="horizontal"
       theme="dark"
       className="header-main-menu"
-      selectedKeys={["home"]}
+      selectedKeys={[selectedHeader]}
       onClick={handleMenuClick}
     >
       <Menu.Item key="home">

client/src/components/header/header.styles.scss

@@ -4,6 +4,6 @@
   max-height: 3.5rem;
 }
 .header-main-menu {
-  width: 80vw;
-  float: left;
+  //width: 95vw;
+  //float: left;
 }

client/src/components/job-search-select/job-search-select.component.jsx

@@ -32,7 +32,7 @@ const JobSearchSelect = ({ value, onChange, onBlur, disabled }, ref) => {
   const [option, setOption] = useState(value);
 
   useEffect(() => {
-    if (value === option) {
+    if (value === option && value) {
       callIdSearch({ variables: { id: value } });
     }
   }, [value, option, callIdSearch]);
@@ -46,7 +46,7 @@ const JobSearchSelect = ({ value, onChange, onBlur, disabled }, ref) => {
   const handleSelect = (value) => {
     setOption(value);
     if (value !== option && onChange) {
-      onChange(option);
+      onChange(value);
     }
   };
 
@@ -69,6 +69,7 @@ const JobSearchSelect = ({ value, onChange, onBlur, disabled }, ref) => {
         filterOption={false}
         onSearch={handleSearch}
         //     onChange={setOption}
+        onChange={handleSelect}
         onSelect={handleSelect}
         notFoundContent={loading ? <LoadingOutlined /> : <Empty />}
         onBlur={onBlur}