fix checkbox displaying in manage tokens modal

src/routes/safe/component/Balances/Tokens/index.jsx

@@ -65,8 +65,7 @@ class Tokens extends React.Component<Props, State> {
     this.setState(() => ({ filter: value }))
   }
 
-  onSwitch = (token: Token) => (e: SyntheticInputEvent<HTMLInputElement>) => {
+  onSwitch = (token: Token) => () => {
-    const { checked } = e.target
     const { safeAddress, updateActiveTokens } = this.props
 
     updateActiveTokens(safeAddress, token.address)
@@ -78,7 +77,9 @@ class Tokens extends React.Component<Props, State> {
   }
 
   render() {
-    const { onClose, classes, tokens } = this.props
+    const {
+      onClose, classes, tokens, activeTokens,
+    } = this.props
     const { filter } = this.state
     const searchClasses = {
       input: classes.searchInput,
@@ -120,7 +121,10 @@ class Tokens extends React.Component<Props, State> {
           <Hairline />
         </Block>
         <MuiList className={classes.list}>
-          {filteredTokens.map((token: Token) => (
+          {filteredTokens.map((token: Token) => {
+            const isActive = activeTokens.findIndex(({ address }) => address === token.address) !== -1
+
+            return (
               <ListItem key={token.address} className={classes.token}>
                 <ListItemIcon>
                   <Img src={token.logoUri} height={28} alt={token.name} onError={this.setImageToPlaceholder} />
@@ -128,11 +132,12 @@ class Tokens extends React.Component<Props, State> {
                 <ListItemText primary={token.symbol} secondary={token.name} />
                 {token.address !== ETH_ADDRESS && (
                   <ListItemSecondaryAction>
-                  <Switch onChange={this.onSwitch(token)} checked={token.status} />
+                    <Switch onChange={this.onSwitch(token)} checked={isActive} />
                   </ListItemSecondaryAction>
                 )}
               </ListItem>
-          ))}
+            )
+          })}
         </MuiList>
       </React.Fragment>
     )

src/routes/safe/component/Balances/index.jsx

@@ -102,7 +102,12 @@ class Balances extends React.Component<Props, State> {
               handleClose={this.onHide('Token')}
               open={showToken}
             >
-              <Tokens tokens={tokens} onClose={this.onHide('Token')} safeAddress={safeAddress} />
+              <Tokens
+                tokens={tokens}
+                onClose={this.onHide('Token')}
+                safeAddress={safeAddress}
+                activeTokens={activeTokens}
+              />
             </Modal>
           </Col>
         </Row>

src/routes/safe/store/reducer/safe.js

@@ -25,7 +25,7 @@ export const buildSafe = (storedSafe: SafeProps) => {
     owners,
   }
 
-  return SafeRecord(safe)
+  return safe
 }
 
 const buildSafesFrom = (loadedSafes: Object): Map<string, Safe> => {
@@ -36,7 +36,7 @@ const buildSafesFrom = (loadedSafes: Object): Map<string, Safe> => {
     const safeRecords = keys.map((address: string) => buildSafe(loadedSafes[address]))
 
     return safes.withMutations(async (map) => {
-      safeRecords.forEach((safe: Safe) => map.set(safe.get('address'), safe))
+      safeRecords.forEach((safe: SafeProps) => map.set(safe.address, safe))
     })
   } catch (err) {
     // eslint-disable-next-line