From 3cccc34ea72980b5d0ca0a599fba73e889aeea85 Mon Sep 17 00:00:00 2001
From: apanizo <adolfo.panizo@gmail.com>
Date: Tue, 12 Jun 2018 10:38:52 +0200
Subject: [PATCH] WA-234 Include warning message when removing owner if there
 are pending transactions

---
 .../component/RemoveOwner/RemoveOwnerForm/index.jsx    | 10 +++++++++-
 src/routes/safe/component/RemoveOwner/index.jsx        | 10 ++++++++--
 src/routes/safe/component/Safe/index.jsx               |  2 +-
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/routes/safe/component/RemoveOwner/RemoveOwnerForm/index.jsx b/src/routes/safe/component/RemoveOwner/RemoveOwnerForm/index.jsx
index 146cc1fc..fc47e8db 100644
--- a/src/routes/safe/component/RemoveOwner/RemoveOwnerForm/index.jsx
+++ b/src/routes/safe/component/RemoveOwner/RemoveOwnerForm/index.jsx
@@ -1,6 +1,7 @@
 // @flow
 import * as React from 'react'
 import Field from '~/components/forms/Field'
+import SnackbarContent from '~/components/SnackbarContent'
 import Checkbox from '~/components/forms/Checkbox'
 import Block from '~/components/layout/Block'
 import Heading from '~/components/layout/Heading'
@@ -12,10 +13,11 @@ type Props = {
   threshold: number,
   name: string,
   disabled: boolean,
+  pendingTransactions: boolean,
 }
 
 const RemoveOwnerForm = ({
-  numOwners, threshold, name, disabled,
+  numOwners, threshold, name, disabled, pendingTransactions,
 }: Props) => () => (
   <Block margin="md">
     <Heading tag="h2" margin="lg">
@@ -24,6 +26,12 @@ const RemoveOwnerForm = ({
     <Heading tag="h4" margin="lg">
       {`Actual number of owners: ${numOwners}, threhsold of safe: ${threshold}`}
     </Heading>
+    { pendingTransactions &&
+      <SnackbarContent
+        variant="warning"
+        message="Be careful removing and owner might incur in some of the pending transactions could never be executed"
+      />
+    }
     <Block margin="md">
       <Field
         name={DECREASE_PARAM}
diff --git a/src/routes/safe/component/RemoveOwner/index.jsx b/src/routes/safe/component/RemoveOwner/index.jsx
index aed0adb9..b0253557 100644
--- a/src/routes/safe/component/RemoveOwner/index.jsx
+++ b/src/routes/safe/component/RemoveOwner/index.jsx
@@ -70,7 +70,7 @@ class RemoveOwner extends React.Component<Props, State> {
   }
 
   render() {
-    const { safe, name } = this.props
+    const { safe, name, pendingTransactions } = this.props
     const { done } = this.state
     const steps = getSteps()
     const numOwners = safe.get('owners').count()
@@ -90,7 +90,13 @@ class RemoveOwner extends React.Component<Props, State> {
           onReset={this.onReset}
           initialValues={initialValues}
         >
-          <Stepper.Page numOwners={numOwners} threshold={threshold} name={name} disabled={disabled}>
+          <Stepper.Page
+            numOwners={numOwners}
+            threshold={threshold}
+            name={name}
+            disabled={disabled}
+            pendingTransactions={pendingTransactions}
+          >
             { RemoveOwnerForm }
           </Stepper.Page>
           <Stepper.Page name={name}>
diff --git a/src/routes/safe/component/Safe/index.jsx b/src/routes/safe/component/Safe/index.jsx
index 6e8c629b..1740da07 100644
--- a/src/routes/safe/component/Safe/index.jsx
+++ b/src/routes/safe/component/Safe/index.jsx
@@ -78,7 +78,7 @@ class GnoSafe extends React.PureComponent<SafeProps, State> {
   onRemoveOwner = (name: string, address: string) => {
     const { safe } = this.props
 
-    this.setState({ component: <RemoveOwner threshold={safe.get('threshold')} safe={safe} name={name} userToRemove={address} /> })
+    this.setState({ component: <RemoveOwner safeAddress={safe.get('address')} threshold={safe.get('threshold')} safe={safe} name={name} userToRemove={address} /> })
   }
 
   render() {