feat(PushBanner): Check if IAP is available to show premium action

cozy · Dec 22, 2023 · 1039439 · 1039439
1 parent 2872ac2
commit 1039439
Show file tree

Hide file tree

Showing 4 changed files with 58 additions and 19 deletions.
diff --git a/src/components/PushBanner/QuotaBanner.jsx b/src/components/PushBanner/QuotaBanner.jsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 
 import CloudSyncIcon from 'cozy-ui/transpiled/react/Icons/CloudSync'
 import Banner from 'cozy-ui/transpiled/react/Banner'
@@ -12,6 +12,7 @@ import {
 } from 'cozy-client/dist/models/instance'
 import flag from 'cozy-flags'
 import { useInstanceInfo } from 'cozy-client'
+import { useWebviewIntent } from 'cozy-intent'
 
 import styles from '../pushClient/pushClient.styl'
 import { usePushBannerContext } from './PushBannerProvider'
@@ -23,6 +24,21 @@ const QuotaBanner = () => {
   const { t } = useI18n()
   const { dismissPushBanner } = usePushBannerContext()
   const instanceInfo = useInstanceInfo()
+  const webviewIntent = useWebviewIntent()
+  const [hasIAP, setIAP] = useState(false)
+
+  useEffect(() => {
+    const fetchIapAvailability = async () => {
+      const isAvailable =
+        (await webviewIntent?.call('isAvailable', 'iap')) ?? false
+      const isEnabled = !!flag('flagship.iap.enabled')
+      setIAP(isAvailable && isEnabled)
+    }
+
+    if (isFlagshipApp()) {
+      fetchIapAvailability()
+    }
+  }, [webviewIntent])
 
   const onAction = () => {
     const link = buildPremiumLink(instanceInfo)
@@ -34,8 +50,7 @@ const QuotaBanner = () => {
   }
 
   const canOpenPremiumLink =
-    arePremiumLinksEnabled(instanceInfo) &&
-    (!isFlagshipApp() || (isFlagshipApp() && !!flag('flagship.iap.enabled')))
+    arePremiumLinksEnabled(instanceInfo) && (!isFlagshipApp() || hasIAP)
 
   return (
     <div className={styles['coz-banner-client']}>

diff --git a/src/components/PushBanner/QuotaBanner.spec.jsx b/src/components/PushBanner/QuotaBanner.spec.jsx
@@ -2,13 +2,13 @@ import React from 'react'
 import { fireEvent, render, screen } from '@testing-library/react'
 
 import { isFlagshipApp } from 'cozy-device-helper'
-import I18n from 'cozy-ui/transpiled/react/providers/I18n'
 import flag from 'cozy-flags'
 import { useInstanceInfo } from 'cozy-client'
+import { useWebviewIntent } from 'cozy-intent'
 
 import QuotaBanner from './QuotaBanner'
 import { usePushBannerContext } from './PushBannerProvider'
-import en from 'drive/locales/en.json'
+import { TestI18n } from 'test/components/AppLike'
 
 jest.mock('./PushBannerProvider', () => ({
   usePushBannerContext: jest.fn()
@@ -24,6 +24,10 @@ jest.mock('cozy-client', () => ({
     isLoaded: true
   }))
 }))
+jest.mock('cozy-intent', () => ({
+  ...jest.requireActual('cozy-intent'),
+  useWebviewIntent: jest.fn()
+}))
 
 describe('QuotaBanner', () => {
   const dismissSpy = jest.fn()
@@ -37,7 +41,8 @@ describe('QuotaBanner', () => {
     enablePremiumLinks = false,
     hasUuid = false,
     isFlagshipApp: isFlagshipAppReturnValue = false,
-    isIapEnabled = null
+    isIapEnabled = null,
+    isIapAvailable = null
   } = {}) => {
     usePushBannerContext.mockReturnValue({
       dismissPushBanner: dismissSpy
@@ -61,11 +66,15 @@ describe('QuotaBanner', () => {
 
     isFlagshipApp.mockReturnValue(isFlagshipAppReturnValue)
     flag.mockReturnValue(isIapEnabled)
+    const mockCall = jest.fn().mockResolvedValue(isIapAvailable)
+    useWebviewIntent.mockReturnValue({
+      call: mockCall
+    })
 
     render(
-      <I18n lang="en" dictRequire={() => en}>
+      <TestI18n>
         <QuotaBanner />
-      </I18n>
+      </TestI18n>
     )
   }
 
@@ -112,27 +121,44 @@ describe('QuotaBanner', () => {
     expect(premiumButton).toBeNull()
   })
 
-  it('should hide premium link when is on flagship application and flag flagship.iap.enabled is false', () => {
+  it('should hide premium link when the flagship app has not IAP available with the flag flagship.iap.enabled is false', () => {
     setup({
       hasUuid: true,
       enablePremiumLinks: true,
       isFlagshipApp: true,
-      isIapEnabled: false
+      isIapEnabled: false,
+      isIapAvailable: false
     })
 
     const premiumButton = screen.queryByText('Check our plans')
     expect(premiumButton).toBeNull()
   })
 
-  it('should display premium link  when is on flagship application and flag flagship.iap.enabled is true', () => {
+  it('should hide premium link when the flagship app has not IAP available with the flag flagship.iap.enabled is true', () => {
     setup({
       hasUuid: true,
       enablePremiumLinks: true,
       isFlagshipApp: true,
-      isIapEnabled: true
+      isIapEnabled: true,
+      isIapAvailable: false
     })
 
-    fireEvent.click(screen.getByText('Check our plans'))
+    const premiumButton = screen.queryByText('Check our plans')
+    expect(premiumButton).toBeNull()
+  })
+
+  it('should display premium link when the flagship app has IAP available with the flag flagship.iap.enabled is true', async () => {
+    setup({
+      hasUuid: true,
+      enablePremiumLinks: true,
+      isFlagshipApp: true,
+      isIapEnabled: true,
+      isIapAvailable: true
+    })
+
+    const actionButton = await screen.findByText('Check our plans')
+
+    fireEvent.click(actionButton)
     expect(openSpy).toBeCalledWith(
       'http://mycozy.cloud/cozy/instances/123/premium',
       '_self'

diff --git a/src/drive/web/modules/upload/__snapshots__/Dropzone.spec.jsx.snap b/src/drive/web/modules/upload/__snapshots__/Dropzone.spec.jsx.snap
@@ -1782,9 +1782,7 @@ exports[`Dropzone should match snapshot 1`] = `
                 }
               }
             >
-              <TestI18n
-                enLocale={[Function]}
-              >
+              <TestI18n>
                 <I18n
                   defaultLang="en"
                   dictRequire={[Function]}

diff --git a/test/components/AppLike.jsx b/test/components/AppLike.jsx
@@ -24,9 +24,9 @@ const mockStore = createStore(() => ({
   }
 }))
 
-export const TestI18n = ({ children, enLocale }) => {
+export const TestI18n = ({ children }) => {
   return (
-    <I18n lang={'en'} dictRequire={enLocale}>
+    <I18n lang={'en'} dictRequire={() => enLocale}>
       {children}
     </I18n>
   )
@@ -54,7 +54,7 @@ const AppLike = ({
   <CozyTheme>
     <Provider store={(client && client.store) || store || mockStore}>
       <CozyProvider client={client}>
-        <TestI18n enLocale={() => enLocale}>
+        <TestI18n>
           <SharingContext.Provider
             value={sharingContextValue || mockSharingContextValue}
           >