chore(core): add tests to save seen announcements actions

packages/sanity/src/core/studio/studioAnnouncements/StudioAnnouncementsProvider.tsx

@@ -66,17 +66,21 @@ export function StudioAnnouncementsProvider({children}: StudioAnnouncementsProvi
     return () => subscription.unsubscribe()
   }, [])
 
+  const saveSeenAnnouncements = useCallback(() => {
+    // Mark all the announcements as seen
+    setSeenAnnouncements(studioAnnouncements.map((doc) => doc._id))
+  }, [setSeenAnnouncements, studioAnnouncements])
+
   const handleOpenDialog = useCallback((mode: DialogMode) => {
     setDialogMode(mode)
     setIsCardDismissed(true)
   }, [])
 
   const handleCardDismiss = useCallback(() => {
-    // Mark all the announcements as seen
-    setSeenAnnouncements(studioAnnouncements.map((doc) => doc._id))
+    saveSeenAnnouncements()
     setIsCardDismissed(true)
     telemetry.log(StudioAnnouncementCardDismissed)
-  }, [setSeenAnnouncements, studioAnnouncements, telemetry])
+  }, [saveSeenAnnouncements, telemetry])
 
   const handleCardClick = useCallback(() => {
     handleOpenDialog('unseen')
@@ -85,9 +89,9 @@ export function StudioAnnouncementsProvider({children}: StudioAnnouncementsProvi
 
   const handleDialogClose = useCallback(() => {
     setDialogMode(null)
-    setSeenAnnouncements(studioAnnouncements.map((doc) => doc._id))
+    saveSeenAnnouncements()
     telemetry.log(StudioAnnouncementModalDismissed)
-  }, [telemetry, setSeenAnnouncements, studioAnnouncements])
+  }, [telemetry, saveSeenAnnouncements])
 
   const contextValue: StudioAnnouncementsContextValue = useMemo(
     () => ({

packages/sanity/src/core/studio/studioAnnouncements/__tests__/StudioAnnouncementsProvider.test.tsx

@@ -71,6 +71,7 @@ const mockAnnouncements = [
     audience: 'everyone',
   },
 ]
+
 describe('StudioAnnouncementsProvider', () => {
   let wrapper = ({children}: {children: ReactNode}) => children
   beforeAll(async () => {
@@ -543,4 +544,105 @@ describe('StudioAnnouncementsProvider', () => {
       expect(result.current.studioAnnouncements).toEqual(announcements)
     })
   })
+  describe('storing seen announcements', () => {
+    beforeEach(() => {
+      jest.clearAllMocks()
+    })
+    test('when the card is dismissed, and only 1 announcement received', () => {
+      const {createClient} = require('@sanity/client')
+      const saveSeenAnnouncementsMock = jest.fn()
+      seenAnnouncementsMock.mockReturnValue([[], saveSeenAnnouncementsMock])
+
+      const mockFetch = createClient().observable.fetch as jest.Mock
+      mockFetch.mockReturnValue({
+        subscribe: ({next}: any) => {
+          next([mockAnnouncements[0]])
+          return {unsubscribe: jest.fn()}
+        },
+      })
+      const {getByLabelText} = render(null, {wrapper})
+
+      const closeButton = getByLabelText('Dismiss announcements')
+      fireEvent.click(closeButton)
+      expect(saveSeenAnnouncementsMock).toHaveBeenCalledWith([mockAnnouncements[0]._id])
+    })
+    test('when the card is dismissed, and 2 announcements are received', () => {
+      const {createClient} = require('@sanity/client')
+      const saveSeenAnnouncementsMock = jest.fn()
+      seenAnnouncementsMock.mockReturnValue([[], saveSeenAnnouncementsMock])
+
+      const mockFetch = createClient().observable.fetch as jest.Mock
+      mockFetch.mockReturnValue({
+        subscribe: ({next}: any) => {
+          next(mockAnnouncements)
+          return {unsubscribe: jest.fn()}
+        },
+      })
+      const {getByLabelText} = render(null, {wrapper})
+
+      const closeButton = getByLabelText('Dismiss announcements')
+      fireEvent.click(closeButton)
+      expect(saveSeenAnnouncementsMock).toHaveBeenCalledWith(mockAnnouncements.map((d) => d._id))
+    })
+    test("when the card is dismissed, doesn't persist previous stored values", () => {
+      const {createClient} = require('@sanity/client')
+      const saveSeenAnnouncementsMock = jest.fn()
+      // The id received here is not present anymore in the mock announcements, this id won't be stored in next save.
+      seenAnnouncementsMock.mockReturnValue([['not-to-be-persisted'], saveSeenAnnouncementsMock])
+
+      const mockFetch = createClient().observable.fetch as jest.Mock
+      mockFetch.mockReturnValue({
+        subscribe: ({next}: any) => {
+          next(mockAnnouncements)
+          return {unsubscribe: jest.fn()}
+        },
+      })
+      const {getByLabelText} = render(null, {wrapper})
+
+      const closeButton = getByLabelText('Dismiss announcements')
+      fireEvent.click(closeButton)
+      expect(saveSeenAnnouncementsMock).toHaveBeenCalledWith(mockAnnouncements.map((d) => d._id))
+    })
+    test('when the card is dismissed, persist previous stored values', () => {
+      const {createClient} = require('@sanity/client')
+      const saveSeenAnnouncementsMock = jest.fn()
+      // The id received here is present in the mock announcements, this id will be persisted in next save.
+      seenAnnouncementsMock.mockReturnValue([[mockAnnouncements[0]._id], saveSeenAnnouncementsMock])
+
+      const mockFetch = createClient().observable.fetch as jest.Mock
+      mockFetch.mockReturnValue({
+        subscribe: ({next}: any) => {
+          next(mockAnnouncements)
+          return {unsubscribe: jest.fn()}
+        },
+      })
+      const {getByLabelText} = render(null, {wrapper})
+
+      const closeButton = getByLabelText('Dismiss announcements')
+      fireEvent.click(closeButton)
+      expect(saveSeenAnnouncementsMock).toHaveBeenCalledWith(mockAnnouncements.map((d) => d._id))
+    })
+    test('when the dialog is closed', () => {
+      const {createClient} = require('@sanity/client')
+      const saveSeenAnnouncementsMock = jest.fn()
+      // The id received here is present in the mock announcements, this id will be persisted in next save.
+      seenAnnouncementsMock.mockReturnValue([[], saveSeenAnnouncementsMock])
+
+      const mockFetch = createClient().observable.fetch as jest.Mock
+      mockFetch.mockReturnValue({
+        subscribe: ({next}: any) => {
+          next(mockAnnouncements)
+          return {unsubscribe: jest.fn()}
+        },
+      })
+      const {getByLabelText} = render(null, {wrapper})
+
+      const openButton = getByLabelText('Open announcements')
+      fireEvent.click(openButton)
+      // Dialog renders and we close it
+      const closeButton = getByLabelText('Close dialog')
+      fireEvent.click(closeButton)
+      expect(saveSeenAnnouncementsMock).toHaveBeenCalledWith(mockAnnouncements.map((d) => d._id))
+    })
+  })
 })