import React from "react"; import classes from "./classes.module.scss"; import Image from "next/image"; import LogoIcon from "@Assets/logo_standard_neutral.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"; import LifeBuoy from "@Assets/Icons/life_buoy.svg"; import Stripe from "@Front/Api/LeCoffreApi/Admin/Stripe/Stripe"; import JwtService from "@Front/Services/JwtService/JwtService"; import Subscriptions from "@Front/Api/LeCoffreApi/Admin/Subscriptions/Subscriptions"; import Typography, { ETypo, ETypoColor } from "../Typography"; import { InformationCircleIcon } from "@heroicons/react/24/outline"; 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; cancelAt: Date | null; }; 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, cancelAt: null, }; 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); this.loadSubscription = this.loadSubscription.bind(this); } public override render(): JSX.Element { return ( <>
logo
{this.props.isUserConnected && ( <>
help
)} {this.props.isOnCustomerLoginPage && ciel-nature}
{this.state.cancelAt && (
; Assurez vous de sauvegarder tout ce dont vous avez besoin avant la fin de votre abonnement le{" "} {this.state.cancelAt.toLocaleDateString()}.
)} ); } public override componentDidMount() { this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window)); this.loadSubscription(); } public override componentWillUnmount() { this.onWindowResize(); } public async loadSubscription() { const jwt = JwtService.getInstance().decodeJwt(); const subscription = await Subscriptions.getInstance().get({ where: { office: { uid: jwt?.office_Id } } }); if (subscription[0]) { const stripeSubscription = await Stripe.getInstance().getStripeSubscriptionByUid(subscription[0].stripe_subscription_id!); if (stripeSubscription.cancel_at !== null) this.setState({ ...this.state, cancelAt: new Date(stripeSubscription.cancel_at! * 1000), }); } } 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 ; }