import React, { useRef } from 'react'; import { Bell } from 'shared/icons'; import { NotificationContainer, GlobalActions, ProjectActions, ProjectMeta, ProjectName, ProjectTabs, ProjectTab, NavbarWrapper, NavbarHeader, Breadcrumbs, BreadcrumpSeparator, ProfileIcon, ProfileContainer, ProfileNameWrapper, ProfileNamePrimary, ProfileNameSecondary, } from './Styles'; type NavBarProps = { onProfileClick: (bottom: number, right: number) => void; onNotificationClick: () => void; bgColor: string; firstName: string; lastName: string; initials: string; }; const NavBar: React.FC = ({ onProfileClick, onNotificationClick, firstName, lastName, initials, bgColor, }) => { const $profileRef: any = useRef(null); const handleProfileClick = () => { console.log('click'); const boundingRect = $profileRef.current.getBoundingClientRect(); onProfileClick(boundingRect.bottom, boundingRect.right); }; return ( Production Team Board {firstName} {lastName} Manager {initials} ); }; export default NavBar;