[DDW-846] Update react, react-router and other related dependencies (#…

…1966) * [DDW-846]: Update react and react-router and their related packages * [DDW-846]: Fix yarn.lock * [DDW-846]: Fix yarn.lock * [DDW-846]: Fix yarn.lock * [DDW-846]: Fix yarn.lock * [DDW-846]: Restore react-intl package * [DDW-846]: Fix yarn.lock * [DDW-846]: Update mobx-react-router initialization * [DDW-846]: Fix routes config error * [DDW-846]: Update hash router * [DDW-846]: Updating routing config * [DDW-846]: Rename legacy lifecycle method names * [DDW-846]: Update renderer webpack config * [DDW-846]: Add missing mobx react form validation configs * [DDW-846]: Update changelog * [DDW-846]: Fix lint and flow errors * [DDW-846] Updates CHANGELOG * [DDW-846]: Fix markNewsAsRead function signature * [DDW-846]: Fix wrong fallback usage * [DDW-846]: Fix yarn.lock * [DDW-846]: Fix flow test * [DDW-846]: Fix news item action parameter types * [DDW-846]: Adjust route by using Switch * [DDW-846]: Fix settings routing from app menu * [DDW-846]: Fix tests * [DDW-846]: Skip node restart test * [DDW-846]: Skip quit app test * [DDW-846]: Add wallets root screen test step spec * [DDW-846]: Restore node-restart and quit-app tests from skpped status * [DDW-846]: Revert unnecessary test step * [DDW-846]: Remove unnecessary previous route * [DDW-846]: Make update route location function as action in app store to enable routing on tests * [DDW-846]: Fix wallet rename test * [DDW-846]: Fix missing done callback call in legacy wallet restore func in test * [DDW-846]: Fix flow test * [DDW-846]: Update hardware wallet container name * [DDW-846]: Fix wallet import tests * [DDW-846]: Fix test * [DDW-846]: Fix test * [DDW-846]: Fix test * [DDW-846]: Fix transfer funds api integration * [DDW-846]: Remove unnecessary action notation * [DDW-846]: Update transfer funds wallet address handling * [DDW-846] Fix failing test * [DDW-846] Improve code style Co-authored-by: Nikola Glumac <niglumac@gmail.com>
input-output-hk · Jun 4, 2020 · a7a65dc · a7a65dc
1 parent cfbef24
commit a7a65dc
Show file tree

Hide file tree

Showing 64 changed files with 725 additions and 526 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -15,6 +15,7 @@ Changelog
 
 ### Chores
 
+- Updated react, react-router, mobx, mobx-react-router and their related package versions ([PR 1966](https://github.com/input-output-hk/daedalus/pull/1966))
 - Removed Resync Wallet feature from the codebase ([PR 2024](https://github.com/input-output-hk/daedalus/pull/2024))
 - Updated Hardware wallet screens for all themes ([PR 2023](https://github.com/input-output-hk/daedalus/pull/2023))
 - Updated `cardano-wallet` to revision `03183595` and updated transaction fee estimation Api endpoint implementation ([PR 2021](https://github.com/input-output-hk/daedalus/pull/2021), [PR 2022](https://github.com/input-output-hk/daedalus/pull/2022))

diff --git a/package.json b/package.json
@@ -183,33 +183,35 @@
     "fs-extra": "8.1.0",
     "graceful-fs": "4.2.3",
     "gulp": "4.0.0",
+    "history": "4.10.1",
     "humanize-duration": "3.22.0",
     "lodash": "4.17.15",
     "lodash-es": "4.17.15",
     "mime-types": "2.1.26",
     "mkdirp": "0.5.1",
-    "mobx": "5.14.0",
-    "mobx-react": "5.4.2",
-    "mobx-react-form": "1.35.1",
-    "mobx-react-router": "3.1.2",
+    "mobx": "5.15.4",
+    "mobx-react": "6.2.2",
+    "mobx-react-form": "2.0.8",
+    "mobx-react-router": "4.1.0",
     "moment": "2.24.0",
     "pbkdf2": "3.0.17",
     "pdfkit": "0.8.3",
     "prop-types": "15.7.2",
     "ps-list": "7.0.0",
     "qr-image": "3.2.0",
     "qrcode.react": "1.0.0",
-    "react": "16.8.0",
+    "react": "16.13.1",
     "react-animate-height": "2.0.20",
     "react-copy-to-clipboard": "5.0.2",
     "react-custom-scrollbars": "4.2.1",
     "react-datetime": "2.16.3",
-    "react-dom": "16.8.0",
+    "react-dom": "16.13.1",
     "react-intl": "2.7.2",
     "react-lottie": "1.2.3",
     "react-markdown": "4.3.1",
     "react-polymorph": "0.9.3-rc.1",
-    "react-router": "3.2.1",
+    "react-router": "5.1.2",
+    "react-router-dom": "5.1.2",
     "react-svg-inline": "2.1.1",
     "react-virtualized": "9.21.2",
     "recharts": "1.8.5",

diff --git a/source/renderer/app/App.js b/source/renderer/app/App.js
@@ -4,7 +4,7 @@ import { Provider, observer } from 'mobx-react';
 import { ThemeProvider } from 'react-polymorph/lib/components/ThemeProvider';
 import { SimpleSkins } from 'react-polymorph/lib/skins/simple';
 import DevTools from 'mobx-react-devtools';
-import { Router } from 'react-router';
+import { Router } from 'react-router-dom';
 import { IntlProvider } from 'react-intl';
 import { Routes } from './Routes';
 import { daedalusTheme } from './themes/daedalus';
@@ -27,7 +27,8 @@ export default class App extends Component<{
   actions: ActionsMap,
   history: Object,
 }> {
-  componentWillMount() {
+  // eslint-disable-next-line
+  UNSAFE_componentWillMount() {
     // Loads app's global environment variables into AppStore via ipc
     this.props.actions.app.initAppEnvironment.trigger();
   }
@@ -63,7 +64,9 @@ export default class App extends Component<{
               {...{ locale, key: locale, messages: translations[locale] }}
             >
               <Fragment>
-                <Router history={history} routes={Routes} />
+                <Router history={history}>
+                  <Routes />
+                </Router>
                 {mobxDevTools}
                 {showNextUpdate ? (
                   <AutomaticUpdateNotificationDialog />

diff --git a/source/renderer/app/Routes.js b/source/renderer/app/Routes.js
@@ -1,6 +1,6 @@
 // @flow
 import React from 'react';
-import { Route, IndexRedirect } from 'react-router';
+import { Switch, Route, Redirect, withRouter } from 'react-router-dom';
 import { ROUTES } from './routes-config';
 
 // PAGES
@@ -31,61 +31,112 @@ import WalletTransactionsPage from './containers/wallet/WalletTransactionsPage';
 import WalletSettingsPage from './containers/wallet/WalletSettingsPage';
 import WalletUtxoPage from './containers/wallet/WalletUtxoPage';
 
-export const Routes = (
-  <Route path={ROUTES.ROOT} component={Root}>
-    <IndexRedirect to={ROUTES.WALLETS.ROOT} />
-    <Route
-      path={ROUTES.PROFILE.INITIAL_SETTINGS}
-      component={InitialSettingsPage}
-    />
-    <Route path={ROUTES.PROFILE.TERMS_OF_USE} component={TermsOfUsePage} />
-    <Route
-      path={ROUTES.PROFILE.DATA_LAYER_MIGRATION}
-      component={DataLayerMigrationPage}
-    />
-    <Route path={ROUTES.WALLETS.ADD} component={WalletAddPage} />
-    <Route path={ROUTES.WALLETS.ROOT} component={Wallet}>
-      <Route path={ROUTES.WALLETS.SUMMARY} component={WalletSummaryPage} />
-      <Route
-        path={ROUTES.WALLETS.TRANSACTIONS}
-        component={WalletTransactionsPage}
-      />
-      <Route path={ROUTES.WALLETS.SEND} component={WalletSendPage} />
-      <Route path={ROUTES.WALLETS.RECEIVE} component={WalletReceivePage} />
-      <Route path={ROUTES.WALLETS.SETTINGS} component={WalletSettingsPage} />
-      <Route path={ROUTES.WALLETS.UTXO} component={WalletUtxoPage} />
-    </Route>
-    <Route path={ROUTES.HARDWARE_WALLETS.ROOT} component={HardwareWallet}>
-      <Route
-        path={ROUTES.HARDWARE_WALLETS.SUMMARY}
-        component={WalletSummaryPage}
-      />
-    </Route>
-    <Route path={ROUTES.SETTINGS.ROOT} component={Settings}>
-      <IndexRedirect to={ROUTES.SETTINGS.GENERAL} />
-      <Route path={ROUTES.SETTINGS.GENERAL} component={GeneralSettingsPage} />
-      <Route
-        path={ROUTES.SETTINGS.TERMS_OF_USE}
-        component={TermsOfUseSettingsPage}
-      />
-      <Route path={ROUTES.SETTINGS.SUPPORT} component={SupportSettingsPage} />
-      <Route path={ROUTES.SETTINGS.DISPLAY} component={DisplaySettingsPage} />
-    </Route>
-    <Route
-      path={ROUTES.PAPER_WALLET_CREATE_CERTIFICATE}
-      component={PaperWalletCreateCertificatePage}
-    />
-    <Route path={ROUTES.STAKING.ROOT} component={Staking}>
-      <IndexRedirect to={ROUTES.STAKING.INFO} />
-      <Route path={ROUTES.STAKING.COUNTDOWN} component={StakingCountdownPage} />
-      <Route
-        path={ROUTES.STAKING.DELEGATION_CENTER}
-        component={DelegationCenterPage}
-      />
-      <Route path={ROUTES.STAKING.STAKE_POOLS} component={StakePoolsListPage} />
-      <Route path={ROUTES.STAKING.REWARDS} component={StakingRewardsPage} />
-      <Route path={ROUTES.STAKING.EPOCHS} component={StakingEpochsPage} />
-      <Route path={ROUTES.STAKING.INFO} component={StakingInfoPage} />
-    </Route>
+export const Routes = withRouter(() => (
+  <Route path={ROUTES.ROOT}>
+    <Root>
+      <Switch>
+        <Route
+          exact
+          path={ROUTES.ROOT}
+          component={() => <Redirect to={ROUTES.WALLETS.ROOT} />}
+        />
+        <Route
+          path={ROUTES.PROFILE.INITIAL_SETTINGS}
+          component={InitialSettingsPage}
+        />
+        <Route path={ROUTES.PROFILE.TERMS_OF_USE} component={TermsOfUsePage} />
+        <Route
+          path={ROUTES.PROFILE.DATA_LAYER_MIGRATION}
+          component={DataLayerMigrationPage}
+        />
+        <Route path={ROUTES.WALLETS.ADD} component={WalletAddPage} />
+        <Route path={ROUTES.WALLETS.ROOT}>
+          <Wallet>
+            <Route
+              path={ROUTES.WALLETS.SUMMARY}
+              component={WalletSummaryPage}
+            />
+            <Route
+              path={ROUTES.WALLETS.TRANSACTIONS}
+              component={WalletTransactionsPage}
+            />
+            <Route path={ROUTES.WALLETS.SEND} component={WalletSendPage} />
+            <Route
+              path={ROUTES.WALLETS.RECEIVE}
+              component={WalletReceivePage}
+            />
+            <Route
+              path={ROUTES.WALLETS.SETTINGS}
+              component={WalletSettingsPage}
+            />
+            <Route path={ROUTES.WALLETS.UTXO} component={WalletUtxoPage} />
+          </Wallet>
+        </Route>
+        <Route path={ROUTES.SETTINGS.ROOT}>
+          <Settings>
+            <Route
+              exact
+              path={ROUTES.SETTINGS.ROOT}
+              component={() => <Redirect to={ROUTES.SETTINGS.GENERAL} />}
+            />
+            <Route
+              path={ROUTES.SETTINGS.GENERAL}
+              component={GeneralSettingsPage}
+            />
+            <Route
+              path={ROUTES.SETTINGS.TERMS_OF_USE}
+              component={TermsOfUseSettingsPage}
+            />
+            <Route
+              path={ROUTES.SETTINGS.SUPPORT}
+              component={SupportSettingsPage}
+            />
+            <Route
+              path={ROUTES.SETTINGS.DISPLAY}
+              component={DisplaySettingsPage}
+            />
+          </Settings>
+        </Route>
+        <Route
+          path={ROUTES.PAPER_WALLET_CREATE_CERTIFICATE}
+          component={PaperWalletCreateCertificatePage}
+        />
+        <Route path={ROUTES.HARDWARE_WALLETS.ROOT}>
+          <HardwareWallet>
+            <Route
+              path={ROUTES.HARDWARE_WALLETS.SUMMARY}
+              component={WalletSummaryPage}
+            />
+          </HardwareWallet>
+        </Route>
+        <Route path={ROUTES.STAKING.ROOT}>
+          <Staking>
+            <Route
+              exact
+              path={ROUTES.STAKING.ROOT}
+              component={() => <Redirect to={ROUTES.STAKING.INFO} />}
+            />
+            <Route
+              path={ROUTES.STAKING.COUNTDOWN}
+              component={StakingCountdownPage}
+            />
+            <Route
+              path={ROUTES.STAKING.DELEGATION_CENTER}
+              component={DelegationCenterPage}
+            />
+            <Route
+              path={ROUTES.STAKING.STAKE_POOLS}
+              component={StakePoolsListPage}
+            />
+            <Route
+              path={ROUTES.STAKING.REWARDS}
+              component={StakingRewardsPage}
+            />
+            <Route path={ROUTES.STAKING.EPOCHS} component={StakingEpochsPage} />
+            <Route path={ROUTES.STAKING.INFO} component={StakingInfoPage} />
+          </Staking>
+        </Route>
+      </Switch>
+    </Root>
   </Route>
-);
+));
diff --git a/source/renderer/app/api/api.js b/source/renderer/app/api/api.js
@@ -1417,15 +1417,22 @@ export default class AdaApi {
   transferFunds = async (
     request: TransferFundsRequest
   ): Promise<TransferFundsResponse> => {
-    const { sourceWalletId, targetWalletId, passphrase } = request;
+    const { sourceWalletId, targetWalletAddresses, passphrase } = request;
     logger.debug('AdaApi::transferFunds called', {
-      parameters: { sourceWalletId, targetWalletId },
+      parameters: { sourceWalletId, targetWalletAddresses },
     });
 
+    if (!targetWalletAddresses) {
+      throw new ApiError({
+        code: 'no_such_wallet',
+        message: 'Target wallet does not exist',
+      }).result();
+    }
+
     try {
       const response: TransferFundsResponse = await transferFunds(this.config, {
         sourceWalletId,
-        targetWalletId,
+        targetWalletAddresses,
         passphrase,
       });
       logger.debug('AdaApi::transferFunds success', { response });

diff --git a/source/renderer/app/api/news/types.js b/source/renderer/app/api/news/types.js
@@ -9,6 +9,7 @@ export type NewsAction = {
   label: NewsTranslations,
   url?: NewsTranslations,
   route?: string,
+  event?: string,
 };
 
 export type NewsTarget = {

diff --git a/source/renderer/app/api/wallets/requests/transferFunds.js b/source/renderer/app/api/wallets/requests/transferFunds.js
@@ -6,16 +6,14 @@ import { getRawWalletId } from '../../utils';
 
 export const transferFunds = (
   config: RequestConfig,
-  { sourceWalletId, targetWalletId, passphrase }: TransferFundsRequest
+  { sourceWalletId, targetWalletAddresses, passphrase }: TransferFundsRequest
 ): Promise<TransferFundsResponse> =>
   request(
     {
       method: 'POST',
-      path: `/v2/byron-wallets/${getRawWalletId(
-        sourceWalletId
-      )}/migrations/${targetWalletId}`,
+      path: `/v2/byron-wallets/${getRawWalletId(sourceWalletId)}/migrations`,
       ...config,
     },
     {},
-    { passphrase }
+    { passphrase, addresses: targetWalletAddresses }
   );
diff --git a/source/renderer/app/api/wallets/types.js b/source/renderer/app/api/wallets/types.js
@@ -242,7 +242,7 @@ export type TransferFundsCalculateFeeResponse = {
 
 export type TransferFundsRequest = {
   sourceWalletId: string,
-  targetWalletId: string,
+  targetWalletAddresses: ?Array<string>,
   passphrase: string,
 };
 

diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingConnecting.js b/source/renderer/app/components/loading/syncing-connecting/SyncingConnecting.js
@@ -64,7 +64,8 @@ export default class SyncingConnecting extends Component<Props, State> {
     this._defensivelyStartTimers(this.props.isConnected);
   }
 
-  componentWillReceiveProps(nextProps: Props) {
+  // eslint-disable-next-line
+  UNSAFE_componentWillReceiveProps(nextProps: Props) {
     this._defensivelyStartTimers(nextProps.isConnected);
   }
 

diff --git a/source/renderer/app/components/news/AlertsOverlay.js b/source/renderer/app/components/news/AlertsOverlay.js
@@ -37,7 +37,8 @@ export default class AlertsOverlay extends Component<Props, State> {
 
   localizedDateFormat: 'MM/DD/YYYY';
 
-  componentWillMount() {
+  // eslint-disable-next-line
+  UNSAFE_componentWillMount() {
     this.localizedDateFormat = moment.localeData().longDateFormat('L');
   }
 

diff --git a/source/renderer/app/components/news/IncidentOverlay.js b/source/renderer/app/components/news/IncidentOverlay.js
@@ -20,7 +20,8 @@ type Props = {
 export default class IncidentOverlay extends Component<Props> {
   localizedDateFormat: 'MM/DD/YYYY';
 
-  componentWillMount() {
+  // eslint-disable-next-line
+  UNSAFE_componentWillMount() {
     this.localizedDateFormat = moment.localeData().longDateFormat('L');
   }
 

diff --git a/source/renderer/app/components/news/NewsItem.js b/source/renderer/app/components/news/NewsItem.js
@@ -39,7 +39,8 @@ export default class NewsItem extends Component<Props, State> {
     newsItemCollapsible: true,
   };
 
-  componentWillReceiveProps(nextProps: Props) {
+  // eslint-disable-next-line
+  UNSAFE_componentWillReceiveProps(nextProps: Props) {
     const { newsItemExpanded } = this.state;
     if (
       this.props.isNewsFeedOpen &&

diff --git a/source/renderer/app/components/staking/delegation-center/UndelegateConfirmationDialog.js b/source/renderer/app/components/staking/delegation-center/UndelegateConfirmationDialog.js
@@ -5,6 +5,7 @@ import { observer } from 'mobx-react';
 import { get } from 'lodash';
 import BigNumber from 'bignumber.js';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
+import vjf from 'mobx-react-form/lib/validators/VJF';
 import classnames from 'classnames';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { Input } from 'react-polymorph/lib/components/Input';
@@ -176,6 +177,7 @@ export default class UndelegateConfirmationDialog extends Component<Props> {
       },
     },
     {
+      plugins: { vjf: vjf() },
       options: {
         validateOnChange: true,
         validationDebounceWait: FORM_VALIDATION_DEBOUNCE_WAIT,

diff --git a/...ce/renderer/app/components/staking/delegation-setup-wizard/DelegationSetupWizardDialog.js b/...ce/renderer/app/components/staking/delegation-setup-wizard/DelegationSetupWizardDialog.js
@@ -44,7 +44,8 @@ type Props = {
 
 @observer
 export default class DelegationSetupWizardDialog extends Component<Props> {
-  componentWillReceiveProps(nextProps: Props) {
+  // eslint-disable-next-line
+  UNSAFE_componentWillReceiveProps(nextProps: Props) {
     // On confirm delegation step, wait for API stake pool "join" endpoint response
     // and redirect to "Ta-Da" step
     if (