diff --git a/packages/cozy-mespapiers-lib/src/components/ModelSteps/Scan.jsx b/packages/cozy-mespapiers-lib/src/components/ModelSteps/Scan.jsx index 0cea519706..28599fb07b 100644 --- a/packages/cozy-mespapiers-lib/src/components/ModelSteps/Scan.jsx +++ b/packages/cozy-mespapiers-lib/src/components/ModelSteps/Scan.jsx @@ -10,7 +10,12 @@ import IlluGenericNewPage from '../../assets/icons/IlluGenericNewPage.svg' import { PaperDefinitionsStepPropTypes } from '../../constants/PaperDefinitionsPropTypes' import CompositeHeader from '../CompositeHeader/CompositeHeader' -const Scan = ({ currentStep, onChangeFile, onChangeFilePicker }) => { +const Scan = ({ + currentStep, + onChangeFile, + onChangeFilePicker, + onOpenFlagshipScan +}) => { const { t } = useI18n() const { illustration, text } = currentStep @@ -31,6 +36,7 @@ const Scan = ({ currentStep, onChangeFile, onChangeFilePicker }) => { setIsFilePickerModalOpen(true)} + onOpenFlagshipScan={onOpenFlagshipScan} /> @@ -47,7 +53,8 @@ const Scan = ({ currentStep, onChangeFile, onChangeFilePicker }) => { Scan.propTypes = { currentStep: PaperDefinitionsStepPropTypes, onChangeFile: PropTypes.func, - onChangeFilePicker: PropTypes.func + onChangeFilePicker: PropTypes.func, + onOpenFlagshipScan: PropTypes.func } export default Scan diff --git a/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.jsx b/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.jsx index 8cd9fcf5e9..0372fcd7d7 100644 --- a/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.jsx +++ b/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.jsx @@ -1,12 +1,30 @@ import PropTypes from 'prop-types' -import React from 'react' +import React, { useState, useEffect } from 'react' -import { isMobile } from 'cozy-device-helper' +import { isFlagshipApp, isMobile } from 'cozy-device-helper' +import flag from 'cozy-flags' +import { useWebviewIntent } from 'cozy-intent' import ScanDesktopActions from './ScanDesktopActions' +import ScanFlagshipActions from './ScanFlagshipActions' import ScanMobileActions from './ScanMobileActions' const ScanActionsWrapper = props => { + const [isFlagshipScanAvailable, setIsFlagshipScanAvailable] = useState(false) + const webviewIntent = useWebviewIntent() + + useEffect(() => { + const checkScanDocument = async () => { + const isAvailable = await webviewIntent.call('isScannerAvailable') + setIsFlagshipScanAvailable(isAvailable) + } + webviewIntent && checkScanDocument() + }, [webviewIntent]) + + if ((isFlagshipApp() || flag('flagship.debug')) && isFlagshipScanAvailable) { + return + } + if (isMobile()) { return } @@ -17,6 +35,7 @@ const ScanActionsWrapper = props => { ScanActionsWrapper.propTypes = { onChangeFile: PropTypes.func, openFilePickerModal: PropTypes.func, + onOpenFlagshipScan: PropTypes.func } export default ScanActionsWrapper diff --git a/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.spec.jsx b/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.spec.jsx index 842f4e4607..6091f8c657 100644 --- a/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.spec.jsx +++ b/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanActionsWrapper.spec.jsx @@ -1,7 +1,9 @@ -import { render } from '@testing-library/react' +/* eslint-disable jest/no-focused-tests */ +import { render, waitFor } from '@testing-library/react' import React from 'react' -import { isMobile } from 'cozy-device-helper' +import { isMobile, isFlagshipApp } from 'cozy-device-helper' +import { useWebviewIntent } from 'cozy-intent' import ScanWrapper from './ScanWrapper' import AppLike from '../../../test/components/AppLike' @@ -19,9 +21,14 @@ const mockFormData = ({ metadata = {}, data = [], contacts = [] } = {}) => ({ data, contacts }) +jest.mock('cozy-intent', () => ({ + ...jest.requireActual('cozy-intent'), + useWebviewIntent: jest.fn() +})) jest.mock('cozy-device-helper', () => ({ ...jest.requireActual('cozy-device-helper'), - isMobile: jest.fn() + isMobile: jest.fn(), + isFlagshipApp: jest.fn() })) jest.mock('../Hooks/useFormData') /* eslint-disable react/display-name */ @@ -31,10 +38,13 @@ jest.mock('../CompositeHeader/CompositeHeader', () => () => ( jest.mock('./AcquisitionResult', () => () => (
)) -jest.mock('../ModelSteps/ScanMobileActions', () => () => ( +jest.mock('./ScanMobileActions', () => () => (
)) -jest.mock('../ModelSteps/ScanDesktopActions', () => () => ( +jest.mock('./ScanFlagshipActions', () => () => ( +
+)) +jest.mock('./ScanDesktopActions', () => () => (
)) /* eslint-enable react/display-name */ @@ -42,8 +52,16 @@ jest.mock('../ModelSteps/ScanDesktopActions', () => () => ( const setup = ({ setFormData = jest.fn(), formData = mockFormData(), - currentStep = mockCurrentStep() + currentStep = mockCurrentStep(), + isMobileMock = false, + isFlagshipAppMock = false, + isScannerAvailable = false } = {}) => { + isMobile.mockReturnValue(isMobileMock || isFlagshipAppMock) + isFlagshipApp.mockReturnValue(isFlagshipAppMock) + useWebviewIntent.mockReturnValue({ + call: jest.fn().mockResolvedValue(isScannerAvailable) + }) useFormData.mockReturnValue({ setFormData, formData @@ -66,14 +84,33 @@ describe('Scan component:', () => { }) it('ScanMobileActions component must be displayed if is on Mobile', () => { - isMobile.mockReturnValue(true) - const { queryByTestId } = setup() + const { queryByTestId } = setup({ isMobileMock: true }) expect(queryByTestId('ScanMobileActions')).toBeTruthy() }) + it('ScanMobileActions component must be displayed if is on flagship app but Scanner is unavailable', async () => { + const { queryByTestId } = setup({ + isFlagshipAppMock: true, + isScannerAvailable: false + }) + + await waitFor(() => { + expect(queryByTestId('ScanMobileActions')).toBeTruthy() + }) + }) + it('ScanFlagshipActions component must be displayed if is on flagship app & Scanner is available', async () => { + const { queryByTestId } = setup({ + isFlagshipAppMock: true, + isScannerAvailable: true + }) + + await waitFor(() => { + expect(queryByTestId('ScanFlagshipActions')).toBeTruthy() + }) + }) + it('ScanDesktopActions component must be displayed if is on Desktop', () => { - isMobile.mockReturnValue(false) const { queryByTestId } = setup() expect(queryByTestId('ScanDesktopActions')).toBeTruthy() diff --git a/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanFlagshipActions.jsx b/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanFlagshipActions.jsx new file mode 100644 index 0000000000..e7d5ccb10a --- /dev/null +++ b/packages/cozy-mespapiers-lib/src/components/ModelSteps/ScanFlagshipActions.jsx @@ -0,0 +1,69 @@ +import PropTypes from 'prop-types' +import React from 'react' + +import Button from 'cozy-ui/transpiled/react/Buttons' +import FileInput from 'cozy-ui/transpiled/react/FileInput' +import { useI18n } from 'cozy-ui/transpiled/react/I18n' +import Icon from 'cozy-ui/transpiled/react/Icon' +import Divider from 'cozy-ui/transpiled/react/MuiCozyTheme/Divider' + +const styleBtn = { color: 'var(--primaryTextColor)' } + +const ScanFlagshipActions = ({ + openFilePickerModal, + onChangeFile, + onOpenFlagshipScan +}) => { + const { t } = useI18n() + + return ( + <> +
+ + {t('Scan.divider')} + +
+