* banners * useAuthHooks * fixes to redirect and banner * extract useIntercom to custom hook * use app theme * extract user-dropdown to new component * Navigation Item * navigation and profile dropdown * Fix import * navigation and sidebar * fix type errors * fix banners being an async call * fix types * fix banner prop type * fix mobile nav item import * fix banner types * (revert) layout banner render method to fix type error --------- Co-authored-by: Alex van Andel <me@alexvanandel.com> Co-authored-by: Keith Williams <keithwillcode@gmail.com> Co-authored-by: Joe Au-Yeung <65426560+joeauyeung@users.noreply.github.com>
48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import { useSession } from "next-auth/react";
|
|
import { useMemo } from "react";
|
|
|
|
import { TOP_BANNER_HEIGHT } from "@calcom/lib/constants";
|
|
import { trpc } from "@calcom/trpc/react";
|
|
|
|
import { type AllBannerProps } from "./LayoutBanner";
|
|
|
|
const _useBanners = () => {
|
|
const { data: getUserTopBanners, isPending } = trpc.viewer.getUserTopBanners.useQuery();
|
|
const { data: userSession } = useSession();
|
|
|
|
if (isPending || !userSession) return null;
|
|
|
|
const isUserInactiveAdmin = userSession?.user.role === "INACTIVE_ADMIN";
|
|
const userImpersonatedByUID = userSession?.user.impersonatedBy?.id;
|
|
|
|
const userSessionBanners = {
|
|
adminPasswordBanner: isUserInactiveAdmin ? userSession : null,
|
|
impersonationBanner: userImpersonatedByUID ? userSession : null,
|
|
};
|
|
|
|
const allBanners: AllBannerProps = Object.assign({}, getUserTopBanners, userSessionBanners);
|
|
|
|
return allBanners;
|
|
};
|
|
|
|
const useBannersHeight = (banners: AllBannerProps | null) => {
|
|
const bannersHeight = useMemo(() => {
|
|
const activeBanners =
|
|
banners &&
|
|
Object.entries(banners).filter(([_, value]) => {
|
|
return value && (!Array.isArray(value) || value.length > 0);
|
|
});
|
|
return (activeBanners?.length ?? 0) * TOP_BANNER_HEIGHT;
|
|
}, [banners]);
|
|
|
|
return bannersHeight;
|
|
};
|
|
|
|
const useBanners = () => {
|
|
const banners = _useBanners();
|
|
const bannersHeight = useBannersHeight(banners);
|
|
return { banners, bannersHeight };
|
|
};
|
|
|
|
export { useBanners, useBannersHeight };
|