fix(watch only): ts conversion

blockchain · Aug 10, 2020 · d836f85 · d836f85
1 parent 54d04a2
commit d836f85
Show file tree

Hide file tree

Showing 21 changed files with 163 additions and 77 deletions.
diff --git a/packages/blockchain-info-components/index.d.ts b/packages/blockchain-info-components/index.d.ts
@@ -62,7 +62,7 @@ export const Carousel: FunctionComponent<{
   chips: boolean
 }>
 export const ComponentDropdown: ComponentClass<{
-  components: Array<JSX.Element>
+  components: Array<JSX.Element | boolean>
   color?: string
   toggleOnCallback?: boolean
   opened?: boolean
@@ -79,6 +79,11 @@ export function Color(
 ): DefaultTheme[keyof DefaultTheme]
 
 export const FontGlobalStyles: FunctionComponent<{}>
+export const FlatLoader: FunctionComponent<{
+  width?: string
+  height?: string
+  style?: CSSProperties
+}>
 export const HeartbeatLoader: FunctionComponent<{
   width?: string
   height?: string
@@ -206,6 +211,7 @@ export const TableCell: FunctionComponent<{
   onClick?: () => void
   width?: string
   hideMobile?: boolean
+  style?: CSSProperties
 }>
 export const TableHeader: FunctionComponent<{}>
 export const TableRow: FunctionComponent<{}>

diff --git a/packages/blockchain-wallet-v4-frontend/src/data/modals/types.ts b/packages/blockchain-wallet-v4-frontend/src/data/modals/types.ts
@@ -1,34 +1,42 @@
 import * as AT from './actionTypes'
 
 export type ModalNamesType =
+  | '@MODAL.REQUEST.BCH'
+  | '@MODAL.REQUEST.BTC'
+  | '@MODAL.REQUEST.ETH'
+  | '@MODAL.REQUEST.XLM'
+  | '@MODAL.SEND.BCH'
+  | '@MODAL.SEND.BTC'
+  | '@MODAL.SEND.ETH'
+  | '@MODAL.SEND.XLM'
+  | 'AddBtcWallet'
   | 'AirdropClaim'
   | 'AirdropSuccess'
   | 'BitPayInvoiceExpired'
   | 'BORROW_MODAL'
   | 'Confirm'
   | 'CUSTODY_WITHDRAW_MODAL'
+  | 'DeleteAddressLabel'
   | 'FAQ_MODAL'
+  | 'ImportBtcAddress'
   | 'INTEREST_MODAL'
   | 'KycDocResubmit'
   | 'LinkFromExchangeAccount'
   | 'LinkToExchangeAccount'
-  | '@MODAL.REQUEST.BCH'
-  | '@MODAL.REQUEST.BTC'
-  | '@MODAL.REQUEST.ETH'
-  | '@MODAL.REQUEST.XLM'
-  | '@MODAL.SEND.BCH'
-  | '@MODAL.SEND.BTC'
-  | '@MODAL.SEND.ETH'
-  | '@MODAL.SEND.XLM'
   | 'PairingCode'
   | 'RECOVERY_PHRASE_MODAL'
+  | 'ShowBtcPrivateKey'
+  | 'ShowUsedAddresses'
+  | 'ShowXPub'
+  | 'SignMessage'
   | 'SIMPLE_BUY_MODAL'
   | 'SunRiverWelcome'
   | 'SwapGetStarted'
   | 'SwapUpgrade'
-  | 'TransferEth'
   | 'TRANSACTION_REPORT'
+  | 'TransferEth'
   | 'UpgradeForAirdrop'
+  | 'VerifyMessage'
   | 'WELCOME_MODAL'
   | 'WHATS_NEW_MODAL'
   | 'WITHDRAWAL_MODAL'

diff --git a/...enes/Settings/Addresses/Btc/AddressRow.js → ...nes/Settings/Addresses/Btc/AddressRow.tsx b/...enes/Settings/Addresses/Btc/AddressRow.js → ...nes/Settings/Addresses/Btc/AddressRow.tsx
@@ -6,6 +6,7 @@ import {
   TableRow,
   Text
 } from 'blockchain-info-components'
+import { CoinType, ImportedAddrType } from 'core/types'
 import { FormattedMessage } from 'react-intl'
 import media from 'services/ResponsiveService'
 import React from 'react'
@@ -41,9 +42,21 @@ const MoreOptions = () => (
   </Link>
 )
 
-const AddressRow = ({ address, archived, coin, renderOptions, dataE2e }) => {
+const AddressRow = ({
+  address,
+  archived,
+  coin,
+  renderOptions,
+  dataE2e
+}: {
+  address: ImportedAddrType
+  archived?: boolean
+  coin?: CoinType
+  dataE2e: string
+  renderOptions: any
+}) => {
   return (
-    <TableRow dataE2e={dataE2e}>
+    <TableRow data-e2e={dataE2e}>
       <AddressTableCell width='50%'>
         <AddressCell
           size='13px'

diff --git a/.../Addresses/Btc/ArchivedAddresses/index.js → ...Addresses/Btc/ArchivedAddresses/index.tsx b/.../Addresses/Btc/ArchivedAddresses/index.js → ...Addresses/Btc/ArchivedAddresses/index.tsx
@@ -1,13 +1,13 @@
 import { actions, model, selectors } from 'data'
 import { bindActionCreators, compose } from 'redux'
-import { connect } from 'react-redux'
+import { connect, ConnectedProps } from 'react-redux'
 import { formValueSelector } from 'redux-form'
 import { Types } from 'blockchain-wallet-v4/src'
 import ArchivedAddresses from './template'
 import React from 'react'
 const { WALLET_TX_SEARCH } = model.form
 
-class ArchivedAddressesContainer extends React.PureComponent {
+class ArchivedAddressesContainer extends React.PureComponent<Props> {
   handleToggleArchived = address => {
     let isArchived = Types.Address.isArchived(address)
     this.props.coreActions.setAddressArchived(address.addr, !isArchived)
@@ -37,6 +37,7 @@ const selectArchived = compose(
 )
 
 const mapStateToProps = state => ({
+  // @ts-ignore
   archivedAddresses: selectArchived(state).toArray(),
   search: formValueSelector(WALLET_TX_SEARCH)(state, 'search')
 })
@@ -45,7 +46,8 @@ const mapDispatchToProps = dispatch => ({
   coreActions: bindActionCreators(actions.core.wallet, dispatch)
 })
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(ArchivedAddressesContainer)
+const connector = connect(mapStateToProps, mapDispatchToProps)
+
+type Props = ConnectedProps<typeof connector>
+
+export default connector(ArchivedAddressesContainer)
diff --git a/...dresses/Btc/ArchivedAddresses/template.js → ...resses/Btc/ArchivedAddresses/template.tsx b/...dresses/Btc/ArchivedAddresses/template.js → ...resses/Btc/ArchivedAddresses/template.tsx
@@ -28,6 +28,7 @@ const Success = ({ archivedAddresses, onToggleArchived, onDelete, search }) => {
         archived
         address={address}
         dataE2e='btcArchivedAddressRow'
+        coin='BTC'
         renderOptions={() => [
           <ClickableText
             size='small'
@@ -68,7 +69,7 @@ const Success = ({ archivedAddresses, onToggleArchived, onDelete, search }) => {
           defaultMessage='Archived addresses are addresses you may not need anymore that are hidden from the main view but still a part of your wallet. You can unarchive them any time.'
         />
       </SettingDescription>
-      <Table dataE2e='btcArchivedAddressesTable'>
+      <Table data-e2e='btcArchivedAddressesTable'>
         <TableHeader>
           <TableCell width='50%'>
             <Text size='13px' weight={500}>

diff --git a/.../Addresses/Btc/ImportedAddresses/index.js → ...Addresses/Btc/ImportedAddresses/index.tsx b/.../Addresses/Btc/ImportedAddresses/index.js → ...Addresses/Btc/ImportedAddresses/index.tsx
@@ -1,36 +1,42 @@
 import { actions, model, selectors } from 'data'
 import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
+import { connect, ConnectedProps } from 'react-redux'
 import { formValueSelector } from 'redux-form'
 import { Remote } from 'blockchain-wallet-v4/src'
 import { values } from 'ramda'
 import ImportedAddresses from './template'
 import React from 'react'
 const { WALLET_TX_SEARCH } = model.form
 
-class ImportedAddressesContainer extends React.Component {
+class ImportedAddressesContainer extends React.Component<Props> {
   shouldComponentUpdate (nextProps) {
     return !Remote.Loading.is(nextProps.data)
   }
 
   handleClickImport = () => {
-    this.props.modalActions.showModal('ImportBtcAddress')
+    this.props.modalActions.showModal('ImportBtcAddress', {
+      origin: 'SettingsPage'
+    })
   }
 
   handleClickVerify = () => {
-    this.props.modalActions.showModal('VerifyMessage')
+    this.props.modalActions.showModal('VerifyMessage', {
+      origin: 'SettingsPage'
+    })
   }
 
   handleShowPriv = address => {
     this.props.modalActions.showModal('ShowBtcPrivateKey', {
       addr: address.addr,
-      balance: address.info.final_balance
+      balance: address.info.final_balance,
+      origin: 'SettingsPage'
     })
   }
 
   handleSignMessage = address => {
     this.props.modalActions.showModal('SignMessage', {
-      address: address.addr
+      address: address.addr,
+      origin: 'SettingsPage'
     })
   }
 
@@ -46,7 +52,8 @@ class ImportedAddressesContainer extends React.Component {
   handleTransferAll = () => {
     this.props.modalActions.showModal(model.components.sendBtc.MODAL, {
       from: 'allImportedAddresses',
-      excludeHDWallets: true
+      excludeHDWallets: true,
+      origin: 'SettingsPage'
     })
   }
 
@@ -73,6 +80,7 @@ class ImportedAddressesContainer extends React.Component {
           onClickImport={this.handleClickImport}
           onClickVerify={this.handleClickVerify}
           search={search && search.toLowerCase()}
+          onShowPriv={this.handleShowPriv}
           onToggleArchived={this.handleToggleArchived}
           onTransferAll={this.handleTransferAll}
           onShowSignMessage={this.handleSignMessage}
@@ -100,7 +108,8 @@ const mapDispatchToProps = dispatch => ({
   )
 })
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(ImportedAddressesContainer)
+const connector = connect(mapStateToProps, mapDispatchToProps)
+
+type Props = ConnectedProps<typeof connector>
+
+export default connector(ImportedAddressesContainer)
diff --git a/...dresses/Btc/ImportedAddresses/template.js → ...resses/Btc/ImportedAddresses/template.tsx b/...dresses/Btc/ImportedAddresses/template.js → ...resses/Btc/ImportedAddresses/template.tsx
@@ -51,12 +51,24 @@ const Success = ({
   onEditLabel,
   search,
   failure
+}: {
+  failure?: any
+  importedAddresses: any
+  onClickImport: any
+  onClickVerify: any
+  onEditLabel: any
+  onShowPriv: any
+  onShowSignMessage: any
+  onToggleArchived: any
+  onTransferAll: any
+  search: any
 }) => {
   const isMatch = address =>
     !search || address.addr.toLowerCase().indexOf(search) > -1
   const importedAddressesTableRows = filter(isMatch, importedAddresses).map(
     address => (
       <AddressRow
+        coin='BTC'
         key={address.addr}
         address={address}
         dataE2e='btcImportedAddressRow'
@@ -73,6 +85,7 @@ const Success = ({
               />
             </ClickableText>
           ].concat(
+            // @ts-ignore
             !address.priv
               ? []
               : [

diff --git a/.../ManageAddresses/UnusedAddresses/index.js → ...ManageAddresses/UnusedAddresses/index.tsx b/.../ManageAddresses/UnusedAddresses/index.js → ...ManageAddresses/UnusedAddresses/index.tsx
@@ -1,9 +1,8 @@
 import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
+import { connect, ConnectedProps } from 'react-redux'
 import { FormattedMessage } from 'react-intl'
 import { formValueSelector } from 'redux-form'
 import { length } from 'ramda'
-import PropTypes from 'prop-types'
 import React from 'react'
 import styled from 'styled-components'
 
@@ -27,7 +26,8 @@ const WalletLabelCell = styled.div`
 const ClickableText = styled(Text)`
   cursor: pointer;
 `
-class UnusedAddressesContainer extends React.PureComponent {
+
+class UnusedAddressesContainer extends React.PureComponent<Props> {
   componentDidMount () {
     this.props.componentActions.fetchUnusedAddresses(this.props.walletIndex)
   }
@@ -52,6 +52,7 @@ class UnusedAddressesContainer extends React.PureComponent {
     }
     const onDeleteLabel = i => {
       modalsActions.showModal('DeleteAddressLabel', {
+        origin: 'SettingsPage',
         accountIdx: account.index,
         walletIdx: walletIndex,
         addressIdx: i
@@ -62,7 +63,10 @@ class UnusedAddressesContainer extends React.PureComponent {
     }
 
     const onShowXPub = () => {
-      modalsActions.showModal('ShowXPub', { xpub: account.xpub })
+      modalsActions.showModal('ShowXPub', {
+        xpub: account.xpub,
+        origin: 'SettingsPage'
+      })
     }
 
     const onMakeDefault = () => {
@@ -232,10 +236,6 @@ class UnusedAddressesContainer extends React.PureComponent {
   }
 }
 
-UnusedAddressesContainer.propTypes = {
-  walletIndex: PropTypes.number
-}
-
 const mapStateToProps = (state, ownProps) => {
   const account = Types.Wallet.selectHDAccounts(state.walletPath.wallet).get(
     ownProps.walletIndex
@@ -270,7 +270,8 @@ const mapDispatchToProps = dispatch => ({
   walletActions: bindActionCreators(actions.wallet, dispatch)
 })
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(UnusedAddressesContainer)
+const connector = connect(mapStateToProps, mapDispatchToProps)
+
+type Props = { walletIndex: number } & ConnectedProps<typeof connector>
+
+export default connector(UnusedAddressesContainer)
diff --git a/...nageAddresses/UnusedAddresses/template.js → ...ageAddresses/UnusedAddresses/template.tsx b/...nageAddresses/UnusedAddresses/template.js → ...ageAddresses/UnusedAddresses/template.tsx
@@ -13,17 +13,9 @@ import {
 } from 'blockchain-info-components'
 
 const UnusedAddressesTemplate = ({
-  account,
-  currentReceiveIndex,
   unusedAddresses,
-  isDefault,
-  onGenerateNextAddress,
   onEditLabel,
   onDeleteLabel,
-  onEditBtcAccountLabel,
-  onShowXPub,
-  onMakeDefault,
-  onSetArchived,
   search
 }) => {
   const isMatch = addr =>
@@ -32,7 +24,7 @@ const UnusedAddressesTemplate = ({
     addr.address.toLowerCase().indexOf(search.toLowerCase()) > -1
   const addresses = filter(isMatch, unusedAddresses).map((entry, i) => {
     return (
-      <TableRow key={i} dataE2e='btcUnusedAddressRow'>
+      <TableRow key={i} data-e2e='btcUnusedAddressRow'>
         <TableCell width='40%' style={{ wordBreak: 'break-all' }}>
           <Link
             href={`https://blockchain.info/address/${entry.address}`}