refactor(banners): lift up show responsability

Author: stackchain

packages/banners/src/translators/reactjs/useBanner.test.ts

@@ -20,43 +20,27 @@ describe('useBanner', () => {
   it('should return the correct initial state', () => {
     const id = 'test-banner'
     const dismissedAt = 0
-    const shouldShowCb = jest.fn().mockReturnValue(true)
 
     ;(manager.dismissedAt as jest.Mock).mockReturnValueOnce(dismissedAt)
 
-    const {result} = renderHook(() => useBanner({id, manager, shouldShowCb}))
+    const {result} = renderHook(() => useBanner({id, manager}))
 
     expect(result.current.dismissedAt).toBe(dismissedAt)
-    expect(result.current.shouldShow).toBe(true)
-    expect(shouldShowCb).toHaveBeenCalledWith({dismissedAt})
+    expect(result.current.dismissedAt).toBe(dismissedAt)
   })
 
   it('should call dismiss method on manager', () => {
     const id = 'test-banner'
     const dismissedAt = 0
-    const shouldShowCb = jest.fn().mockReturnValue(true)
 
     ;(manager.dismissedAt as jest.Mock).mockReturnValueOnce(dismissedAt)
 
-    const {result} = renderHook(() => useBanner({id, manager, shouldShowCb}))
+    const {result} = renderHook(() => useBanner({id, manager}))
 
     act(() => {
       result.current.dismiss()
     })
 
     expect(manager.dismiss).toHaveBeenCalledWith(id)
   })
-
-  it('should update shouldShow based on shouldShowCb', () => {
-    const id = 'test-banner'
-    const dismissedAt = 0
-    const shouldShowCb = jest.fn().mockReturnValue(false)
-
-    ;(manager.dismissedAt as jest.Mock).mockReturnValueOnce(dismissedAt)
-
-    const {result} = renderHook(() => useBanner({id, manager, shouldShowCb}))
-
-    expect(result.current.shouldShow).toBe(false)
-    expect(shouldShowCb).toHaveBeenCalledWith({dismissedAt})
-  })
 })

packages/banners/src/translators/reactjs/useBanner.ts

@@ -2,32 +2,20 @@ import {Banners} from '@yoroi/types'
 import {freeze} from 'immer'
 import * as React from 'react'
 
-/**
- * Custom hook to manage the state of a banner.
- *
- * @param {Object} params - The parameters for the hook.
- * @param {string} params.id - The unique identifier for the banner.
- * @param {Banners.Manager} params.manager - The manager responsible for handling banner state.
- * @param {Function} params.shouldShowCb - Callback function to determine if the banner should be shown.
- * @param {Object} params.shouldShowCb.params - Parameters for the callback function.
- * @param {number} params.shouldShowCb.params.dismissedAt - The timestamp when the banner was dismissed.
- * @returns {Object} An object containing the banner's dismissed timestamp, a function to dismiss the banner, and a boolean indicating if the banner should be shown.
- * @note Remember wrapping the shouldShowCb function in a useCallback hook to prevent unnecessary re-renders.
- */
 export function useBanner({
   id,
   manager,
-  shouldShowCb,
 }: Readonly<{
   id: string
   manager: Readonly<Banners.Manager>
-  shouldShowCb: ({dismissedAt}: {dismissedAt: number}) => boolean
 }>) {
+  const [dismissedAt, setDismissedAt] = React.useState(manager.dismissedAt(id))
   return React.useMemo(() => {
-    const dismissedAt = manager.dismissedAt(id)
-    const dismiss = () => manager.dismiss(id)
-    const shouldShow = shouldShowCb({dismissedAt})
+    const dismiss = () => {
+      manager.dismiss(id)
+      setDismissedAt(manager.dismissedAt(id))
+    }
 
-    return freeze({dismissedAt, dismiss, shouldShow})
-  }, [id, manager, shouldShowCb])
+    return freeze({dismissedAt, dismiss})
+  }, [id, manager, dismissedAt])
 }