\r\n {userToken && (\r\n \r\n {ReactHtmlParser(MyProfile)}\r\n\r\n \r\n )}\r\n
\r\n );\r\n}\r\n\r\nconst HoverStyleWrapper = styled.div`\r\n${({\r\n theme: {\r\n breakpoints: { tablet, tabletLarge, mobileLarge, mobileMax },\r\n },\r\n}) => `\r\n position: relative;\r\n z-index: 1;\r\n padding: 12px;\r\n \r\n &: hover {\r\n background-color: #f2f2f2;\r\n }\r\n \r\n span {\r\n color: #333;\r\n text-transform: capitalize;\r\n font-size: 16px;\r\n // line-height: 26px;\r\n font-weight: bold;\r\n cursor: pointer;\r\n }\r\n\r\n @media (max-width: ${mobileMax}px){\r\n font-size: 14px;\r\n padding: 5px;\r\n }\r\n\r\n > div {\r\n background-color: #fff;\r\n position: absolute;\r\n top: 50px;\r\n right: 0;\r\n box-shadow: 0 0 10px #00000029;\r\n ul {\r\n padding: 0;\r\n margin: 0;\r\n li {\r\n a {\r\n white-space: nowrap;\r\n }\r\n }\r\n }\r\n\r\n @media (min-width: 1200px) {\r\n display: none !important;\r\n }\r\n }\r\n\r\n &:hover > div {\r\n @media (min-width: 1200px) {\r\n display: block !important;\r\n }\r\n }\r\n\r\n &:hover > div::before {\r\n content: '';\r\n position: absolute;\r\n width: 100%;\r\n height: 30px;\r\n top: -30px;\r\n }\r\n\r\n > div ul li {\r\n list-style-type: none;\r\n\r\n a {\r\n display: block;\r\n padding: 15px 10px;\r\n text-decoration: none;\r\n color: rgb(106, 106, 106);\r\n font-size: 1.5rem;\r\n position: relative;\r\n letter-spacing: 1px;\r\n transition: all 0.2s;\r\n\r\n :hover {\r\n background-color: rgb(228, 225, 225);\r\n text-decoration: none;\r\n }\r\n }\r\n\r\n &:not(:last-child) {\r\n border-bottom: 1px solid #ddd;\r\n }\r\n }\r\n `}\r\n`;\r\n","import GlobalNav from './GlobalNav';\r\n\r\nexport default GlobalNav;\r\n","import React, { useContext, useEffect, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n GlobalNavBar,\r\n Logo,\r\n LinksWrapper,\r\n Link,\r\n LinkContainer,\r\n NavIcon,\r\n Hamburger,\r\n Row,\r\n Notifications,\r\n LogoWrapper,\r\n} from './GlobalNav.styles.js';\r\nimport Cookies from 'js-cookie';\r\nimport { useHistory, useLocation } from 'react-router-dom';\r\nimport { GlobalContext } from 'components/context/GlobalContext';\r\nimport NavigationLink from 'components/_common/navigation-link';\r\n\r\nimport kvernelandGroupImg from 'components/global-nav/logos/Kverneland.jpg';\r\nimport kubotaImg from 'components/global-nav/logos/Kubota.png';\r\nimport viconImg from 'components/global-nav/logos/Vicon.jpg';\r\nimport HoverStyle from 'components/_common/navigation-link/HoverStyle.js';\r\nimport { Auth } from 'components/context/AuthContext.js';\r\nimport { HeaderLink, UserLink } from 'components/_common/navigation-link/NavigationLink.styles.js';\r\n\r\nconst GlobalNav = ({ links: { links: { links } = {}, MyProfile } = {}, logo, brand, favicon }) => {\r\n const { globalDispatch } = useContext(GlobalContext);\r\n const { userToken } = useContext(Auth);\r\n const [activeUser, setActiveUser] = useState(null);\r\n const history = useHistory();\r\n const location = useLocation();\r\n const returnLogo = brand => {\r\n let brandLogo = logo?.Logos.filter(item => item.brand === brand)[0]\r\n ? logo?.Logos.filter(item => item.brand === brand)[0]?.image.src\r\n : logo?.Logos.filter(item => item.brand === 'Kverneland Group')[0]?.image.src;\r\n return brandLogo;\r\n };\r\n\r\n const returnFavicon = brand => {\r\n let icon = favicon?.Icons.filter(item => item.Brand === brand)[0]\r\n ? favicon?.Icons.filter(item => item.Brand === brand)[0]?.Image.src\r\n : favicon?.Icons.filter(item => item.Brand === 'Kverneland Group')[0]?.Image.src;\r\n return icon;\r\n };\r\n\r\n useEffect(() => {\r\n if (document.getElementById('favicon')) {\r\n let newFavicon = document.getElementById('favicon');\r\n newFavicon.href = returnFavicon(brand);\r\n }\r\n setActiveUser(Cookies.get('ActivUserName'));\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n const changeDealerHandler=()=>{\r\n // Cookies.set(\"IsFirstLogin\",false)\r\n history.push('/multiple-contact')\r\n }\r\n\r\n return (\r\n \r\n
\r\n - \r\n {links?.map(item => {\r\n if (item.url === '#b2c-log-out') {\r\n return (\r\n
- \r\n \r\n {ReactHtmlParser(item.title)}\r\n \r\n
\r\n \r\n );\r\n } else if (item.url === '#b2c-edit-profile') {\r\n return (\r\n - \r\n
\r\n \r\n );\r\n } else if (item.url === '#b2c-edit_profile_edit_phone') {\r\n return (\r\n - \r\n
\r\n \r\n );\r\n } else if (item.url === '#b2c-edit_password') {\r\n return (\r\n - \r\n
\r\n \r\n );\r\n } else if (item.isExternal) {\r\n return (\r\n - \r\n \r\n {ReactHtmlParser(item.title)}\r\n \r\n
\r\n \r\n );\r\n } else {\r\n return (\r\n - \r\n \r\n {ReactHtmlParser(item.title)}\r\n \r\n
\r\n \r\n );\r\n }\r\n })}\r\n
\r\n {ReactHtmlParser(parentLinks?.title)}\r\n
\r\n- \r\n {parentLinks?.childLinks?.map(item => {\r\n return (\r\n
- \r\n {item.isExternal ? (\r\n
\r\n \r\n )}\r\n \r\n );\r\n })}\r\n
\r\n {ReactHtmlParser(dataChild?.title)}\r\n
\r\n- \r\n {dataChild?.childSubLinks &&\r\n dataChild?.childSubLinks?.map(item => {\r\n return (\r\n
- \r\n {item.isExternal ? (\r\n getSubChiled(item.title)}>\r\n\r\n )}\r\n
\r\n \r\n );\r\n })}\r\n
\r\n \r\n {ReactHtmlParser(name)} \r\n {jobTitle && {ReactHtmlParser(jobTitle)} }\r\n {titleCompany && {ReactHtmlParser(titleCompany)} }\r\n \r\n
\r\n \r\n {ReactHtmlParser(placeholder)}\r\n
\r\n\r\n {selectOptions?.map((item, index) => {\r\n const { value, key } = item;\r\n return (\r\n \r\n )\r\n })}\r\n {ReactHtmlParser(item)}
\r\n ))}\r\n\r\n {item}\r\n
\r\n ))}\r\n \r\n );\r\n };\r\n return (\r\n\r\n {ReactHtmlParser(title)} \r\n \r\n {isEllipsisMessage}\r\n \r\n \r\n
\r\n \"))}
\r\n \r\n \r\n
\r\n { ReactHtmlParser(header) }
\r\n\r\n \r\n
\r\n \r\n \r\n
\r\n No component found for {templateLabel}
;\r\n }\r\n \r\n return\r\n
\r\n );\r\n }\r\n\r\n // dynamically adding in colours for theming of\r\n // different brands. This brand comes from BE\r\n // which comes from UMS.\r\n\r\n const brand = page?.brand || 'default';\r\n\r\n const newColours = { ...theme.colours, ...brands[brand] };\r\n\r\n theme.colours = newColours;\r\n\r\n return (\r\n