feat: Edit only Scan step in Modify action

src/components/Actions/Items/modify.jsx

@@ -22,9 +22,14 @@ export const modify = ({ t, navigate }) => {
       getCreatedByApp(docs[0]) === 'mespapiers',
     action: docs => {
       const country = docs[0].metadata.country?.toLowerCase()
+      const searchParams = new URLSearchParams({
+        model: 'scan',
+        ...(country && { country })
+      }).toString()
+
       navigate({
         pathname: `edit/${docs[0]._id}`,
-        ...(country && { search: `?country=${country}` })
+        search: searchParams
       })
     },
     // eslint-disable-next-line react/display-name

src/components/Contexts/StepperDialogProvider.jsx

@@ -18,7 +18,13 @@ import { useWebviewIntent } from 'cozy-intent'
 
 const StepperDialogContext = createContext()
 
-export const StepperDialogProvider = ({ children, isEdit }) => {
+/**
+ * @param {object} props
+ * @param {React.ReactNode} props.children
+ * @param {boolean} props.isEdit - True if the dialog is in edit mode
+ * @param {function} props.stepFilterFn - The filter function to apply on the steps
+ */
+export const StepperDialogProvider = ({ children, isEdit, stepFilterFn }) => {
   const [stepperDialogTitle, setStepperDialogTitle] = useState('')
   const [allCurrentSteps, setAllCurrentSteps] = useState([])
   const [currentStepIndex, setCurrentStepIndex] = useState(-1)
@@ -68,14 +74,21 @@ export const StepperDialogProvider = ({ children, isEdit }) => {
             steps: allCurrentStepsDefinitions,
             webviewIntent,
             isEdit,
+            stepFilterFn,
             fromFlagshipUpload
           })
           setAllCurrentSteps(filteredSteps)
         }
       }
       buildAllCurrentSteps()
     }
-  }, [webviewIntent, currentDefinition, fromFlagshipUpload, isEdit])
+  }, [
+    webviewIntent,
+    currentDefinition,
+    fromFlagshipUpload,
+    isEdit,
+    stepFilterFn
+  ])
 
   useEffect(() => {
     const loadCreatePaperDataBackup = async () => {

src/components/ModelSteps/Scan/ScanWrapper.jsx

@@ -1,4 +1,5 @@
 import { PDFDocument } from 'pdf-lib'
+import propTypes from 'prop-types'
 import React, { useEffect, useState } from 'react'
 import { useParams, useSearchParams } from 'react-router-dom'
 import { PaperDefinitionsStepPropTypes } from 'src/PaperDefinitionsPropTypes'
@@ -37,7 +38,7 @@ const isFileEncryptedPDF = async file => {
   return pdf.isEncrypted
 }
 
-const ScanWrapper = ({ currentStep, onClose, onBack }) => {
+const ScanWrapper = ({ currentStep, onClose, onBack, onSubmit }) => {
   const client = useClient()
   const [searchParams] = useSearchParams()
   const { qualificationLabel } = useParams()
@@ -153,6 +154,7 @@ const ScanWrapper = ({ currentStep, onClose, onBack }) => {
         onChangeFile={onChangeFile}
         onClose={onClose}
         onBack={onBack}
+        onSubmit={onSubmit}
       />
     )
   }
@@ -180,7 +182,10 @@ const ScanWrapper = ({ currentStep, onClose, onBack }) => {
 }
 
 ScanWrapper.propTypes = {
-  currentStep: PaperDefinitionsStepPropTypes
+  currentStep: PaperDefinitionsStepPropTypes,
+  onClose: propTypes.func.isRequired,
+  onBack: propTypes.func.isRequired,
+  onSubmit: propTypes.func.isRequired
 }
 
 export default ScanWrapper

src/components/ModelSteps/ScanResult/ScanResultCard/ScanResultCardImageActions.jsx

@@ -4,7 +4,6 @@ import React from 'react'
 import Button from 'cozy-ui/transpiled/react/Buttons'
 import Icon from 'cozy-ui/transpiled/react/Icon'
 import IconButton from 'cozy-ui/transpiled/react/IconButton'
-import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
 import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 import { makeStyles } from 'cozy-ui/transpiled/react/styles'
 
@@ -25,15 +24,12 @@ const ScanResultCardImageActions = ({
 }) => {
   const classes = useStyles()
   const { t } = useI18n()
-  const { isDesktop } = useBreakpoints()
-
-  const device = isDesktop ? 'desktop' : 'mobile'
 
   return (
     <>
       <Button
         data-testid="retry-button"
-        label={t(`Acquisition.${device}.retry`)}
+        label={t('Acquisition.image.edit')}
         fullWidth
         variant="secondary"
         onClick={onCancel}
@@ -43,8 +39,8 @@ const ScanResultCardImageActions = ({
         classes={classes}
         size="small"
         onClick={onRotate}
-        aria-label={t('Acquisition.rotate')}
-        title={t('Acquisition.rotate')}
+        aria-label={t('Acquisition.image.rotate')}
+        title={t('Acquisition.image.rotate')}
         disabled={isImageRotating}
       >
         <Icon icon="rotate-left" />

src/components/ModelSteps/ScanResult/ScanResultCard/ScanResultCardPDFActions.jsx

@@ -2,19 +2,15 @@ import PropTypes from 'prop-types'
 import React from 'react'
 
 import Button from 'cozy-ui/transpiled/react/Buttons'
-import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
 import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 
 const ScanResultCardPDFActions = ({ onCancel }) => {
   const { t } = useI18n()
-  const { isDesktop } = useBreakpoints()
-
-  const device = isDesktop ? 'desktop' : 'mobile'
 
   return (
     <Button
       data-testid="retry-button"
-      label={t(`Acquisition.${device}.retry`)}
+      label={t('Acquisition.pdf.edit')}
       fullWidth
       variant="secondary"
       onClick={onCancel}

src/components/ModelSteps/ScanResult/ScanResultDialog.jsx

@@ -1,4 +1,5 @@
 import cx from 'classnames'
+import propTypes from 'prop-types'
 import React, { useRef, useState } from 'react'
 import { useSearchParams } from 'react-router-dom'
 import CompositeHeaderImage from 'src/components/CompositeHeader/CompositeHeaderImage'
@@ -7,7 +8,11 @@ import { useStepperDialog } from 'src/components/Contexts/StepperDialogProvider'
 import OcrProcessingDialog from 'src/components/ModelSteps/ScanResult/OcrProcessingDialog'
 import ScanResultCard from 'src/components/ModelSteps/ScanResult/ScanResultCard/ScanResultCard'
 import ScanResultTitle from 'src/components/ModelSteps/ScanResult/ScanResultTitle'
-import { makeFileFromBase64 } from 'src/components/ModelSteps/helpers'
+import {
+  isPDFFile,
+  makeFileFromBase64
+} from 'src/components/ModelSteps/helpers'
+import SubmitButton from 'src/components/ModelSteps/widgets/SubmitButton'
 import StepperDialogTitle from 'src/components/StepperDialog/StepperDialogTitle'
 import { FLAGSHIP_SCAN_TEMP_FILENAME, KEYS } from 'src/constants'
 import { isFlagshipOCRAvailable } from 'src/helpers/isFlagshipOCRAvailable'
@@ -19,30 +24,39 @@ import { FixedDialog } from 'cozy-ui/transpiled/react/CozyDialogs'
 import PointerAlert from 'cozy-ui/transpiled/react/PointerAlert'
 import { ButtonLink } from 'cozy-ui/transpiled/react/deprecated/Button'
 import useEventListener from 'cozy-ui/transpiled/react/hooks/useEventListener'
-import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
 import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 
+/**
+ * @param {object} props
+ * @param {object} props.currentStep
+ * @param {Function} props.onClose
+ * @param {Function} props.onBack
+ * @param {Function} props.onChangeFile
+ * @param {Function} props.onSubmit
+ * @param {object} props.currentFile
+ * @param {Function} props.setCurrentFile
+ */
 const ScanResultDialog = ({
   currentStep,
   onClose,
   onBack,
   onChangeFile,
+  onSubmit,
   currentFile,
   setCurrentFile
 }) => {
   const { illustration, multipage, page = 'default', tooltip } = currentStep
   const { t } = useI18n()
   const webviewIntent = useWebviewIntent()
   const [searchParams] = useSearchParams()
-  const { isDesktop } = useBreakpoints()
 
-  const device = isDesktop ? 'desktop' : 'mobile'
   const imageRef = useRef(null)
   const [rotationImage, setRotationImage] = useState(0)
   const [ocrProcessing, setOcrProcessing] = useState(false)
   const {
     currentStepIndex,
     nextStep,
+    isEdit,
     isLastStep,
     allCurrentSteps,
     currentDefinition
@@ -96,6 +110,13 @@ const ScanResultDialog = ({
       <OcrProcessingDialog rotatedFile={currentFileRotated} onBack={onBack} />
     )
   }
+  const SubmitButtonComponent = isLastStep() ? SubmitButton : null
+  const isEditStatusChanged =
+    !isEdit || (isEdit && currentFile.name !== formData.file.name)
+
+  const tooltipKey = t(
+    `Acquisition.${isPDFFile(currentFile) ? 'pdf' : 'image'}.tooltip.${page}`
+  )
 
   return (
     <FixedDialog
@@ -113,7 +134,9 @@ const ScanResultDialog = ({
         <div className={cx('u-flex u-flex-column u-flex-justify-center')}>
           {!formData.data?.[0]?.file?.isBlank && (
             <>
-              <ScanResultTitle />
+              {isEditStatusChanged && (
+                <ScanResultTitle currentFile={currentFile} />
+              )}
               {tooltip && (
                 <PointerAlert
                   className="u-mb-1"
@@ -124,7 +147,7 @@ const ScanResultDialog = ({
                     />
                   }
                 >
-                  {t(`Acquisition.${device}.tooltip.${page}`)}
+                  {tooltipKey}
                 </PointerAlert>
               )}
             </>
@@ -140,12 +163,16 @@ const ScanResultDialog = ({
       }
       actions={
         <>
-          <Button
-            data-testid="next-button"
-            fullWidth
-            label={t('common.next')}
-            onClick={handleNextStep}
-          />
+          {SubmitButtonComponent ? (
+            <SubmitButtonComponent formData={formData} onSubmit={onSubmit} />
+          ) : (
+            <Button
+              data-testid="next-button"
+              fullWidth
+              label={t('common.next')}
+              onClick={handleNextStep}
+            />
+          )}
           {multipage && (
             <ButtonLink
               className="u-ml-0 u-mb-half"
@@ -164,4 +191,14 @@ const ScanResultDialog = ({
   )
 }
 
+ScanResultDialog.propTypes = {
+  currentStep: propTypes.object.isRequired,
+  onClose: propTypes.func.isRequired,
+  onBack: propTypes.func.isRequired,
+  onChangeFile: propTypes.func.isRequired,
+  currentFile: propTypes.object.isRequired,
+  setCurrentFile: propTypes.func.isRequired,
+  onSubmit: propTypes.func.isRequired
+}
+
 export default ScanResultDialog

src/components/ModelSteps/ScanResult/ScanResultDialog.spec.jsx

@@ -126,6 +126,17 @@ describe('AcquisitionResult component:', () => {
     expect(btn).toBeDefined()
   })
 
+  describe('Submit', () => {
+    it('should submit button must exist if this is the last step.', async () => {
+      const { findByTestId } = setup({
+        currentFile: mockFile({ name: 'test.pdf' }),
+        isLastStep: jest.fn(() => true)
+      })
+      const btn = await findByTestId('ButtonSave')
+      expect(btn).toBeDefined()
+    })
+  })
+
   describe('setCurrentFile', () => {
     it('should setCurrentFile must be called once with null when restarting the file selection', async () => {
       const mockSetCurrentFile = jest.fn()
@@ -245,7 +256,7 @@ describe('AcquisitionResult component:', () => {
         const { getByTestId } = setup({
           currentFile: mockFile({ name: 'test.pdf' }),
           mockIsFlagshipOCRAvailable: true,
-          isLastStep: jest.fn(() => true),
+          isLastStep: jest.fn(() => false),
           currentDefinition: { ocrAttributes: [] },
           allCurrentSteps: [{ isDisplayed: 'ocr' }]
         })
@@ -262,7 +273,7 @@ describe('AcquisitionResult component:', () => {
         const { findByTestId } = setup({
           currentFile: mockFile({ name: FLAGSHIP_SCAN_TEMP_FILENAME }),
           mockIsFlagshipOCRAvailable: true,
-          isLastStep: jest.fn(() => true),
+          isLastStep: jest.fn(() => false),
           mockGetAttributesFromOcr,
           currentDefinition: { ocrAttributes: [] },
           allCurrentSteps: [{ isDisplayed: 'ocr' }]