Skip to content

Merge to main #117

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
bahmez merged 4 commits into from
Feb 8, 2026
Merged

Merge to main #117

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
06a095f
feat: implement notification polling and toast alerts
bahmez Feb 7, 2026
cf1e27b
feat: add notification count display and mark notifications as read
bahmez Feb 7, 2026
cd5030d
feat: add method to retrieve project ID for Firestore console
bahmez Feb 7, 2026
43e3580
Merge pull request #116 from bahmez/bugfix/improve-notification
bahmez Feb 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 54 additions & 2 deletions apps/web/src/app/(app)/dashboard/boards/[boardId]/board-client.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ import {
} from '@taskly/ui';
import { useWorkspaceUI } from '@/components/workspace/workspace-ui-provider';
import { UserAvatar } from '@/components/user/user-avatar';
import { MoreHorizontal, Plus, CheckSquare, Paperclip, MessageSquare, GripVertical, Calendar, ScrollText, Clock, Paintbrush } from 'lucide-react';
import { MoreHorizontal, Plus, CheckSquare, Paperclip, MessageSquare, GripVertical, Calendar, ScrollText, Clock, Paintbrush, Bell } from 'lucide-react';
import TicketDialogV2 from '@/components/ticket/ticket-dialog-v2';
import { ConfirmDialog } from '@/components/ui/confirm-dialog';

Expand Down Expand Up @@ -174,6 +174,7 @@ function SortableBoardTicket({
formatUserSecondary: _formatUserSecondary,
initialsForUser: _initialsForUser,
userById,
notifCount,
}: {
t: TicketLike;
labelMap: Map<string, AnyLabel>;
Expand All @@ -182,6 +183,7 @@ function SortableBoardTicket({
formatUserSecondary: (userId: string) => string;
initialsForUser: (userId: string) => string;
userById: Map<string, { id: string }>;
notifCount: number;
}) {
const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({
id: dndTicketId(t.id),
Expand Down Expand Up @@ -285,6 +287,12 @@ function SortableBoardTicket({
<span>0</span>
</div>
)}
{notifCount > 0 && (
<div className="flex items-center gap-1 text-xs text-[#579dff] font-medium">
<Bell className="h-3 w-3" />
<span>{notifCount}</span>
</div>
)}
{/* Assignees */}
{t.assigneeIds && t.assigneeIds.length > 0 && (
<div className="flex -space-x-1 ml-auto">
Expand Down Expand Up @@ -339,6 +347,7 @@ function SortableBoardColumn({
formatUserSecondary,
initialsForUser,
userById,
ticketNotifCounts,
}: {
boardId: string;
col: ColumnLike;
Expand Down Expand Up @@ -370,6 +379,7 @@ function SortableBoardColumn({
formatUserSecondary: (userId: string) => string;
initialsForUser: (userId: string) => string;
userById: Map<string, { id: string }>;
ticketNotifCounts: Map<string, number>;
}) {
const { t } = useTranslation();
const { setNodeRef: setDropRef } = useDroppable({
Expand Down Expand Up @@ -486,6 +496,7 @@ function SortableBoardColumn({
formatUserSecondary={formatUserSecondary}
initialsForUser={initialsForUser}
userById={userById}
notifCount={ticketNotifCounts.get(ticket.id) ?? 0}
/>
))}
</SortableContext>
Expand Down Expand Up @@ -534,6 +545,35 @@ export default function BoardClient({ boardId }: { boardId: string }) {
{ enabled: boardActivityOpen },
);

// Fetch unread notifications to display per-ticket badge counts
const unreadNotifsQuery = api.notifications.list.useQuery(
{ limit: 50, unreadOnly: true },
{ refetchInterval: 15_000 },
);

const { ticketNotifCounts, ticketNotifIds } = React.useMemo(() => {
const counts = new Map<string, number>();
const ids = new Map<string, string[]>();
const items = unreadNotifsQuery.data?.items ?? [];
for (const n of items) {
const nBoardId = typeof n.data?.boardId === 'string' ? n.data.boardId : null;
const nTicketId = typeof n.data?.ticketId === 'string' ? n.data.ticketId : null;
if (nBoardId !== boardId || !nTicketId) continue;
counts.set(nTicketId, (counts.get(nTicketId) ?? 0) + 1);
const arr = ids.get(nTicketId) ?? [];
arr.push(n.id);
ids.set(nTicketId, arr);
}
return { ticketNotifCounts: counts, ticketNotifIds: ids };
}, [unreadNotifsQuery.data, boardId]);

const markRead = api.notifications.markRead.useMutation({
onSuccess: async () => {
await utils.notifications.list.invalidate();
await utils.notifications.unreadCount.invalidate();
},
});

const [backgroundPickerOpen, setBackgroundPickerOpen] = React.useState(false);
const [backgroundTab, setBackgroundTab] = React.useState<'color' | 'gradient' | 'image'>('color');
const [imageSearch, setImageSearch] = React.useState('');
Expand Down Expand Up @@ -1068,6 +1108,10 @@ export default function BoardClient({ boardId }: { boardId: string }) {
onClick={() => {
setBoardActivityOpen(false);
setOpenedTicketId(it.ticketId!);
const ids = ticketNotifIds.get(it.ticketId!);
if (ids?.length) {
for (const id of ids) markRead.mutate({ id });
}
}}
>
{t('board.open_ticket')}
Expand Down Expand Up @@ -1185,11 +1229,19 @@ export default function BoardClient({ boardId }: { boardId: string }) {
setNewCardDescByColumn((s) => ({ ...s, [col.id]: '' }));
}}
labelMap={labelMap}
onOpenTicket={(ticketId) => setOpenedTicketId(ticketId)}
onOpenTicket={(ticketId) => {
setOpenedTicketId(ticketId);
// Mark related notifications as read
const ids = ticketNotifIds.get(ticketId);
if (ids?.length) {
for (const id of ids) markRead.mutate({ id });
}
}}
formatUserPrimary={formatUserPrimary}
formatUserSecondary={formatUserSecondary}
initialsForUser={initialsForUser}
userById={usersById}
ticketNotifCounts={ticketNotifCounts}
/>
);
})}
Expand Down
3 changes: 2 additions & 1 deletion apps/web/src/app/(app)/dashboard/notifications/notifications-client.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,11 @@ export default function NotificationsClient() {
{ limit: PAGE_SIZE },
{
getNextPageParam: (lastPage) => lastPage.nextCursor,
refetchInterval: 10_000,
},
);

const unreadCountQuery = api.notifications.unreadCount.useQuery();
const unreadCountQuery = api.notifications.unreadCount.useQuery(undefined, { refetchInterval: 10_000 });

const markRead = api.notifications.markRead.useMutation({
onSuccess: async () => {
Expand Down
35 changes: 33 additions & 2 deletions apps/web/src/components/layout/navbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -141,8 +141,8 @@ export function Navbar() {
},
)

const notificationsQuery = api.notifications.list.useQuery({ limit: 6 })
const unreadCountQuery = api.notifications.unreadCount.useQuery()
const notificationsQuery = api.notifications.list.useQuery({ limit: 6 }, { refetchInterval: 10_000 })
const unreadCountQuery = api.notifications.unreadCount.useQuery(undefined, { refetchInterval: 10_000 })
const markRead = api.notifications.markRead.useMutation({
onSuccess: async () => {
await utils.notifications.list.invalidate()
Expand All @@ -159,6 +159,37 @@ export function Navbar() {
const notifications = notificationsQuery.data?.items ?? []
const unreadCount = unreadCountQuery.data?.count ?? 0

// Track known notification IDs to detect new ones arriving via polling
const knownNotifIdsRef = React.useRef<Set<string> | null>(null)

React.useEffect(() => {
if (!notificationsQuery.data) return

const currentIds = new Set(notifications.map((n) => n.id))

// First load: just seed the ref, don't toast
if (knownNotifIdsRef.current === null) {
knownNotifIdsRef.current = currentIds
return
}

// Find notifications that weren't in the previous set
const newNotifs = notifications.filter((n) => !knownNotifIdsRef.current!.has(n.id) && !n.readAt)
knownNotifIdsRef.current = currentIds

for (const n of newNotifs) {
toast({
title: (
<span className="flex items-center gap-2">
<Bell className="h-4 w-4 text-[#579dff]" />
{n.title}
</span>
) as unknown as string,
description: n.body ?? undefined,
})
}
}, [notificationsQuery.data]) // eslint-disable-line react-hooks/exhaustive-deps

const notificationHref = (n: (typeof notifications)[number]) => {
const data = n.data ?? {}
const boardId = typeof data.boardId === "string" ? data.boardId : null
Expand Down
69 changes: 58 additions & 11 deletions packages/database/src/workspaces/workspaces.store.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,15 @@ export class WorkspacesStore {
return this.workspaceRef(workspaceId).collection('invitations');
}

private getProjectIdForConsole(): string {
return (
process.env.FIREBASE_PROJECT_ID ??
process.env.GCLOUD_PROJECT ??
process.env.GCP_PROJECT ??
'<PROJECT_ID>'
);
}

async createWorkspace(
input: WorkspaceCreateInput,
): Promise<WorkspaceModel> {
Expand Down Expand Up @@ -284,11 +293,29 @@ export class WorkspacesStore {

async acceptInvitationByToken(token: string, userId: string): Promise<WorkspaceInvitationModel> {
// Find invitation doc reference via collectionGroup, then tx update + upsert member
const snap = await this.db
.collectionGroup('invitations')
.where('token', '==', token)
.limit(1)
.get();
let snap: FirebaseFirestore.QuerySnapshot;
try {
snap = await this.db
.collectionGroup('invitations')
.where('token', '==', token)
.limit(1)
.get();
} catch (e) {
const err = e as { code?: number | string; message?: string };
const code = typeof err?.code === 'string' ? Number(err.code) : err?.code;
if (code === 9) {
const projectId = this.getProjectIdForConsole();
console.error(
`[Firestore] Missing collection group index for 'invitations'. Create it here:\n` +
`https://console.firebase.google.com/v1/r/project/${projectId}/firestore/indexes?create_exemption=ClBwcm9qZWN0cy8ke3Byb2plY3RJZH0vZGF0YWJhc2VzLyhkZWZhdWx0KS9jb2xsZWN0aW9uR3JvdXBzL2ludml0YXRpb25zL2ZpZWxkcy90b2tlbhACGggKBHRva2Vu\n\n` +
`Or manually: Go to Firebase Console > Firestore > Indexes > Collection Group > Add index:\n` +
` Collection group: invitations\n` +
` Field: token (Ascending)\n` +
` Query scope: Collection group`,
);
}
throw e;
}
if (snap.empty) throw new Error('Invitation not found');
const invDoc = snap.docs[0]!;
const workspaceRef = invDoc.ref.parent.parent;
Expand All @@ -300,7 +327,10 @@ export class WorkspacesStore {
const now = nowIso();

await this.db.runTransaction(async (tx) => {
// All reads MUST happen before any write in a Firestore transaction
const invSnap = await tx.get(invRef);
const memSnap = await tx.get(memberRef);

const inv = invSnap.data() as InvitationDoc;
if (!inv) throw new Error('Invitation not found');
if (inv.cancelledAt) throw new Error('Invitation cancelled');
Expand All @@ -310,7 +340,6 @@ export class WorkspacesStore {

tx.update(invRef, { acceptedAt: now, acceptedBy: userId } satisfies Partial<InvitationDoc>);

const memSnap = await tx.get(memberRef);
if (memSnap.exists) {
tx.update(memberRef, { role: inv.role, updatedAt: now } satisfies Partial<MemberDoc>);
} else {
Expand All @@ -324,11 +353,29 @@ export class WorkspacesStore {
}

async declineInvitationByToken(token: string, userId: string): Promise<WorkspaceInvitationModel> {
const snap = await this.db
.collectionGroup('invitations')
.where('token', '==', token)
.limit(1)
.get();
let snap: FirebaseFirestore.QuerySnapshot;
try {
snap = await this.db
.collectionGroup('invitations')
.where('token', '==', token)
.limit(1)
.get();
} catch (e) {
const err = e as { code?: number | string; message?: string };
const code = typeof err?.code === 'string' ? Number(err.code) : err?.code;
if (code === 9) {
const projectId = this.getProjectIdForConsole();
console.error(
`[Firestore] Missing collection group index for 'invitations'. Create it here:\n` +
`https://console.firebase.google.com/v1/r/project/${projectId}/firestore/indexes?create_exemption=ClBwcm9qZWN0cy8ke3Byb2plY3RJZH0vZGF0YWJhc2VzLyhkZWZhdWx0KS9jb2xsZWN0aW9uR3JvdXBzL2ludml0YXRpb25zL2ZpZWxkcy90b2tlbhACGggKBHRva2Vu\n\n` +
`Or manually: Go to Firebase Console > Firestore > Indexes > Collection Group > Add index:\n` +
` Collection group: invitations\n` +
` Field: token (Ascending)\n` +
` Query scope: Collection group`,
);
}
throw e;
}
if (snap.empty) throw new Error('Invitation not found');
const invDoc = snap.docs[0]!;
const workspaceRef = invDoc.ref.parent.parent;
Expand Down