Commit 6a9b7380 authored by BrittainJackson7's avatar BrittainJackson7
Browse files

Move HelpBox to Menubar

parent 5037a06f

src/components/presentational/Menubar.jsx

+19 −1
Original line number Diff line number Diff line
@@ -4,6 +4,7 @@ import OpenInFullIcon from "@mui/icons-material/OpenInFull"; 
import CloseFullscreenIcon from "@mui/icons-material/CloseFullscreen";

import HelpOutlineIcon from "@mui/icons-material/HelpOutline";

import GeoStacWhiteIcon from "../../images/logos/geostac-logo-white.svg";

import HelpBox from "./HelpBox.jsx";



import Button from "@mui/material/Button";

import Dialog from "@mui/material/Dialog";
@@ -23,6 +24,16 @@ export default function Menubar(props) { 
    setShowAbout(false);

  };



   const handleOpenHelpBox = () => {

    setShowHelpBox(true);

  };



  const handleCloseHelpBox = () => {

    setShowHelpBox(false);

  }



  const [showHelpBox, setShowHelpBox] = React.useState(false);



  return (

    <div id="menu-bar">

      <div className="menu-item" onClick={handleOpenAbout}>
@@ -47,6 +58,13 @@ export default function Menubar(props) { 
          <span className="menu-item-text">Help</span>

        </div>

      </a>



      <div className="menu-item"onClick={handleOpenHelpBox}>

        <span className="menu-item-text">Interactions</span>

        </div>

        

      <HelpBox isOpen={showHelpBox} onClose={handleCloseHelpBox} />



      <div className="menu-item" onClick={props.handleOpenCloseHeader}>

        {props.showHeaderFooter ? (

          <>

src/components/presentational/SearchAndFilterInput.jsx

+0 −16
Original line number Diff line number Diff line
@@ -19,8 +19,6 @@ import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward"; 


import { Collapse, Divider } from "@mui/material";

import ListItemText from "@mui/material/ListItemText";

 //help box

import HelpBox from "./HelpBox.jsx";



/**

 * Controls css styling for this component using js to css
@@ -87,9 +85,6 @@ export default function SearchAndFilterInput(props) { 
  const [dateFromVal, setDateFromVal] = React.useState(null);     // From Date

  const [dateToVal, setDateToVal] = React.useState(null);         // To Date



  // help box

  const [showHelpBox, setShowHelpBox] = React.useState(false);



  //const for callback

  const {UpdateQueryableTitles} = props;

  const handleExpandFilterClick = () => {
@@ -304,15 +299,6 @@ export default function SearchAndFilterInput(props) { 


  }, [props.targetName]);



  //help box

  const handleOpenHelpBox = () => {

    setShowHelpBox(true);

  };



  const handleCloseHelpBox = () => {

    setShowHelpBox(false);

  }



  /* Control IDs for reference:

  sortBySelect

  sortAscCheckBox
@@ -455,8 +441,6 @@ export default function SearchAndFilterInput(props) { 
          </Collapse>

        </div>

      </Collapse>

      <button onClick={handleOpenHelpBox} style={{marginTop: "20px"}}>Help</button>

      <HelpBox isOpen={showHelpBox} onClose={handleCloseHelpBox} />

    </div>

  );

}

src/styles.css

+1 −0
Original line number Diff line number Diff line
@@ -508,6 +508,7 @@ Help Box Inside Search and Filter 
}



.helpBoxContent, .subPopup {

  color: #000;

  width: 300px;

  padding: 20px;

  background-color: #fff;