Web:Client: fix double navigation icon
This commit is contained in:
parent
19937f50dd
commit
02b225b78b
@ -30,7 +30,6 @@ import {
|
||||
onItemClick,
|
||||
} from "@appserver/studio/src/helpers/utils";
|
||||
import StyledExternalLinkIcon from "@appserver/studio/src/components/StyledExternalLinkIcon";
|
||||
import NavDesktopItem from "./nav-desktop-item";
|
||||
import { Base } from "@appserver/components/themes";
|
||||
|
||||
const { proxyURL } = AppServerConfig;
|
||||
@ -236,7 +235,7 @@ const HeaderComponent = ({
|
||||
)}
|
||||
</LinkWithoutRedirect>
|
||||
|
||||
{!isPersonal && (
|
||||
{isNavAvailable && isDesktopView && !isPersonal && (
|
||||
<StyledNavigationIconsWrapper>
|
||||
{mainModules.map((item) => {
|
||||
return (
|
||||
@ -262,18 +261,6 @@ const HeaderComponent = ({
|
||||
})}
|
||||
</StyledNavigationIconsWrapper>
|
||||
)}
|
||||
|
||||
{isNavAvailable && isDesktopView && !isPersonal && (
|
||||
<div className="header-items-wrapper not-selectable">
|
||||
{mainModulesWithoutSettings.map((module) => (
|
||||
<NavDesktopItem
|
||||
isActive={module.id == currentProductId}
|
||||
key={module.id}
|
||||
module={module}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</Header>
|
||||
|
||||
{isNavAvailable && !isDesktopView && (
|
||||
|
@ -1,64 +0,0 @@
|
||||
import React, { useState } from "react";
|
||||
import { ReactSVG } from "react-svg";
|
||||
import Badge from "@appserver/components/badge";
|
||||
import Link from "@appserver/components/link";
|
||||
import styled from "styled-components";
|
||||
import { getLink, onItemClick } from "../../../../src/helpers/utils";
|
||||
|
||||
// const separatorColor = "#3E668D";
|
||||
|
||||
// const StyledNavDesktopItemSeparator = styled.div`
|
||||
// height: 20px;
|
||||
// margin: 0px 2px 0 20px;
|
||||
// width: 1px;
|
||||
// background: #3e668d;
|
||||
// border-left: 1px solid ${separatorColor};
|
||||
// `;
|
||||
|
||||
const StyledNavDesktopItem = styled(Link)`
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
margin-left: 16px;
|
||||
|
||||
.popup-icon {
|
||||
svg {
|
||||
margin-top: 4px;
|
||||
path {
|
||||
fill: ${(props) => (props.isActive ? "#fff" : "#7A95B0")};
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledBadge = styled(Badge)`
|
||||
position: absolute;
|
||||
height: 16px;
|
||||
margin-top: -8px;
|
||||
margin-left: 8px;
|
||||
`;
|
||||
|
||||
const NavDesktopItem = ({ module, isActive }, ...rest) => {
|
||||
const { iconUrl, notifications, link, separator, title } = module;
|
||||
const [showPopup, setShowPopup] = useState(false);
|
||||
const onBadgeClick = () => setShowPopup(!showPopup);
|
||||
const dataLink = getLink(link);
|
||||
|
||||
// <StyledNavDesktopItemSeparator {...rest} />
|
||||
return separator ? (
|
||||
<></>
|
||||
) : (
|
||||
<StyledNavDesktopItem isActive={isActive} href={link} {...rest}>
|
||||
<>
|
||||
<ReactSVG
|
||||
className="popup-icon"
|
||||
onClick={onItemClick}
|
||||
src={iconUrl}
|
||||
data-link={dataLink}
|
||||
/>
|
||||
<StyledBadge label={notifications} onClick={onBadgeClick} />
|
||||
</>
|
||||
</StyledNavDesktopItem>
|
||||
);
|
||||
};
|
||||
|
||||
export default NavDesktopItem;
|
Loading…
Reference in New Issue
Block a user