54 lines
1.9 KiB
TypeScript
54 lines
1.9 KiB
TypeScript
"use client";
|
|
|
|
import { usePathname } from "next/navigation";
|
|
import { useLocale } from "next-intl";
|
|
|
|
import NewMessages from "@/components/domains/chat/NewMessages/NewMessages";
|
|
import ViewAll from "@/components/domains/chat/ViewAll/ViewAll";
|
|
import { useBalance } from "@/hooks/balance/useBalance";
|
|
import { useAppUiStore } from "@/providers/app-ui-store-provider";
|
|
import { useChats } from "@/providers/chats-provider";
|
|
import { ROUTES } from "@/shared/constants/client-routes";
|
|
import { stripLocale } from "@/shared/utils/path";
|
|
|
|
import styles from "./GlobalNewMessagesBanner.module.scss";
|
|
|
|
export default function GlobalNewMessagesBanner() {
|
|
const { unreadChats } = useChats();
|
|
const { balance } = useBalance();
|
|
|
|
// Exclude banner on chat-related, settings (profile), retention funnel, portraits, and video guides pages
|
|
const pathname = usePathname();
|
|
const locale = useLocale();
|
|
const pathnameWithoutLocale = stripLocale(pathname, locale);
|
|
const isExcluded =
|
|
pathnameWithoutLocale.startsWith(ROUTES.chat()) ||
|
|
pathnameWithoutLocale.startsWith(ROUTES.profile()) ||
|
|
pathnameWithoutLocale.startsWith("/retaining") ||
|
|
pathnameWithoutLocale.startsWith("/portraits") ||
|
|
pathnameWithoutLocale.startsWith("/video-guides");
|
|
|
|
const hasHydrated = useAppUiStore(state => state._hasHydrated);
|
|
const { isVisibleAll } = useAppUiStore(state => state.home.newMessages);
|
|
const setHomeNewMessages = useAppUiStore(state => state.setHomeNewMessages);
|
|
|
|
if (!hasHydrated || isExcluded || unreadChats.length === 0) return null;
|
|
|
|
return (
|
|
<div className={styles.container}>
|
|
<NewMessages
|
|
chats={unreadChats}
|
|
isVisibleAll={isVisibleAll}
|
|
currentBalance={balance}
|
|
/>
|
|
{unreadChats.length > 1 && (
|
|
<ViewAll
|
|
count={unreadChats.length}
|
|
isAll={isVisibleAll}
|
|
onClick={() => setHomeNewMessages({ isVisibleAll: !isVisibleAll })}
|
|
/>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|