\r\n
\r\n
setOpen(!open)}>\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {/*
*/}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n ) : (\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n {/*
*/}\r\n
\r\n
\r\n
\r\n
\r\n \r\n )}\r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\n//ReactComponentIgnore\r\nexport const AccountActions: React.FC = () => {\r\n const [user, setUser] = useState
();\r\n const [isAccountDropdownVisible, setIsAccountDropdownVisible] = useState(false);\r\n const accountActionsRef = useRef(null);\r\n const accountRef = useRef(null);\r\n const {t} = useTranslation();\r\n const {setAccountTarget, isShowingTour} = useTour();\r\n useEffect(() => {\r\n TdmApi.users.getCurrentUser().then(setUser);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if(isShowingTour){\r\n setAccountTarget(accountRef.current);\r\n }\r\n }, [isShowingTour]);\r\n\r\n const toggleAccountDropdown = () => {\r\n setIsAccountDropdownVisible(!isAccountDropdownVisible);\r\n };\r\n\r\n const handleClickOutside = (e: Event) => {\r\n if (accountActionsRef.current && !accountActionsRef.current.contains(e.target)) {\r\n setIsAccountDropdownVisible(false);\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n document.addEventListener('mousedown', handleClickOutside);\r\n return () => {\r\n document.removeEventListener('mousedown', handleClickOutside);\r\n };\r\n });\r\n\r\n return (\r\n <>\r\n {user &&\r\n } trigger={\"click\"} destroyTooltipOnHide>\r\n \r\n \r\n }\r\n \r\n );\r\n};\r\n\r\ninterface accountPopoverProps {\r\n user: UserDto;\r\n}\r\n\r\nconst AccountPopover: React.FC = ({user}) => {\r\n const {t} = useTranslation();\r\n const [environmentsOpen, setEnvironmentsOpen] = useState(false);\r\n const [envSearchFocused, setEnvSearchFocused] = useState(false);\r\n\r\n function onOpenChange(newOpen: boolean) {\r\n if (!envSearchFocused)\r\n setEnvironmentsOpen(newOpen);\r\n }\r\n\r\n return (\r\n setEnvironmentsOpen(false)}>\r\n
\r\n
{user.name}\r\n
\r\n
\r\n
\r\n
: \r\n : }\r\n imageClassName={className}/>\r\n }\r\n \r\n );\r\n};\r\n\r\nexport default Avatar;","import React, {Fragment, useEffect, useState} from \"react\";\r\nimport styles from \"./Breadcrumb.scss\";\r\nimport {useEnvironment} from \"shared/Designer/Contexts/EnvironmentContext\";\r\nimport {useHeader} from \"shared/Designer/Contexts/HeaderContext\";\r\n\r\n\r\nconst Breadcrumb: React.FC = () => {\r\n const {breadcrumb} = useHeader();\r\n const {environment} = useEnvironment();\r\n const [parts, setParts] = useState([]);\r\n\r\n useEffect(() => {\r\n if (breadcrumb) {\r\n if (breadcrumb.base === \"currentEnvironment\" && environment) {\r\n const newParts = breadcrumb.parts.map(part => ({path: `/${environment.path}/${part.path}`, name: part.name}));\r\n newParts.unshift({path: `/${environment.path}`, name: environment.name});\r\n setParts(newParts);\r\n } else {\r\n setParts(breadcrumb.parts);\r\n }\r\n }\r\n }, [breadcrumb, environment]);\r\n\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\n\r\nexport default Breadcrumb;\r\n","import React, {ReactNode, useState} from 'react';\r\nimport styles from './ComingSoon.scss';\r\nimport {t} from \"i18next\";\r\n\r\ninterface props {\r\n children: ReactNode\r\n functionalityName?: string\r\n}\r\n\r\nconst ComingSoon: React.FC = ({children, functionalityName}) => {\r\n const [isHovered, setHovered] = useState(false);\r\n\r\n return (\r\n setHovered(true)}\r\n onMouseLeave={() => setHovered(false)}>\r\n {isHovered &&\r\n
\r\n
{t(\"{{functionality}} Coming Soon\", {functionality: functionalityName})}
\r\n
\r\n }\r\n {children}\r\n
event.stopPropagation()}>\r\n
onSearchFocusChanged(true)} onBlur={() => onSearchFocusChanged(false)}/>\r\n
{query === \"\" ? t(\"Recent environments\") : t(\"Search results\")}\r\n
\r\n
\r\n
onChanged(e)}\r\n />\r\n\r\n {query &&\r\n
\r\n {(results && results.length > 0)\r\n ? results.map(result =>
)\r\n : searching ? Searching...
\r\n : No results found...
}\r\n \r\n }\r\n
\r\n
\r\n {/*
*/}\r\n
\r\n
\r\n
\r\n {environment\r\n ?
\r\n : \r\n 
\r\n \r\n }\r\n \r\n
\r\n
\r\n
\r\n {menuItems\r\n .filter(menu => menu.items.length > 0)\r\n .map((menu, index) => \r\n
\r\n \r\n
\r\n
{menu.title}
\r\n \r\n
\r\n {menu.items.map((item, idx) =>\r\n subMenuItemAllowed(item) && (\r\n \r\n {item.name}\r\n \r\n )\r\n )}\r\n
\r\n