Merge pull request #378 from miracle2k/initial-deposit-address

Allow an initial deposit address to be given via query string.

This allows the start the redemption flow with a deposit address already prefilled,
for example:

http://localhost:3001/deposit/0xecfdabdd933799e524e5e21c6672213a1f22e9dd/redeem

This would enable third party websites & explorer to link to the redemption flow for
deposits they know are redeemable.

src/components/redemption/Start.js

@@ -3,6 +3,7 @@ import classnames from "classnames"
 import { bindActionCreators } from "redux"
 import { connect } from "react-redux"
 import PropTypes from "prop-types"
+import { useParams } from "react-router-dom"
 import { useWeb3React } from "@web3-react/core"
 
 import { BitcoinHelpers } from "@keep-network/tbtc.js"
@@ -21,13 +22,27 @@ const Start = ({ saveAddresses, resetState, openWalletModal }) => {
     isValid: false,
     hasError: false,
   }
-  const [depositAddress, setDepositAddress] = useState(initialAddressState)
+
+  const params = useParams()
+
+  const [depositAddress, setDepositAddress] = useState({
+    ...initialAddressState,
+    address: params.address || "",
+  })
   const [btcAddress, setBtcAddress] = useState(initialAddressState)
 
   useEffect(() => {
     resetState()
   }, [resetState])
 
+  useEffect(() => {
+    if (depositAddress.address) {
+      const isValid = web3.utils.isAddress(depositAddress.address)
+      const hasError = !isValid
+      setDepositAddress({ address: depositAddress.address, isValid, hasError })
+    }
+  }, [])
+
   const { active } = useWeb3React()
 
   const handleClickConfirm = (evt) => {

src/index.js

@@ -98,6 +98,11 @@ function AppWrapper() {
               </Loadable>
             </Route>
             <Route path="/redeem" exact component={StartRedemption} />
+            <Route
+              path="/deposit/:address/redeem"
+              exact
+              component={StartRedemption}
+            />
             <Route path="/deposit/:address/redemption" exact>
               <Loadable restorer={RESTORER.REDEMPTION}>
                 <Redeeming />