import React from 'react';
import { Message } from 'retranslate';

import SelectSources from './selectSources';
import TransferFutureCapital from './transferFutureCapital';
import ConfirmMandate from './confirmMandate';
import Success from './success';
import Flow from '../common/Flow'; // eslint-disable-line import/no-named-as-default
import AddressStep from '../common/AddressStep';

const flowPath = '/2nd-pillar-flow';
const introMessage = <Message>steps.intro</Message>;
const steps = [
  {
    path: 'select-sources',
    Component: () => <SelectSources nextPath={`${flowPath}/transfer-future-capital`} />,
    title: <Message>steps.select-sources</Message>,
  },
  {
    path: 'transfer-future-capital',
    Component: () => (
      <TransferFutureCapital
        previousPath={`${flowPath}/select-sources`}
        nextPath={`${flowPath}/address`}
      />
    ),
    title: <Message>steps.transfer-future-capital</Message>,
  },
  {
    path: 'address',
    Component: () => (
      <AddressStep nextPath={`${flowPath}/confirm-mandate`} updateOnlyEmailAndPhone pillar={2} />
    ),
    title: <Message>steps.address</Message>,
  },
  {
    path: 'confirm-mandate',
    Component: () => (
      <ConfirmMandate previousPath={`${flowPath}/address`} nextPath={`${flowPath}/success`} />
    ),
    title: <Message>steps.confirm-mandate</Message>,
  },
  {
    path: 'success',
    Component: () => <Success previousPath={`${flowPath}/confirm-mandate`} />,
  },
];

const SecondPillarFlow = () => (
  <Flow name="SECOND_PILLAR" flowPath={flowPath} introMessage={introMessage} steps={steps} />
);

export default SecondPillarFlow;

@@ -20,16 +20,17 @@
 react';%0A
+%0A
 import %7B
@@ -30,16 +30,25 @@
 mport %7B 
+Formatted
 Message 
@@ -61,21 +61,19 @@
  're
-translate
+act-intl
 ';%0A
-%0A
 impo
@@ -448,24 +448,37 @@
 sage = %3C
+Formatted
 Message
-%3E
+ id=%22
 steps.in
@@ -480,25 +480,19 @@
 ps.intro
-%3C/Message
+%22 /
 %3E;%0Aconst
@@ -631,32 +631,45 @@
     title: %3C
+Formatted
 Message
-%3E
+ id=%22
 steps.select
@@ -676,25 +676,19 @@
 -sources
-%3C/Message
+%22 /
 %3E,%0A  %7D,%0A
@@ -897,32 +897,45 @@
     title: %3C
+Formatted
 Message
-%3E
+ id=%22
 steps.transf
@@ -951,25 +951,19 @@
 -capital
-%3C/Message
+%22 /
 %3E,%0A  %7D,%0A
@@ -1123,32 +1123,45 @@
     title: %3C
+Formatted
 Message
-%3E
+ id=%22
 steps.addres
@@ -1161,25 +1161,19 @@
 .address
-%3C/Message
+%22 /
 %3E,%0A  %7D,%0A
@@ -1342,24 +1342,37 @@
 title: %3C
+Formatted
 Message
-%3E
+ id=%22
 steps.co
@@ -1388,17 +1388,11 @@
 date
-%3C/Message
+%22 /
 %3E,%0A 

Convert second pillar flow to react-intl