99 lines
3.4 KiB
TypeScript
99 lines
3.4 KiB
TypeScript
import LogoIcon from "@Assets/logo_standard_neutral.svg";
|
|
import Stripe from "@Front/Api/LeCoffreApi/Admin/Stripe/Stripe";
|
|
import Subscriptions from "@Front/Api/LeCoffreApi/Admin/Subscriptions/Subscriptions";
|
|
import Module from "@Front/Config/Module";
|
|
import JwtService from "@Front/Services/JwtService/JwtService";
|
|
import { InformationCircleIcon, LifebuoyIcon } from "@heroicons/react/24/outline";
|
|
import Head from "next/head";
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { useRouter } from "next/router";
|
|
import React, { useCallback, useEffect, useState } from "react";
|
|
|
|
import IconButton from "../IconButton";
|
|
import Typography, { ETypo, ETypoColor } from "../Typography";
|
|
import BurgerMenu from "./BurgerMenu";
|
|
import classes from "./classes.module.scss";
|
|
import LogoCielNatureIcon from "./logo-ciel-notaires.jpeg";
|
|
import Navigation from "./Navigation";
|
|
import Notifications from "./Notifications";
|
|
import Profile from "./Profile";
|
|
|
|
type IProps = {
|
|
isUserConnected: boolean;
|
|
};
|
|
|
|
const headerHeight = 75;
|
|
|
|
export default function Header(props: IProps) {
|
|
const { isUserConnected } = props;
|
|
|
|
const router = useRouter();
|
|
const { pathname } = router;
|
|
const isOnCustomerLoginPage = Module.getInstance().get().modules.pages.CustomersLogin.props.path === pathname;
|
|
|
|
const [cancelAt, setCancelAt] = useState<Date | null>(null);
|
|
|
|
const loadSubscription = useCallback(async () => {
|
|
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) {
|
|
setCancelAt(new Date(stripeSubscription.cancel_at! * 1000));
|
|
}
|
|
}
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
document.documentElement.style.setProperty("--header-height", `${headerHeight}px`);
|
|
loadSubscription();
|
|
}, [loadSubscription]);
|
|
|
|
return (
|
|
<>
|
|
<div className={classes["root"]}>
|
|
<Head>
|
|
<link rel="shortcut icon" href={"/favicon.svg"} />
|
|
</Head>
|
|
<div className={classes["logo-container"]}>
|
|
<Link href={isUserConnected ? Module.getInstance().get().modules.pages.Folder.props.path : "#"}>
|
|
<Image src={LogoIcon} alt="logo" className={classes["logo"]} />
|
|
</Link>
|
|
</div>
|
|
{isUserConnected && (
|
|
<>
|
|
<div className={classes["desktop"]}>
|
|
<Navigation />
|
|
</div>
|
|
<div className={classes["right-section"]}>
|
|
<div className={classes["desktop"]}>
|
|
<Link href="https://tally.so/r/mBGaNY" target="_blank">
|
|
<IconButton icon={<LifebuoyIcon />} />
|
|
</Link>
|
|
</div>
|
|
<Notifications />
|
|
<div className={classes["desktop"]}>
|
|
<Profile />
|
|
</div>
|
|
<div className={classes["mobile"]}>
|
|
<BurgerMenu />
|
|
</div>
|
|
</div>
|
|
</>
|
|
)}
|
|
{isOnCustomerLoginPage && <Image width={70} height={70} alt="ciel-nature" src={LogoCielNatureIcon}></Image>}
|
|
</div>
|
|
{cancelAt && (
|
|
<div className={classes["subscription-line"]}>
|
|
<InformationCircleIcon height="24" />
|
|
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_GENERIC_BLACK}>
|
|
Assurez vous de sauvegarder tout ce dont vous avez besoin avant la fin de votre abonnement le{" "}
|
|
{cancelAt.toLocaleDateString()}.
|
|
</Typography>
|
|
</div>
|
|
)}
|
|
</>
|
|
);
|
|
}
|