import React from "react"; import classes from "./classes.module.scss"; import Image from "next/image"; import LogoIcon from "@Assets/logo.svg"; import Link from "next/link"; import Navigation from "./Navigation"; import Notifications from "./Notifications"; import Profile from "./Profile"; import BurgerMenu from "./BurgerMenu"; import WindowStore from "@Front/Stores/WindowStore"; import Module from "@Front/Config/Module"; import Head from "next/head"; import { useRouter } from "next/router"; import LogoCielNatureIcon from "./logo-ciel-notaires.jpeg"; enum EHeaderOpeningState { OPEN = "open", CLOSED = "closed", IDLE = "idle", } type IProps = { isUserConnected: boolean; }; type IPropsClass = IProps & { isOnCustomerLoginPage: boolean; }; type IState = { open: EHeaderOpeningState; isBurgerMenuOpen: boolean; isNotificationMenuOpen: boolean; isProfileMenuOpen: boolean; }; class HeaderClass extends React.Component { private onWindowResize = () => {}; private headerBreakpoint = 1300; constructor(props: IPropsClass) { super(props); this.state = { open: EHeaderOpeningState.OPEN, isBurgerMenuOpen: false, isNotificationMenuOpen: false, isProfileMenuOpen: false, }; this.openBurgerMenu = this.openBurgerMenu.bind(this); this.closeBurgerMenu = this.closeBurgerMenu.bind(this); this.openNotificationMenu = this.openNotificationMenu.bind(this); this.closeNotificationMenu = this.closeNotificationMenu.bind(this); this.closeProfileMenu = this.closeProfileMenu.bind(this); this.openProfileMenu = this.openProfileMenu.bind(this); } public override render(): JSX.Element { return (
logo
{this.props.isUserConnected && ( <>
)} {this.props.isOnCustomerLoginPage && ciel-nature}
); } public override componentDidMount() { this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window)); } public override componentWillUnmount() { this.onWindowResize(); } private onResize(window: Window) { if (window.innerWidth > this.headerBreakpoint && this.state.isBurgerMenuOpen) this.setState({ isBurgerMenuOpen: false }); if (window.innerWidth < this.headerBreakpoint && this.state.isProfileMenuOpen) this.setState({ isProfileMenuOpen: false }); } private openBurgerMenu() { this.setState({ isBurgerMenuOpen: true }); } private closeBurgerMenu() { this.setState({ isBurgerMenuOpen: false }); } private openNotificationMenu() { this.setState({ isNotificationMenuOpen: true }); } private closeNotificationMenu() { this.setState({ isNotificationMenuOpen: false }); } private openProfileMenu() { this.setState({ isProfileMenuOpen: true }); } private closeProfileMenu() { this.setState({ isProfileMenuOpen: false }); } } export default function Header(props: IProps) { const router = useRouter(); const { pathname } = router; let isActive = Module.getInstance().get().modules.pages.CustomersLogin.props.path === pathname; return ; }