add reviewtx component, state variable for tx info

src/routes/safe/components/Balances/SendModal/index.jsx

@@ -7,6 +7,7 @@ import { withStyles } from '@material-ui/core/styles'
 import Modal from '~/components/Modal'
 import ChooseTxType from './screens/ChooseTxType'
 import SendFunds from './screens/SendFunds'
+import ReviewTx from './screens/ReviewTx'
 
 type Props = {
   onClose: () => void,
@@ -19,7 +20,15 @@ type Props = {
   tokens: List<Token>,
   selectedToken: string,
 }
-type ActiveScreen = 'chooseTxType' | 'sendFunds'
+type ActiveScreen = 'chooseTxType' | 'sendFunds' | 'reviewTx'
+
+type TxStateType =
+  | {
+      token: Token,
+      recipientAddress: string,
+      amount: string,
+    }
+  | Object
 
 const styles = () => ({
   smallerModalWindow: {
@@ -29,10 +38,23 @@ const styles = () => ({
 })
 
 const Send = ({
-  onClose, isOpen, classes, safeAddress, etherScanLink, safeName, ethBalance, tokens, selectedToken,
+  onClose,
+  isOpen,
+  classes,
+  safeAddress,
+  etherScanLink,
+  safeName,
+  ethBalance,
+  tokens,
+  selectedToken,
 }: Props) => {
   const [activeScreen, setActiveScreen] = useState<ActiveScreen>('sendFunds')
+  const [tx, setTx] = useState<TxStateType>({})
   const smallerModalSize = activeScreen === 'chooseTxType'
+  const handleTxCreation = (txInfo) => {
+    setActiveScreen('reviewTx')
+    setTx(txInfo)
+  }
 
   // Uncomment when we add custom txs
   // useEffect(
@@ -62,8 +84,10 @@ const Send = ({
             ethBalance={ethBalance}
             tokens={tokens}
             selectedToken={selectedToken}
+            onSubmit={handleTxCreation}
           />
         )}
+        {activeScreen === 'reviewTx' && <ReviewTx tx={tx} />}
       </React.Fragment>
     </Modal>
   )

src/routes/safe/components/Balances/SendModal/screens/ReviewTx/index.jsx

@@ -0,0 +1,12 @@
+// @flow
+import React from 'react'
+
+const ReviewTx = () => {
+  return (
+    <div>
+      YO! Wanna review tx?
+    </div>
+  )
+}
+
+export default ReviewTx

src/routes/safe/components/Balances/SendModal/screens/SendFunds/index.jsx

@@ -39,6 +39,7 @@ type Props = {
   ethBalance: string,
   selectedToken: string,
   tokens: List<Token>,
+  onSubmit: Function,
 }
 
 const SendFunds = ({
@@ -50,10 +51,12 @@ const SendFunds = ({
   ethBalance,
   tokens,
   selectedToken,
+  onSubmit,
 }: Props) => {
   const handleSubmit = (values) => {
-    console.log(values)
+    onSubmit(values)
   }
+
   const formMutators = {
     setMax: (args, state, utils) => {
       const { token } = state.formState.values