Merge pull request #267 from gnosis/215-update-owner-list-fix

Feature #215: Update owner list fix

src/routes/safe/components/Layout.jsx

@@ -196,6 +196,7 @@ const Layout = (props: Props) => {
               network={network}
               userAddress={userAddress}
               createTransaction={createTransaction}
+              safe={safe}
             />
           )}
         />

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

@@ -10,6 +10,7 @@ import { TX_NOTIFICATION_TYPES } from '~/logic/safe/transactions'
 import CheckOwner from './screens/CheckOwner'
 import ThresholdForm from './screens/ThresholdForm'
 import ReviewRemoveOwner from './screens/Review'
+import type { Safe } from '~/routes/safe/store/models/safe'
 
 const styles = () => ({
   biggerModalWindow: {
@@ -34,6 +35,7 @@ type Props = {
   removeSafeOwner: Function,
   enqueueSnackbar: Function,
   closeSnackbar: Function,
+  safe: Safe
 }
 
 type ActiveScreen = 'checkOwner' | 'selectThreshold' | 'reviewRemoveOwner'
@@ -48,6 +50,7 @@ export const sendRemoveOwner = async (
   closeSnackbar: Function,
   createTransaction: Function,
   removeSafeOwner: Function,
+  safe: Safe,
 ) => {
   const gnosisSafe = await getGnosisSafeInstanceAt(safeAddress)
   const safeOwners = await gnosisSafe.getOwners()
@@ -69,7 +72,7 @@ export const sendRemoveOwner = async (
     closeSnackbar,
   )
 
-  if (txHash) {
+  if (txHash && safe.threshold === 1) {
     removeSafeOwner({ safeAddress, ownerAddress: ownerAddressToRemove })
   }
 }
@@ -88,6 +91,7 @@ const RemoveOwner = ({
   removeSafeOwner,
   enqueueSnackbar,
   closeSnackbar,
+  safe,
 }: Props) => {
   const [activeScreen, setActiveScreen] = useState<ActiveScreen>('checkOwner')
   const [values, setValues] = useState<Object>({})
@@ -130,6 +134,7 @@ const RemoveOwner = ({
       closeSnackbar,
       createTransaction,
       removeSafeOwner,
+      safe,
     )
   }
 

src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/index.jsx

@@ -9,6 +9,7 @@ import { TX_NOTIFICATION_TYPES } from '~/logic/safe/transactions'
 import { getGnosisSafeInstanceAt, SENTINEL_ADDRESS } from '~/logic/contracts/safeContracts'
 import OwnerForm from './screens/OwnerForm'
 import ReviewReplaceOwner from './screens/Review'
+import type { Safe } from '~/routes/safe/store/models/safe'
 
 const styles = () => ({
   biggerModalWindow: {
@@ -33,6 +34,7 @@ type Props = {
   replaceSafeOwner: Function,
   enqueueSnackbar: Function,
   closeSnackbar: Function,
+  safe: Safe,
 }
 type ActiveScreen = 'checkOwner' | 'reviewReplaceOwner'
 
@@ -44,6 +46,7 @@ export const sendReplaceOwner = async (
   closeSnackbar: Function,
   createTransaction: Function,
   replaceSafeOwner: Function,
+  safe: Safe,
 ) => {
   const gnosisSafe = await getGnosisSafeInstanceAt(safeAddress)
   const safeOwners = await gnosisSafe.getOwners()
@@ -65,7 +68,7 @@ export const sendReplaceOwner = async (
     closeSnackbar,
   )
 
-  if (txHash) {
+  if (txHash && safe.threshold === 1) {
     replaceSafeOwner({
       safeAddress,
       oldOwnerAddress: ownerAddressToRemove,
@@ -89,6 +92,7 @@ const ReplaceOwner = ({
   replaceSafeOwner,
   enqueueSnackbar,
   closeSnackbar,
+  safe,
 }: Props) => {
   const [activeScreen, setActiveScreen] = useState<ActiveScreen>('checkOwner')
   const [values, setValues] = useState<Object>({})
@@ -121,6 +125,7 @@ const ReplaceOwner = ({
         closeSnackbar,
         createTransaction,
         replaceSafeOwner,
+        safe,
       )
     } catch (error) {
       console.error('Error while removing an owner', error)

src/routes/safe/components/Settings/ManageOwners/index.jsx

@@ -32,6 +32,7 @@ import ReplaceOwnerIcon from './assets/icons/replace-owner.svg'
 import RenameOwnerIcon from './assets/icons/rename-owner.svg'
 import RemoveOwnerIcon from '../assets/icons/bin.svg'
 import Paragraph from '~/components/layout/Paragraph/index'
+import type { Safe } from '~/routes/safe/store/models/safe'
 
 export const RENAME_OWNER_BTN_TEST_ID = 'rename-owner-btn'
 export const REMOVE_OWNER_BTN_TEST_ID = 'remove-owner-btn'
@@ -53,6 +54,7 @@ type Props = {
   replaceSafeOwner: Function,
   editSafeOwner: Function,
   granted: boolean,
+  safe: Safe
 }
 
 type State = {
@@ -111,6 +113,7 @@ class ManageOwners extends React.Component<Props, State> {
       replaceSafeOwner,
       editSafeOwner,
       granted,
+      safe,
     } = this.props
     const {
       showAddOwner,
@@ -237,6 +240,7 @@ class ManageOwners extends React.Component<Props, State> {
           userAddress={userAddress}
           createTransaction={createTransaction}
           removeSafeOwner={removeSafeOwner}
+          safe={safe}
         />
         <ReplaceOwnerModal
           onClose={this.onHide('ReplaceOwner')}
@@ -251,6 +255,7 @@ class ManageOwners extends React.Component<Props, State> {
           userAddress={userAddress}
           createTransaction={createTransaction}
           replaceSafeOwner={replaceSafeOwner}
+          safe={safe}
         />
         <EditOwnerModal
           onClose={this.onHide('EditOwner')}

src/routes/safe/components/Settings/index.jsx

@@ -19,6 +19,7 @@ import ManageOwners from './ManageOwners'
 import actions, { type Actions } from './actions'
 import { styles } from './style'
 import RemoveSafeIcon from './assets/icons/bin.svg'
+import type { Safe } from '~/routes/safe/store/models/safe'
 
 export const OWNERS_SETTINGS_TAB_TEST_ID = 'owner-settings-tab'
 
@@ -43,6 +44,7 @@ type Props = Actions & {
   replaceSafeOwner: Function,
   editSafeOwner: Function,
   userAddress: string,
+  safe: Safe
 }
 
 type Action = 'RemoveSafe'
@@ -87,6 +89,7 @@ class Settings extends React.Component<Props, State> {
       removeSafeOwner,
       replaceSafeOwner,
       editSafeOwner,
+      safe,
     } = this.props
 
     return (
@@ -152,6 +155,7 @@ class Settings extends React.Component<Props, State> {
                   replaceSafeOwner={replaceSafeOwner}
                   editSafeOwner={editSafeOwner}
                   granted={granted}
+                  safe={safe}
                 />
               )}
               {menuOptionIndex === 3 && (

src/routes/safe/container/actions.js

@@ -1,5 +1,5 @@
 // @flow
-import fetchSafe from '~/routes/safe/store/actions/fetchSafe'
+import fetchSafe, { checkAndUpdateSafeOwners } from '~/routes/safe/store/actions/fetchSafe'
 import fetchTokenBalances from '~/routes/safe/store/actions/fetchTokenBalances'
 import fetchEtherBalance from '~/routes/safe/store/actions/fetchEtherBalance'
 import createTransaction from '~/routes/safe/store/actions/createTransaction'
@@ -28,4 +28,5 @@ export default {
   fetchTransactions,
   updateSafe,
   fetchEtherBalance,
+  checkAndUpdateSafeOwners,
 }

src/routes/safe/container/index.jsx

@@ -89,9 +89,9 @@ class SafeView extends React.Component<Props, State> {
 
   checkForUpdates() {
     const {
-      safeUrl, activeTokens, fetchTokenBalances, fetchEtherBalance,
+      safeUrl, activeTokens, fetchTokenBalances, fetchEtherBalance, checkAndUpdateSafeOwners,
     } = this.props
-
+    checkAndUpdateSafeOwners(safeUrl)
     fetchTokenBalances(safeUrl, activeTokens)
     fetchEtherBalance(safeUrl)
   }

src/routes/safe/store/actions/fetchSafe.js

@@ -5,9 +5,12 @@ import { type GlobalState } from '~/store/index'
 import { makeOwner } from '~/routes/safe/store/models/owner'
 import type { SafeProps } from '~/routes/safe/store/models/safe'
 import addSafe from '~/routes/safe/store/actions/addSafe'
-import { getOwners, getSafeName } from '~/logic/safe/utils'
+import { getOwners, getSafeName, SAFES_KEY } from '~/logic/safe/utils'
 import { getGnosisSafeInstanceAt } from '~/logic/contracts/safeContracts'
 import { getBalanceInEtherOf } from '~/logic/wallets/getWeb3'
+import { loadFromStorage } from '~/utils/storage'
+import removeSafeOwner from '~/routes/safe/store/actions/removeSafeOwner'
+import addSafeOwner from '~/routes/safe/store/actions/addSafeOwner'
 
 const buildOwnersFrom = (
   safeOwners: string[],
@@ -35,6 +38,36 @@ export const buildSafe = async (safeAddress: string, safeName: string) => {
   return safe
 }
 
+const getLocalSafe = async (safeAddress: string) => {
+  const storedSafes = (await loadFromStorage(SAFES_KEY)) || {}
+  return storedSafes[safeAddress]
+}
+
+export const checkAndUpdateSafeOwners = (safeAddress: string) => async (
+  dispatch: ReduxDispatch<GlobalState>,
+) => {
+  // Check if the owner's safe did change and update them
+  const [gnosisSafe, localSafe] = await Promise.all([getGnosisSafeInstanceAt(safeAddress), getLocalSafe(safeAddress)])
+  const remoteOwners = await gnosisSafe.getOwners()
+  // Converts from [ { address, ownerName} ] to address array
+  const localOwners = localSafe.owners.map((localOwner) => localOwner.address)
+
+  // If the remote owners does not contain a local address, we remove that local owner
+  localOwners.forEach((localAddress) => {
+    if (!remoteOwners.includes(localAddress)) {
+      dispatch(removeSafeOwner({ safeAddress, ownerAddress: localAddress }))
+    }
+  })
+
+  // If the remote has an owner that we don't have locally, we add it
+  remoteOwners.forEach((remoteAddress) => {
+    if (!localOwners.includes(remoteAddress)) {
+      dispatch(addSafeOwner({ safeAddress, ownerAddress: remoteAddress, ownerName: 'UNKNOWN' }))
+    }
+  })
+}
+
+// eslint-disable-next-line consistent-return
 export default (safeAddress: string) => async (dispatch: ReduxDispatch<GlobalState>) => {
   try {
     const safeName = (await getSafeName(safeAddress)) || 'LOADED SAFE'