All files / src/components AppsMenu.tsx

28.57% Statements 2/7
100% Branches 0/0
0% Functions 0/3
28.57% Lines 2/7

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110                                          1x                                 1x                                                                                                                                              
import React from "react";
import { createStyles, makeStyles } from "@mui/styles";
import {
  MenuItem,
  Box,
  Grow,
  Paper,
  Popper,
  MenuList,
  ClickAwayListener,
  Link,
  Theme
} from "@mui/material";
import {
  Web,
  Publish as ImportIcon,
  Apps as AppsIcon
} from "@mui/icons-material";
import { OCL_URL } from "../utils";
import { ReactComponent as OmrsLogo } from "./omrs-logo.svg";
 
const useStyles = makeStyles((theme: Theme) =>
  createStyles({
    box: {
      marginLeft: "10px"
    },
    popperWithOpenNav: {
      display: "block",
      left: "210px !important"
    }
  })
);
 
interface Props {
  handleClose: () => void;
  open: boolean;
}
 
export const AppsMenu: React.FC<Props> = ({ handleClose, open }) => {
  const classes = useStyles();
 
  const anchorRef = React.useRef(null);
 
  return (
    <div>
      <AppsIcon ref={anchorRef} />
      <Popper
        className={classes.popperWithOpenNav}
        placement="right-start"
        open={open}
        role={undefined}
        transition
        disablePortal
        anchorEl={anchorRef.current}
      >
        {({ TransitionProps, placement }) => (
          <Grow {...TransitionProps}>
            <Paper>
              <ClickAwayListener onClickAway={handleClose}>
                <MenuList autoFocusItem={open} id="menu-list-grow">
                  <MenuItem onClick={handleClose}>
                    <Link
                      href={OCL_URL}
                      underline="none"
                      color={"inherit"}
                      target="_blank"
                      rel="noreferrer"
                    >
                      <Box className={classes.box}>
                        <Web fontSize="small" /> OCL TermBrowser
                      </Box>
                    </Link>
                  </MenuItem>
                  <MenuItem onClick={handleClose}>
                    <Link
                      href="/"
                      underline="none"
                      color={"inherit"}
                      target="_blank"
                      rel="noreferrer"
                    >
                      <Box className={classes.box}>
                        <OmrsLogo height={24} width={24} /> OpenMRS Dictionary
                        Manager
                      </Box>
                    </Link>
                  </MenuItem>
                  <MenuItem onClick={handleClose}>
                    <Link
                      href={OCL_URL + "imports"}
                      underline="none"
                      color={"inherit"}
                      target="_blank"
                      rel="noreferrer"
                    >
                      <Box className={classes.box}>
                        <ImportIcon /> Bulk Importer
                      </Box>
                    </Link>
                  </MenuItem>
                </MenuList>
              </ClickAwayListener>
            </Paper>
          </Grow>
        )}
      </Popper>
    </div>
  );
};