Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-12 15:53:02 +10:00
Code Issues Packages Projects Releases Wiki Activity

feat: add inbox counter (#1849)

Browse Source
This commit is contained in:
Ephraim Duncan
2025-06-18 03:30:01 +00:00
committed by GitHub
parent 039cd7d449
commit 29a03d4ec7
5 changed files with 86 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
apps/remix/app/components/general/app-header.tsx
View File

@ -1,11 +1,13 @@
import { type HTMLAttributes, useEffect, useState } from 'react';
import { ReadStatus } from '@prisma/client';
import { InboxIcon, MenuIcon, SearchIcon } from 'lucide-react';
import { Link, useParams } from 'react-router';
import { useSession } from '@documenso/lib/client-only/providers/session';
import { isPersonalLayout } from '@documenso/lib/utils/organisations';
import { getRootHref } from '@documenso/lib/utils/params';
import { trpc } from '@documenso/trpc/react';
import { cn } from '@documenso/ui/lib/utils';
import { Button } from '@documenso/ui/primitives/button';
@ -28,6 +30,15 @@ export const Header = ({ className, ...props }: HeaderProps) => {
const [isHamburgerMenuOpen, setIsHamburgerMenuOpen] = useState(false);
const [scrollY, setScrollY] = useState(0);
const { data: unreadCountData } = trpc.document.inbox.getCount.useQuery(
{
readStatus: ReadStatus.NOT_OPENED,
},
{
// refetchInterval: 30000, // Refetch every 30 seconds
},
);
useEffect(() => {
const onScroll = () => {
setScrollY(window.scrollY);
@ -61,12 +72,11 @@ export const Header = ({ className, ...props }: HeaderProps) => {
<Link to="/inbox" className="relative block h-10 w-10">
<InboxIcon className="text-muted-foreground hover:text-foreground h-5 w-5 flex-shrink-0 transition-colors" />
{/* Todo: Add counter. */}
{/* {unreadCount > 0 && (
<span className="bg-muted text-muted-foreground absolute -right-2 -top-2 flex h-5 w-5 items-center justify-center rounded-full text-[10px]">
1
{unreadCountData && unreadCountData.count > 0 && (
<span className="bg-primary text-primary-foreground absolute -right-1.5 -top-1.5 flex h-5 w-5 items-center justify-center rounded-full text-[10px] font-semibold">
{unreadCountData.count > 99 ? '99+' : unreadCountData.count}
</span>
)} */}
)}
</Link>
</Button>