rap-react/src/components/common/subHeader/index.js

To make it easy for you to get started with GitLab, here's a list of recommended next steps.

import React, { useContext } from "react";
import {
  getEntityDescription,
  getEntityUrl,
} from "../../../services/entityService";
import { hasAccess } from "../../../services/permissionService";
import {
  entityNames,
  accessTypes,
  moduleNames,
} from "../../../constants/enums";
import { GetBrandName } from "../../../services/brandService";
import { UserContext } from "../../../context/user/userContext";

export const SubHeader = ({
  brandCode,
  selectedModuleName,
  selectedEntityName,
}) => {
  const { state } = useContext(UserContext);

  const getLabelValue = () => {
    switch (selectedEntityName) {
      case entityNames.USERMANAGEMENT:
        return "Restaurant Users Management";
      case entityNames.HOURSOPERATION:
        return "Hours of Operation";
      case entityNames.MYRESTAURANTS:
        return "Revenue Management";
      case entityNames.PRICEENTRY:
      case entityNames.GROUPMANAGEMENT:
        return "Restaurant Groups Management";
      case entityNames.ROLEMANAGEMENT:
      default:
        return "Restaurant Roles Management";
    }
  };

  const label = getLabelValue();

  const getEntityNames = () => {
    switch (selectedModuleName) {
      case moduleNames.Locations:
        return [entityNames.HOURSOPERATION];
      case moduleNames.RevenueManagement:
        return [
          entityNames.MYRESTAURANTS,
          entityNames.PRICINGGROUP, //pricing
        ];
      case moduleNames.ManageRolesAndUsersModule:
      default:
        return [
          entityNames.ROLEMANAGEMENT,
          entityNames.USERMANAGEMENT,
          entityNames.GROUPMANAGEMENT,
        ];
    }
  };

  let applicableEntityNames = getEntityNames();

  const getEntityLink = (value, index) => {
    const privileges = state?.user?.privileges;
    let hasEntityAccess = hasAccess(privileges, value, accessTypes.READ);
    let description = getEntityDescription(privileges, value);
    switch (selectedModuleName) {
      case moduleNames.Locations: {
        break;
      }
      case moduleNames.RevenueManagement: {
        description = "Manage " + description; //TODO
        break;
      }
      case moduleNames.ManageRolesAndUsersModule:
      default: {
        description = "Manage " + description;
        break;
      }
    }

    let url = getEntityUrl(value);
    let className = "nav-link submenu";
    if (selectedEntityName === value) {
      className += " w--current";
    }

    if (hasEntityAccess) {
      return (
        <a key={index} className={className} href={url}>
          {description}
        </a>
      );
    }
    return <React.Fragment></React.Fragment>;
  };

  return (
    <>
      <div className="sub-header">
        <div className="container menu">
          <div className="subheader-mainlink">{label}</div>
          <div className="menu-link-wrapper">
            {applicableEntityNames.length > 0 &&
              applicableEntityNames.map((value, index) => {
                return getEntityLink(value, index);
              })}
          </div>
        </div>
      </div>
    </>
  );
};