Merge pull request #57 from paritytech/w3f-deploy-1.1.2

v1.1.2

.eslintignore

@@ -15,4 +15,5 @@ LICENSE
 dist
 build
 vite.config.ts
-public/lottie/player.js
+public/lottie/player.js
+CHANGELOG.md

.eslintrc.json

@@ -32,6 +32,7 @@
     // NOTE: These rules are being reviewed and comments justifying their deactivation will be
     // added.
     "react/require-default-props": "off",
+    "jsx-a11y/control-has-associated-label": "off",
     "react/no-access-state-in-setstate": "off",
     "react/destructuring-assignment": "off",
     "react/function-component-definition": "off",

.nvmrc

@@ -0,0 +1 @@
+v20.6.1

.prettierignore

@@ -7,4 +7,5 @@
 **/tsconfig.json
 dist
 src/img/**/*
-public/lottie/player.js
+public/lottie/player.js
+CHANGELOG.md

.prettierrc.json

@@ -3,5 +3,6 @@
   "trailingComma": "es5",
   "tabWidth": 2,
   "semi": true,
-  "singleQuote": true
+  "singleQuote": true,
+  "endOfLine": "auto"
 }

package.json

@@ -21,24 +21,24 @@
     "visualizer": "vite-bundle-visualizer"
   },
   "dependencies": {
-    "@dotlottie/player-component": "^2.7.0",
+    "@dotlottie/player-component": "^2.7.2",
     "@fortawesome/fontawesome-svg-core": "^6.4.2",
     "@fortawesome/free-brands-svg-icons": "^6.4.2",
     "@fortawesome/free-regular-svg-icons": "^6.4.2",
     "@fortawesome/free-solid-svg-icons": "^6.4.2",
     "@fortawesome/react-fontawesome": "^0.2.0",
-    "@ledgerhq/hw-transport-webhid": "^6.27.19",
-    "@polkadot-cloud/assets": "^0.1.32",
-    "@polkadot-cloud/core": "^1.0.30",
-    "@polkadot-cloud/react": "^0.1.102",
-    "@polkadot-cloud/utils": "^0.0.23",
+    "@ledgerhq/hw-transport-webhid": "^6.27.20",
+    "@polkadot-cloud/assets": "^0.1.34",
+    "@polkadot-cloud/core": "^1.0.46",
+    "@polkadot-cloud/react": "^0.1.129",
+    "@polkadot-cloud/utils": "^0.0.25",
     "@polkadot/api": "^10.10.1",
     "@polkadot/keyring": "^12.1.1",
     "@polkadot/rpc-provider": "^10.9.1",
     "@polkadot/util": "^12.4.2",
     "@polkadot/util-crypto": "12.5.1",
     "@polkawatch/ddp-client": "^2.0.8",
-    "@substrate/connect": "^0.7.34",
+    "@substrate/connect": "^0.7.35",
     "@zondax/ledger-substrate": "^0.41.3",
     "bignumber.js": "^9.1.2",
     "bn.js": "^5.2.1",
@@ -47,53 +47,53 @@
     "chroma-js": "^2.4.2",
     "date-fns": "^2.29.3",
     "framer-motion": "^10.16.3",
-    "i18next": "^23.6.0",
-    "i18next-browser-languagedetector": "^7.1.0",
+    "i18next": "^23.7.6",
+    "i18next-browser-languagedetector": "^7.2.0",
     "lodash.throttle": "^4.1.1",
     "qrcode-generator": "1.4.4",
-    "rc-slider": "^10.3.1",
+    "rc-slider": "^10.4.0",
     "react": "^18.2.0",
     "react-chartjs-2": "^5.2.0",
     "react-dom": "^18.2.0",
     "react-error-boundary": "^4.0.11",
     "react-helmet": "^6.1.0",
-    "react-i18next": "^13.3.1",
+    "react-i18next": "^13.4.1",
     "react-qr-reader": "^2.2.1",
-    "react-router-dom": "^6.17.0",
+    "react-router-dom": "^6.18.0",
     "react-scroll": "^1.9.0",
     "styled-components": "^6.1.0"
   },
   "devDependencies": {
     "@ledgerhq/logs": "^6.10.1",
-    "@types/chroma-js": "^2.4.0",
-    "@types/lodash.throttle": "^4.1.7",
-    "@types/react": "^18.2.33",
-    "@types/react-dom": "^18.2.14",
-    "@types/react-helmet": "^6.1.8",
-    "@types/react-qr-reader": "^2.1.6",
-    "@types/react-scroll": "^1.8.9",
-    "@typescript-eslint/eslint-plugin": "^6.9.1",
-    "@typescript-eslint/parser": "^6.9.1",
+    "@types/chroma-js": "^2.4.3",
+    "@types/lodash.throttle": "^4.1.9",
+    "@types/react": "^18.2.37",
+    "@types/react-dom": "^18.2.15",
+    "@types/react-helmet": "^6.1.9",
+    "@types/react-qr-reader": "^2.1.7",
+    "@types/react-scroll": "^1.8.10",
+    "@typescript-eslint/eslint-plugin": "^6.11.0",
+    "@typescript-eslint/parser": "^6.11.0",
     "@vitejs/plugin-react-swc": "^3.4.0",
     "eslint": "^8.52.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^17.1.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-import-resolver-typescript": "^3.6.1",
     "eslint-plugin-import": "^2.29.0",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
     "eslint-plugin-prefer-arrow": "^1.2.3",
     "eslint-plugin-prefer-arrow-functions": "^3.2.4",
     "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-unused-imports": "^3.0.0",
     "gh-pages": "^6.0.0",
-    "prettier": "^3.0.3",
-    "prettier-plugin-organize-imports": "^3.2.3",
+    "prettier": "^3.1.0",
+    "prettier-plugin-organize-imports": "^3.2.4",
     "sass": "^1.69.5",
     "typescript": "^5.2.2",
     "vite": "^4.4.11",
-    "vite-bundle-visualizer": "^0.10.0",
+    "vite-bundle-visualizer": "^0.11.0",
     "vite-plugin-checker": "^0.6.2",
     "vite-plugin-eslint": "^1.8.1",
     "vite-plugin-svgr": "^4.1.0",

src/Providers.tsx

@@ -11,8 +11,8 @@ import {
 import { ExtrinsicsProvider } from 'contexts/Extrinsics';
 import { FastUnstakeProvider } from 'contexts/FastUnstake';
 import { FiltersProvider } from 'contexts/Filters';
-import { LedgerHardwareProvider } from 'contexts/Hardware/Ledger';
-import { VaultHardwareProvider } from 'contexts/Hardware/Vault';
+import { LedgerHardwareProvider } from 'contexts/Hardware/Ledger/LedgerHardware';
+import { VaultAccountsProvider } from 'contexts/Hardware/Vault/VaultAccounts';
 import { HelpProvider } from 'contexts/Help';
 import { IdentitiesProvider } from 'contexts/Identities';
 import { MenuProvider } from 'contexts/Menu';
@@ -50,6 +50,8 @@ import { DappName } from 'consts';
 import { ImportedAccountsProvider } from 'contexts/Connect/ImportedAccounts';
 import { PoolPerformanceProvider } from 'contexts/Pools/PoolPerformance';
 import { registerSaEvent } from 'Utils';
+import { LedgerAccountsProvider } from 'contexts/Hardware/Ledger/LedgerAccounts';
+import { ExternalAccountsProvider } from 'contexts/Connect/ExternalAccounts';
 
 // Embed providers from hook.
 export const Providers = () => {
@@ -65,7 +67,7 @@ export const Providers = () => {
     FiltersProvider,
     NotificationsProvider,
     PluginsProvider,
-    VaultHardwareProvider,
+    VaultAccountsProvider,
     LedgerHardwareProvider,
     ExtensionsProvider,
     [
@@ -84,14 +86,16 @@ export const Providers = () => {
         },
       },
     ],
+    LedgerAccountsProvider,
+    ExternalAccountsProvider,
     OtherAccountsProvider,
     ImportedAccountsProvider,
-    HelpProvider,
+    ProxiesProvider,
     NetworkMetricsProvider,
+    HelpProvider,
     SubscanProvider,
     PolkawatchProvider,
     IdentitiesProvider,
-    ProxiesProvider,
     BalancesProvider,
     BondedProvider,
     StakingProvider,

src/Router.tsx

@@ -36,9 +36,11 @@ import { useActiveAccounts } from 'contexts/ActiveAccounts';
 import { useOtherAccounts } from 'contexts/Connect/OtherAccounts';
 import { useImportedAccounts } from 'contexts/Connect/ImportedAccounts';
 import { SideMenuMaximisedWidth } from 'consts';
+import { useTheme } from 'styled-components';
 
 export const RouterInner = () => {
   const { t } = useTranslation();
+  const { mode } = useTheme();
   const { network } = useNetwork();
   const { pathname, search } = useLocation();
   const { accounts } = useImportedAccounts();
@@ -75,6 +77,15 @@ export const RouterInner = () => {
     });
   }, []);
 
+  // Update body background to `--background-default` upon theme change.
+  useEffect(() => {
+    const elem = document.querySelector('.core-entry');
+    if (elem) {
+      document.getElementsByTagName('body')[0].style.backgroundColor =
+        getComputedStyle(elem).getPropertyValue('--background-default');
+    }
+  }, [mode]);
+
   // Open default account modal if url var present and accounts initialised.
   useEffect(() => {
     if (accountsInitialised) {

src/canvas/ManageNominations/index.tsx

@@ -25,6 +25,7 @@ import type {
   NominationSelection,
   NominationSelectionWithResetCounter,
 } from 'library/GenerateNominations/types';
+import { useBondedPools } from 'contexts/Pools/BondedPools';
 import { RevertPrompt } from './Prompts/RevertPrompt';
 import { CanvasSubmitTxFooter, ManageNominationsWrapper } from './Wrappers';
 
@@ -42,6 +43,7 @@ export const ManageNominations = () => {
   const { addNotification } = useNotifications();
   const { selectedActivePool } = useActivePools();
   const { openPromptWith, closePrompt } = usePrompt();
+  const { updatePoolNominations } = useBondedPools();
   const controller = getBondedAccount(activeAccount);
   const { maxNominations } = consts;
   const bondFor = options?.bondFor || 'nominator';
@@ -128,7 +130,16 @@ export const ManageNominations = () => {
     callbackSubmit: () => {
       setCanvasStatus('closing');
     },
-    callbackInBlock: () => {},
+    callbackInBlock: () => {
+      if (isPool) {
+        // Upate bonded pool targets if updating pool nominations.
+        if (selectedActivePool?.id)
+          updatePoolNominations(
+            selectedActivePool.id,
+            newNominations.nominations.map((n) => n.address)
+          );
+      }
+    },
   });
 
   // Valid if there are between 1 and `maxNominations` nominations.

src/config/help.ts

@@ -156,6 +156,7 @@ export const HelpConfig: HelpItems = [
       'Ledger Rejected Transaction',
       'Ledger Request Timeout',
       'Open App On Ledger',
+      'Ledger App Not on Latest Runtime Version',
       'Wrong Transaction',
     ],
     external: [],

src/config/ledger.ts

@@ -1,7 +1,7 @@
 // Copyright 2023 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { LedgerApp } from 'contexts/Hardware/types';
+import type { LedgerApp } from 'contexts/Hardware/Ledger/types';
 import KusamaSVG from 'img/appIcons/kusama.svg?react';
 import PolkadotSVG from 'img/appIcons/polkadot.svg?react';
 

src/consts.ts

@@ -8,7 +8,7 @@ import type { Plugin } from 'types';
 /*
  * Global Constants
  */
-export const AppVersion = '1.0.8';
+export const AppVersion = '1.1.2';
 export const DappName = 'Polkadot Staking Dashboard';
 export const PolkadotUrl = 'https://polkadot.network/features/staking/';
 export const DefaultNetwork = 'polkadot';

src/contexts/Api/defaults.ts

@@ -4,9 +4,13 @@
 
 import { stringToU8a } from '@polkadot/util';
 import BigNumber from 'bignumber.js';
-import type { APIConstants, APIContextInterface } from 'contexts/Api/types';
+import type {
+  APIChainState,
+  APIConstants,
+  APIContextInterface,
+} from 'contexts/Api/types';
 
-export const consts: APIConstants = {
+export const defaultConsts: APIConstants = {
   bondDuration: new BigNumber(0),
   maxNominations: new BigNumber(0),
   sessionsPerEra: new BigNumber(0),
@@ -20,10 +24,18 @@ export const consts: APIConstants = {
   poolsPalletId: stringToU8a('0'),
 };
 
+export const defaultChainState: APIChainState = {
+  chain: null,
+  version: {
+    specVersion: 0,
+  },
+  ss58Prefix: 0,
+};
+
 export const defaultApiContext: APIContextInterface = {
   api: null,
-  consts,
-  chainState: undefined,
+  consts: defaultConsts,
+  chainState: defaultChainState,
   isReady: false,
   apiStatus: 'disconnected',
   isLightClient: false,