Merge branch 'develop' into fix/ddw-1007-min-ada

Author: danielmain

CHANGELOG.md

@@ -7,17 +7,19 @@
 - Improved RTS flags splash screen message ([PR 2901](https://github.com/input-output-hk/daedalus/pull/2901))
 - Implemented error message when trying to leave wallet without enough ada to support tokens ([PR 2783](https://github.com/input-output-hk/daedalus/pull/2783))
 
+### Fixes
+
+- Fixed styling of the incentivized testnet rewards wallet dropdown ([PR 2907](https://github.com/input-output-hk/daedalus/pull/2907))
+- Fix warning sign displayed when recommend decimals is zero ([PR 2905](https://github.com/input-output-hk/daedalus/pull/2905))
+- Fixed discrete tooltip being clipped by loading overlay when stake pools are adjusted ([PR 2902](https://github.com/input-output-hk/daedalus/pull/2902))
+- Sets minimum transaction fee to ada input field when tokens are removed ([PR 2918](https://github.com/input-output-hk/daedalus/pull/2918))
+
 ### Chores
 
 - Fixed spelling issues and typos ([PR 2915](https://github.com/input-output-hk/daedalus/pull/2915))
 - Removed SASS ts-lint ignore comments ([PR 2870](https://github.com/input-output-hk/daedalus/pull/2870))
 - Enabled debugging of the main process ([PR 2893](https://github.com/input-output-hk/daedalus/pull/2893))
 
-### Fixes
-
-- Fixed discrete tooltip being clipped by loading overlay when stake pools are adjusted ([PR 2902](https://github.com/input-output-hk/daedalus/pull/2902))
-- Sets minimum transaction fee to ada input field when tokens are removed ([PR 2918](https://github.com/input-output-hk/daedalus/pull/2918))
-
 ## 4.9.0
 
 ### Features

jest.config.js

@@ -89,6 +89,7 @@ module.exports = {
     // Jest does not support WASM imports from ESM modules
     // https://github.com/facebook/jest/issues/9430
     '^@iohk-jormungandr/wallet-js$': 'identity-obj-proxy',
+    'tests/(.*)': '<rootDir>/tests/$1',
   },
 
   // An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader

package.json

@@ -255,7 +255,7 @@
     "react-intl": "2.7.2",
     "react-lottie": "1.2.3",
     "react-markdown": "4.3.1",
-    "react-polymorph": "1.0.2",
+    "react-polymorph": "1.0.3",
     "react-router": "5.2.0",
     "react-router-dom": "5.2.0",
     "react-svg-inline": "2.1.1",

source/renderer/app/components/assets/Asset.tsx

@@ -209,7 +209,9 @@ class Asset extends Component<Props, State> {
               })}
               className={styles.warningIconWrapper}
             >
-              <SVGInline className={styles.warningIcon} svg={warningIcon} />
+              <span data-testid="warning-icon">
+                <SVGInline className={styles.warningIcon} svg={warningIcon} />
+              </span>
             </PopOver>
           </div>
         )}

source/renderer/app/components/assets/AssetSettingsDialog.spec.tsx

@@ -0,0 +1,41 @@
+import '@testing-library/jest-dom';
+
+import React from 'react';
+import noop from 'lodash/noop';
+import { cleanup, screen, waitFor } from '@testing-library/react';
+
+import createTestBed from 'tests/_utils/TestBed';
+import {
+  withDecimalPlacesToken,
+  zeroDecimalPlacesToken,
+} from 'tests/mocks/asset';
+
+import AssetSettingsDialog from './AssetSettingsDialog';
+
+describe('AssetSettingsDialog', () => {
+  afterEach(() => cleanup());
+
+  it('should not show a warning when an asset is set to zero recommended decimal places', async () => {
+    createTestBed(
+      <AssetSettingsDialog
+        asset={zeroDecimalPlacesToken}
+        onSubmit={noop}
+        onCancel={noop}
+      />
+    );
+    await waitFor(() => screen.getByText('Number of decimal places'));
+    expect(screen.queryByTestId('warning-icon')).not.toBeInTheDocument();
+  });
+
+  it('should show a warning when an asset is not set to the recommended decimal places', async () => {
+    createTestBed(
+      <AssetSettingsDialog
+        asset={withDecimalPlacesToken}
+        onSubmit={noop}
+        onCancel={noop}
+      />
+    );
+    await waitFor(() => screen.getByText('Number of decimal places'));
+    expect(screen.queryByTestId('warning-icon')).toBeInTheDocument();
+  });
+});

source/renderer/app/components/assets/AssetSettingsDialog.tsx

@@ -17,6 +17,7 @@ import {
   MAX_DECIMAL_PRECISION,
 } from '../../config/assetsConfig';
 import { DiscreetTokenWalletAmount } from '../../features/discreet-mode';
+import { isRecommendedDecimal } from '../wallet/tokens/wallet-token/helpers';
 
 const messages = defineMessages({
   title: {
@@ -135,7 +136,6 @@ class AssetSettingsDialog extends Component<Props, State> {
     const { decimals: savedDecimals, recommendedDecimals } = asset;
     const { decimals } = this.state;
     const hasSavedDecimals = typeof savedDecimals === 'number';
-    const hasRecommendedDecimals = typeof recommendedDecimals === 'number';
     const options = range(MAX_DECIMAL_PRECISION + 1).map((value) => ({
       value,
     }));
@@ -153,8 +153,12 @@ class AssetSettingsDialog extends Component<Props, State> {
         onClick: () => onSubmit(asset, decimals),
       },
     ];
-    const hasWarning =
-      hasRecommendedDecimals && savedDecimals !== recommendedDecimals;
+
+    const hasWarning = isRecommendedDecimal({
+      recommendedDecimals,
+      decimals: savedDecimals,
+    });
+
     let warningPopOverMessage;
 
     if (hasWarning) {
@@ -209,10 +213,12 @@ class AssetSettingsDialog extends Component<Props, State> {
                       recommendedDecimals,
                     })}
                   >
-                    <SVGInline
-                      className={styles.warningIcon}
-                      svg={warningIcon}
-                    />
+                    <span data-testid="warning-icon">
+                      <SVGInline
+                        className={styles.warningIcon}
+                        svg={warningIcon}
+                      />
+                    </span>
                   </PopOver>
                 )}
               </span>

source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.scss

@@ -38,20 +38,6 @@
     margin-bottom: 17px;
   }
 
-  .walletsDropdown {
-    &.disabled {
-      pointer-events: none;
-      :global {
-        .SelectOverrides_selectInput:after {
-          opacity: 0.5;
-        }
-        .SimpleFormField_inputWrapper {
-          opacity: 0.5;
-        }
-      }
-    }
-  }
-
   .checkbox {
     margin-bottom: 20px;
 

source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx

@@ -142,6 +142,10 @@ type Props = {
   wallets: Array<Wallet>;
 };
 
+type State = {
+  wasRecoveryPhraseValidAtLeastOnce: boolean;
+};
+
 interface FormFields {
   checkboxAcceptance1: string;
   checkboxAcceptance2: string;
@@ -150,14 +154,19 @@ interface FormFields {
 }
 
 @observer
-class Step1ConfigurationDialog extends Component<Props> {
+class Step1ConfigurationDialog extends Component<Props, State> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
   static defaultProps = {
     error: null,
     recoveryPhrase: [],
   };
+
+  state = {
+    wasRecoveryPhraseValidAtLeastOnce: false,
+  };
+
   recoveryPhraseAutocomplete: Autocomplete;
   form = new ReactToolboxMobxForm<FormFields>(
     {
@@ -177,6 +186,16 @@ class Step1ConfigurationDialog extends Component<Props> {
                 this.context.intl.formatMessage(messages.invalidRecoveryPhrase),
               ],
             }),
+          hooks: {
+            onChange: (field) => {
+              if (
+                this.state.wasRecoveryPhraseValidAtLeastOnce === false &&
+                field.isValid
+              ) {
+                this.setState({ wasRecoveryPhraseValidAtLeastOnce: true });
+              }
+            },
+          },
         },
         walletsDropdown: {
           type: 'select',
@@ -276,11 +295,11 @@ class Step1ConfigurationDialog extends Component<Props> {
     const checkboxAcceptance1Field = form.$('checkboxAcceptance1');
     const checkboxAcceptance2Field = form.$('checkboxAcceptance2');
     const walletId = get(wallet, 'id', null);
-    const validRecoveryPhase = recoveryPhraseField.isValid;
-    const walletsDropdownClasses = classnames([
-      styles.walletsDropdown,
-      !validRecoveryPhase ? styles.disabled : null,
-    ]);
+    const walletsDropdownDisabled = !(
+      recoveryPhraseField.isValid ||
+      this.state.wasRecoveryPhraseValidAtLeastOnce
+    );
+
     const actions = {
       direction: 'column',
       items: [
@@ -365,7 +384,6 @@ class Step1ConfigurationDialog extends Component<Props> {
           />
           <div className={styles.walletsDropdownWrapper}>
             <WalletsDropdown
-              className={walletsDropdownClasses}
               {...walletsDropdownField.bind()}
               numberOfStakePools={4}
               wallets={wallets}
@@ -376,6 +394,7 @@ class Step1ConfigurationDialog extends Component<Props> {
               value={walletId}
               getStakePoolById={() => {}}
               errorPosition="bottom"
+              disabled={walletsDropdownDisabled}
             />
           </div>
           <Checkbox

source/renderer/app/components/wallet/WalletSendForm.scss

@@ -56,7 +56,7 @@
 
   input {
     background-color: var(--rp-input-bg-color-disabled) !important;
-    border-color: var(--rp-input-bg-color-disabled) !important;
+    border-color: var(--rp-input-border-color-disabled) !important;
     font-family: var(--font-regular);
     pointer-events: none;
 

source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.spec.tsx

@@ -0,0 +1,46 @@
+import '@testing-library/jest-dom';
+
+import React from 'react';
+import noop from 'lodash/noop';
+import { cleanup, screen, waitFor } from '@testing-library/react';
+
+import createTestBed from 'tests/_utils/TestBed';
+import {
+  withDecimalPlacesToken,
+  zeroDecimalPlacesToken,
+} from 'tests/mocks/asset';
+
+import WalletToken from './WalletToken';
+
+const defaultWalletProps = {
+  isFavorite: false,
+  isInsertingAsset: false,
+  isLoading: false,
+  isRemovingAsset: false,
+  anyAssetWasHovered: false,
+  assetSettingsDialogWasOpened: false,
+  onAssetSettings: noop,
+  onCopyAssetParam: noop,
+  onOpenAssetSend: noop,
+  onToggleFavorite: noop,
+};
+
+describe('WalletToken', () => {
+  afterEach(() => cleanup());
+
+  it('should not show a warning when an asset is set to zero recommended decimal places', async () => {
+    createTestBed(
+      <WalletToken asset={zeroDecimalPlacesToken} {...defaultWalletProps} />
+    );
+    await waitFor(() => screen.getByText(zeroDecimalPlacesToken.policyId));
+    expect(screen.queryByTestId('warning-icon')).not.toBeInTheDocument();
+  });
+
+  it('should show a warning when an asset is not set to the recommended decimal places', async () => {
+    createTestBed(
+      <WalletToken asset={withDecimalPlacesToken} {...defaultWalletProps} />
+    );
+    await waitFor(() => screen.getByText(withDecimalPlacesToken.policyId));
+    expect(screen.queryAllByTestId('warning-icon').length).toEqual(2);
+  });
+});