Merge branch 'development' of github.com:gnosis/safe-react into development

src/routes/safe/components/Settings/ManageOwners/RemoveOwnerModal/index.tsx

@@ -80,7 +80,7 @@ export const RemoveOwnerModal = ({
 }: RemoveOwnerProps): React.ReactElement => {
   const classes = useStyles()
   const [activeScreen, setActiveScreen] = useState('checkOwner')
-  const [values, setValues] = useState<any>({})
+  const [values, setValues] = useState<OwnerValues>({ ownerAddress, ownerName, threshold: '' })
   const dispatch = useDispatch()
   const safeAddress = useSelector(safeParamAddressFromStateSelector)
   const threshold = useSelector(safeThresholdSelector) || 1
@@ -88,7 +88,6 @@ export const RemoveOwnerModal = ({
   useEffect(
     () => () => {
       setActiveScreen('checkOwner')
-      setValues({})
     },
     [isOpen],
   )
@@ -106,8 +105,8 @@ export const RemoveOwnerModal = ({
   }
 
   const thresholdSubmitted = (newValues) => {
-    values.threshold = newValues.threshold
-    setValues(values)
+    const cpValues = { ...values, threshold: newValues.threshold }
+    setValues(cpValues)
     setActiveScreen('reviewRemoveOwner')
   }
 
@@ -138,7 +137,7 @@ export const RemoveOwnerModal = ({
             onSubmit={onRemoveOwner}
             ownerAddress={ownerAddress}
             ownerName={ownerName}
-            threshold={threshold}
+            threshold={Number(values.threshold)}
           />
         )}
       </>

src/routes/safe/components/Settings/ManageOwners/RemoveOwnerModal/screens/Review/index.tsx

@@ -27,6 +27,7 @@ import { TxParameters } from 'src/routes/safe/container/hooks/useTransactionPara
 import { styles } from './style'
 import { TransactionFees } from 'src/components/TransactionsFees'
 import { EditableTxParameters } from 'src/routes/safe/components/Transactions/helpers/EditableTxParameters'
+import { sameAddress } from 'src/logic/wallets/ethAddresses'
 
 export const REMOVE_OWNER_REVIEW_BTN_TEST_ID = 'remove-owner-review-btn'
 
@@ -87,7 +88,7 @@ export const ReviewRemoveOwnerModal = ({
       try {
         const gnosisSafe = await getGnosisSafeInstanceAt(safeAddress)
         const safeOwners = await gnosisSafe.methods.getOwners().call()
-        const index = safeOwners.findIndex((owner) => owner.toLowerCase() === ownerAddress.toLowerCase())
+        const index = safeOwners.findIndex((owner) => sameAddress(owner, ownerAddress))
         const prevAddress = index === 0 ? SENTINEL_ADDRESS : safeOwners[index - 1]
         const txData = gnosisSafe.methods.removeOwner(prevAddress, ownerAddress, threshold).encodeABI()
 
@@ -141,6 +142,7 @@ export const ReviewRemoveOwnerModal = ({
           <Hairline />
           <Block>
             <Row className={classes.root}>
+              {/* Details */}
               <Col layout="column" xs={4}>
                 <Block className={classes.details}>
                   <Block margin="lg">
@@ -166,6 +168,7 @@ export const ReviewRemoveOwnerModal = ({
                   </Block>
                 </Block>
               </Col>
+              {/* Owners */}
               <Col className={classes.owners} layout="column" xs={8}>
                 <Row className={classes.ownersTitle}>
                   <Paragraph color="primary" noMargin size="lg">

src/routes/safe/components/Settings/ManageOwners/RemoveOwnerModal/screens/ThresholdForm/index.tsx

@@ -2,7 +2,7 @@ import IconButton from '@material-ui/core/IconButton'
 import MenuItem from '@material-ui/core/MenuItem'
 import { makeStyles } from '@material-ui/core/styles'
 import Close from '@material-ui/icons/Close'
-import React from 'react'
+import React, { ReactElement } from 'react'
 import { useSelector } from 'react-redux'
 
 import { styles } from './style'
@@ -18,12 +18,19 @@ import Hairline from 'src/components/layout/Hairline'
 import Paragraph from 'src/components/layout/Paragraph'
 import Row from 'src/components/layout/Row'
 import { safeOwnersSelector, safeThresholdSelector } from 'src/logic/safe/store/selectors'
+import { TxParameters } from 'src/routes/safe/container/hooks/useTransactionParameters'
 
 export const REMOVE_OWNER_THRESHOLD_NEXT_BTN_TEST_ID = 'remove-owner-threshold-next-btn'
 
 const useStyles = makeStyles(styles)
 
-const ThresholdForm = ({ onClickBack, onClose, onSubmit }) => {
+type Props = {
+  onClickBack: () => void
+  onClose: () => void
+  onSubmit: (txParameters: TxParameters) => void
+}
+
+const ThresholdForm = ({ onClickBack, onClose, onSubmit }: Props): ReactElement => {
   const classes = useStyles()
   const owners = useSelector(safeOwnersSelector)
   const threshold = useSelector(safeThresholdSelector) as number