From 6febb187c7241884503cb45df6106fab208ebfca Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Sun, 4 Apr 2021 23:45:24 -0700 Subject: [PATCH 01/46] DDW-595 - Warn user when pasting an address of the same wallet --- .../app/components/wallet/WalletSendForm.js | 76 ++++++++++++++----- .../app/components/wallet/WalletSendForm.scss | 10 +++ .../components/wallet/send-form/messages.js | 5 ++ .../app/containers/wallet/WalletSendPage.js | 4 +- source/renderer/app/i18n/locales/en-US.json | 3 +- source/renderer/app/i18n/locales/ja-JP.json | 3 +- source/renderer/app/stores/WalletsStore.js | 8 ++ .../wallets/send/WalletSend.stories.js | 10 +++ 8 files changed, 97 insertions(+), 22 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 6964fd5b90..539a7728f0 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -67,6 +67,8 @@ type Props = { onOpenDialogAction: Function, onUnsetActiveAssetFingerprint: Function, onExternalLinkClick: Function, + addressFromSameWallet: boolean, + walletName: string, }; type State = { @@ -299,8 +301,9 @@ export default class WalletSendForm extends Component { return receiverField.value.length > 0; }; - hasAssetValue = (asset: Field) => { - return get(asset, 'value', false); + isAddressFromSameWallet = () => { + const { addressFromSameWallet } = this.props; + return this.hasReceiverValue() && addressFromSameWallet; }; isDisabled = () => @@ -672,7 +675,7 @@ export default class WalletSendForm extends Component { selectedAssetFingerprints, isReceiverAddressValid, } = this.state; - const { currencyMaxFractionalDigits, walletAmount } = this.props; + const { currencyMaxFractionalDigits, walletAmount, walletName } = this.props; const { receiver: receiverField, @@ -696,28 +699,63 @@ export default class WalletSendForm extends Component { !this.hasAvailableAssets ? styles.disabled : null, 'primary', ]); + + const receiverFieldClasses = classNames([ + styles.receiverInput, + this.isAddressFromSameWallet() ? styles.sameRecieverInput: null, + ]); + const minAdaRequiredTooltip = selectedAssetFingerprints.length ? messages.minAdaRequiredWithAssetTooltip : messages.minAdaRequiredWithNoAssetTooltip; return (
-
- { - this.addFocusableField(field); - }} - className="receiver" - error={receiverField.error} - onChange={(value) => { - receiverField.onChange(value || ''); - this.setState({ - isResetButtonDisabled: false, - }); - }} - onKeyPress={this.handleSubmitOnEnter} - /> +
+ {this.isAddressFromSameWallet() ? ( + + { + this.addFocusableField(field); + }} + className="receiver" + error={receiverField.error} + onChange={(value) => { + receiverField.onChange(value || ''); + this.setState({ + isResetButtonDisabled: false, + }); + }} + onKeyPress={this.handleSubmitOnEnter} + /> + + ) : ( + { + this.addFocusableField(field); + }} + className="receiver" + error={receiverField.error} + onChange={(value) => { + receiverField.onChange(value || ''); + this.setState({ + isResetButtonDisabled: false, + }); + }} + onKeyPress={this.handleSubmitOnEnter} + /> + )} {this.hasReceiverValue() && (
{ hardwareWallets, assets: assetsStore, } = this.props.stores; - const { isValidAddress } = wallets; + const { isValidAddress, isAddressFromSameWallet } = wallets; const { validateAmount } = transactions; const { hwDeviceStatus } = hardwareWallets; const hasAssetsEnabled = WALLET_ASSETS_ENABLED; @@ -167,6 +167,7 @@ export default class WalletSendPage extends Component { }) } walletAmount={wallet.amount} + walletName={wallet.name} validateAmount={validateAmount} addressValidator={isValidAddress} assets={walletAssets} @@ -182,6 +183,7 @@ export default class WalletSendPage extends Component { } onUnsetActiveAssetFingerprint={this.handleUnsetActiveAssetFingerprint} onExternalLinkClick={app.openExternalLink} + addressFromSameWallet={isAddressFromSameWallet} /> ); } diff --git a/source/renderer/app/i18n/locales/en-US.json b/source/renderer/app/i18n/locales/en-US.json index 9fc25bdda8..8f7f3e004d 100755 --- a/source/renderer/app/i18n/locales/en-US.json +++ b/source/renderer/app/i18n/locales/en-US.json @@ -958,6 +958,7 @@ "wallet.send.form.receiver.label": "Receiver", "wallet.send.form.receiver.placeholder": "Paste an address", "wallet.send.form.reset": "Reset", + "wallet.send.form.sameWalletLabel": "This address belongs to your {walletName} wallet. No assets will be transferred, but fee will be charged", "wallet.send.form.send": "Send", "wallet.send.form.syncingTransactionsMessage": "The balance and transaction history of this wallet is being synced with the blockchain.", "wallet.send.form.syncingWallet": "syncing", @@ -1186,4 +1187,4 @@ "widgets.assetToken.item.name": "Name", "widgets.assetToken.item.policyId": "Policy Id", "widgets.assetToken.item.ticker": "Ticker" -} \ No newline at end of file +} diff --git a/source/renderer/app/i18n/locales/ja-JP.json b/source/renderer/app/i18n/locales/ja-JP.json index e3b4b88949..a5ba0222fe 100755 --- a/source/renderer/app/i18n/locales/ja-JP.json +++ b/source/renderer/app/i18n/locales/ja-JP.json @@ -958,6 +958,7 @@ "wallet.send.form.receiver.label": "送金先", "wallet.send.form.receiver.placeholder": "アドレスを貼り付け", "wallet.send.form.reset": "リセット", + "wallet.send.form.sameWalletLabel": "このアドレスはあなたのものです{walletName}財布。資産は譲渡されませんが、手数料がかかります", "wallet.send.form.send": "送信", "wallet.send.form.syncingTransactionsMessage": "ウォレットの残高とトランザクション履歴は現在ブロックチェーンと同期中です。", "wallet.send.form.syncingWallet": "同期", @@ -1186,4 +1187,4 @@ "widgets.assetToken.item.name": "名称", "widgets.assetToken.item.policyId": "ポリシーID", "widgets.assetToken.item.ticker": "ティッカー" -} \ No newline at end of file +} diff --git a/source/renderer/app/stores/WalletsStore.js b/source/renderer/app/stores/WalletsStore.js index c716682835..dc58bf4dbe 100644 --- a/source/renderer/app/stores/WalletsStore.js +++ b/source/renderer/app/stores/WalletsStore.js @@ -76,6 +76,8 @@ export default class WalletsStore extends Store { @observable undelegateWalletSubmissionSuccess: ?boolean = null; + @observable isAddressFromSameWallet: boolean = false; + // REQUESTS @observable walletsRequest: Request> = new Request( this.api.ada.getWallets @@ -1107,6 +1109,10 @@ export default class WalletsStore extends Store { if (response === 'Invalid') { return false; } + runInAction('check if address is from the same wallet', () => { + const walletAddresses = this.stores.addresses.all.slice().map(addr => addr.id); + this.isAddressFromSameWallet = !!walletAddresses.filter(addr => addr === address).length; + }); return ( validAddressStyles.includes(response.introspection.address_style) && ((Array.isArray(expectedNetworkTag) && @@ -1174,6 +1180,7 @@ export default class WalletsStore extends Store { this.walletsRequest.reset(); this.stores.addresses.addressesRequests = []; this.stores.transactions.transactionsRequests = []; + this.isAddressFromSameWallet = false; }; @action _importWalletFromFile = async ( @@ -1239,6 +1246,7 @@ export default class WalletsStore extends Store { // Active wallet has been updated if (this.active && newActiveWallet) this.active.update(newActiveWallet); } + this.isAddressFromSameWallet = false; } }; diff --git a/storybook/stories/wallets/send/WalletSend.stories.js b/storybook/stories/wallets/send/WalletSend.stories.js index d0e58fd57b..1e1d2978a1 100644 --- a/storybook/stories/wallets/send/WalletSend.stories.js +++ b/storybook/stories/wallets/send/WalletSend.stories.js @@ -206,6 +206,7 @@ storiesOf('Wallets|Send', module) validateAmount={promise(true)} calculateTransactionFee={promise(true)} walletAmount={new BigNumber(123)} + walletName={'Test wallet'} assets={sendFormAssetData} addressValidator={() => true} onOpenDialogAction={action('onOpenDialogAction')} @@ -218,6 +219,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} + addressFromSameWallet={boolean('addressFromSameWallet', false)} /> )) .add('Send - Hardware wallet verifying transaction', () => ( @@ -234,6 +236,7 @@ storiesOf('Wallets|Send', module) isDialogOpen={() => boolean('isDialogOpen', false)} isRestoreActive={boolean('isRestoreActive', false)} walletAmount={new BigNumber(123)} + walletName={'Test wallet'} hwDeviceStatus={HwDeviceStatuses.VERIFYING_TRANSACTION} isHardwareWallet={boolean('isHardwareWallet', true)} isLoadingAssets={boolean('isLoadingAssets', false)} @@ -241,6 +244,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} + addressFromSameWallet={boolean('addressFromSameWallet', false)} /> )) .add('Send - Hardware wallet verifying transaction succeeded', () => ( @@ -257,6 +261,7 @@ storiesOf('Wallets|Send', module) isDialogOpen={() => boolean('isDialogOpen', false)} isRestoreActive={boolean('isRestoreActive', false)} walletAmount={new BigNumber(123)} + walletName={'Test wallet'} hwDeviceStatus={HwDeviceStatuses.VERIFYING_TRANSACTION_SUCCEEDED} isHardwareWallet={boolean('isHardwareWallet', true)} isLoadingAssets={boolean('isLoadingAssets', false)} @@ -264,6 +269,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} + addressFromSameWallet={boolean('addressFromSameWallet', false)} /> )) .add('Send - Hardware wallet verifying transaction failed', () => ( @@ -280,6 +286,7 @@ storiesOf('Wallets|Send', module) isDialogOpen={() => boolean('isDialogOpen', false)} isRestoreActive={boolean('isRestoreActive', false)} walletAmount={new BigNumber(123)} + walletName={'Test wallet'} hwDeviceStatus={HwDeviceStatuses.VERIFYING_TRANSACTION_FAILED} isHardwareWallet={boolean('isHardwareWallet', true)} isLoadingAssets={boolean('isLoadingAssets', false)} @@ -287,6 +294,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} + addressFromSameWallet={boolean('addressFromSameWallet', false)} /> )) .add('Send - With Assets', () => ( @@ -309,10 +317,12 @@ storiesOf('Wallets|Send', module) isLoadingAssets={boolean('isLoadingAssets', false)} assets={sendFormAssetData} walletAmount={new BigNumber(123)} + walletName={'Test wallet'} onExternalLinkClick={action('onExternalLinkClick')} hasAssets={boolean('hasAssets', true)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} + addressFromSameWallet={boolean('addressFromSameWallet', false)} /> )) .add('Wallet Send Confirmation Dialog With Assets', () => ( From ff47b5e000bb4c95ded95f23ca21672b95ec13e2 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Sun, 4 Apr 2021 23:51:19 -0700 Subject: [PATCH 02/46] DDW-595 - Warn user when pasting an address of the same wallet - prettier, linter --- .../app/components/wallet/WalletSendForm.js | 11 ++- .../app/components/wallet/WalletSendForm.scss | 1 - .../components/wallet/send-form/messages.js | 3 +- .../app/i18n/locales/defaultMessages.json | 74 +++++++++++-------- source/renderer/app/i18n/locales/en-US.json | 2 +- source/renderer/app/i18n/locales/ja-JP.json | 2 +- source/renderer/app/stores/WalletsStore.js | 8 +- 7 files changed, 62 insertions(+), 39 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 539a7728f0..57ae096729 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -675,7 +675,11 @@ export default class WalletSendForm extends Component { selectedAssetFingerprints, isReceiverAddressValid, } = this.state; - const { currencyMaxFractionalDigits, walletAmount, walletName } = this.props; + const { + currencyMaxFractionalDigits, + walletAmount, + walletName, + } = this.props; const { receiver: receiverField, @@ -702,7 +706,7 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.isAddressFromSameWallet() ? styles.sameRecieverInput: null, + this.isAddressFromSameWallet() ? styles.sameRecieverInput : null, ]); const minAdaRequiredTooltip = selectedAssetFingerprints.length @@ -719,7 +723,8 @@ export default class WalletSendForm extends Component { })} contentClassName={styles.sameWalletTooltipContent} themeVariables={{ - '--rp-pop-over-bg-color': 'var(--rp-password-input-warning-score-color)', + '--rp-pop-over-bg-color': + 'var(--rp-password-input-warning-score-color)', }} placement="bottom" > diff --git a/source/renderer/app/components/wallet/WalletSendForm.scss b/source/renderer/app/components/wallet/WalletSendForm.scss index 68a7c1399e..8e3ddb8661 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.scss +++ b/source/renderer/app/components/wallet/WalletSendForm.scss @@ -325,5 +325,4 @@ } .sameWalletTooltipContent { - } diff --git a/source/renderer/app/components/wallet/send-form/messages.js b/source/renderer/app/components/wallet/send-form/messages.js index a8003f957d..f9cc9ff33c 100644 --- a/source/renderer/app/components/wallet/send-form/messages.js +++ b/source/renderer/app/components/wallet/send-form/messages.js @@ -46,7 +46,8 @@ export default defineMessages({ }, sameWalletLabel: { id: 'wallet.send.form.sameWalletLabel', - defaultMessage: '!!!This address belongs to your {walletName} wallet. No assets will be transferred, but fee will be charged', + defaultMessage: + '!!!This address belongs to your {walletName} wallet. No assets will be transferred, but fee will be charged', description: 'Label for the same wallet tooltip in the wallet send form.', }, addAssetButtonLabel: { diff --git a/source/renderer/app/i18n/locales/defaultMessages.json b/source/renderer/app/i18n/locales/defaultMessages.json index 25147eb790..92be925834 100644 --- a/source/renderer/app/i18n/locales/defaultMessages.json +++ b/source/renderer/app/i18n/locales/defaultMessages.json @@ -10249,18 +10249,32 @@ "line": 42 } }, + { + "defaultMessage": "!!!This address belongs to your {walletName} wallet. No assets will be transferred, but fee will be charged", + "description": "Label for the same wallet tooltip in the wallet send form.", + "end": { + "column": 3, + "line": 51 + }, + "file": "source/renderer/app/components/wallet/send-form/messages.js", + "id": "wallet.send.form.sameWalletLabel", + "start": { + "column": 19, + "line": 47 + } + }, { "defaultMessage": "!!!+ Add a token", "description": "Label for the \"+ Add a token\" button in the wallet send form.", "end": { "column": 3, - "line": 52 + "line": 57 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.button.addAssetButtonLabel", "start": { "column": 23, - "line": 47 + "line": 52 } }, { @@ -10268,13 +10282,13 @@ "description": "Label for the \"Estimated fees\" number input in the wallet send form.", "end": { "column": 3, - "line": 58 + "line": 63 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.estimatedFee.label", "start": { "column": 21, - "line": 53 + "line": 58 } }, { @@ -10282,13 +10296,13 @@ "description": "Label for the \"of\" max ADA value in the wallet send form.", "end": { "column": 3, - "line": 63 + "line": 68 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.of.label", "start": { "column": 11, - "line": 59 + "line": 64 } }, { @@ -10296,13 +10310,13 @@ "description": "Label for the min ADA required value in the wallet send form.", "end": { "column": 3, - "line": 69 + "line": 74 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.minAdaRequired", "start": { "column": 18, - "line": 64 + "line": 69 } }, { @@ -10310,13 +10324,13 @@ "description": "Tooltip for the min ADA required value in the wallet send form.", "end": { "column": 3, - "line": 76 + "line": 81 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.minAdaRequiredWithAssetTooltip", "start": { "column": 34, - "line": 70 + "line": 75 } }, { @@ -10324,13 +10338,13 @@ "description": "Tooltip for the min ADA required value in the wallet send form.", "end": { "column": 3, - "line": 83 + "line": 88 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.minAdaRequiredWithNoAssetTooltip", "start": { "column": 36, - "line": 77 + "line": 82 } }, { @@ -10338,13 +10352,13 @@ "description": "Label for the \"description\" text area in the wallet send form.", "end": { "column": 3, - "line": 89 + "line": 94 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.description.label", "start": { "column": 20, - "line": 84 + "line": 89 } }, { @@ -10352,13 +10366,13 @@ "description": "Hint in the \"description\" text area in the wallet send form.", "end": { "column": 3, - "line": 94 + "line": 99 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.description.hint", "start": { "column": 19, - "line": 90 + "line": 95 } }, { @@ -10366,13 +10380,13 @@ "description": "Label for the reset button on the wallet send form.", "end": { "column": 3, - "line": 99 + "line": 104 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.reset", "start": { "column": 20, - "line": 95 + "line": 100 } }, { @@ -10380,13 +10394,13 @@ "description": "Label for the send button on the wallet send form.", "end": { "column": 3, - "line": 104 + "line": 109 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.send", "start": { "column": 19, - "line": 100 + "line": 105 } }, { @@ -10394,13 +10408,13 @@ "description": "Error message shown when invalid amount was entered.", "end": { "column": 3, - "line": 109 + "line": 114 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.errors.invalidAmount", "start": { "column": 17, - "line": 105 + "line": 110 } }, { @@ -10408,13 +10422,13 @@ "description": "Error message shown when invalid transaction title was entered.", "end": { "column": 3, - "line": 115 + "line": 120 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.errors.invalidTitle", "start": { "column": 16, - "line": 110 + "line": 115 } }, { @@ -10422,13 +10436,13 @@ "description": "Syncing transactions message shown during async wallet restore in the wallet send form.", "end": { "column": 3, - "line": 122 + "line": 127 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.syncingTransactionsMessage", "start": { "column": 30, - "line": 116 + "line": 121 } }, { @@ -10436,13 +10450,13 @@ "description": "Label for the \"Calculating fees\" message for amount input field.", "end": { "column": 3, - "line": 128 + "line": 133 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.calculatingFeesLabel", "start": { "column": 24, - "line": 123 + "line": 128 } }, { @@ -10450,13 +10464,13 @@ "description": "Syncing wallet label on the send tokens form.", "end": { "column": 3, - "line": 133 + "line": 138 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.syncingWallet", "start": { "column": 17, - "line": 129 + "line": 134 } } ], diff --git a/source/renderer/app/i18n/locales/en-US.json b/source/renderer/app/i18n/locales/en-US.json index 8f7f3e004d..5c0d89f040 100755 --- a/source/renderer/app/i18n/locales/en-US.json +++ b/source/renderer/app/i18n/locales/en-US.json @@ -1187,4 +1187,4 @@ "widgets.assetToken.item.name": "Name", "widgets.assetToken.item.policyId": "Policy Id", "widgets.assetToken.item.ticker": "Ticker" -} +} \ No newline at end of file diff --git a/source/renderer/app/i18n/locales/ja-JP.json b/source/renderer/app/i18n/locales/ja-JP.json index a5ba0222fe..ae422d1623 100755 --- a/source/renderer/app/i18n/locales/ja-JP.json +++ b/source/renderer/app/i18n/locales/ja-JP.json @@ -1187,4 +1187,4 @@ "widgets.assetToken.item.name": "名称", "widgets.assetToken.item.policyId": "ポリシーID", "widgets.assetToken.item.ticker": "ティッカー" -} +} \ No newline at end of file diff --git a/source/renderer/app/stores/WalletsStore.js b/source/renderer/app/stores/WalletsStore.js index dc58bf4dbe..0bdfb49731 100644 --- a/source/renderer/app/stores/WalletsStore.js +++ b/source/renderer/app/stores/WalletsStore.js @@ -1110,8 +1110,12 @@ export default class WalletsStore extends Store { return false; } runInAction('check if address is from the same wallet', () => { - const walletAddresses = this.stores.addresses.all.slice().map(addr => addr.id); - this.isAddressFromSameWallet = !!walletAddresses.filter(addr => addr === address).length; + const walletAddresses = this.stores.addresses.all + .slice() + .map((addr) => addr.id); + this.isAddressFromSameWallet = !!walletAddresses.filter( + (addr) => addr === address + ).length; }); return ( validAddressStyles.includes(response.introspection.address_style) && From e5bbe15483c6ed22d1ed5ec1736f42b9964ef3cc Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Sun, 4 Apr 2021 23:55:36 -0700 Subject: [PATCH 03/46] DDW-595 - Warn user when pasting an address of the same wallet - changelog --- CHANGELOG.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1ac2914835..5bb14ab0d8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,10 @@ Changelog ## vNext +### Features + +- Added warning message when pasting an address of the same wallet in the send form ([PR 2506](https://github.com/input-output-hk/daedalus/pull/2506)) + ### Chores - Updates Catalyst Fund4 dates ([PR 2495](https://github.com/input-output-hk/daedalus/pull/2495)) From 06d83effefda492a325a449f94d25d3618583c29 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Mon, 5 Apr 2021 08:38:08 -0700 Subject: [PATCH 04/46] DDW-595 - Warn user when pasting an address of the same wallet - fixing tooltip show/hide --- source/renderer/app/stores/WalletsStore.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/renderer/app/stores/WalletsStore.js b/source/renderer/app/stores/WalletsStore.js index 0bdfb49731..f35d1aeb77 100644 --- a/source/renderer/app/stores/WalletsStore.js +++ b/source/renderer/app/stores/WalletsStore.js @@ -1250,7 +1250,6 @@ export default class WalletsStore extends Store { // Active wallet has been updated if (this.active && newActiveWallet) this.active.update(newActiveWallet); } - this.isAddressFromSameWallet = false; } }; @@ -1267,6 +1266,7 @@ export default class WalletsStore extends Store { matchRoute(ROUTES.WALLETS.SEND, buildRoute(options.route, options.params)) ) { this.sendMoneyRequest.reset(); + this.isAddressFromSameWallet = false; } }; From ce73b9ddf386c1fb41f24191ea840911931b9efd Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Tue, 6 Apr 2021 08:35:30 -0700 Subject: [PATCH 05/46] DDW-595 - Warn user when pasting an address of the same wallet - linter update --- .../app/i18n/locales/defaultMessages.json | 62 +++++++++---------- 1 file changed, 31 insertions(+), 31 deletions(-) diff --git a/source/renderer/app/i18n/locales/defaultMessages.json b/source/renderer/app/i18n/locales/defaultMessages.json index 92be925834..8c6bd0b608 100644 --- a/source/renderer/app/i18n/locales/defaultMessages.json +++ b/source/renderer/app/i18n/locales/defaultMessages.json @@ -10254,7 +10254,7 @@ "description": "Label for the same wallet tooltip in the wallet send form.", "end": { "column": 3, - "line": 51 + "line": 52 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.sameWalletLabel", @@ -10268,13 +10268,13 @@ "description": "Label for the \"+ Add a token\" button in the wallet send form.", "end": { "column": 3, - "line": 57 + "line": 58 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.button.addAssetButtonLabel", "start": { "column": 23, - "line": 52 + "line": 53 } }, { @@ -10282,13 +10282,13 @@ "description": "Label for the \"Estimated fees\" number input in the wallet send form.", "end": { "column": 3, - "line": 63 + "line": 64 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.estimatedFee.label", "start": { "column": 21, - "line": 58 + "line": 59 } }, { @@ -10296,13 +10296,13 @@ "description": "Label for the \"of\" max ADA value in the wallet send form.", "end": { "column": 3, - "line": 68 + "line": 69 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.of.label", "start": { "column": 11, - "line": 64 + "line": 65 } }, { @@ -10310,13 +10310,13 @@ "description": "Label for the min ADA required value in the wallet send form.", "end": { "column": 3, - "line": 74 + "line": 75 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.minAdaRequired", "start": { "column": 18, - "line": 69 + "line": 70 } }, { @@ -10324,13 +10324,13 @@ "description": "Tooltip for the min ADA required value in the wallet send form.", "end": { "column": 3, - "line": 81 + "line": 82 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.minAdaRequiredWithAssetTooltip", "start": { "column": 34, - "line": 75 + "line": 76 } }, { @@ -10338,13 +10338,13 @@ "description": "Tooltip for the min ADA required value in the wallet send form.", "end": { "column": 3, - "line": 88 + "line": 89 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.minAdaRequiredWithNoAssetTooltip", "start": { "column": 36, - "line": 82 + "line": 83 } }, { @@ -10352,13 +10352,13 @@ "description": "Label for the \"description\" text area in the wallet send form.", "end": { "column": 3, - "line": 94 + "line": 95 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.description.label", "start": { "column": 20, - "line": 89 + "line": 90 } }, { @@ -10366,13 +10366,13 @@ "description": "Hint in the \"description\" text area in the wallet send form.", "end": { "column": 3, - "line": 99 + "line": 100 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.description.hint", "start": { "column": 19, - "line": 95 + "line": 96 } }, { @@ -10380,13 +10380,13 @@ "description": "Label for the reset button on the wallet send form.", "end": { "column": 3, - "line": 104 + "line": 105 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.reset", "start": { "column": 20, - "line": 100 + "line": 101 } }, { @@ -10394,13 +10394,13 @@ "description": "Label for the send button on the wallet send form.", "end": { "column": 3, - "line": 109 + "line": 110 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.send", "start": { "column": 19, - "line": 105 + "line": 106 } }, { @@ -10408,13 +10408,13 @@ "description": "Error message shown when invalid amount was entered.", "end": { "column": 3, - "line": 114 + "line": 115 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.errors.invalidAmount", "start": { "column": 17, - "line": 110 + "line": 111 } }, { @@ -10422,13 +10422,13 @@ "description": "Error message shown when invalid transaction title was entered.", "end": { "column": 3, - "line": 120 + "line": 121 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.errors.invalidTitle", "start": { "column": 16, - "line": 115 + "line": 116 } }, { @@ -10436,13 +10436,13 @@ "description": "Syncing transactions message shown during async wallet restore in the wallet send form.", "end": { "column": 3, - "line": 127 + "line": 128 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.syncingTransactionsMessage", "start": { "column": 30, - "line": 121 + "line": 122 } }, { @@ -10450,13 +10450,13 @@ "description": "Label for the \"Calculating fees\" message for amount input field.", "end": { "column": 3, - "line": 133 + "line": 134 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.calculatingFeesLabel", "start": { "column": 24, - "line": 128 + "line": 129 } }, { @@ -10464,13 +10464,13 @@ "description": "Syncing wallet label on the send tokens form.", "end": { "column": 3, - "line": 138 + "line": 139 }, "file": "source/renderer/app/components/wallet/send-form/messages.js", "id": "wallet.send.form.syncingWallet", "start": { "column": 17, - "line": 134 + "line": 135 } } ], From 0008d25e6441b28f5abb5cf1e7626e8883e452b9 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Tue, 6 Apr 2021 09:42:44 -0700 Subject: [PATCH 06/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes for receiver input field --- .../app/components/wallet/WalletSendForm.js | 111 +++++++++++------- 1 file changed, 66 insertions(+), 45 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 57ae096729..9e8dc42646 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -666,6 +666,71 @@ export default class WalletSendForm extends Component { this.resetTransactionFee(); }; + renderReceiverInputField = (): Node => { + const { intl } = this.context; + const { + formFields, + } = this.state; + + const { + walletName, + } = this.props; + + const { + receiver: receiverField, + } = formFields.receiver; + + return ( + <> + {this.isAddressFromSameWallet() ? ( + + { + this.addFocusableField(field); + }} + className="receiver" + error={receiverField.error} + onChange={(value) => { + receiverField.onChange(value || ''); + this.setState({ + isResetButtonDisabled: false, + }); + }} + onKeyPress={this.handleSubmitOnEnter} + /> + + ) : ( + { + this.addFocusableField(field); + }} + className="receiver" + error={receiverField.error} + onChange={(value) => { + receiverField.onChange(value || ''); + this.setState({ + isResetButtonDisabled: false, + }); + }} + onKeyPress={this.handleSubmitOnEnter} + /> + )} + + ); + }; + renderReceiverRow = (): Node => { const { intl } = this.context; const { @@ -716,51 +781,7 @@ export default class WalletSendForm extends Component { return (
- {this.isAddressFromSameWallet() ? ( - - { - this.addFocusableField(field); - }} - className="receiver" - error={receiverField.error} - onChange={(value) => { - receiverField.onChange(value || ''); - this.setState({ - isResetButtonDisabled: false, - }); - }} - onKeyPress={this.handleSubmitOnEnter} - /> - - ) : ( - { - this.addFocusableField(field); - }} - className="receiver" - error={receiverField.error} - onChange={(value) => { - receiverField.onChange(value || ''); - this.setState({ - isResetButtonDisabled: false, - }); - }} - onKeyPress={this.handleSubmitOnEnter} - /> - )} + {this.renderReceiverInputField()} {this.hasReceiverValue() && (
Date: Tue, 6 Apr 2021 09:47:44 -0700 Subject: [PATCH 07/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes for receiver input field --- source/renderer/app/components/wallet/WalletSendForm.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 9e8dc42646..eba2132224 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -303,7 +303,8 @@ export default class WalletSendForm extends Component { isAddressFromSameWallet = () => { const { addressFromSameWallet } = this.props; - return this.hasReceiverValue() && addressFromSameWallet; + const receiverField = this.form.$('receiver'); + return this.hasReceiverValue() && addressFromSameWallet && !receiverField.error; }; isDisabled = () => @@ -743,11 +744,9 @@ export default class WalletSendForm extends Component { const { currencyMaxFractionalDigits, walletAmount, - walletName, } = this.props; const { - receiver: receiverField, adaAmount: adaAmountField, assetFields, assetsDropdown, From 7c49f7ba4359eee4f3a0c00a715459def25dc68e Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Tue, 6 Apr 2021 18:05:35 -0700 Subject: [PATCH 08/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes for receiver input field - validity --- source/renderer/app/components/wallet/WalletSendForm.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index eba2132224..70378653b5 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -304,7 +304,7 @@ export default class WalletSendForm extends Component { isAddressFromSameWallet = () => { const { addressFromSameWallet } = this.props; const receiverField = this.form.$('receiver'); - return this.hasReceiverValue() && addressFromSameWallet && !receiverField.error; + return this.hasReceiverValue() && addressFromSameWallet && receiverField.isValid && !receiverField.error; }; isDisabled = () => From 736bf7b95e279710a0b7bb9666d96c51d8de2632 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Wed, 7 Apr 2021 10:19:11 -0700 Subject: [PATCH 09/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes for receiver input field focus with tooltip --- .../app/components/wallet/WalletSendForm.js | 31 ++++++++++++++++++- 1 file changed, 30 insertions(+), 1 deletion(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 70378653b5..72ef36efa9 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -744,10 +744,12 @@ export default class WalletSendForm extends Component { const { currencyMaxFractionalDigits, walletAmount, + walletName, } = this.props; const { adaAmount: adaAmountField, + receiver: receiverField, assetFields, assetsDropdown, } = formFields.receiver; @@ -780,7 +782,34 @@ export default class WalletSendForm extends Component { return (
- {this.renderReceiverInputField()} + + { + this.addFocusableField(field); + }} + className="receiver" + error={receiverField.error} + onChange={(value) => { + receiverField.onChange(value || ''); + this.setState({ + isResetButtonDisabled: false, + }); + }} + onKeyPress={this.handleSubmitOnEnter} + /> + {this.hasReceiverValue() && (
Date: Wed, 7 Apr 2021 10:21:00 -0700 Subject: [PATCH 10/46] DDW-595 - Warn user when pasting an address of the same wallet - prettier --- .../app/components/wallet/WalletSendForm.js | 72 ++----------------- 1 file changed, 6 insertions(+), 66 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 72ef36efa9..cb7bf79115 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -304,7 +304,12 @@ export default class WalletSendForm extends Component { isAddressFromSameWallet = () => { const { addressFromSameWallet } = this.props; const receiverField = this.form.$('receiver'); - return this.hasReceiverValue() && addressFromSameWallet && receiverField.isValid && !receiverField.error; + return ( + this.hasReceiverValue() && + addressFromSameWallet && + receiverField.isValid && + !receiverField.error + ); }; isDisabled = () => @@ -667,71 +672,6 @@ export default class WalletSendForm extends Component { this.resetTransactionFee(); }; - renderReceiverInputField = (): Node => { - const { intl } = this.context; - const { - formFields, - } = this.state; - - const { - walletName, - } = this.props; - - const { - receiver: receiverField, - } = formFields.receiver; - - return ( - <> - {this.isAddressFromSameWallet() ? ( - - { - this.addFocusableField(field); - }} - className="receiver" - error={receiverField.error} - onChange={(value) => { - receiverField.onChange(value || ''); - this.setState({ - isResetButtonDisabled: false, - }); - }} - onKeyPress={this.handleSubmitOnEnter} - /> - - ) : ( - { - this.addFocusableField(field); - }} - className="receiver" - error={receiverField.error} - onChange={(value) => { - receiverField.onChange(value || ''); - this.setState({ - isResetButtonDisabled: false, - }); - }} - onKeyPress={this.handleSubmitOnEnter} - /> - )} - - ); - }; - renderReceiverRow = (): Node => { const { intl } = this.context; const { From 92efe164fc9fdb130c25dc8f646616c2a8680390 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Mon, 12 Apr 2021 00:22:16 -0700 Subject: [PATCH 11/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes for tooltip show/hide --- source/renderer/app/components/wallet/WalletSendForm.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 0938158cb3..1cbd37b6fb 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -307,6 +307,7 @@ export default class WalletSendForm extends Component { return ( this.hasReceiverValue() && addressFromSameWallet && + receiverField.focused && receiverField.isValid && !receiverField.error ); @@ -730,7 +731,7 @@ export default class WalletSendForm extends Component { content={intl.formatMessage(messages.sameWalletLabel, { walletName, })} - trigger={this.isAddressFromSameWallet() ? 'mouseenter' : 'focus'} + visible={this.isAddressFromSameWallet()} contentClassName={styles.sameWalletTooltipContent} themeVariables={{ '--rp-pop-over-bg-color': @@ -813,7 +814,6 @@ export default class WalletSendForm extends Component { error={adaAmountField.error || transactionFeeError} onKeyPress={this.handleSubmitOnEnter} allowSigns={false} - autoFocus />
From 09da13e1a0be6eeb261e3adb453fc0ccfb3e3018 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Tue, 13 Apr 2021 21:19:42 -0700 Subject: [PATCH 12/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes --- source/renderer/app/components/wallet/WalletSendForm.js | 3 +-- source/renderer/app/components/wallet/WalletSendForm.scss | 3 --- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 1cbd37b6fb..fb2679491a 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -308,8 +308,7 @@ export default class WalletSendForm extends Component { this.hasReceiverValue() && addressFromSameWallet && receiverField.focused && - receiverField.isValid && - !receiverField.error + receiverField.isValid ); }; diff --git a/source/renderer/app/components/wallet/WalletSendForm.scss b/source/renderer/app/components/wallet/WalletSendForm.scss index 8e3ddb8661..08c7e02538 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.scss +++ b/source/renderer/app/components/wallet/WalletSendForm.scss @@ -323,6 +323,3 @@ } } } - -.sameWalletTooltipContent { -} From e0de68039787e9a05a6cc643d663b3a29e1285b7 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Tue, 13 Apr 2021 21:31:47 -0700 Subject: [PATCH 13/46] DDW-595 - Warn user when pasting an address of the same wallet - fixes --- source/renderer/app/components/wallet/WalletSendForm.js | 1 - 1 file changed, 1 deletion(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index fb2679491a..cf85bf4e0b 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -307,7 +307,6 @@ export default class WalletSendForm extends Component { return ( this.hasReceiverValue() && addressFromSameWallet && - receiverField.focused && receiverField.isValid ); }; From 1d86032ef569f43b9a52e3e39003153abeb5210b Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Thu, 15 Apr 2021 08:58:45 -0700 Subject: [PATCH 14/46] DDW-595 - Warn user when pasting an address of the same wallet - changelog update --- CHANGELOG.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f9d1a0daa8..21236e34d8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,10 @@ Changelog ## vNext +### Features + +- Added warning message when pasting an address of the same wallet in the send form ([PR 2506](https://github.com/input-output-hk/daedalus/pull/2506)) + ### Fixes - Fixed hardware wallets spending password issue ([PR 2519](https://github.com/input-output-hk/daedalus/pull/2519)) @@ -20,10 +24,6 @@ Changelog - Fixed fee calculation edge cases in wallet send form ([PR 2501](https://github.com/input-output-hk/daedalus/pull/2501)) - Handle empty strings in transaction metadata correctly ([PR 2503](https://github.com/input-output-hk/daedalus/pull/2503)) -### Features - -- Added warning message when pasting an address of the same wallet in the send form ([PR 2506](https://github.com/input-output-hk/daedalus/pull/2506)) - ### Chores - Updated header section styles of delegation rewards screen ([PR 2509](https://github.com/input-output-hk/daedalus/pull/2509)) From 2dc613195af9711eea6bf0fd32fa2d6c353b1a7a Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Thu, 15 Apr 2021 09:08:02 -0700 Subject: [PATCH 15/46] DDW-595 - Warn user when pasting an address of the same wallet - disable autofocus on warning --- source/renderer/app/components/wallet/WalletSendForm.js | 1 + 1 file changed, 1 insertion(+) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index cf85bf4e0b..b3c00b8b3b 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -812,6 +812,7 @@ export default class WalletSendForm extends Component { error={adaAmountField.error || transactionFeeError} onKeyPress={this.handleSubmitOnEnter} allowSigns={false} + autoFocus={!this.isAddressFromSameWallet()} />
From 90c937ef67085fc4d9851ee5a11d893d10b3b977 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Thu, 15 Apr 2021 09:16:52 -0700 Subject: [PATCH 16/46] DDW-595 - Warn user when pasting an address of the same wallet - disable autofocus on warning --- source/renderer/app/components/wallet/WalletSendForm.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index b3c00b8b3b..8c56379438 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -307,6 +307,7 @@ export default class WalletSendForm extends Component { return ( this.hasReceiverValue() && addressFromSameWallet && + receiverField.focused && receiverField.isValid ); }; @@ -688,6 +689,7 @@ export default class WalletSendForm extends Component { currencyMaxFractionalDigits, walletAmount, walletName, + addressFromSameWallet, } = this.props; const { @@ -715,7 +717,10 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.isAddressFromSameWallet() ? styles.sameRecieverInput : null, + this.hasReceiverValue() && + addressFromSameWallet && + receiverField.isValid ? + styles.sameRecieverInput : null, ]); const minAdaRequiredTooltip = selectedAssetFingerprints.length From 71d0f1e5fc42c278c5ee105c46d3f85d25fb8e3d Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Thu, 15 Apr 2021 09:17:15 -0700 Subject: [PATCH 17/46] DDW-595 - Warn user when pasting an address of the same wallet - prettier fix --- source/renderer/app/components/wallet/WalletSendForm.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 8c56379438..b57752d077 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -717,10 +717,9 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.hasReceiverValue() && - addressFromSameWallet && - receiverField.isValid ? - styles.sameRecieverInput : null, + this.hasReceiverValue() && addressFromSameWallet && receiverField.isValid + ? styles.sameRecieverInput + : null, ]); const minAdaRequiredTooltip = selectedAssetFingerprints.length From 9087dc7d407f2e6a030f0a013f2a579799d2fd02 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Fri, 16 Apr 2021 05:10:05 -0700 Subject: [PATCH 18/46] DDW-595 - Warn user when pasting an address of the same wallet - rename addressFromSameWallet --- .../renderer/app/components/wallet/WalletSendForm.js | 10 +++++----- .../renderer/app/containers/wallet/WalletSendPage.js | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index b57752d077..5e90aa519a 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -67,7 +67,7 @@ type Props = { onOpenDialogAction: Function, onUnsetActiveAssetFingerprint: Function, onExternalLinkClick: Function, - addressFromSameWallet: boolean, + isAddressFromSameWallet: boolean, walletName: string, }; @@ -302,11 +302,11 @@ export default class WalletSendForm extends Component { }; isAddressFromSameWallet = () => { - const { addressFromSameWallet } = this.props; + const { isAddressFromSameWallet } = this.props; const receiverField = this.form.$('receiver'); return ( this.hasReceiverValue() && - addressFromSameWallet && + isAddressFromSameWallet && receiverField.focused && receiverField.isValid ); @@ -689,7 +689,7 @@ export default class WalletSendForm extends Component { currencyMaxFractionalDigits, walletAmount, walletName, - addressFromSameWallet, + isAddressFromSameWallet, } = this.props; const { @@ -717,7 +717,7 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.hasReceiverValue() && addressFromSameWallet && receiverField.isValid + this.hasReceiverValue() && isAddressFromSameWallet && receiverField.isValid ? styles.sameRecieverInput : null, ]); diff --git a/source/renderer/app/containers/wallet/WalletSendPage.js b/source/renderer/app/containers/wallet/WalletSendPage.js index 882905add1..ccf4dcb1ea 100755 --- a/source/renderer/app/containers/wallet/WalletSendPage.js +++ b/source/renderer/app/containers/wallet/WalletSendPage.js @@ -183,7 +183,7 @@ export default class WalletSendPage extends Component { } onUnsetActiveAssetFingerprint={this.handleUnsetActiveAssetFingerprint} onExternalLinkClick={app.openExternalLink} - addressFromSameWallet={isAddressFromSameWallet} + isAddressFromSameWallet={isAddressFromSameWallet} /> ); } From 7ac0d6200f08d60d118cde4350d4a075de4b992b Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Fri, 16 Apr 2021 05:44:21 -0700 Subject: [PATCH 19/46] DDW-595 - Warn user when pasting an address of the same wallet - adding hover state on receiver input field --- source/renderer/app/components/wallet/WalletSendForm.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 5e90aa519a..a0c7eddb04 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -93,6 +93,7 @@ type State = { isResetButtonDisabled: boolean, isReceiverAddressValid: boolean, isTransactionFeeCalculated: boolean, + isHoveringReceiverField: boolean, }; @observer @@ -303,12 +304,13 @@ export default class WalletSendForm extends Component { isAddressFromSameWallet = () => { const { isAddressFromSameWallet } = this.props; + const { isHoveringReceiverField } = this.state; const receiverField = this.form.$('receiver'); return ( this.hasReceiverValue() && isAddressFromSameWallet && - receiverField.focused && - receiverField.isValid + receiverField.isValid && + (receiverField.focused || isHoveringReceiverField) ); }; @@ -755,6 +757,8 @@ export default class WalletSendForm extends Component { }); }} onKeyPress={this.handleSubmitOnEnter} + onMouseEnter={() => this.setState({ isHoveringReceiverField: true })} + onMouseLeave={() => this.setState({ isHoveringReceiverField: false })} /> {this.hasReceiverValue() && ( From 23e9ffd5b0f6035011f219e5703c7ab0a26238cf Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Fri, 16 Apr 2021 06:25:24 -0700 Subject: [PATCH 20/46] DDW-595 - Warn user when pasting an address of the same wallet - flow fixes --- .../renderer/app/components/wallet/WalletSendForm.js | 1 + storybook/stories/wallets/send/WalletSend.stories.js | 10 +++++----- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index a0c7eddb04..b7e2c3d133 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -113,6 +113,7 @@ export default class WalletSendForm extends Component { isResetButtonDisabled: true, isReceiverAddressValid: false, isTransactionFeeCalculated: false, + isHoveringReceiverField: false, }; // We need to track the fee calculation state in order to disable diff --git a/storybook/stories/wallets/send/WalletSend.stories.js b/storybook/stories/wallets/send/WalletSend.stories.js index 1e1d2978a1..6aad4cde5a 100644 --- a/storybook/stories/wallets/send/WalletSend.stories.js +++ b/storybook/stories/wallets/send/WalletSend.stories.js @@ -219,7 +219,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} - addressFromSameWallet={boolean('addressFromSameWallet', false)} + isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)} /> )) .add('Send - Hardware wallet verifying transaction', () => ( @@ -244,7 +244,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} - addressFromSameWallet={boolean('addressFromSameWallet', false)} + isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)} /> )) .add('Send - Hardware wallet verifying transaction succeeded', () => ( @@ -269,7 +269,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} - addressFromSameWallet={boolean('addressFromSameWallet', false)} + isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)} /> )) .add('Send - Hardware wallet verifying transaction failed', () => ( @@ -294,7 +294,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', false)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} - addressFromSameWallet={boolean('addressFromSameWallet', false)} + isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)} /> )) .add('Send - With Assets', () => ( @@ -322,7 +322,7 @@ storiesOf('Wallets|Send', module) hasAssets={boolean('hasAssets', true)} selectedAsset={null} onUnsetActiveAssetFingerprint={() => {}} - addressFromSameWallet={boolean('addressFromSameWallet', false)} + isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)} /> )) .add('Wallet Send Confirmation Dialog With Assets', () => ( From b7164d23e69df9f29c37a6d1370c69a29e448336 Mon Sep 17 00:00:00 2001 From: Dominik Guzei Date: Fri, 16 Apr 2021 21:03:25 +0200 Subject: [PATCH 21/46] [DDW-595] Refactor wallet send form receiver field This updates to the latest react-polymorph release that includes improvements to the Input and FormField components for more flexibility regarding when and how to show error/warning messages in our forms. --- package.json | 2 +- .../app/components/wallet/WalletSendForm.js | 74 +++++++++---------- source/renderer/app/stores/WalletsStore.js | 2 + yarn.lock | 15 +--- 4 files changed, 44 insertions(+), 49 deletions(-) diff --git a/package.json b/package.json index 42c684fe3b..e3d9a8fd89 100644 --- a/package.json +++ b/package.json @@ -233,7 +233,7 @@ "react-intl": "2.7.2", "react-lottie": "1.2.3", "react-markdown": "4.3.1", - "react-polymorph": "0.9.8-rc.11", + "react-polymorph": "0.9.8-rc.19", "react-router": "5.2.0", "react-router-dom": "5.2.0", "react-svg-inline": "2.1.1", diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index b7e2c3d133..648e57df22 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -93,7 +93,6 @@ type State = { isResetButtonDisabled: boolean, isReceiverAddressValid: boolean, isTransactionFeeCalculated: boolean, - isHoveringReceiverField: boolean, }; @observer @@ -113,7 +112,6 @@ export default class WalletSendForm extends Component { isResetButtonDisabled: true, isReceiverAddressValid: false, isTransactionFeeCalculated: false, - isHoveringReceiverField: false, }; // We need to track the fee calculation state in order to disable @@ -203,8 +201,6 @@ export default class WalletSendForm extends Component { } }; - handleSubmitOnEnter = submitOnEnter.bind(this, this.handleOnSubmit); - handleOnSubmit = () => { if (this.isDisabled()) { return false; @@ -214,6 +210,8 @@ export default class WalletSendForm extends Component { }); }; + handleSubmitOnEnter = submitOnEnter.bind(this, this.handleOnSubmit); + handleOnReset = () => { // Cancel all debounced field validations this.form.each((field) => { @@ -305,13 +303,11 @@ export default class WalletSendForm extends Component { isAddressFromSameWallet = () => { const { isAddressFromSameWallet } = this.props; - const { isHoveringReceiverField } = this.state; const receiverField = this.form.$('receiver'); return ( this.hasReceiverValue() && isAddressFromSameWallet && - receiverField.isValid && - (receiverField.focused || isHoveringReceiverField) + receiverField.isValid ); }; @@ -720,7 +716,9 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.hasReceiverValue() && isAddressFromSameWallet && receiverField.isValid + this.hasReceiverValue() && + isAddressFromSameWallet && + receiverField.isValid ? styles.sameRecieverInput : null, ]); @@ -729,39 +727,40 @@ export default class WalletSendForm extends Component { ? messages.minAdaRequiredWithAssetTooltip : messages.minAdaRequiredWithNoAssetTooltip; + const sameWalletError = intl.formatMessage(messages.sameWalletLabel, { + walletName, + }); + let receiverFieldError = receiverField.error; + let receiverFieldThemeVars = {}; + if (this.isAddressFromSameWallet()) { + receiverFieldError = sameWalletError; + receiverFieldThemeVars = { + '--rp-input-border-color-errored': + 'var(--rp-password-input-warning-score-color)', + '--rp-pop-over-bg-color': + 'var(--rp-password-input-warning-score-color)', + }; + } + return (
- { + this.addFocusableField(field); }} - placement="bottom" - > - { - this.addFocusableField(field); - }} - className="receiver" - error={receiverField.error} - onChange={(value) => { - receiverField.onChange(value || ''); - this.setState({ - isResetButtonDisabled: false, - }); - }} - onKeyPress={this.handleSubmitOnEnter} - onMouseEnter={() => this.setState({ isHoveringReceiverField: true })} - onMouseLeave={() => this.setState({ isHoveringReceiverField: false })} - /> - + className="receiver" + error={receiverFieldError} + onChange={(value) => { + receiverField.onChange(value || ''); + this.setState({ + isResetButtonDisabled: false, + }); + }} + onKeyPress={this.handleSubmitOnEnter} + themeVariables={receiverFieldThemeVars} + /> {this.hasReceiverValue() && (
{
From 6c3263950a7c9b3ffa6a15d1cee864e36e97cd1c Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Wed, 28 Apr 2021 16:19:46 +0200 Subject: [PATCH 42/46] DDW-595 - Warn user when pasting an address of the same wallet - new updates for autoFocus --- .../app/components/wallet/WalletSendForm.js | 38 +++++++++---------- .../components/wallet/send-form/AssetInput.js | 3 ++ 2 files changed, 21 insertions(+), 20 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 8f0de61b19..92b4b1d0f0 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -125,6 +125,10 @@ export default class WalletSendForm extends Component { // Read more: https://facebook.github.io/react/blog/2015/12/16/ismounted-antipattern.html _isMounted = false; + // We need to prevent auto focus of ada and token amount fields in case user pastes + // or enters a receiver address which belongs to the same wallet he is sending from. + _isAutoFocusEnabled = true; + componentDidMount() { this._isMounted = true; this.updateFormFields(true); @@ -200,6 +204,8 @@ export default class WalletSendForm extends Component { } }; + handleSubmitOnEnter = submitOnEnter.bind(this, this.handleOnSubmit); + handleOnSubmit = () => { if (this.isDisabled()) { return false; @@ -209,8 +215,6 @@ export default class WalletSendForm extends Component { }); }; - handleSubmitOnEnter = submitOnEnter.bind(this, this.handleOnSubmit); - handleOnReset = () => { // Cancel all debounced field validations this.form.each((field) => { @@ -333,21 +337,18 @@ export default class WalletSendForm extends Component { this.context.intl.formatMessage(messages.fieldIsRequired), ]; } + const isValid = await this.props.addressValidator(value); + + if (this.isAddressFromSameWallet()) { + this._isAutoFocusEnabled = false; + } + this.setReceiverValidity(isValid); + const adaAmountField = form.$('adaAmount'); const isAdaAmountValid = adaAmountField.isValid; - const { selectedAsset } = this.props; - const shouldFocus = !this.isAddressFromSameWallet(); - if (selectedAsset && !shouldFocus) { - const newAsset = `asset_${selectedAsset.fingerprint}`; - const newAssetField = this.form.$(newAsset); - const { name: fieldName } = newAssetField; - const focusableField = this.focusableFields[fieldName]; - if (focusableField && focusableField.inputElement) { - focusableField.inputElement.current.blur(); - } - } + if (isValid && isAdaAmountValid) { this.calculateTransactionFee(); } else { @@ -568,6 +569,7 @@ export default class WalletSendForm extends Component { selectedAssetFingerprints, }); this.resetTransactionFee(); + this._isAutoFocusEnabled = true; }; removeAssetRow = (fingerprint: string) => { @@ -645,7 +647,6 @@ export default class WalletSendForm extends Component { ]; }, ]); - this.form.$(newAsset).focus(); const assetsDropdown = `assetsDropdown_${fingerprint}`; this.form.add({ @@ -696,8 +697,6 @@ export default class WalletSendForm extends Component { const { currencyMaxFractionalDigits, walletAmount, - isAddressFromSameWallet, - selectedAsset, } = this.props; const { @@ -725,9 +724,7 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.hasReceiverValue() && - isAddressFromSameWallet && - receiverField.isValid + this.isAddressFromSameWallet() ? styles.sameRecieverInput : null, ]); @@ -828,7 +825,7 @@ export default class WalletSendForm extends Component { error={adaAmountField.error || transactionFeeError} onKeyPress={this.handleSubmitOnEnter} allowSigns={false} - autoFocus={!this.isAddressFromSameWallet() && !selectedAsset} + autoFocus={this._isAutoFocusEnabled} />
@@ -872,6 +869,7 @@ export default class WalletSendForm extends Component { handleSubmitOnEnter={this.handleSubmitOnEnter} clearAssetFieldValue={this.clearAssetFieldValue} onChangeAsset={this.onChangeAsset} + autoFocus={this._isAutoFocusEnabled} /> ) )} diff --git a/source/renderer/app/components/wallet/send-form/AssetInput.js b/source/renderer/app/components/wallet/send-form/AssetInput.js index 3e012adad6..c9865893b1 100644 --- a/source/renderer/app/components/wallet/send-form/AssetInput.js +++ b/source/renderer/app/components/wallet/send-form/AssetInput.js @@ -37,6 +37,7 @@ type Props = { handleSubmitOnEnter: Function, clearAssetFieldValue: Function, onChangeAsset: Function, + autoFocus: boolean, }; const INPUT_FIELD_PADDING_DELTA = 10; @@ -91,6 +92,7 @@ export default class AssetInput extends Component { handleSubmitOnEnter, clearAssetFieldValue, onChangeAsset, + autoFocus, } = this.props; const asset = getAssetByFingerprint(fingerprint); if (!asset) { @@ -176,6 +178,7 @@ export default class AssetInput extends Component { handleSubmitOnEnter(evt); }} allowSigns={false} + autoFocus={autoFocus} />
{this.hasAssetValue(assetField) && ( From 177374a188d342c33f381974d2f7230297390140 Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Wed, 28 Apr 2021 16:22:55 +0200 Subject: [PATCH 43/46] DDW-595 - Warn user when pasting an address of the same wallet - prettier --- source/renderer/app/components/wallet/WalletSendForm.js | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 92b4b1d0f0..0ea421af43 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -694,10 +694,7 @@ export default class WalletSendForm extends Component { selectedAssetFingerprints, isReceiverAddressValid, } = this.state; - const { - currencyMaxFractionalDigits, - walletAmount, - } = this.props; + const { currencyMaxFractionalDigits, walletAmount } = this.props; const { adaAmount: adaAmountField, @@ -724,9 +721,7 @@ export default class WalletSendForm extends Component { const receiverFieldClasses = classNames([ styles.receiverInput, - this.isAddressFromSameWallet() - ? styles.sameRecieverInput - : null, + this.isAddressFromSameWallet() ? styles.sameRecieverInput : null, ]); const minAdaRequiredTooltip = selectedAssetFingerprints.length From 9e6487be5574f304265f7cdfbab759158e0f26c4 Mon Sep 17 00:00:00 2001 From: Nikola Glumac Date: Wed, 28 Apr 2021 16:58:41 +0200 Subject: [PATCH 44/46] [DDW-595] Code cleanup --- source/renderer/app/components/wallet/WalletSendForm.js | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/source/renderer/app/components/wallet/WalletSendForm.js b/source/renderer/app/components/wallet/WalletSendForm.js index 0ea421af43..121bf02064 100755 --- a/source/renderer/app/components/wallet/WalletSendForm.js +++ b/source/renderer/app/components/wallet/WalletSendForm.js @@ -337,18 +337,13 @@ export default class WalletSendForm extends Component { this.context.intl.formatMessage(messages.fieldIsRequired), ]; } - const isValid = await this.props.addressValidator(value); - - if (this.isAddressFromSameWallet()) { + if (isValid && this.isAddressFromSameWallet()) { this._isAutoFocusEnabled = false; } - this.setReceiverValidity(isValid); - const adaAmountField = form.$('adaAmount'); const isAdaAmountValid = adaAmountField.isValid; - if (isValid && isAdaAmountValid) { this.calculateTransactionFee(); } else { @@ -523,6 +518,7 @@ export default class WalletSendForm extends Component { ); } + this._isCalculatingTransactionFee = false; this.setState({ isTransactionFeeCalculated: false, From 9e4e94cf4af6437c08181a9662edaec4cb1a768e Mon Sep 17 00:00:00 2001 From: Aleksandar Djordjevic Date: Wed, 28 Apr 2021 19:35:55 +0200 Subject: [PATCH 45/46] DDW-595 - Warn user when pasting an address of the same wallet - updates --- .../app/components/widgets/forms/InlineEditingInput.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/source/renderer/app/components/widgets/forms/InlineEditingInput.js b/source/renderer/app/components/widgets/forms/InlineEditingInput.js index 4cbe0d496e..eeb633dad2 100644 --- a/source/renderer/app/components/widgets/forms/InlineEditingInput.js +++ b/source/renderer/app/components/widgets/forms/InlineEditingInput.js @@ -301,9 +301,11 @@ export default class InlineEditingInput extends Component { type="text" maxLength={maxLength} label={label} + onFocus={this.onFocus} + onBlur={this.onBlur} onChange={this.onChange} onKeyDown={(event) => this.handleInputKeyDown(event)} - error={error} + error={isActive ? error : !!error} disabled={disabled} readOnly={readOnly} ref={(input) => { From 94c6d2b3acdc95d7f8dee31426acfb3bec9ce5a4 Mon Sep 17 00:00:00 2001 From: Dominik Guzei Date: Wed, 28 Apr 2021 22:49:30 +0200 Subject: [PATCH 46/46] [DDW-595] Update to react-polymorph release candidate --- package.json | 2 +- yarn.lock | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index e01836bc0a..b0750ad1b5 100644 --- a/package.json +++ b/package.json @@ -234,7 +234,7 @@ "react-intl": "2.7.2", "react-lottie": "1.2.3", "react-markdown": "4.3.1", - "react-polymorph": "0.9.7-next.1", + "react-polymorph": "1.0.0-rc.1", "react-router": "5.2.0", "react-router-dom": "5.2.0", "react-svg-inline": "2.1.1", diff --git a/yarn.lock b/yarn.lock index 7636be9c23..648efb46e5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -12735,9 +12735,9 @@ react-modal@3.1.12: prop-types "^15.5.10" warning "^3.0.0" -react-polymorph@0.9.7-next.1: - version "0.9.7-next.1" - resolved "https://registry.yarnpkg.com/react-polymorph/-/react-polymorph-0.9.7-next.1.tgz#41087c95dab1811432c66501288f672039a75d74" +react-polymorph@1.0.0-rc.1: + version "1.0.0-rc.1" + resolved "https://registry.yarnpkg.com/react-polymorph/-/react-polymorph-1.0.0-rc.1.tgz#666c18bbd2683dc61b617ff2e32a0302f974fa98" dependencies: "@tippyjs/react" "4.2.1" create-react-context "0.2.2"