From 5a66d069a59b2697b550b35be412488f229dca68 Mon Sep 17 00:00:00 2001 From: Sameer Pashikanti Date: Tue, 14 Apr 2026 18:46:29 +0000 Subject: [PATCH 1/7] fix: announcement drawer no longer auto-marks as read, add explicit controls Remove the auto-mark-all-as-read timer that was causing announcements to disappear from the header on click. Announcements are now only marked as read via explicit per-item "Mark as read" buttons or the "Mark all read" header button. The drawer now splits items into unread (top) and an "Earlier" collapsible section for read items, which auto-expands when there are no unread items. Release notes are deduped against the main list. --- .../announcement/AnnouncementItem.tsx | 37 +++-- .../components/announcement/Announcements.tsx | 130 +++++++++++++----- .../hooks/useProcessedAnnouncements.ts | 8 +- echo/frontend/src/locales/de-DE.po | 20 +-- echo/frontend/src/locales/en-US.po | 20 +-- echo/frontend/src/locales/es-ES.po | 20 +-- echo/frontend/src/locales/fr-FR.po | 20 +-- echo/frontend/src/locales/it-IT.po | 20 +-- echo/frontend/src/locales/nl-NL.po | 20 +-- echo/frontend/src/locales/uk-UA.po | 20 +-- 10 files changed, 195 insertions(+), 120 deletions(-) diff --git a/echo/frontend/src/components/announcement/AnnouncementItem.tsx b/echo/frontend/src/components/announcement/AnnouncementItem.tsx index d838b4cb..a1c41a84 100644 --- a/echo/frontend/src/components/announcement/AnnouncementItem.tsx +++ b/echo/frontend/src/components/announcement/AnnouncementItem.tsx @@ -31,13 +31,14 @@ type Announcement = { interface AnnouncementItemProps { announcement: Announcement; + onMarkAsRead: (id: string) => void; index: number; } export const AnnouncementItem = forwardRef< HTMLDivElement, AnnouncementItemProps ->(({ announcement, index }, ref) => { +>(({ announcement, onMarkAsRead, index }, ref) => { const theme = useMantineTheme(); const [showMore, setShowMore] = useState(false); const [showReadMoreButton, setShowReadMoreButton] = useState(false); @@ -52,14 +53,12 @@ export const AnnouncementItem = forwardRef< } }, []); + const isRead = !!announcement.read; + return ( @@ -79,7 +78,7 @@ export const AnnouncementItem = forwardRef<
- + {announcement.title}
@@ -89,7 +88,7 @@ export const AnnouncementItem = forwardRef< {formatDate(announcement.created_at)} - {!announcement.read && ( + {!isRead && (
- {showReadMoreButton && ( - + + {showReadMoreButton && ( - - )} + )} + + {!isRead && ( + + )} + diff --git a/echo/frontend/src/components/announcement/Announcements.tsx b/echo/frontend/src/components/announcement/Announcements.tsx index 72eda756..b1ac3585 100644 --- a/echo/frontend/src/components/announcement/Announcements.tsx +++ b/echo/frontend/src/components/announcement/Announcements.tsx @@ -12,8 +12,13 @@ import { ThemeIcon, UnstyledButton, } from "@mantine/core"; -import { CaretDown, CaretUp, Sparkle } from "@phosphor-icons/react"; -import { useEffect, useRef, useState } from "react"; +import { + CaretDown, + CaretUp, + CheckCircle, + Sparkle, +} from "@phosphor-icons/react"; +import { useEffect, useMemo, useState } from "react"; import { useInView } from "react-intersection-observer"; import { useAnnouncementDrawer } from "@/components/announcement/hooks"; import { @@ -33,16 +38,18 @@ import { WhatsNewItem } from "./WhatsNewItem"; import { useInfiniteAnnouncements, useMarkAllAsReadMutation, + useMarkAsReadMutation, useWhatsNewAnnouncements, } from "./hooks"; export const Announcements = () => { const { isOpen, close } = useAnnouncementDrawer(); const { language } = useLanguage(); + const markAsReadMutation = useMarkAsReadMutation(); const markAllAsReadMutation = useMarkAllAsReadMutation(); const [openedOnce, setOpenedOnce] = useState(false); + const [readExpanded, setReadExpanded] = useState(false); const [whatsNewExpanded, setWhatsNewExpanded] = useState(false); - const autoReadTimerRef = useRef | null>(null); const { ref: loadMoreRef, inView } = useInView(); @@ -58,23 +65,6 @@ export const Announcements = () => { } }, [isOpen, openedOnce]); - // Auto-mark all as read after 1 second when drawer opens - // biome-ignore lint/correctness/useExhaustiveDependencies: only trigger on isOpen changes, mutate ref is stable - useEffect(() => { - if (isOpen) { - autoReadTimerRef.current = setTimeout(() => { - markAllAsReadMutation.mutate(); - }, 1000); - } - - return () => { - if (autoReadTimerRef.current) { - clearTimeout(autoReadTimerRef.current); - autoReadTimerRef.current = null; - } - }; - }, [isOpen]); - const { data: announcementsData, fetchNextPage, @@ -106,15 +96,31 @@ export const Announcements = () => { language, ); - // Only show unread announcements (read ones are hidden) - const unreadAnnouncements = processedAnnouncements.filter((a) => !a.read); - - // Process "What's new" announcements - const whatsNewAnnouncements = useWhatsNewProcessed( - whatsNewData ?? [], - language, + // Split into unread and read + const unreadAnnouncements = useMemo( + () => processedAnnouncements.filter((a) => !a.read), + [processedAnnouncements], + ); + const readAnnouncements = useMemo( + () => processedAnnouncements.filter((a) => a.read), + [processedAnnouncements], ); + // Auto-expand read section when there are no unread items + // biome-ignore lint/correctness/useExhaustiveDependencies: only react to unread/read count changes + useEffect(() => { + if (unreadAnnouncements.length === 0 && readAnnouncements.length > 0) { + setReadExpanded(true); + } + }, [unreadAnnouncements.length, readAnnouncements.length]); + + // Process "What's new" announcements, excluding those already in the main list + const whatsNewRaw = useWhatsNewProcessed(whatsNewData ?? [], language); + const whatsNewAnnouncements = useMemo(() => { + const mainIds = new Set(processedAnnouncements.map((a) => a.id)); + return whatsNewRaw.filter((a) => !mainIds.has(a.id)); + }, [whatsNewRaw, processedAnnouncements]); + // Load more announcements when user scrolls to bottom useEffect(() => { if (inView && hasNextPage && !isFetchingNextPage) { @@ -122,6 +128,10 @@ export const Announcements = () => { } }, [inView, hasNextPage, isFetchingNextPage, fetchNextPage]); + const handleMarkAsRead = async (id: string) => { + markAsReadMutation.mutate({ announcementId: id }); + }; + const handleMarkAllAsRead = async () => { markAllAsReadMutation.mutate(); }; @@ -166,7 +176,7 @@ export const Announcements = () => { /> ) : isLoading ? ( - ) : unreadAnnouncements.length === 0 && + ) : processedAnnouncements.length === 0 && whatsNewAnnouncements.length === 0 ? ( @@ -180,12 +190,8 @@ export const Announcements = () => { ))} @@ -195,7 +201,60 @@ export const Announcements = () => { )} - {/* Release notes under "View earlier" */} + {/* Earlier (read) section */} + {readAnnouncements.length > 0 && ( + <> + + setReadExpanded(!readExpanded) + } + > + + + + Earlier + + {readExpanded ? ( + + ) : ( + + )} + + + } + labelPosition="left" + /> + + + + {readAnnouncements.map( + (announcement, index) => ( + + ), + )} + + + + )} + + {/* Release notes */} {whatsNewAnnouncements.length > 0 && ( <> { )} + + {/* Infinite scroll sentinel */} +
)} diff --git a/echo/frontend/src/components/announcement/hooks/useProcessedAnnouncements.ts b/echo/frontend/src/components/announcement/hooks/useProcessedAnnouncements.ts index 60708920..902e9782 100644 --- a/echo/frontend/src/components/announcement/hooks/useProcessedAnnouncements.ts +++ b/echo/frontend/src/components/announcement/hooks/useProcessedAnnouncements.ts @@ -26,7 +26,7 @@ export const isWhatsNew = (announcement: Announcement): boolean => { ); const title = (enTranslation as AnnouncementTranslation)?.title?.toLowerCase() || ""; - return title.includes("new features") || title.startsWith("new:"); + return title.includes("new"); }; export interface ProcessedAnnouncement { @@ -67,9 +67,9 @@ export function useProcessedAnnouncements( language: string, ) { return useMemo(() => { - const processed = announcements - .filter((a) => !isWhatsNew(a)) - .map((a) => processAnnouncement(a, language)); + const processed = announcements.map((a) => + processAnnouncement(a, language), + ); // Sort: unread first, then by date descending return processed.sort((a, b) => { diff --git a/echo/frontend/src/locales/de-DE.po b/echo/frontend/src/locales/de-DE.po index 396a4e44..ea16efb9 100644 --- a/echo/frontend/src/locales/de-DE.po +++ b/echo/frontend/src/locales/de-DE.po @@ -1944,9 +1944,9 @@ msgstr "z.B. Wöchentliche Stakeholder-Zusammenfassung" msgid "e.g., Slack Notifications, Make Workflow" msgstr "z.B. Slack-Benachrichtigungen, Make-Workflow" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Früher" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Früher" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3197,9 +3197,9 @@ msgstr "Vorlagen verwalten" msgid "Mark all read" msgstr "Alle als gelesen markieren" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Als gelesen markieren" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Als gelesen markieren" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3398,7 +3398,7 @@ msgstr "Nein" msgid "No actions found" msgstr "Keine Aktionen gefunden" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "Keine Ankündigungen verfügbar" @@ -4460,7 +4460,7 @@ msgstr "Registrieren | Dembrane" msgid "Register as a new user" msgstr "Als neuer Benutzer registrieren" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Versionshinweise" @@ -5103,11 +5103,11 @@ msgstr "Daten anzeigen" msgid "Show IP addresses" msgstr "IP-Adressen anzeigen" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Weniger anzeigen" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Mehr anzeigen" diff --git a/echo/frontend/src/locales/en-US.po b/echo/frontend/src/locales/en-US.po index 003e881f..903d29f9 100644 --- a/echo/frontend/src/locales/en-US.po +++ b/echo/frontend/src/locales/en-US.po @@ -2172,9 +2172,9 @@ msgstr "e.g. Weekly stakeholder digest" msgid "e.g., Slack Notifications, Make Workflow" msgstr "e.g., Slack Notifications, Make Workflow" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Earlier" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Earlier" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3483,9 +3483,9 @@ msgstr "Manage templates" msgid "Mark all read" msgstr "Mark all read" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Mark as read" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Mark as read" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3686,7 +3686,7 @@ msgstr "No" msgid "No actions found" msgstr "No actions found" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "No announcements available" @@ -4698,7 +4698,7 @@ msgstr "Register | Dembrane" msgid "Register as a new user" msgstr "Register as a new user" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Release notes" @@ -5360,11 +5360,11 @@ msgstr "Show data" msgid "Show IP addresses" msgstr "Show IP addresses" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Show less" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Show more" diff --git a/echo/frontend/src/locales/es-ES.po b/echo/frontend/src/locales/es-ES.po index 8cd2a524..4df767d9 100644 --- a/echo/frontend/src/locales/es-ES.po +++ b/echo/frontend/src/locales/es-ES.po @@ -1947,9 +1947,9 @@ msgstr "ej. Resumen semanal de partes interesadas" msgid "e.g., Slack Notifications, Make Workflow" msgstr "por ejemplo, Notificaciones de Slack, Flujo de trabajo de Make" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Anteriores" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Anteriores" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3200,9 +3200,9 @@ msgstr "Gestionar plantillas" msgid "Mark all read" msgstr "Marcar todos como leídos" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Marcar como leído" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Marcar como leído" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3401,7 +3401,7 @@ msgstr "No" msgid "No actions found" msgstr "No se encontraron acciones" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "No hay anuncios disponibles" @@ -4466,7 +4466,7 @@ msgstr "Registrar | Dembrane" msgid "Register as a new user" msgstr "Registrar como nuevo usuario" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Notas de versión" @@ -5109,11 +5109,11 @@ msgstr "Mostrar datos" msgid "Show IP addresses" msgstr "Mostrar direcciones IP" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Mostrar menos" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Mostrar más" diff --git a/echo/frontend/src/locales/fr-FR.po b/echo/frontend/src/locales/fr-FR.po index 57aa4bbb..2bcb5aa6 100644 --- a/echo/frontend/src/locales/fr-FR.po +++ b/echo/frontend/src/locales/fr-FR.po @@ -1962,9 +1962,9 @@ msgstr "ex. Résumé hebdomadaire des parties prenantes" msgid "e.g., Slack Notifications, Make Workflow" msgstr "par exemple : Notifications Slack, Make Workflow" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Plus anciennes" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Plus anciennes" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3215,9 +3215,9 @@ msgstr "Gérer les modèles" msgid "Mark all read" msgstr "Marquer toutes comme lues" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Marquer comme lue" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Marquer comme lue" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3416,7 +3416,7 @@ msgstr "Non" msgid "No actions found" msgstr "Aucune action trouvée" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "Aucune annonce disponible" @@ -4481,7 +4481,7 @@ msgstr "S'enregistrer | Dembrane" msgid "Register as a new user" msgstr "S'enregistrer en tant qu'utilisateur nouveau" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Notes de version" @@ -5124,11 +5124,11 @@ msgstr "Afficher les données" msgid "Show IP addresses" msgstr "Afficher les adresses IP" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Afficher moins" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Afficher plus" diff --git a/echo/frontend/src/locales/it-IT.po b/echo/frontend/src/locales/it-IT.po index 5dba72db..e7077ca6 100644 --- a/echo/frontend/src/locales/it-IT.po +++ b/echo/frontend/src/locales/it-IT.po @@ -2172,9 +2172,9 @@ msgstr "e.g. Weekly stakeholder digest" msgid "e.g., Slack Notifications, Make Workflow" msgstr "e.g., Slack Notifications, Make Workflow" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Earlier" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Earlier" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3483,9 +3483,9 @@ msgstr "Manage templates" msgid "Mark all read" msgstr "Mark all read" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Mark as read" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Mark as read" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3686,7 +3686,7 @@ msgstr "No" msgid "No actions found" msgstr "No actions found" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "No announcements available" @@ -4698,7 +4698,7 @@ msgstr "Register | Dembrane" msgid "Register as a new user" msgstr "Register as a new user" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Release notes" @@ -5360,11 +5360,11 @@ msgstr "Show data" msgid "Show IP addresses" msgstr "Show IP addresses" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Show less" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Show more" diff --git a/echo/frontend/src/locales/nl-NL.po b/echo/frontend/src/locales/nl-NL.po index 6400ba28..5c4fccd8 100644 --- a/echo/frontend/src/locales/nl-NL.po +++ b/echo/frontend/src/locales/nl-NL.po @@ -2031,9 +2031,9 @@ msgstr "bijv. Wekelijkse samenvatting stakeholders" msgid "e.g., Slack Notifications, Make Workflow" msgstr "bijvoorbeeld, Slack meldingen, Make workflow" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Eerder" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Eerder" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3317,9 +3317,9 @@ msgstr "Templates beheren" msgid "Mark all read" msgstr "Alle als gelezen markeren" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Als gelezen markeren" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Als gelezen markeren" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3518,7 +3518,7 @@ msgstr "Nee" msgid "No actions found" msgstr "Geen acties gevonden" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "Geen meldingen beschikbaar" @@ -4616,7 +4616,7 @@ msgstr "Registreer | Dembrane" msgid "Register as a new user" msgstr "Registreer als nieuwe gebruiker" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Release notes" @@ -5265,11 +5265,11 @@ msgstr "Gegevens tonen" msgid "Show IP addresses" msgstr "IP-adressen tonen" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Minder tonen" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Meer tonen" diff --git a/echo/frontend/src/locales/uk-UA.po b/echo/frontend/src/locales/uk-UA.po index 9277f1dc..c164f99b 100644 --- a/echo/frontend/src/locales/uk-UA.po +++ b/echo/frontend/src/locales/uk-UA.po @@ -2172,9 +2172,9 @@ msgstr "e.g. Weekly stakeholder digest" msgid "e.g., Slack Notifications, Make Workflow" msgstr "e.g., Slack Notifications, Make Workflow" -#: src/components/announcement/Announcements.tsx:204 -#~ msgid "Earlier" -#~ msgstr "Earlier" +#: src/components/announcement/Announcements.tsx:227 +msgid "Earlier" +msgstr "Earlier" #. js-lingui-explicit-id #: src/components/participant/ParticipantConversationAudio.tsx:825 @@ -3483,9 +3483,9 @@ msgstr "Manage templates" msgid "Mark all read" msgstr "Mark all read" -#: src/components/announcement/AnnouncementItem.tsx:153 -#~ msgid "Mark as read" -#~ msgstr "Mark as read" +#: src/components/announcement/AnnouncementItem.tsx:147 +msgid "Mark as read" +msgstr "Mark as read" #: src/components/chat/templates.ts:58 msgid "Meeting Notes" @@ -3686,7 +3686,7 @@ msgstr "No" msgid "No actions found" msgstr "No actions found" -#: src/components/announcement/Announcements.tsx:173 +#: src/components/announcement/Announcements.tsx:183 msgid "No announcements available" msgstr "No announcements available" @@ -4698,7 +4698,7 @@ msgstr "Register | Dembrane" msgid "Register as a new user" msgstr "Register as a new user" -#: src/components/announcement/Announcements.tsx:221 +#: src/components/announcement/Announcements.tsx:280 msgid "Release notes" msgstr "Release notes" @@ -5360,11 +5360,11 @@ msgstr "Show data" msgid "Show IP addresses" msgstr "Show IP addresses" -#: src/components/announcement/AnnouncementItem.tsx:126 +#: src/components/announcement/AnnouncementItem.tsx:125 msgid "Show less" msgstr "Show less" -#: src/components/announcement/AnnouncementItem.tsx:131 +#: src/components/announcement/AnnouncementItem.tsx:130 msgid "Show more" msgstr "Show more" From 15f4af4cc5e9a4ea91f35821397c9175d4394302 Mon Sep 17 00:00:00 2001 From: Sameer Pashikanti Date: Tue, 14 Apr 2026 18:50:27 +0000 Subject: [PATCH 2/7] feat: add mark-as-unread for read announcements in Earlier section Add useMarkAsUnreadMutation that deletes the activity record to revert an announcement to unread. Read items in the Earlier section now show a "Mark as unread" button so users can move items back to the top. --- .../announcement/AnnouncementItem.tsx | 17 ++- .../components/announcement/Announcements.tsx | 7 ++ .../components/announcement/hooks/index.ts | 105 +++++++++++++++++- echo/frontend/src/locales/de-DE.po | 25 +++-- echo/frontend/src/locales/de-DE.ts | 2 +- echo/frontend/src/locales/en-US.po | 25 +++-- echo/frontend/src/locales/en-US.ts | 2 +- echo/frontend/src/locales/es-ES.po | 25 +++-- echo/frontend/src/locales/es-ES.ts | 2 +- echo/frontend/src/locales/fr-FR.po | 25 +++-- echo/frontend/src/locales/fr-FR.ts | 2 +- echo/frontend/src/locales/it-IT.po | 25 +++-- echo/frontend/src/locales/it-IT.ts | 2 +- echo/frontend/src/locales/nl-NL.po | 25 +++-- echo/frontend/src/locales/nl-NL.ts | 2 +- echo/frontend/src/locales/uk-UA.po | 25 +++-- echo/frontend/src/locales/uk-UA.ts | 2 +- 17 files changed, 252 insertions(+), 66 deletions(-) diff --git a/echo/frontend/src/components/announcement/AnnouncementItem.tsx b/echo/frontend/src/components/announcement/AnnouncementItem.tsx index a1c41a84..37a46510 100644 --- a/echo/frontend/src/components/announcement/AnnouncementItem.tsx +++ b/echo/frontend/src/components/announcement/AnnouncementItem.tsx @@ -32,13 +32,14 @@ type Announcement = { interface AnnouncementItemProps { announcement: Announcement; onMarkAsRead: (id: string) => void; + onMarkAsUnread: (id: string) => void; index: number; } export const AnnouncementItem = forwardRef< HTMLDivElement, AnnouncementItemProps ->(({ announcement, onMarkAsRead, index }, ref) => { +>(({ announcement, onMarkAsRead, onMarkAsUnread, index }, ref) => { const theme = useMantineTheme(); const [showMore, setShowMore] = useState(false); const [showReadMoreButton, setShowReadMoreButton] = useState(false); @@ -134,7 +135,19 @@ export const AnnouncementItem = forwardRef< )} - {!isRead && ( + {isRead ? ( + + ) : (