feat: Use Dialog for how to add beneficiary modal

cozy · Nov 12, 2020 · 5439f6a · 5439f6a
1 parent 64a95cd
commit 5439f6a
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 17 deletions.
diff --git a/src/ducks/transfers/steps/Beneficiary.jsx b/src/ducks/transfers/steps/Beneficiary.jsx
@@ -1,17 +1,10 @@
 import React from 'react'
 import Padded from 'components/Spacing/Padded'
-import {
-  Media,
-  Bd,
-  Img,
-  translate,
-  Text,
-  Caption,
-  Bold,
-  Button,
-  Modal,
-  ModalContent
-} from 'cozy-ui/transpiled/react'
+import { Media, Bd, Img } from 'cozy-ui/transpiled/react/Media'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
+import { Text, Caption, Bold } from 'cozy-ui/transpiled/react/Text'
+import Button from 'cozy-ui/transpiled/react/Button'
+import { Dialog } from 'cozy-ui/transpiled/react/CozyDialogs'
 
 import AddAccountButton from 'ducks/categories/AddAccountButton'
 import { List, Row } from 'components/List'
@@ -111,11 +104,19 @@ class ChooseBeneficiary extends React.Component {
           </div>
         </Padded>
         {this.state.showAddBeneficiary ? (
-          <Modal into="body" dismissAction={this.handleCloseAddBeneficiary}>
-            <ModalContent>
-              {t('Transfer.beneficiary.help-add-beneficiary')}
-            </ModalContent>
-          </Modal>
+          <Dialog
+            open
+            title={t('Transfer.beneficiary.help-add-beneficiary-title')}
+            content={t('Transfer.beneficiary.help-add-beneficiary')}
+            onClose={this.handleCloseAddBeneficiary}
+            actions={
+              <Button
+                onClick={this.handleCloseAddBeneficiary}
+                theme="primary"
+                label={t('Transfer.beneficiary.help-add-beneficiary-action')}
+              />
+            }
+          />
         ) : null}
       </>
     )

diff --git a/src/locales/en.json b/src/locales/en.json
@@ -737,7 +737,9 @@
     "beneficiary": {
       "page-title": "Beneficiary",
       "add-beneficiary": "Add a recipient",
+      "help-add-beneficiary-title": "Adding recipients",
       "help-add-beneficiary": "To add recipients, add them directly on the website of your bank.",
+      "help-add-beneficiary-action": "Understood !",
       "title": "To which account do you want to send this transfer"
     },
     "sender": {

diff --git a/src/locales/fr.json b/src/locales/fr.json
@@ -748,6 +748,8 @@
     "beneficiary": {
       "page-title": "Bénéficiaire",
       "add-beneficiary": "Ajouter un bénéficiaire",
+      "help-add-beneficiary-title": "Ajout de bénéficiaires",
+      "help-add-beneficiary-action": "Compris !",
       "help-add-beneficiary": "Pour rajouter des bénéficiaires, ajoutez les directement depuis le site de votre banque.",
       "title": "Vers quel compte souhaitez-vous effectuer un virement ?"
     },