diff --git a/.eslintrc b/.eslintrc
index a0b0cbab3b..603b09bc9a 100755
--- a/.eslintrc
+++ b/.eslintrc
@@ -67,10 +67,8 @@
     "react/no-array-index-key": "warn",
     "react/no-unused-prop-types": "warn",
     "react/prefer-stateless-function": 0,
-    "react/prop-types": "warn",
+    "react/prop-types": 0,
     "react/require-default-props": 0,
-    "react/sort-comp": 0,
-    "react/state-in-constructor": 0,
     "react/jsx-first-prop-new-line": [1, "multiline-multiprop"],
     "@typescript-eslint/ban-ts-comment": 1,
     "@typescript-eslint/no-empty-function": 1,
@@ -78,22 +76,15 @@
     "import/no-unresolved": 1,
     "@typescript-eslint/no-var-requires": 1,
     "camelcase": 1,
-		"no-empty": 1,
+    "no-empty": 1,
     "@typescript-eslint/no-explicit-any": 1,
     "no-shadow": 1,
     "react/no-did-update-set-state": 1,
-    "react/static-property-placement": 0,
-    "react/jsx-one-expression-per-line": 0,
-    "react/jsx-curly-newline": 0,
-    "react/jsx-indent": 0
+    "react/sort-comp": 0,
+    "react/state-in-constructor": 0,
+    "react/static-property-placement": 0
   },
-  "plugins": [
-    "@typescript-eslint",
-    "import",
-    "promise",
-    "react",
-    "jest"
-  ],
+  "plugins": ["@typescript-eslint", "import", "promise", "react", "jest"],
   "globals": {
     "API": true,
     "API_VERSION": true,
@@ -103,10 +94,19 @@
     "Process": true // TODO: remove after fix
   },
   "settings": {
-     "import/resolver": {
+    "import/resolver": {
       "node": {
-        "extensions": [".js", ".jsx",".ts", ".tsx"]
+        "extensions": [".js", ".jsx", ".ts", ".tsx"]
+      }
+    }
+  },
+  "overrides": [
+    {
+      "files": "**/*.ts",
+      "rules": {
+          "no-useless-constructor": "off",
+          "@typescript-eslint/no-useless-constructor": "error"
       }
     }
-  }
+  ]
 }
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
index de92566601..a91508a26b 100644
--- a/.github/pull_request_template.md
+++ b/.github/pull_request_template.md
@@ -20,7 +20,7 @@ or animated GIFs of important UI changes in both English and Japanese.
 Do not use shadow or any effects. On macOS this can be accomplished the following way:
 1. Use the Command+Shift+4 keyboard shortcut.
 2. Press the Spacebar.
-3. Hold the Option button and click the window you want to capture. 
+3. Hold the Option button and click the window you want to capture.
 -->
 
 ## Testing Checklist
@@ -29,7 +29,6 @@ Do not use shadow or any effects. On macOS this can be accomplished the followin
 Open a thread on #daedalus-qa on Slack, mention `@daedalusqa` and `@daedalusteam`, link the thread below
 -->
 
-
 - [Slack QA thread](https://input-output-rnd.slack.com/messages/GGKFXSKC6)
 - [ ] Test
 
@@ -38,15 +37,17 @@ Open a thread on #daedalus-qa on Slack, mention `@daedalusqa` and `@daedalusteam
 ## Review Checklist
 
 ### Basics
-- [ ] PR assigned to the PR author(s) 
+
+- [ ] PR assigned to the PR author(s)
 - [ ] `input-output-hk/daedalus-dev` and `input-output-hk/daedalus-qa` assigned as PR reviewers
 - [ ] If there are UI changes, Alexander Rukin assigned as an additional reviewer
+- [ ] All visual regression testing has been reviewed (assign `run Chromatic` label to PR to trigger the run)
 - [ ] PR has appropriate labels (`release-vNext`, `feature`/`bug`/`chore`, `WIP`)
 - [ ] PR link is added to a Jira ticket, ticket moved to In Review
 - [ ] PR is updated to the most recent version of the target branch (and there are no conflicts)
 - [ ] PR has a good description that summarizes all changes
 - [ ] PR contains screenshots (in case of UI changes)
-- [ ] CHANGELOG entry has been added to the top of the appropriate section (*Features*, *Fixes*, *Chores*) and is linked to the correct PR on GitHub
+- [ ] CHANGELOG entry has been added to the top of the appropriate section (_Features_, _Fixes_, _Chores_) and is linked to the correct PR on GitHub
 - [ ] There are no missing translations (running `yarn manage:translations` produces no changes)
 - [ ] Text changes are proofread and approved (Jane Wild / Amy Reeve)
 - [ ] Japanese text changes are proofread and approved (Junko Oda)
@@ -54,12 +55,14 @@ Open a thread on #daedalus-qa on Slack, mention `@daedalusqa` and `@daedalusteam
 - [ ] In case of dependency changes `yarn.lock` file is updated
 
 ### Code Quality
+
 - [ ] Important parts of the code are properly commented and documented
-- [ ] Code is properly typed with flow
+- [ ] Code is properly typed with typescript types
 - [ ] React components are split-up enough to avoid unnecessary re-renderings
 - [ ] Any code that only works in main process is neatly separated from components
 
 ### Testing
+
 - [ ] New feature/change is covered by acceptance tests
 - [ ] New feature/change is manually tested and approved by QA team
 - [ ] All existing acceptance tests are still up-to-date
@@ -67,4 +70,5 @@ Open a thread on #daedalus-qa on Slack, mention `@daedalusqa` and `@daedalusteam
 - [ ] All existing Daedalus Testing scenarios are still up-to-date
 
 ### After Review
+
 - [ ] Update Slack QA thread by marking it with a green checkmark
diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index aeddc615d6..fc5a939007 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -1,8 +1,18 @@
 name: 'Chromatic'
-on: push
+on:
+  pull_request:
+    types:
+      - labeled
+  push:
+    branches:
+      - develop
+
 jobs:
   chromatic-deployment:
+    if: contains(github.event.pull_request.labels.*.name, 'run Chromatic') || github.ref == 'refs/heads/develop'
     runs-on: ubuntu-latest
+    env:
+      STORYBOOK_FREEZE_DATE: "true"
     steps:
       - uses: actions/checkout@v1
       - name: Setup Node.js
@@ -18,6 +28,7 @@ jobs:
           token: ${{ secrets.GITHUB_TOKEN }}
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
           exitZeroOnChanges: true
+          buildScriptName: 'storybook:build:chromatic'
       - name: Publish to Chromatic and auto accept changes
         if: github.ref == 'refs/heads/develop'
         uses: chromaui/action@v1
@@ -25,3 +36,4 @@ jobs:
           token: ${{ secrets.GITHUB_TOKEN }}
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
           autoAcceptChanges: true
+          buildScriptName: 'storybook:build:chromatic'
diff --git a/.github/workflows/run_tests_on_pr.yml b/.github/workflows/run_tests_on_pr.yml
deleted file mode 100644
index 3ce7787de8..0000000000
--- a/.github/workflows/run_tests_on_pr.yml
+++ /dev/null
@@ -1,18 +0,0 @@
-name: Run Tests for Pull Requests
-on:
-  pull_request:
-    branches:
-      - develop
-      - master
-jobs:
-  tests:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout Repo
-        uses: actions/checkout@v2
-      - name: Setup Node.js
-        uses: actions/setup-node@v2
-        with:
-          node-version: "12"
-      - run: yarn install
-      - run: yarn test:jest
diff --git a/.github/workflows/verify_pr.yml b/.github/workflows/verify_pr.yml
new file mode 100644
index 0000000000..1d8df8c6bd
--- /dev/null
+++ b/.github/workflows/verify_pr.yml
@@ -0,0 +1,26 @@
+name: Verify Pull Request
+on:
+  pull_request:
+jobs:
+  tests:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v2
+      - name: Setup Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: "14"
+      - name: Restore node_modules from cache
+        uses: actions/cache@v2
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+      - name: Run checks
+        run: yarn check:all
+      - name: Ensure there are no uncommited changes
+        run: git diff --exit-code || (echo "Did you forget to run 'yarn check:all' and commit changes?" && exit 1)
+      - name: Run tests
+        run: yarn test:jest --maxWorkers=3
diff --git a/.gitignore b/.gitignore
index b43c8bb717..d785b3b350 100755
--- a/.gitignore
+++ b/.gitignore
@@ -119,3 +119,6 @@ Debug
 /cardano-cli
 /cardano-wallet
 .vscode
+
+# Typescript
+*.scss.d.ts
diff --git a/BESTPRACTICES.md b/BESTPRACTICES.md
index 538779a638..785cb2f16e 100644
--- a/BESTPRACTICES.md
+++ b/BESTPRACTICES.md
@@ -1108,7 +1108,7 @@ type Props = {
 };
 ```
 
-For preventing syntax errors, leave a comma after the last key/value pair incase the type definition's properties are rearranged or expanded upon in the future.
+For preventing syntax errors, leave a comma after the last key/value pair in case the type definition's properties are rearranged or expanded upon in the future.
 
 :white_check_mark: ***Do***
 
@@ -1204,7 +1204,7 @@ const Names = () => (<div>
 ## Formatting Selectors
 
 * Use class selectors instead of ID selectors.
-* Use camelCase or dashed-case instead of PascelCase or names_with_underscores.
+* Use camel case or dashed-case instead of pascal case or names_with_underscores.
 * Give each selector its own line.
 * Put a space before the opening brace `{` in rule declarations.
 * Put closing braces `}` of rule declarations on a new line.
diff --git a/CHANGELOG.md b/CHANGELOG.md
index f49216e1df..8d0380703c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,110 @@
 
 ## vNext
 
+### Features
+
+- Added ASCII name to token header when metadata name is missing ([PR 2904](https://github.com/input-output-hk/daedalus/pull/2904))
+- Improved IPC by reducing the amount of messages from periodic events ([PR 2892](https://github.com/input-output-hk/daedalus/pull/2892))
+- 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 stake pool list view overlapping news feed ([PR 2917](https://github.com/input-output-hk/daedalus/pull/2917))
+- Restored opacity for search icon when focused ([PR 2909](https://github.com/input-output-hk/daedalus/pull/2909))
+- 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))
+
+## 4.9.0
+
+### Features
+
+- Added display of current/unspent rewards ([PR 2803](https://github.com/input-output-hk/daedalus/pull/2803))
+- Improve the syncing screen by showing syncing progress split into three stages ([PR 2877](https://github.com/input-output-hk/daedalus/pull/2877))
+- Improved stake pool searchbar ([PR 2847](https://github.com/input-output-hk/daedalus/pull/2847))
+- Implemented catalyst dynamic content ([PR 2856](https://github.com/input-output-hk/daedalus/pull/2856))
+
+### Fixes
+
+- Fixed main container zIndex ([PR 2863](https://github.com/input-output-hk/daedalus/pull/2863))
+- Fixed ui overlap issues ([PR 2881](https://github.com/input-output-hk/daedalus/pull/2881))
+- Fixed the gap between Stake Pool View options ([PR 2899](https://github.com/input-output-hk/daedalus/pull/2899))
+
+### Chores
+
+- Fixed Daedalus menu in Storybook used for theme and language selection ([PR 2886](https://github.com/input-output-hk/daedalus/pull/2886))
+
+## 4.9.0-FC1
+
+### Features
+
+- Added table view for delegated stake pools list ([PR 2837](https://github.com/input-output-hk/daedalus/pull/2837))
+- Removed Discreet mode notification ([PR 2852](https://github.com/input-output-hk/daedalus/pull/2852))
+- Unified CPU info in diagnostics dialog ([PR 2818](https://github.com/input-output-hk/daedalus/pull/2818))
+- Implemented wallet sorting on sidebar menu ([PR 2775](https://github.com/input-output-hk/daedalus/pull/2775))
+- Implemented new token picker ([PR 2787](https://github.com/input-output-hk/daedalus/pull/2787))
+- Improved wallet send form ([PR 2791](https://github.com/input-output-hk/daedalus/pull/2791), [PR 2859](https://github.com/input-output-hk/daedalus/pull/2859))
+
+### Fixes
+
+- Fixed rewards CSV export issues ([PR 2885](https://github.com/input-output-hk/daedalus/pull/2885))
+- Fixed behaviour of wallet settings option of the app menu ([PR 2838](https://github.com/input-output-hk/daedalus/pull/2838))
+- Fixed styling of ITN rewards feature ([PR 2861](https://github.com/input-output-hk/daedalus/pull/2861))
+- Fixed available disk space takes a long time to show ([PR 2849](https://github.com/input-output-hk/daedalus/pull/2849))
+  
+### Chores
+
+- Migrated codebase from javascript to typescript ([PR 2843](https://github.com/input-output-hk/daedalus/pull/2843))
+- Updated the list of team members ([PR 2805](https://github.com/input-output-hk/daedalus/pull/2805))
+
+## 4.8.0
+
+### Features
+
+- Added dynamic RTS flags setting ([PR 2758](https://github.com/input-output-hk/daedalus/pull/2758/files))
+- Improved UI/UX of RTS flags settings ([PR 2842](https://github.com/input-output-hk/daedalus/pull/2842), [PR 2846](https://github.com/input-output-hk/daedalus/pull/2846))
+- Updated messages about Cardano node sync on the initial screen ([PR 2827](https://github.com/input-output-hk/daedalus/pull/2827), [PR 2831](https://github.com/input-output-hk/daedalus/pull/2831))
+
+### Chores
+
+- Updated check-disk-space version ([PR 2845](https://github.com/input-output-hk/daedalus/pull/2845))
+- Updated CWB and Cardano Node ([PR 2822](https://github.com/input-output-hk/daedalus/pull/2822))
+
+### Fixes
+
+- Fixed blockchain verification progress text ([PR 2840](https://github.com/input-output-hk/daedalus/pull/2840))
+
+## 4.8.0-FC1
+
+### Features
+
+- Added dynamic RTS flags setting ([PR 2758](https://github.com/input-output-hk/daedalus/pull/2758/files))
+- Improved UI/UX of RTS flags settings ([PR 2842](https://github.com/input-output-hk/daedalus/pull/2842), [PR 2846](https://github.com/input-output-hk/daedalus/pull/2846))
+- Updated messages about Cardano node sync on the initial screen ([PR 2827](https://github.com/input-output-hk/daedalus/pull/2827), [PR 2831](https://github.com/input-output-hk/daedalus/pull/2831))
+
+### Chores
+
+- Updated check-disk-space version ([PR 2845](https://github.com/input-output-hk/daedalus/pull/2845))
+- Updated CWB and Cardano Node ([PR 2822](https://github.com/input-output-hk/daedalus/pull/2822))
+
+### Fixes
+
+- Fixed blockchain verification progress text ([PR 2840](https://github.com/input-output-hk/daedalus/pull/2840))
+
+## 4.7.0
+
+### Features
+
+- Updated Catalyst dates ([PR 2812](https://github.com/input-output-hk/daedalus/pull/2812))
+
 ### Fixes
 
 - Fixed immediate language updates of application top menu bar ([PR 2813](https://github.com/input-output-hk/daedalus/pull/2813))
diff --git a/README.md b/README.md
index 4cd19ffcd9..58330abddf 100644
--- a/README.md
+++ b/README.md
@@ -65,8 +65,8 @@ If you get SSL error when running `nix-shell` (SSL peer certificate or SSH remot
 
 1. Run `yarn nix:selfnode` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell` (use `KEEP_LOCAL_CLUSTER_RUNNING` environment variable to keep the local cluster running after Daedalus exits: `KEEP_LOCAL_CLUSTER_RUNNING=true yarn dev`)
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
-4. Once Daedalus has started and has gotten past the loading screen run the following commands from a new terminal window if you wish to import funded wallets:
+    1. Alternatively: run `yarn nix:selfnode yarn dev` to achieve the same thing in a single command. Note: after `yarn dev` exits, you will still remain in the `nix-shell`.
+3. Once Daedalus has started and has gotten past the loading screen run the following commands from a new terminal window if you wish to import funded wallets:
    - Byron wallets: `yarn byron:wallet:importer`
    - Shelley wallets: `yarn shelley:wallet:importer`
    - Mary wallets: `yarn mary:wallet:importer` (all of which contain native tokens which are visible once selfnode enters Mary era)
@@ -95,37 +95,37 @@ If you get SSL error when running `nix-shell` (SSL peer certificate or SSH remot
 
 1. Run `yarn nix:mainnet` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell`
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
+3. Or in one command: `yarn nix:mainnet yarn dev`
 
 #### Flight
 
 1. Run `yarn nix:flight` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell`
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
+3. Or in one command: `yarn nix:flight yarn dev`
 
 #### Testnet
 
 1. Run `yarn nix:testnet` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell`
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
+3. Or in one command: `yarn nix:testnet yarn dev`
 
 #### Staging
 
 1. Run `yarn nix:staging` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell`
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
+3. Or in one command: `yarn nix:staging yarn dev`
 
 #### Shelley QA
 
 1. Run `yarn nix:shelley_qa` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell`
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
+3. Or in one command: `yarn nix:shelley_qa yarn dev`
 
 #### Alonzo Purple
 
 1. Run `yarn nix:alonzo_purple` from `daedalus`.
 2. Run `yarn dev` from the subsequent `nix-shell`
-3. Run `yarn start` from a second `nix-shell` instance (running step 1 from a new terminal instance)
+3. Or in one command: `yarn nix:alonzo_purple yarn dev`
 
 #### Native token metadata server
 
@@ -201,6 +201,15 @@ Make sure to list bootstrap in externals in `webpack.config.base.js` or the app
 externals: ['bootstrap']
 ```
 
+### Debugging
+
+You can debug the main process by following one of these approaches:
+- [VSCode](https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_attaching-to-nodejs)
+- [Chrome](https://nodejs.org/en/docs/guides/debugging-getting-started/#inspector-clients)
+- [IntelliJ](https://www.jetbrains.com/help/idea/run-debug-configuration-node-js-remote-debug.html)
+
+The inspector runs on port 9229
+
 ## Testing
 
 You can find more details regarding tests setup within
diff --git a/bors.toml b/bors.toml
index 5375315116..c8cf3c886a 100644
--- a/bors.toml
+++ b/bors.toml
@@ -1,11 +1,6 @@
 status = [
   # Buildkite: osx/linux installers
   "buildkite/daedalus",
-
-  # Hydra: we just care about tests attribute set
-  "ci/hydra:Cardano:daedalus:tests.runTsc",
-  "ci/hydra:Cardano:daedalus:tests.runLint",
-  "ci/hydra:Cardano:daedalus:tests.runShellcheck"
 ]
 timeout_sec = 7200
 required_approvals = 1
diff --git a/declaration.d.ts b/declaration.d.ts
index cf2f235f2d..e598e2a913 100644
--- a/declaration.d.ts
+++ b/declaration.d.ts
@@ -22,6 +22,17 @@ type Daedalus = {
   };
 };
 
+export type $ElementType<
+  T extends { [P in K & any]: any },
+  K extends keyof T | number
+> = T[K];
+
+export type EnumMap<
+  K extends string,
+  V,
+  O extends Record<string, any> = any
+> = O & Record<K, V & $ElementType<O, K>>;
+
 declare global {
   namespace NodeJS {
     interface ProcessEnv {
diff --git a/default.nix b/default.nix
index 1f8d485afa..09f9c5f7bd 100644
--- a/default.nix
+++ b/default.nix
@@ -40,7 +40,7 @@ let
   inherit (pkgs.lib) optionalString optional concatStringsSep;
   inherit (pkgs) writeTextFile;
   crossSystem = lib: (crossSystemTable lib).${target} or null;
-  # TODO, nsis cant cross-compile with the nixpkgs daedalus currently uses
+  # TODO, nsis can't cross-compile with the nixpkgs daedalus currently uses
   nsisNixPkgs = import localLib.sources.nixpkgs-nsis {};
   installPath = ".daedalus";
   needSignedBinaries = (signingKeys != null) || (HSMServer != null);
@@ -55,7 +55,7 @@ let
     cardanoLib = localLib.iohkNix.cardanoLib;
     daedalus-bridge = self.bridgeTable.${nodeImplementation};
 
-    nodejs = pkgs.nodejs-16_x;
+    nodejs = pkgs.nodejs-14_x;
     nodePackages = pkgs.nodePackages.override { nodejs = self.nodejs; };
     yarnInfo = {
       version = "1.22.4";
@@ -319,8 +319,6 @@ let
     electron = pkgs.callPackage ./installers/nix/electron.nix {};
 
     tests = {
-      runTsc = self.callPackage ./tests/tsc.nix {};
-      runLint = self.callPackage ./tests/lint.nix {};
       runShellcheck = self.callPackage ./tests/shellcheck.nix { src = ./.;};
     };
     nix-bundle = import sources.nix-bundle { nixpkgs = pkgs; };
diff --git a/gulpfile.js b/gulpfile.js
index 691d5de763..1bee16bc46 100755
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -51,6 +51,8 @@ gulp.task(
   )
 );
 
+gulp.task('typedef:sass', shell.task('yarn typedef:sass --watch'));
+
 gulp.task(
   'clear:cache',
   shell.task('rimraf ./node_modules/.cache && rimraf .cache-loader')
diff --git a/installers/common/MacInstaller.hs b/installers/common/MacInstaller.hs
index fc3ec70d7d..666907a6d0 100644
--- a/installers/common/MacInstaller.hs
+++ b/installers/common/MacInstaller.hs
@@ -152,6 +152,8 @@ sign_cmd "$ABS_PATH/Contents/Resources/app/build/HID.node"
 sign_cmd "$ABS_PATH/Contents/Resources/app/node_modules/keccak/bin/darwin-x64-"*"/keccak.node"
 sign_cmd "$ABS_PATH/Contents/Resources/app/node_modules/keccak/build/Release/addon.node"
 sign_cmd "$ABS_PATH/Contents/Resources/app/node_modules/keccak/prebuilds/darwin-x64/node.napi.node"
+sign_cmd "$ABS_PATH/Contents/Resources/app/node_modules/blake-hash/prebuilds/darwin-x64/node.napi.node"
+sign_cmd "$ABS_PATH/Contents/Resources/app/node_modules/tiny-secp256k1/build/Release/secp256k1.node"
 
 # Sign the whole component deeply
 sign_cmd "$ABS_PATH"
diff --git a/jest.config.js b/jest.config.js
index fba7a4c536..536e373727 100644
--- a/jest.config.js
+++ b/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
@@ -182,10 +183,10 @@ module.exports = {
   },
 
   // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
-  // transformIgnorePatterns: [
-  //   "/node_modules/",
-  //   "\\.pnp\\.[^\\/]+$"
-  // ],
+  transformIgnorePatterns: [
+    'node_modules/(?!react-polymorph)',
+    // "\\.pnp\\.[^\\/]+$"
+  ],
 
   // An array of regexp pattern strings that are matched against all modules before the module loader will automatically return a mock for them
   // unmockedModulePathPatterns: undefined,
diff --git a/nix/nsis-inner.nix b/nix/nsis-inner.nix
index 32ef9d2377..4dc4e26c08 100644
--- a/nix/nsis-inner.nix
+++ b/nix/nsis-inner.nix
@@ -43,7 +43,7 @@ in stdenv.mkDerivation {
   '';
 
   meta = with lib; {
-    descripition = "System to create Windows installers";
+    description = "System to create Windows installers";
     homepage = "https://nsis.sourceforge.io/";
   };
 }
diff --git a/nix/sources.json b/nix/sources.json
index 7c132cb34e..940f079cd6 100644
--- a/nix/sources.json
+++ b/nix/sources.json
@@ -1,14 +1,14 @@
 {
     "cardano-node": {
-        "branch": "tags/1.32.1",
+        "branch": "tags/1.33.0",
         "description": null,
         "homepage": null,
         "owner": "input-output-hk",
         "repo": "cardano-node",
-        "rev": "4f65fb9a27aa7e3a1873ab4211e412af780a3648",
-        "sha256": "00k9fqrm0gphjji23x0nc9z6bqh8bqrncgivn3mi3csacjzicrrx",
+        "rev": "814df2c146f5d56f8c35a681fe75e85b905aed5d",
+        "sha256": "1hr00wqzmcyc3x0kp2hyw78rfmimf6z4zd4vv85b9zv3nqbjgrik",
         "type": "tarball",
-        "url": "https://github.com/input-output-hk/cardano-node/archive/4f65fb9a27aa7e3a1873ab4211e412af780a3648.tar.gz",
+        "url": "https://github.com/input-output-hk/cardano-node/archive/814df2c146f5d56f8c35a681fe75e85b905aed5d.tar.gz",
         "url_template": "https://github.com/<owner>/<repo>/archive/<rev>.tar.gz"
     },
     "cardano-shell": {
@@ -24,15 +24,15 @@
         "url_template": "https://github.com/<owner>/<repo>/archive/<rev>.tar.gz"
     },
     "cardano-wallet": {
-        "branch": "anviking/ADP-1081/node-alonzo-rc",
+        "branch": "master",
         "description": "Official Wallet Backend & API for Cardano decentralized",
         "homepage": null,
         "owner": "input-output-hk",
         "repo": "cardano-wallet",
-        "rev": "760140e238a5fbca61d1b286d7a80ece058dc729",
-        "sha256": "014njpddrlqm9bbab636h2gf58zkm0bx04i1jsn07vh5j3k0gri6",
+        "rev": "a5085acbd2670c24251cf8d76a4e83c77a2679ba",
+        "sha256": "1apzfy7qdgf6l0lb3icqz3rvaq2w3a53xq6wvhqnbfi8i7cacy03",
         "type": "tarball",
-        "url": "https://github.com/input-output-hk/cardano-wallet/archive/760140e238a5fbca61d1b286d7a80ece058dc729.tar.gz",
+        "url": "https://github.com/input-output-hk/cardano-wallet/archive/a5085acbd2670c24251cf8d76a4e83c77a2679ba.tar.gz",
         "url_template": "https://github.com/<owner>/<repo>/archive/<rev>.tar.gz"
     },
     "gitignore": {
diff --git a/nix/yarn-nix-shell.sh b/nix/yarn-nix-shell.sh
new file mode 100755
index 0000000000..bccb6bf67e
--- /dev/null
+++ b/nix/yarn-nix-shell.sh
@@ -0,0 +1,33 @@
+#!/usr/bin/env bash
+
+# This small wrapper over `nix-shell`, called from package.json
+# (e.g. `yarn nix:testnet`) allows to specify an initial command to be
+# run inside the `nix-shell` once its ready, e.g.:
+#
+# $ yarn nix:testnet yarn dev
+#
+# After the command finishes, you will still be left inside the
+# nix-shell.
+
+if [ $# -lt 2 ] ; then
+   echo >&2 'fatal: usage: '"$0"' <network> <cluster> [<initial command> ...]'
+   exit 1
+fi
+
+NETWORK="$1" ; shift
+cluster="$1" ; shift
+
+# Unfortunately, we need to shell-escape the command:
+# cf. <https://github.com/NixOS/nixpkgs/blob/877eb10cfbdb3e3d54bdc7a7f6fd3c4b4e6396da/lib/strings.nix#L310-L328>
+command=''
+while [ $# -gt 0 ] ; do
+  command="$command '""${1//\'/\'\\\'\'}""'" ; shift
+done
+
+if [ -z "$command" ] ; then
+  command=':'   # no-op, if no command
+fi
+
+export NETWORK
+# `return` will make the user stay in `nix-shell` after the initial command finishes:
+exec nix-shell --argstr nodeImplementation cardano --argstr cluster "$cluster" --command "$command ; return"
diff --git a/package.json b/package.json
index bd6ad38e66..ce4c578c0c 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "daedalus",
   "productName": "Daedalus",
-  "version": "4.6.0",
+  "version": "4.9.0",
   "description": "Cryptocurrency Wallet",
   "main": "./dist/main/index.js",
   "scripts": {
@@ -40,25 +40,27 @@
     "cleanup": "mop -v",
     "lint": "eslint --format=node_modules/eslint-formatter-pretty source storybook utils  --ext .ts,.tsx",
     "compile": "tsc --noEmit",
+    "precompile": "yarn typedef:sass",
     "prettier": "./node_modules/.bin/prettier \"**/*.*\"",
     "prettier:check": "yarn prettier --check",
     "prettier:format": "yarn prettier --write --loglevel warn",
     "stylelint": "./node_modules/.bin/stylelint \"**/*.scss\"",
     "stylelint:fix": "yarn stylelint --fix",
-    "manage:translations": "gulp purge:translations && gulp clear:cache && yarn build && ts-node ./translations/translation-runner.ts",
+    "manage:translations": "gulp purge:translations && gulp clear:cache && gulp build && ts-node ./translations/translation-runner.ts",
     "storybook": "start-storybook -p 6006 -c storybook --ci /",
     "storybook:build": "build-storybook -c storybook -o dist/storybook",
+    "storybook:build:chromatic": "build-storybook -c storybook",
     "themes:check:createTheme": "gulp build:themes && ts-node -r esm ./dist/scripts/check.js",
     "themes:update": "gulp build:themes && ts-node -r esm ./dist/scripts/update.js && yarn prettier --loglevel warn --write source/renderer/app/themes/daedalus/*.ts",
-    "themes:copy": "babel-node source/renderer/app/themes/utils/copyTheme.ts && yarn prettier --loglevel warn --write source/renderer/app/themes/daedalus/*.ts",
+    "themes:copy": "ts-node -r @babel/register -r @babel/polyfill source/renderer/app/themes/utils/copyTheme.ts && yarn prettier --loglevel warn --write source/renderer/app/themes/daedalus/*.ts",
     "clear:cache": "gulp clear:cache",
-    "nix:alonzo_purple": "NETWORK=alonzo_purple nix-shell --argstr nodeImplementation cardano --argstr cluster alonzo_purple",
-    "nix:mainnet": "NETWORK=mainnet nix-shell --argstr nodeImplementation cardano --argstr cluster mainnet",
-    "nix:flight": "NETWORK=mainnet nix-shell --argstr nodeImplementation cardano --argstr cluster mainnet_flight",
-    "nix:selfnode": "NETWORK=selfnode nix-shell --argstr nodeImplementation cardano --argstr cluster selfnode",
-    "nix:shelley_qa": "NETWORK=shelley_qa nix-shell --argstr nodeImplementation cardano --argstr cluster shelley_qa",
-    "nix:staging": "NETWORK=staging nix-shell --argstr nodeImplementation cardano --argstr cluster staging",
-    "nix:testnet": "NETWORK=testnet nix-shell --argstr nodeImplementation cardano --argstr cluster testnet",
+    "nix:alonzo_purple": "./nix/yarn-nix-shell.sh alonzo_purple alonzo_purple",
+    "nix:mainnet": "./nix/yarn-nix-shell.sh mainnet mainnet",
+    "nix:flight": "./nix/yarn-nix-shell.sh mainnet mainnet_flight",
+    "nix:selfnode": "./nix/yarn-nix-shell.sh selfnode selfnode",
+    "nix:shelley_qa": "./nix/yarn-nix-shell.sh shelley_qa shelley_qa",
+    "nix:staging": "./nix/yarn-nix-shell.sh staging staging",
+    "nix:testnet": "./nix/yarn-nix-shell.sh testnet testnet",
     "byron:wallet:importer": "ts-node utils/api-importer/byron-wallet-importer.ts",
     "shelley:wallet:importer": "ts-node utils/api-importer/shelley-wallet-importer.ts",
     "mary:wallet:importer": "ts-node utils/api-importer/mary-wallet-importer.ts",
@@ -67,7 +69,9 @@
     "yoroi:wallet:importer": "ts-node utils/api-importer/yoroi-wallet-importer.ts",
     "create-news-verification-hashes": "ts-node utils/create-news-verification-hashes/index.ts",
     "lockfile:check": "ts-node utils/lockfile-checker/index.ts --check",
-    "lockfile:fix": "ts-node utils/lockfile-checker/index.ts --fix"
+    "lockfile:fix": "ts-node utils/lockfile-checker/index.ts --fix",
+    "postinstall": "./scripts/postinstall.sh",
+    "typedef:sass": "typed-scss-modules source/renderer/app"
   },
   "bin": {
     "electron": "./node_modules/.bin/electron"
@@ -100,12 +104,13 @@
     "@testing-library/jest-dom": "5.15.1",
     "@testing-library/react": "12.1.2",
     "@types/aes-js": "3.1.1",
-    "@types/node": "17.0.7",
+    "@types/jest": "27.4.0",
+    "@types/node": "17.0.12",
     "@types/qrcode.react": "1.0.2",
     "@types/react": "17.0.38",
     "@types/react-svg-inline": "2.1.3",
-    "@typescript-eslint/eslint-plugin": "5.9.0",
-    "@typescript-eslint/parser": "5.9.0",
+    "@typescript-eslint/eslint-plugin": "5.10.1",
+    "@typescript-eslint/parser": "5.10.1",
     "asar": "2.1.0",
     "autodll-webpack-plugin": "0.4.2",
     "axios": "0.24.0",
@@ -115,7 +120,7 @@
     "babel-plugin-react-intl": "3.0.1",
     "bufferutil": "4.0.1",
     "cache-loader": "4.1.0",
-    "chai": "4.2.0",
+    "chai": "4.3.4",
     "chalk": "4.1.0",
     "concurrently": "5.3.0",
     "cross-env": "7.0.2",
@@ -157,7 +162,7 @@
     "mini-css-extract-plugin": "2.3.0",
     "minimist": "1.2.5",
     "mobx-react-devtools": "6.1.1",
-    "node-forge": "0.10.0",
+    "node-forge": "1.0.0",
     "nodemon": "2.0.15",
     "npmlog": "4.1.2",
     "path-browserify": "1.0.1",
@@ -179,11 +184,12 @@
     "style-loader": "3.2.1",
     "stylelint": "13.7.2",
     "stylelint-order": "4.1.0",
-    "svg-inline-loader": "^0.8.2",
+    "svg-inline-loader": "0.8.2",
     "thread-loader": "2.1.3",
     "timemachine": "0.3.2",
     "transform-loader": "0.2.4",
     "ts-node": "10.4.0",
+    "typed-scss-modules": "5.0.0",
     "typescript": "4.5.4",
     "utf-8-validate": "5.0.2",
     "webdriverio": "5.18.7",
@@ -211,22 +217,24 @@
     "cardano-js": "0.4.8",
     "cardano-launcher": "0.20211105.1",
     "cbor": "5.0.2",
-    "check-disk-space": "3.1.0",
+    "check-disk-space": "3.2.0",
     "chroma-js": "2.1.0",
     "classnames": "2.2.6",
     "csv-stringify": "5.5.1",
     "cucumber-html-reporter": "5.2.0",
     "electron": "13.6.3",
     "electron-log-daedalus": "2.2.21",
-    "electron-store": "8.0.0",
+    "electron-store": "8.0.1",
     "es6-error": "4.1.1",
-    "find-process": "1.4.4",
+    "find-process": "1.4.7",
     "fireworks-js": "1.0.4",
     "form-data": "3.0.0",
     "fs-extra": "9.0.1",
+    "fuse.js": "6.5.3",
     "glob": "7.1.6",
     "graceful-fs": "4.2.4",
     "gulp": "4.0.2",
+    "highlight-words": "1.2.0",
     "history": "4.10.1",
     "humanize-duration": "3.23.1",
     "inquirer": "7.3.3",
@@ -240,6 +248,7 @@
     "mobx-react-form": "2.0.8",
     "mobx-react-router": "4.1.0",
     "moment": "2.29.0",
+    "nanoid": "3.2.0",
     "node-downloader-helper": "1.0.18",
     "omit-deep-lodash": "1.1.5",
     "pbkdf2": "3.1.2",
@@ -258,7 +267,7 @@
     "react-intl": "2.7.2",
     "react-lottie": "1.2.3",
     "react-markdown": "4.3.1",
-    "react-polymorph": "1.0.1",
+    "react-polymorph": "1.0.3",
     "react-router": "5.2.0",
     "react-router-dom": "5.2.0",
     "react-svg-inline": "2.1.1",
@@ -275,6 +284,7 @@
     "shasum": "1.0.2",
     "source-map-support": "0.5.19",
     "spectron-fake-dialog": "0.0.1",
+    "tail": "2.2.4",
     "tcp-port-used": "1.0.1",
     "trezor-connect": "8.2.4-extended",
     "unorm": "1.6.0",
@@ -283,7 +293,7 @@
     "validator": "13.7.0"
   },
   "devEngines": {
-    "node": "16.13.2",
+    "node": ">=16.13.2",
     "yarn": "1.22.4"
   },
   "husky": {
diff --git a/scripts/build-cross-windows.sh b/scripts/build-cross-windows.sh
index 1f9b0adcb5..5cec7e32d3 100755
--- a/scripts/build-cross-windows.sh
+++ b/scripts/build-cross-windows.sh
@@ -1,15 +1,15 @@
 #!/usr/bin/env bash
-
 set -e
+source "$(dirname "$0")/utils.sh"
 
 BUILDKITE_BUILD_NUMBER="$1"
 
 upload_artifacts() {
-  buildkite-agent artifact upload "$@" --job "$BUILDKITE_JOB_ID"
+  retry 5 buildkite-agent artifact upload "$@" --job "$BUILDKITE_JOB_ID"
 }
 
 upload_artifacts_public() {
-  buildkite-agent artifact upload "$@" "${ARTIFACT_BUCKET:-}" --job "$BUILDKITE_JOB_ID"
+  retry 5 buildkite-agent artifact upload "$@" "${ARTIFACT_BUCKET:-}" --job "$BUILDKITE_JOB_ID"
 }
 
 CLUSTERS="$(xargs echo -n < "$(dirname "$0")/../installer-clusters.cfg")"
diff --git a/scripts/build-installer-nix.sh b/scripts/build-installer-nix.sh
index d144c7923d..ea175313a3 100755
--- a/scripts/build-installer-nix.sh
+++ b/scripts/build-installer-nix.sh
@@ -1,15 +1,15 @@
 #!/usr/bin/env bash
-
 set -e
+source "$(dirname "$0")/utils.sh"
 
 BUILDKITE_BUILD_NUMBER="$1"
 
 upload_artifacts() {
-    buildkite-agent artifact upload "$@" --job "$BUILDKITE_JOB_ID"
+    retry 5 buildkite-agent artifact upload "$@" --job "$BUILDKITE_JOB_ID"
 }
 
 upload_artifacts_public() {
-    buildkite-agent artifact upload "$@" "${ARTIFACT_BUCKET:-}" --job "$BUILDKITE_JOB_ID"
+    retry 5 buildkite-agent artifact upload "$@" "${ARTIFACT_BUCKET:-}" --job "$BUILDKITE_JOB_ID"
 }
 
 rm -rf dist || true
diff --git a/scripts/build-installer-unix.sh b/scripts/build-installer-unix.sh
index ccb2bf6d1d..dbf717f4e3 100755
--- a/scripts/build-installer-unix.sh
+++ b/scripts/build-installer-unix.sh
@@ -1,53 +1,14 @@
 #!/usr/bin/env bash
+set -e
+source "$(dirname "$0")/utils.sh"
+
 # DEPENDENCIES (binaries should be in PATH):
 #   0. 'git'
 #   1. 'curl'
 #   2. 'nix-shell'
 
-set -e
-
 CLUSTERS="$(xargs echo -n < "$(dirname "$0")"/../installer-clusters.cfg)"
 
-usage() {
-    test -z "$1" || { echo "ERROR: $*" >&2; echo >&2; }
-    cat >&2 <<EOF
-  Usage:
-    $0 OPTIONS*
-
-  Build a Daedalus installer.
-
-  Options:
-    --clusters "[CLUSTER-NAME...]"
-                              Build installers for CLUSTERS.  Defaults to "mainnet staging testnet"
-    --fast-impure             Fast, impure, incremental build
-    --build-id BUILD-NO       Identifier of the build; defaults to '0'
-
-    --nix-path NIX-PATH       NIX_PATH value
-
-    --upload-s3               Upload the installer to S3
-    --test-installer          Test the installer for installability
-
-    --verbose                 Verbose operation
-    --quiet                   Disable verbose operation
-
-EOF
-    test -z "$1" || exit 1
-}
-
-arg2nz() { test $# -ge 2 -a ! -z "$2" || usage "empty value for" "$1"; }
-fail() { echo "ERROR: $*" >&2; exit 1; }
-retry() {
-        local tries=$1; arg2nz "iteration count" "$1"; shift
-        for i in $(seq 1 "${tries}")
-        do if "$@"
-           then return 0
-           else echo "failed, retry #$i of ${tries}"
-           fi
-           sleep 5s
-        done
-        fail "persistent failure to exec:  $*"
-}
-
 ###
 ### Argument processing
 ###
@@ -76,8 +37,8 @@ while test $# -ge 1
 do case "$1" in
            --clusters )                                     CLUSTERS="$2"; shift;;
            --fast-impure )                               export fast_impure=true;;
-           --build-id )       arg2nz "build identifier" "$2"; build_id="$2"; shift;;
-           --nix-path )       arg2nz "NIX_PATH value" "$2";
+           --build-id )       validate_arguments "build identifier" "$2"; build_id="$2"; shift;;
+           --nix-path )       validate_arguments "NIX_PATH value" "$2";
                                                      export NIX_PATH="$2"; shift;;
            --test-installer )                         test_installer="--test-installer";;
 
@@ -117,11 +78,11 @@ export PATH=$HOME/.local/bin:$PATH
 if [ -n "${NIX_SSL_CERT_FILE-}" ]; then export SSL_CERT_FILE=$NIX_SSL_CERT_FILE; fi
 
 upload_artifacts() {
-    buildkite-agent artifact upload "$@" --job "$BUILDKITE_JOB_ID"
+    retry 5 buildkite-agent artifact upload "$@" --job "$BUILDKITE_JOB_ID"
 }
 
 upload_artifacts_public() {
-    buildkite-agent artifact upload "$@" "${ARTIFACT_BUCKET:-}" --job "$BUILDKITE_JOB_ID"
+    retry 5 buildkite-agent artifact upload "$@" "${ARTIFACT_BUCKET:-}" --job "$BUILDKITE_JOB_ID"
 }
 
 function checkItnCluster() {
diff --git a/scripts/postinstall.sh b/scripts/postinstall.sh
new file mode 100755
index 0000000000..b361f58733
--- /dev/null
+++ b/scripts/postinstall.sh
@@ -0,0 +1,5 @@
+#!/usr/bin/env bash
+
+if [[ "$CI" != "true" ]]; then
+  yarn lockfile:fix
+fi
diff --git a/scripts/utils.sh b/scripts/utils.sh
new file mode 100755
index 0000000000..1174bb4503
--- /dev/null
+++ b/scripts/utils.sh
@@ -0,0 +1,49 @@
+#!/usr/bin/env bash
+
+usage() {
+  test -z "$1" || { echo "ERROR: $*" >&2; echo >&2; }
+  cat >&2 <<EOF
+  Usage:
+    $0 OPTIONS*
+
+  Build a Daedalus installer.
+
+  Options:
+    --clusters "[CLUSTER-NAME...]"
+                              Build installers for CLUSTERS.  Defaults to "mainnet staging testnet"
+    --fast-impure             Fast, impure, incremental build
+    --build-id BUILD-NO       Identifier of the build; defaults to '0'
+
+    --nix-path NIX-PATH       NIX_PATH value
+
+    --upload-s3               Upload the installer to S3
+    --test-installer          Test the installer for installability
+
+    --verbose                 Verbose operation
+    --quiet                   Disable verbose operation
+
+EOF
+    test -z "$1" || exit 1
+}
+
+validate_arguments() { test $# -ge 2 -a ! -z "$2" || usage "empty value for" "$1"; }
+
+fail() {
+  echo "ERROR: $*" >&2
+  exit 1
+}
+
+retry() {
+  local tries=$1
+  validate_arguments "iteration count" "$1"
+  shift
+  for i in $(seq 1 "${tries}"); do
+    if "$@"; then
+      return 0
+    else
+      echo "failed, retry #$i of ${tries}"
+    fi
+    sleep 5
+  done
+  fail "persistent failure to exec:  $*"
+}
diff --git a/source/common/config/downloadManagerConfig.ts b/source/common/config/downloadManagerConfig.ts
index 8e2b82b4a3..4030c5e22a 100644
--- a/source/common/config/downloadManagerConfig.ts
+++ b/source/common/config/downloadManagerConfig.ts
@@ -1,14 +1,13 @@
 // https://www.npmjs.com/package/node-downloader-helper
 import type {
-  AllowedDownloadDirectories,
+  AllowedDownloadDirectoriesValues,
+  AllowedDownloadDirectoriesKeys,
+  AllowedDownloadDirectoriesMap,
   DownloadState,
   DownloadEventType,
 } from '../types/downloadManager.types';
 
-export const ALLOWED_DOWNLOAD_DIRECTORIES: Record<
-  string,
-  AllowedDownloadDirectories
-> = {
+export const ALLOWED_DOWNLOAD_DIRECTORIES: AllowedDownloadDirectoriesMap = {
   DOWNLOADS: 'downloads',
   DESKTOP: 'desktop',
   STATE_DIRECTORY: 'stateDirectory',
diff --git a/source/common/config/electron-store.config.ts b/source/common/config/electron-store.config.ts
index ba08b4aa2e..7455f7c4ff 100644
--- a/source/common/config/electron-store.config.ts
+++ b/source/common/config/electron-store.config.ts
@@ -10,19 +10,17 @@ export const STORAGE_KEYS: Record<string, StorageKey> = {
   APP_AUTOMATIC_UPDATE_FAILED: 'APP-AUTOMATIC-UPDATE-FAILED',
   APP_UPDATE_COMPLETED: 'APP-UPDATE-COMPLETED',
   ASSET_DATA: 'ASSET-DATA',
-  ASSET_SETTINGS_DIALOG_WAS_OPENED: 'ASSET-SETTINGS-DIALOG-WAS-OPENED',
   CURRENCY_ACTIVE: 'CURRENCY-ACTIVE',
   CURRENCY_SELECTED: 'CURRENCY-SELECTED',
   DATA_LAYER_MIGRATION_ACCEPTANCE: 'DATA-LAYER-MIGRATION-ACCEPTANCE',
   DISCREET_MODE_ENABLED: 'DISCREET-MODE-ENABLED',
-  DISCREET_MODE_SETTINGS_TOOLTIP: 'DISCREET-MODE-SETTINGS-TOOLTIP',
-  DISCREET_MODE_NOTIFICATION: 'DISCREET-MODE-NOTIFICATION',
   DOWNLOAD_MANAGER: 'DOWNLOAD-MANAGER',
   HARDWARE_WALLETS: 'HARDWARE-WALLETS',
   HARDWARE_WALLET_DEVICES: 'HARDWARE-WALLET-DEVICES',
   READ_NEWS: 'READ-NEWS',
   RESET: 'RESET',
   SMASH_SERVER: 'SMASH-SERVER',
+  STAKE_POOLS_LIST_VIEW_TOOLTIP: 'STAKE-POOLS-LIST-VIEW-TOOLTIP',
   STAKING_INFO_WAS_OPEN: 'ALONZO-INFO-WAS-OPEN',
   TERMS_OF_USE_ACCEPTANCE: 'TERMS-OF-USE-ACCEPTANCE',
   THEME: 'THEME',
diff --git a/source/common/ipc/api.ts b/source/common/ipc/api.ts
index dd69d9cb06..fe58d9c20d 100644
--- a/source/common/ipc/api.ts
+++ b/source/common/ipc/api.ts
@@ -14,6 +14,7 @@ import type { GenerateVotingPDFParams } from '../types/voting-pdf-request.types'
 import type { GenerateCsvParams } from '../types/csv-request.types';
 import type { GenerateQRCodeParams } from '../types/save-qrCode.types';
 import type {
+  BlockSyncType,
   CardanoNodeState,
   CardanoStatus,
   FaultInjectionIpcRequest,
@@ -177,9 +178,16 @@ export type SubmitBugReportRequestMainResponse = void;
 /**
  * Channel to rebuild the electron application menu after the language setting changes
  */
+export enum WalletSettingsStateEnum {
+  hidden = 'hidden',
+  disabled = 'disabled',
+  enabled = 'enabled',
+}
+
 export const REBUILD_APP_MENU_CHANNEL = 'REBUILD_APP_MENU_CHANNEL';
 export type RebuildAppMenuRendererRequest = {
   isNavigationEnabled: boolean;
+  walletSettingsState: WalletSettingsStateEnum;
 };
 export type RebuildAppMenuMainResponse = void;
 
@@ -312,14 +320,6 @@ export type GenerateWalletMigrationReportRendererRequest =
   WalletMigrationReportData;
 export type GenerateWalletMigrationReportMainResponse = void;
 
-/**
- * Channel for enabling application menu navigation
- */
-export const ENABLE_APPLICATION_MENU_NAVIGATION_CHANNEL =
-  'ENABLE_APPLICATION_MENU_NAVIGATION_CHANNEL';
-export type EnableApplicationMenuNavigationRendererRequest = void;
-export type EnableApplicationMenuNavigationMainResponse = void;
-
 /**
  * Channel for generating wallet migration report
  */
@@ -456,9 +456,13 @@ export type IntrospectAddressMainResponse = IntrospectAddressResponse;
 /**
  * Channel for checking block replay progress
  */
-export const GET_BLOCK_REPLAY_STATUS_CHANNEL = 'GetBlockReplayProgressChannel';
-export type GetBlockReplayProgressRendererRequest = void;
-export type GetBlockReplayProgressMainResponse = number;
+export const GET_BLOCK_SYNC_PROGRESS_CHANNEL = 'GetBlockSyncProgressChannel';
+export type GetBlockSyncProgressType = BlockSyncType;
+export type GetBlockSyncProgressRendererRequest = void;
+export type GetBlockSyncProgressMainResponse = {
+  progress: number;
+  type: GetBlockSyncProgressType;
+};
 
 /**
  * Channels for connecting / interacting with Hardware Wallet devices
@@ -482,9 +486,9 @@ export type getCardanoAdaAppRendererRequest = {
 export type getCardanoAdaAppMainResponse = HardwareWalletCardanoAdaAppResponse;
 export const GET_HARDWARE_WALLET_CONNECTION_CHANNEL =
   'GET_HARDWARE_WALLET_CONNECTION_CHANNEL';
-export type getHardwareWalletConnectiontMainRequest =
+export type getHardwareWalletConnectionMainRequest =
   HardwareWalletConnectionRequest;
-export type getHardwareWalletConnectiontRendererResponse = Record<string, any>;
+export type getHardwareWalletConnectionRendererResponse = Record<string, any>;
 export const SIGN_TRANSACTION_LEDGER_CHANNEL =
   'SIGN_TRANSACTION_LEDGER_CHANNEL';
 export type signTransactionLedgerRendererRequest = LedgerSignTransactionRequest;
@@ -513,3 +517,6 @@ export type deriveAddressMainResponse = string;
 export const SHOW_ADDRESS_CHANNEL = 'SHOW_ADDRESS_CHANNEL';
 export type showAddressRendererRequest = showAddressRendererRequestType;
 export type showAddressMainResponse = void;
+export const TOGGLE_RTS_FLAGS_MODE_CHANNEL = 'TOGGLE_RTS_FLAGS_MODE_CHANNEL';
+export type ToggleRTSFlagsModeRendererRequest = void;
+export type ToggleRTSFlagsModeMainResponse = void;
diff --git a/source/common/ipc/constants.ts b/source/common/ipc/constants.ts
index 727b0ca928..75bdd93820 100644
--- a/source/common/ipc/constants.ts
+++ b/source/common/ipc/constants.ts
@@ -2,6 +2,7 @@ export const DIALOGS = {
   ABOUT: 'ABOUT_DIALOG',
   DAEDALUS_DIAGNOSTICS: 'DAEDALUS_DIAGNOSTICS_DIALOG',
   ITN_REWARDS_REDEMPTION: 'ITN_REWARDS_REDEMPTION_DIALOG',
+  TOGGLE_RTS_FLAGS_MODE: 'TOGGLE_RTS_FLAGS_MODE_DIALOG',
 };
 export const NOTIFICATIONS = {
   DOWNLOAD_LOGS: 'DOWNLOAD_LOGS_NOTIFICATION',
diff --git a/source/common/types/address-introspection.types.ts b/source/common/types/address-introspection.types.ts
index 7c96e0bea1..fca6abf3cf 100644
--- a/source/common/types/address-introspection.types.ts
+++ b/source/common/types/address-introspection.types.ts
@@ -1,33 +1,26 @@
 export type IntrospectAddressRequest = {
   input: string;
 };
-
 export type AddressStyle = 'Byron' | 'Icarus' | 'Shelley';
-
 export type AddressType = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 14 | 15;
-
 export type ChainPointer = {
   slot_num: number;
   transaction_index: number;
   output_index: number;
 };
-
 export type AddressBase = {
   address_type: AddressType;
   address_style: AddressStyle;
   network_tag: number | null;
   stake_reference: 'none' | 'by pointer' | 'by value';
 };
-
 export type ByronAddress = AddressBase & {
   address_root: string;
   derivation_path: string;
 };
-
 export type IcarusAddress = AddressBase & {
   address_root: string;
 };
-
 export type ShelleyAddress = AddressBase & {
   pointer?: ChainPointer;
   script_hash?: string;
@@ -35,7 +28,6 @@ export type ShelleyAddress = AddressBase & {
   stake_key_hash?: string;
   stake_script_hash?: string;
 };
-
 export type IntrospectAddressResponse =
   | {
       introspection: ByronAddress | IcarusAddress | ShelleyAddress;
diff --git a/source/common/types/cardano-node.types.ts b/source/common/types/cardano-node.types.ts
index 563516195c..fcc526b29f 100644
--- a/source/common/types/cardano-node.types.ts
+++ b/source/common/types/cardano-node.types.ts
@@ -1,4 +1,3 @@
-import { EnumMap } from '../../renderer/app/types/enumTypes';
 import {
   MAINNET,
   TESTNET,
@@ -54,7 +53,7 @@ export type CardanoNodeState =
   | 'errored'
   | 'unknown'
   | 'unrecoverable';
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const CardanoNodeStates: EnumMap<string, CardanoNodeState> = {
   STARTING: 'starting',
   RUNNING: 'running',
@@ -136,6 +135,7 @@ export type CardanoStatus = {
   hasBeenConnected: boolean;
   cardanoNodePID: number;
   cardanoWalletPID: number;
+  isRTSFlagsModeEnabled: boolean;
 };
 export type NetworkMagicType = Array<number | null | undefined>;
 export const NetworkMagics: {
@@ -159,3 +159,8 @@ export const NetworkMagics: {
   // Cardano Selfnode network magic
   [SELFNODE]: [1, null],
 };
+export enum BlockSyncType {
+  pushingLedger = 'pushingLedger',
+  replayedBlock = 'replayedBlock',
+  validatingChunk = 'validatingChunk',
+}
diff --git a/source/common/types/downloadManager.types.ts b/source/common/types/downloadManager.types.ts
index 6b7b2ddd51..33c7fba9d3 100644
--- a/source/common/types/downloadManager.types.ts
+++ b/source/common/types/downloadManager.types.ts
@@ -1,7 +1,17 @@
-export type AllowedDownloadDirectories =
+export type AllowedDownloadDirectoriesValues =
   | 'stateDirectory'
   | 'downloads'
   | 'desktop';
+
+export type AllowedDownloadDirectoriesKeys =
+  | 'DOWNLOADS'
+  | 'DESKTOP'
+  | 'STATE_DIRECTORY';
+
+export type AllowedDownloadDirectoriesMap = {
+  [day in AllowedDownloadDirectoriesKeys]: AllowedDownloadDirectoriesValues;
+};
+
 // https://www.npmjs.com/package/node-downloader-helper
 export type DownloadRequest = {
   /**
@@ -12,7 +22,7 @@ export type DownloadRequest = {
    */
   id?: string;
   fileUrl: string;
-  destinationDirectoryName?: AllowedDownloadDirectories;
+  destinationDirectoryName?: AllowedDownloadDirectoriesValues;
   options?: DownloadRequestOptions | null | undefined;
   resumeDownload?: {
     temporaryFilename: string;
@@ -47,7 +57,7 @@ export type DownloadRequestOptions = {
   httpsRequestOptions?: Record<string, any>;
   // Override the https request options, ex: to add SSL Certs
   progressIsThrottled?: boolean;
-  // by default, the progress is sent every second. if `false` it will be sent every milisecond
+  // by default, the progress is sent every second. if `false` it will be sent every millisecond
   persistLocalData?: boolean; // by default, the localdata information is deleted after the end of the download
 };
 // https://www.npmjs.com/package/node-downloader-helper
@@ -82,7 +92,7 @@ export type DownloadInfo = {
   fileUrl: string;
   originalFilename: string;
   temporaryFilename: string;
-  destinationDirectoryName: AllowedDownloadDirectories;
+  destinationDirectoryName: AllowedDownloadDirectoriesValues;
   destinationPath: string;
   options: DownloadRequestOptions;
 };
@@ -138,7 +148,7 @@ export type DownloadInfoProgress = {
   downloaded: number;
   // downloaded size in bytes
   progress: number;
-  // progress porcentage 0-100%
+  // progress percentage 0-100%
   speed: number; // download speed in bytes
 };
 export type DownloadInfoEnd = {
@@ -147,7 +157,7 @@ export type DownloadInfoEnd = {
   totalSize: number;
   // total file size got from the server
   incomplete: boolean;
-  // true/false if the download endend but still incomplete
+  // true/false if the download ended but still incomplete
   onDiskSize: number;
   // total size of file on the disk
   downloadedSize: number; // the total size downloaded
diff --git a/source/common/types/electron-store.types.ts b/source/common/types/electron-store.types.ts
index 01b13b9c82..bb3481c833 100644
--- a/source/common/types/electron-store.types.ts
+++ b/source/common/types/electron-store.types.ts
@@ -9,14 +9,13 @@ export type StorageKey =
   | 'CURRENCY-SELECTED'
   | 'DATA-LAYER-MIGRATION-ACCEPTANCE'
   | 'DISCREET-MODE-ENABLED'
-  | 'DISCREET-MODE-SETTINGS-TOOLTIP'
-  | 'DISCREET-MODE-NOTIFICATION'
   | 'DOWNLOAD-MANAGER'
   | 'HARDWARE-WALLET-DEVICES'
   | 'HARDWARE-WALLETS'
   | 'READ-NEWS'
   | 'RESET'
   | 'SMASH-SERVER'
+  | 'STAKE-POOLS-LIST-VIEW-TOOLTIP'
   | 'TERMS-OF-USE-ACCEPTANCE'
   | 'THEME'
   | 'TOKEN-FAVORITES'
diff --git a/source/common/types/environment.types.ts b/source/common/types/environment.types.ts
index 3b8ca04250..8513e67d0f 100644
--- a/source/common/types/environment.types.ts
+++ b/source/common/types/environment.types.ts
@@ -24,6 +24,7 @@ export type Environment = {
   os: string;
   cpu: string;
   ram: number;
+  hasMetHardwareRequirements: boolean;
   installerVersion: string;
   version: string;
   isWindows: boolean;
@@ -71,3 +72,9 @@ export const networkPrettyNames = {
   selfnode: 'Selfnode',
   development: 'Development',
 };
+export type CpuThreadData = {
+  model: string;
+  speed: number;
+  times: Record<string, number>;
+};
+export type Cpu = Array<CpuThreadData>;
diff --git a/source/common/types/logging.types.ts b/source/common/types/logging.types.ts
index 9aa2f77368..e8d93af11e 100644
--- a/source/common/types/logging.types.ts
+++ b/source/common/types/logging.types.ts
@@ -19,10 +19,10 @@ import type { AdaApiStakePool } from '../../renderer/app/api/staking/types';
 
 export type LoggingLevel = 'debug' | 'info' | 'error' | 'warn';
 export type Logger = {
-  debug: (arg0: string, arg1: Record<string, any> | null | undefined) => void;
-  info: (arg0: string, arg1: Record<string, any> | null | undefined) => void;
-  error: (arg0: string, arg1: Record<string, any> | null | undefined) => void;
-  warn: (arg0: string, arg1: Record<string, any> | null | undefined) => void;
+  debug: (arg0: string, arg1?: Record<string, any> | null | undefined) => void;
+  info: (arg0: string, arg1?: Record<string, any> | null | undefined) => void;
+  error: (arg0: string, arg1?: Record<string, any> | null | undefined) => void;
+  warn: (arg0: string, arg1?: Record<string, any> | null | undefined) => void;
 };
 export type FormatMessageContextParams = {
   appName: string;
diff --git a/source/main/cardano/CardanoNode.ts b/source/main/cardano/CardanoNode.ts
index 6f707257de..4f2e34292a 100644
--- a/source/main/cardano/CardanoNode.ts
+++ b/source/main/cardano/CardanoNode.ts
@@ -29,6 +29,7 @@ import { CardanoSelfnodeLauncher } from './CardanoSelfnodeLauncher';
 import { launcherConfig } from '../config';
 import type { NodeConfig } from '../config';
 import type { Logger } from '../../common/types/logging.types';
+import { containsRTSFlags } from '../utils/containsRTSFlags';
 
 /* eslint-disable consistent-return */
 type Actions = {
@@ -84,6 +85,7 @@ export type CardanoNodeConfig = {
   // Path to cardano-cli executable
   isStaging: boolean;
   metadataUrl?: string;
+  rtsFlags: Array<string>;
 };
 const CARDANO_UPDATE_EXIT_CODE = 20;
 // grab the current network on which Daedalus is running
@@ -229,6 +231,7 @@ export class CardanoNode {
     return Object.assign({}, this._status, {
       cardanoNodePID: get(this, '_node.pid', 0),
       cardanoWalletPID: get(this, '_node.wpid', 0),
+      isRTSFlagsModeEnabled: containsRTSFlags(this._config.rtsFlags),
     });
   }
 
@@ -519,7 +522,7 @@ export class CardanoNode {
   }
 
   /**
-   * Kills cardano-node and waitsup to `killTimeout` for the node to
+   * Kills cardano-node and waits up to `killTimeout` for the node to
    * report the exit message.
    *
    * @returns {Promise<void>} resolves if the node could be killed, rejects with error otherwise.
diff --git a/source/main/cardano/CardanoWalletLauncher.ts b/source/main/cardano/CardanoWalletLauncher.ts
index 70afc2f22b..c825ae36c7 100644
--- a/source/main/cardano/CardanoWalletLauncher.ts
+++ b/source/main/cardano/CardanoWalletLauncher.ts
@@ -35,6 +35,7 @@ export type WalletOptions = {
   cliBin: string;
   isStaging: boolean;
   metadataUrl?: string;
+  rtsFlags: Array<string>;
 };
 export async function CardanoWalletLauncher(
   walletOptions: WalletOptions
@@ -54,6 +55,7 @@ export async function CardanoWalletLauncher(
     cliBin,
     isStaging,
     metadataUrl,
+    rtsFlags,
   } = walletOptions;
   // TODO: Update launcher config to pass number
   const syncToleranceSeconds = parseInt(syncTolerance.replace('s', ''), 10);
@@ -146,11 +148,20 @@ export async function CardanoWalletLauncher(
       logger.info('Launching Wallet with --token-metadata-server flag', {
         tokenMetadataServer,
       });
+
       // RTS flags:
-      nodeConfig.rtsOpts = [];
-      logger.info('Launching Cardano Node with RTS flags', {
-        rtsFlags: nodeConfig.rtsOpts,
-      });
+      // 1) "-H4G -M6553M -c70"  16.0% peak RSS reduction and a sub-percentile CPU regression
+      // 2) "-H4G -M6553M"       18.5% peak RSS reduction and a second-best CPU regression
+      if (!!rtsFlags && rtsFlags?.length > 0) {
+        nodeConfig.rtsOpts = rtsFlags;
+        logger.info('Launching Cardano Node with RTS flags', {
+          rtsFlags,
+        });
+      } else {
+        // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
+        logger.info('Launching Cardano Node without RTS flags');
+      }
+
       merge(launcherConfig, {
         nodeConfig,
         tlsConfiguration,
diff --git a/source/main/cardano/setup.ts b/source/main/cardano/setup.ts
index 5be36aa199..f56f496ad2 100644
--- a/source/main/cardano/setup.ts
+++ b/source/main/cardano/setup.ts
@@ -49,10 +49,12 @@ const restartCardanoNode = async (node: CardanoNode) => {
  *
  * @param launcherConfig {LauncherConfig}
  * @param mainWindow
+ * @param rtsFlags flags used to start cardano-node
  */
 export const setupCardanoNode = (
   launcherConfig: LauncherConfig,
-  mainWindow: BrowserWindow
+  mainWindow: BrowserWindow,
+  rtsFlags: Array<string>
 ): CardanoNode => {
   const {
     logsPrefix,
@@ -78,6 +80,7 @@ export const setupCardanoNode = (
     configPath,
     syncTolerance,
     cliBin,
+    rtsFlags,
     isStaging,
     metadataUrl,
     startupTimeout: NODE_STARTUP_TIMEOUT,
diff --git a/source/main/config.ts b/source/main/config.ts
index 93968a36b0..9dd57d40b9 100644
--- a/source/main/config.ts
+++ b/source/main/config.ts
@@ -103,7 +103,7 @@ export const windowOptions: WindowOptionsType = {
     nodeIntegration: isTest,
     webviewTag: false,
     enableRemoteModule: isTest,
-    preload: path.join(__dirname, './preload.ts'),
+    preload: path.join(__dirname, './preload.js'),
     // @ts-ignore ts-migrate(2322) FIXME: Type '{ nodeIntegration: boolean; webviewTag: fals... Remove this comment to see the full error message
     additionalArguments: isBlankScreenFixActive ? ['--safe-mode'] : [],
   },
@@ -132,11 +132,11 @@ export const buildLabel = getBuildLabel(
 );
 // Logging config
 export const ALLOWED_LOGS = [
-  'Daedalus.tson',
-  'System-info.tson',
-  'Daedalus-versions.tson',
-  'State-snapshot.tson',
-  'Wallet-migration-report.tson',
+  'Daedalus.json',
+  'System-info.json',
+  'Daedalus-versions.json',
+  'State-snapshot.json',
+  'Wallet-migration-report.json',
   'cardano-wallet.log',
   'node.log',
 ];
@@ -171,12 +171,13 @@ export const DISK_SPACE_RECOMMENDED_PERCENTAGE = 15; // 15% of the total disk sp
 
 export const DISK_SPACE_CHECK_TIMEOUT = 9 * 1000; // Timeout for checking disks pace
 
-export const BLOCK_REPLAY_PROGRESS_CHECK_INTERVAL = 1 * 1000; // 1 seconds | unit: milliseconds
-
 // Used if token metadata server URL is not defined in launcher config
 export const FALLBACK_TOKEN_METADATA_SERVER_URL =
   'https://metadata.cardano-testnet.iohkdev.io';
+export const MINIMUM_AMOUNT_OF_RAM_FOR_RTS_FLAGS = 16 * 1024 * 1024 * 1024; // 16gb RAM
+
 // Used by mock-token-metadata-server
 export const MOCK_TOKEN_METADATA_SERVER_URL = 'http://localhost';
 export const MOCK_TOKEN_METADATA_SERVER_PORT =
   process.env.MOCK_TOKEN_METADATA_SERVER_PORT || 0;
+export const RTS_FLAGS = ['-c'];
diff --git a/source/main/environment.ts b/source/main/environment.ts
index da9286c61e..89eab9f420 100644
--- a/source/main/environment.ts
+++ b/source/main/environment.ts
@@ -19,6 +19,12 @@ import {
   checkIsWindows,
   checkIsLinux,
 } from '../common/utils/environmentCheckers';
+// Daedalus requires minimum 16 gigabytes of RAM, but some devices having 16 GB
+// actually have a slightly smaller RAM size (eg. 15.99 GB), therefore we used 15 GB threshold
+//
+// TODO figure out better place for it - can't import from config.js as it would be a circular dep
+// https://input-output.atlassian.net/browse/DDW-928
+export const RECOMMENDED_RAM_IN_BYTES = 15 * 1024 * 1024 * 1024;
 
 /* ==================================================================
 =                           Evaluations                             =
@@ -36,14 +42,10 @@ const isAlonzoPurple = checkIsAlonzoPurple(NETWORK);
 const isShelleyQA = checkIsShelleyQA(NETWORK);
 const isSelfnode = checkIsSelfnode(NETWORK);
 const isDevelopment = checkIsDevelopment(NETWORK);
-const isWatchMode =
-  (process.env.IS_WATCH_MODE && process.env.IS_WATCH_MODE === 'true') || false;
-const keepLocalClusterRunning =
-  (process.env.KEEP_LOCAL_CLUSTER_RUNNING &&
-    process.env.KEEP_LOCAL_CLUSTER_RUNNING === 'true') ||
-  false;
+const keepLocalClusterRunning = process.env.KEEP_LOCAL_CLUSTER_RUNNING;
 const API_VERSION = process.env.API_VERSION || 'dev';
-const NODE_VERSION = '1.32.1'; // TODO: pick up this value from process.env
+const NODE_VERSION = '1.33.0'; // TODO: pick up this value from process.env
+
 const mainProcessID = get(process, 'ppid', '-');
 const rendererProcessID = process.pid;
 const PLATFORM = os.platform();
@@ -51,13 +53,12 @@ const PLATFORM_VERSION = os.release();
 const OS = OS_NAMES[PLATFORM] || PLATFORM;
 const cpu = os.cpus();
 const ram = os.totalmem();
+const hasMetHardwareRequirements = ram >= RECOMMENDED_RAM_IN_BYTES;
 const isBlankScreenFixActive = includes(process.argv.slice(1), '--safe-mode');
 const BUILD = process.env.BUILD_NUMBER || 'dev';
 const BUILD_NUMBER = uniq([API_VERSION, BUILD]).join('.');
 const INSTALLER_VERSION = uniq([API_VERSION, BUILD]).join('.');
-const MOBX_DEV_TOOLS =
-  (process.env.MOBX_DEV_TOOLS && process.env.MOBX_DEV_TOOLS === 'true') ||
-  false;
+const MOBX_DEV_TOOLS = process.env.MOBX_DEV_TOOLS || false;
 const isMacOS = checkIsMacOS(PLATFORM);
 const isWindows = checkIsWindows(PLATFORM);
 const isLinux = checkIsLinux(PLATFORM);
@@ -101,6 +102,7 @@ export const environment: Environment = Object.assign(
     isLinux,
     isBlankScreenFixActive,
     keepLocalClusterRunning,
+    hasMetHardwareRequirements,
   },
   process.env
 );
diff --git a/source/main/index.ts b/source/main/index.ts
index c21a57c0af..c3d1794ec7 100644
--- a/source/main/index.ts
+++ b/source/main/index.ts
@@ -1,7 +1,10 @@
 import os from 'os';
 import path from 'path';
 import { app, dialog, BrowserWindow, screen, shell } from 'electron';
+import type { Event } from 'electron';
+import { client } from 'electron-connect';
 import EventEmitter from 'events';
+import { WalletSettingsStateEnum } from '../common/ipc/api';
 import { requestElectronStore } from './ipc/electronStoreConversation';
 import { logger } from './utils/logging';
 import {
@@ -19,6 +22,7 @@ import mainErrorHandler from './utils/mainErrorHandler';
 import {
   launcherConfig,
   pubLogsFolderPath,
+  RTS_FLAGS,
   stateDirectoryPath,
 } from './config';
 import { setupCardanoNode } from './cardano/setup';
@@ -40,12 +44,17 @@ import type {
 import { logUsedVersion } from './utils/logUsedVersion';
 import { setStateSnapshotLogChannel } from './ipc/set-log-state-snapshot';
 import { generateWalletMigrationReportChannel } from './ipc/generateWalletMigrationReportChannel';
-import { enableApplicationMenuNavigationChannel } from './ipc/enableApplicationMenuNavigationChannel';
 import { pauseActiveDownloads } from './ipc/downloadManagerChannel';
 import {
   restoreSavedWindowBounds,
   saveWindowBoundsOnSizeAndPositionChange,
 } from './windows/windowBounds';
+import {
+  getRtsFlagsSettings,
+  storeRtsFlagsSettings,
+} from './utils/rtsFlagsSettings';
+import { toggleRTSFlagsModeChannel } from './ipc/toggleRTSFlagsModeChannel';
+import { containsRTSFlags } from './utils/containsRTSFlags';
 
 /* eslint-disable consistent-return */
 // Global references to windows to prevent them from being garbage collected
@@ -54,6 +63,7 @@ let cardanoNode: CardanoNode;
 const {
   isDev,
   isTest,
+  isWatchMode,
   isBlankScreenFixActive,
   isSelfnode,
   network,
@@ -80,6 +90,7 @@ const safeExit = async () => {
   pauseActiveDownloads();
 
   if (!cardanoNode || cardanoNode.state === CardanoNodeStates.STOPPED) {
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('Daedalus:safeExit: exiting Daedalus with code 0', {
       code: 0,
     });
@@ -95,15 +106,18 @@ const safeExit = async () => {
 
   try {
     const pid = cardanoNode.pid || 'null';
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info(`Daedalus:safeExit: stopping cardano-node with PID: ${pid}`, {
       pid,
     });
     await cardanoNode.stop();
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('Daedalus:safeExit: exiting Daedalus with code 0', {
       code: 0,
     });
     safeExitWithCode(0);
   } catch (error) {
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.error('Daedalus:safeExit: cardano-node did not exit correctly', {
       error,
     });
@@ -111,6 +125,13 @@ const safeExit = async () => {
   }
 };
 
+const handleWindowClose = async (event: Event | null | undefined) => {
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
+  logger.info('mainWindow received <close> event. Safe exiting Daedalus now.');
+  event?.preventDefault();
+  await safeExit();
+};
+
 const onAppReady = async () => {
   setupLogging();
   logUsedVersion(
@@ -142,13 +163,17 @@ const onAppReady = async () => {
     process.env.PATH,
     process.env.DAEDALUS_INSTALL_DIRECTORY,
   ].join(path.delimiter);
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
   logger.info(`Daedalus is starting at ${startTime}`, {
     startTime,
   });
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
   logger.info('Updating System-info.json file', { ...systemInfo.data });
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
   logger.info(`Current working directory is: ${process.cwd()}`, {
     cwd: process.cwd(),
   });
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
   logger.info('System and user locale', {
     systemLocale,
     userLocale,
@@ -157,50 +182,48 @@ const onAppReady = async () => {
   await installChromeExtensions(isDev);
   // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
   logger.info('Setting up Main Window...');
-  // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'unknown' is not assignable to pa... Remove this comment to see the full error message
-  mainWindow = createMainWindow(userLocale, () =>
+  mainWindow = createMainWindow(
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'unknown' is not assignable to pa... Remove this comment to see the full error message
+    userLocale,
     // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'Electron.Screen' is not assignab... Remove this comment to see the full error message
     restoreSavedWindowBounds(screen, requestElectronStore)
   );
   saveWindowBoundsOnSizeAndPositionChange(mainWindow, requestElectronStore);
+  const currentRtsFlags = getRtsFlagsSettings(network) || [];
   // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
-  logger.info('Setting up Cardano Node...');
-  cardanoNode = setupCardanoNode(launcherConfig, mainWindow);
+  logger.info(
+    `Setting up Cardano Node... with flags: ${JSON.stringify(currentRtsFlags)}`
+  );
+  cardanoNode = setupCardanoNode(launcherConfig, mainWindow, currentRtsFlags);
   // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'unknown' is not assignable to pa... Remove this comment to see the full error message
   buildAppMenus(mainWindow, cardanoNode, userLocale, {
     isNavigationEnabled: false,
+    walletSettingsState: WalletSettingsStateEnum.hidden,
   });
-  enableApplicationMenuNavigationChannel.onReceive(
-    () =>
-      new Promise((resolve) => {
-        const locale = getLocale(network);
-        // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'unknown' is not assignable to pa... Remove this comment to see the full error message
-        buildAppMenus(mainWindow, cardanoNode, locale, {
-          isNavigationEnabled: true,
-        });
-        resolve();
-      })
-  );
   rebuildApplicationMenu.onReceive(
-    (data) =>
+    ({ walletSettingsState, isNavigationEnabled }) =>
       new Promise((resolve) => {
         const locale = getLocale(network);
         // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'unknown' is not assignable to pa... Remove this comment to see the full error message
         buildAppMenus(mainWindow, cardanoNode, locale, {
-          isNavigationEnabled: data.isNavigationEnabled,
+          isNavigationEnabled,
+          walletSettingsState,
         });
         // @ts-ignore ts-migrate(2339) FIXME: Property 'updateTitle' does not exist on type 'Bro... Remove this comment to see the full error message
         mainWindow.updateTitle(locale);
+        // @ts-ignore ts-migrate(2794) FIXME: Expected 1 arguments, but got 0. Did you forget to... Remove this comment to see the full error message
         resolve();
       })
   );
   setStateSnapshotLogChannel.onReceive(
-    (data: SetStateSnapshotLogMainResponse) =>
-      Promise.resolve(logStateSnapshot(data))
+    (data: SetStateSnapshotLogMainResponse) => {
+      return Promise.resolve(logStateSnapshot(data));
+    }
   );
   generateWalletMigrationReportChannel.onReceive(
-    (data: GenerateWalletMigrationReportRendererRequest) =>
-      Promise.resolve(generateWalletMigrationReport(data))
+    (data: GenerateWalletMigrationReportRendererRequest) => {
+      return Promise.resolve(generateWalletMigrationReport(data));
+    }
   );
   getStateDirectoryPathChannel.onRequest(() =>
     Promise.resolve(stateDirectoryPath)
@@ -209,6 +232,12 @@ const onAppReady = async () => {
     Promise.resolve(app.getPath('desktop'))
   );
   getSystemLocaleChannel.onRequest(() => Promise.resolve(systemLocale));
+  toggleRTSFlagsModeChannel.onReceive(() => {
+    const flagsToSet = containsRTSFlags(currentRtsFlags) ? [] : RTS_FLAGS;
+    storeRtsFlagsSettings(environment.network, flagsToSet);
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
+    return handleWindowClose();
+  });
   const handleCheckDiskSpace = handleDiskSpace(mainWindow, cardanoNode);
 
   const onMainError = (error: string) => {
@@ -219,22 +248,22 @@ const onAppReady = async () => {
   };
 
   mainErrorHandler(onMainError);
+  handleCheckBlockReplayProgress(mainWindow, launcherConfig.logsPrefix);
   await handleCheckDiskSpace();
-  await handleCheckBlockReplayProgress(mainWindow, launcherConfig.logsPrefix);
-  mainWindow.on('close', async (event) => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
-    logger.info(
-      'mainWindow received <close> event. Safe exiting Daedalus now.'
-    );
-    event.preventDefault();
-    await safeExit();
-  });
+
+  if (isWatchMode) {
+    // Connect to electron-connect server which restarts / reloads windows on file changes
+    client.create(mainWindow);
+  }
+
+  mainWindow.on('close', handleWindowClose);
   // Security feature: Prevent creation of new browser windows
   // https://github.com/electron/electron/blob/master/docs/tutorial/security.md#14-disable-or-limit-creation-of-new-windows
   app.on('web-contents-created', (_, contents) => {
     contents.on('new-window', (event, url) => {
       // Prevent creation of new BrowserWindows via links / window.open
       event.preventDefault();
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.info('Prevented creation of new browser window', {
         url,
       });
@@ -250,6 +279,7 @@ const onAppReady = async () => {
 
     if (isSelfnode) {
       if (keepLocalClusterRunning || isTest) {
+        // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
         logger.info(
           'ipcMain: Keeping the local cluster running while exiting Daedalus',
           {
diff --git a/source/main/ipc/downloadManagerChannel.ts b/source/main/ipc/downloadManagerChannel.ts
index 0ad41fd41f..a275b72160 100644
--- a/source/main/ipc/downloadManagerChannel.ts
+++ b/source/main/ipc/downloadManagerChannel.ts
@@ -206,8 +206,9 @@ const getDownloadLocalData = async ({
 };
 
 const getDownloadsLocalData =
-  // @ts-ignore ts-migrate(2322) FIXME: Type 'unknown' is not assignable to type 'Download... Remove this comment to see the full error message
-  async (): Promise<DownloadsLocalDataMainResponse> => localStorage.getAll();
+  async (): Promise<DownloadsLocalDataMainResponse> => {
+    return localStorage.getAll() as Promise<DownloadsLocalDataMainResponse>;
+  };
 
 const clearDownloadLocalData = async ({
   fileName,
diff --git a/source/main/ipc/electronStoreConversation.ts b/source/main/ipc/electronStoreConversation.ts
index 32f27c6647..f35dd075d1 100644
--- a/source/main/ipc/electronStoreConversation.ts
+++ b/source/main/ipc/electronStoreConversation.ts
@@ -31,14 +31,13 @@ const reset = async () => {
   await unset(keys.CURRENCY_SELECTED);
   await unset(keys.DATA_LAYER_MIGRATION_ACCEPTANCE);
   await unset(keys.DISCREET_MODE_ENABLED);
-  await unset(keys.DISCREET_MODE_SETTINGS_TOOLTIP);
-  await unset(keys.DISCREET_MODE_NOTIFICATION);
   await unset(keys.DOWNLOAD_MANAGER);
   await unset(keys.HARDWARE_WALLET_DEVICES);
   await unset(keys.HARDWARE_WALLETS);
   await unset(keys.READ_NEWS);
   await unset(keys.SMASH_SERVER);
   await unset(keys.STAKING_INFO_WAS_OPEN);
+  await unset(keys.STAKE_POOLS_LIST_VIEW_TOOLTIP);
   await unset(keys.TERMS_OF_USE_ACCEPTANCE);
   await unset(keys.THEME);
   await unset(keys.USER_DATE_FORMAT_ENGLISH);
diff --git a/source/main/ipc/get-block-sync-progress.ts b/source/main/ipc/get-block-sync-progress.ts
new file mode 100644
index 0000000000..5613f5a21c
--- /dev/null
+++ b/source/main/ipc/get-block-sync-progress.ts
@@ -0,0 +1,13 @@
+import { MainIpcChannel } from './lib/MainIpcChannel';
+import { GET_BLOCK_SYNC_PROGRESS_CHANNEL } from '../../common/ipc/api';
+import type {
+  GetBlockSyncProgressRendererRequest,
+  GetBlockSyncProgressMainResponse,
+} from '../../common/ipc/api';
+
+// IpcChannel<Incoming, Outgoing>
+
+export const getBlockSyncProgressChannel: MainIpcChannel<
+  GetBlockSyncProgressRendererRequest,
+  GetBlockSyncProgressMainResponse
+> = new MainIpcChannel(GET_BLOCK_SYNC_PROGRESS_CHANNEL);
diff --git a/source/main/ipc/getHardwareWalletChannel.ts b/source/main/ipc/getHardwareWalletChannel.ts
index 6bfa2adddf..c20b5f559c 100644
--- a/source/main/ipc/getHardwareWalletChannel.ts
+++ b/source/main/ipc/getHardwareWalletChannel.ts
@@ -22,8 +22,8 @@ import type {
   getCardanoAdaAppRendererRequest,
   getExtendedPublicKeyMainResponse,
   getExtendedPublicKeyRendererRequest,
-  getHardwareWalletConnectiontMainRequest,
-  getHardwareWalletConnectiontRendererResponse,
+  getHardwareWalletConnectionMainRequest,
+  getHardwareWalletConnectionRendererResponse,
   getHardwareWalletTransportMainResponse,
   getHardwareWalletTransportRendererRequest,
   handleInitLedgerConnectMainResponse,
@@ -80,8 +80,8 @@ const getCardanoAdaAppChannel: MainIpcChannel<
   getCardanoAdaAppMainResponse
 > = new MainIpcChannel(GET_CARDANO_ADA_APP_CHANNEL);
 const getHardwareWalletConnectionChannel: MainIpcChannel<
-  getHardwareWalletConnectiontMainRequest,
-  getHardwareWalletConnectiontRendererResponse
+  getHardwareWalletConnectionMainRequest,
+  getHardwareWalletConnectionRendererResponse
 > = new MainIpcChannel(GET_HARDWARE_WALLET_CONNECTION_CHANNEL);
 const signTransactionLedgerChannel: MainIpcChannel<
   signTransactionLedgerRendererRequest,
diff --git a/source/main/ipc/manageAppUpdateChannel.ts b/source/main/ipc/manageAppUpdateChannel.ts
index 7bc2fbe66d..0aaa69df9b 100644
--- a/source/main/ipc/manageAppUpdateChannel.ts
+++ b/source/main/ipc/manageAppUpdateChannel.ts
@@ -79,8 +79,8 @@ export const handleManageAppUpdateRequests = (window: BrowserWindow) => {
     return true;
   };
 
-  const installUpdate = async (filePath) =>
-    new Promise((resolve, reject) => {
+  const installUpdate = async (filePath) => {
+    return new Promise((resolve, reject) => {
       const { name: functionPrefix } = installUpdate;
       response(null, functionPrefix, 'installation begin.');
       const { updateRunnerBin } = launcherConfig;
@@ -171,6 +171,7 @@ export const handleManageAppUpdateRequests = (window: BrowserWindow) => {
         return resolve(response(true, functionPrefix));
       });
     });
+  };
 
   // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ filePath, hash: expectedHash ... Remove this comment to see the full error message
   manageAppUpdateChannel.onRequest(async ({ filePath, hash: expectedHash }) => {
diff --git a/source/main/ipc/toggleRTSFlagsModeChannel.ts b/source/main/ipc/toggleRTSFlagsModeChannel.ts
new file mode 100644
index 0000000000..0375018bb5
--- /dev/null
+++ b/source/main/ipc/toggleRTSFlagsModeChannel.ts
@@ -0,0 +1,11 @@
+import { TOGGLE_RTS_FLAGS_MODE_CHANNEL } from '../../common/ipc/api';
+import type {
+  ToggleRTSFlagsModeMainResponse,
+  ToggleRTSFlagsModeRendererRequest,
+} from '../../common/ipc/api';
+import { MainIpcChannel } from './lib/MainIpcChannel';
+
+export const toggleRTSFlagsModeChannel: MainIpcChannel<
+  ToggleRTSFlagsModeRendererRequest,
+  ToggleRTSFlagsModeMainResponse
+> = new MainIpcChannel(TOGGLE_RTS_FLAGS_MODE_CHANNEL);
diff --git a/source/main/locales/en-US.json b/source/main/locales/en-US.json
index 977b539f85..7fdc70661b 100644
--- a/source/main/locales/en-US.json
+++ b/source/main/locales/en-US.json
@@ -22,6 +22,13 @@
   "menu.edit.undo": "Undo",
   "menu.helpSupport": "Help",
   "menu.helpSupport.blankScreenFix": "Blank Screen Fix",
+  "menu.helpSupport.usingRtsFlags": "Using RTS flags",
+  "menu.helpSupport.rtsFlagsDialogCancel": "Cancel",
+  "menu.helpSupport.rtsFlagsDialogConfirm": "Yes",
+  "menu.helpSupport.enableRtsFlagsDialogMessage": "When enabled, the Cardano node will attempt to reduce its RAM usage",
+  "menu.helpSupport.enableRtsFlagsDialogTitle": "Enable RAM management (RTS Flags)",
+  "menu.helpSupport.disableRtsFlagsDialogMessage": "When disabled, we will restart cardano-node in default mode",
+  "menu.helpSupport.disableRtsFlagsDialogTitle": "Disable RAM management (RTS Flags)",
   "menu.helpSupport.blankScreenFixDialogCancel": "Cancel",
   "menu.helpSupport.blankScreenFixDialogConfirm": "Yes",
   "menu.helpSupport.blankScreenFixDialogMessage": "Turn off 'Blank screen fix'? \n \nDisabling the blank screen fix setting will improve the performance of user interface rendering by enabling graphics acceleration, however, some users may find that Daedalus runs better with this setting enabled. If you see a blank screen instead of the Daedalus user interface after disabling this setting and restarting Daedalus, please turn this setting back on. \n \nDo you want to disable this setting and restart Daedalus?",
@@ -43,5 +50,6 @@
   "menu.view.toggleDeveloperTools": "Toggle Developer Tools",
   "menu.view.toggleFullScreen": "Toggle Full Screen",
   "menu.view.toggleMaximumWindowSize": "Toggle Maximum Window Size",
-  "window.title.blankScreenFix": "['Blank screen fix' active]"
+  "window.title.blankScreenFix": "['Blank screen fix' active]",
+  "window.title.usingRtsFlags": "['Using RTS flags' active]"
 }
diff --git a/source/main/locales/ja-JP.json b/source/main/locales/ja-JP.json
index c681f2dd91..e153ae0042 100644
--- a/source/main/locales/ja-JP.json
+++ b/source/main/locales/ja-JP.json
@@ -22,6 +22,13 @@
   "menu.edit.undo": "元に戻す",
   "menu.helpSupport": "ヘルプ",
   "menu.helpSupport.blankScreenFix": "ブランク画面修正",
+  "menu.helpSupport.usingRtsFlags": "RTSフラグの使用",
+  "menu.helpSupport.rtsFlagsDialogCancel": "Cancel",
+  "menu.helpSupport.rtsFlagsDialogConfirm": "Yes",
+  "menu.helpSupport.enableRtsFlagsDialogMessage": "When enabled, the Cardano node will attempt to reduce its RAM usage",
+  "menu.helpSupport.enableRtsFlagsDialogTitle": "Enable RAM management (RTSフラグの使用\")",
+  "menu.helpSupport.disableRtsFlagsDialogMessage": "When disabled, we will restart cardano-node in default mode",
+  "menu.helpSupport.disableRtsFlagsDialogTitle": "Disable RAM management (RTSフラグの使用\")",
   "menu.helpSupport.blankScreenFixDialogCancel": "キャンセル",
   "menu.helpSupport.blankScreenFixDialogConfirm": "はい",
   "menu.helpSupport.blankScreenFixDialogMessage": "「ブランク画面修正」を無効にしますか? \n \nブランク画面修正設定を無効にすると、グラフィックアクセラレーションが有効化されてユーザーインターフェイスのレンダリングパフォーマンスが向上しますが、この設定を有効にした方がDaedalusがスムーズに作動する場合があります。この設定を無効にしてDaedalusを再起動した際にDaedalusユーザーインターフェイスの代わりにブランク画面が表示される場合は、この設定をもう一度有効にしてください。 \n \nこの設定を無効にしてDaedalusを再起動しますか。",
@@ -43,5 +50,6 @@
   "menu.view.toggleDeveloperTools": "開発者ツール切替え",
   "menu.view.toggleFullScreen": "フルスクリーン切替え",
   "menu.view.toggleMaximumWindowSize": "最大ウインドウサイズ切り切り替え",
-  "window.title.blankScreenFix": "[「ブランク画面修正」有効 ]"
+  "window.title.blankScreenFix": "[「ブランク画面修正」有効 ]",
+  "window.title.usingRtsFlags": "[「RTSフラグの使用」が有効]"
 }
diff --git a/source/main/menus/MenuActions.types.ts b/source/main/menus/MenuActions.types.ts
index 13e85aaa5c..3d239cb5ab 100644
--- a/source/main/menus/MenuActions.types.ts
+++ b/source/main/menus/MenuActions.types.ts
@@ -1,5 +1,6 @@
 export type MenuActions = {
   toggleBlankScreenFix: (...args: Array<any>) => any;
+  openToggleRTSFlagsModeDialog: (...args: Array<any>) => any;
   openAboutDialog: (...args: Array<any>) => any;
   openDaedalusDiagnosticsDialog: (...args: Array<any>) => any;
   openItnRewardsRedemptionDialog: (...args: Array<any>) => any;
diff --git a/source/main/menus/osx.ts b/source/main/menus/osx.ts
index 909ff6b35a..e1795a8e2c 100644
--- a/source/main/menus/osx.ts
+++ b/source/main/menus/osx.ts
@@ -7,9 +7,10 @@ import { environment } from '../environment';
 import { showUiPartChannel } from '../ipc/control-ui-parts';
 import { NOTIFICATIONS } from '../../common/ipc/constants';
 import { generateSupportRequestLink } from '../../common/utils/reporting';
+import { buildKnownIssueFixesSubmenu } from './submenuBuilders';
+import { WalletSettingsStateEnum } from '../../common/ipc/api';
 
 const id = 'menu';
-const { isBlankScreenFixActive } = environment;
 export const osxMenu = (
   app: App,
   window: BrowserWindow,
@@ -17,6 +18,7 @@ export const osxMenu = (
   translations: {},
   locale: string,
   isNavigationEnabled: boolean,
+  walletSettingsState: WalletSettingsStateEnum,
   translation: (...args: Array<any>) => any = getTranslation(translations, id)
 ) => [
   {
@@ -65,7 +67,10 @@ export const osxMenu = (
           actions.openWalletSettingsPage();
         },
 
-        enabled: isNavigationEnabled,
+        enabled:
+          isNavigationEnabled &&
+          walletSettingsState === WalletSettingsStateEnum.enabled,
+        visible: walletSettingsState !== WalletSettingsStateEnum.hidden,
       },
       {
         type: 'separator',
@@ -157,23 +162,7 @@ export const osxMenu = (
   {
     label: translation('helpSupport'),
     submenu: compact([
-      {
-        label: translation('helpSupport.knownIssues'),
-
-        click() {
-          const faqLink = translation('helpSupport.knownIssuesUrl');
-          shell.openExternal(faqLink);
-        },
-      },
-      {
-        label: translation('helpSupport.blankScreenFix'),
-        type: 'checkbox',
-        checked: isBlankScreenFixActive,
-
-        click(item) {
-          actions.toggleBlankScreenFix(item);
-        },
-      },
+      ...buildKnownIssueFixesSubmenu(actions, translations, translation),
       {
         type: 'separator',
       },
@@ -185,15 +174,6 @@ export const osxMenu = (
           shell.openExternal(safetyTipsLinkUrl);
         },
       },
-      /* {
-    label: translation('helpSupport.featureRequest'),
-    click() {
-      const featureRequestLinkUrl = translation(
-        'helpSupport.featureRequestUrl'
-      );
-      shell.openExternal(featureRequestLinkUrl);
-    },
-  }, */
       {
         label: translation('helpSupport.supportRequest'),
 
diff --git a/source/main/menus/submenuBuilders.ts b/source/main/menus/submenuBuilders.ts
new file mode 100644
index 0000000000..5777e3ac18
--- /dev/null
+++ b/source/main/menus/submenuBuilders.ts
@@ -0,0 +1,49 @@
+import { shell } from 'electron';
+import type { MenuItem } from 'electron';
+import { getRtsFlagsSettings } from '../utils/rtsFlagsSettings';
+import { environment } from '../environment';
+import type { MenuActions } from './MenuActions.types';
+import { getTranslation } from '../utils/getTranslation';
+
+export const buildKnownIssueFixesSubmenu = (
+  actions: MenuActions,
+  translations: {},
+  translate: (...args: Array<any>) => any = getTranslation(translations, 'menu')
+): MenuItem[] => {
+  const { isBlankScreenFixActive, network } = environment;
+  const rtsFlags = getRtsFlagsSettings(network);
+  const areRTSFlagsEnabled = !!rtsFlags?.length && rtsFlags.length > 0;
+  return [
+    // @ts-ignore ts-migrate(2740) FIXME: Type '{ label: any; click(): void; }' is missing t... Remove this comment to see the full error message
+    {
+      label: translate('helpSupport.knownIssues'),
+
+      click() {
+        const faqLink = translate('helpSupport.knownIssuesUrl');
+        shell.openExternal(faqLink);
+      },
+    },
+    // @ts-ignore ts-migrate(2740) FIXME: Type '{ label: any; type: "checkbox"; checked: boo... Remove this comment to see the full error message
+    {
+      label: translate('helpSupport.blankScreenFix'),
+      type: 'checkbox',
+      checked: isBlankScreenFixActive,
+
+      click(item) {
+        actions.toggleBlankScreenFix(item);
+      },
+    },
+    // @ts-ignore ts-migrate(2740) FIXME: Type '{ label: any; type: "checkbox"; checked: boo... Remove this comment to see the full error message
+    {
+      label: translate('helpSupport.usingRtsFlags'),
+      type: 'checkbox',
+      checked: areRTSFlagsEnabled,
+
+      click(item) {
+        actions.openToggleRTSFlagsModeDialog(!areRTSFlagsEnabled);
+        // keep previous setting until app restart
+        item.checked = areRTSFlagsEnabled;
+      },
+    },
+  ];
+};
diff --git a/source/main/menus/win-linux.ts b/source/main/menus/win-linux.ts
index 8dc416bb50..b070b5e0d2 100644
--- a/source/main/menus/win-linux.ts
+++ b/source/main/menus/win-linux.ts
@@ -7,9 +7,10 @@ import { environment } from '../environment';
 import { NOTIFICATIONS } from '../../common/ipc/constants';
 import { showUiPartChannel } from '../ipc/control-ui-parts';
 import { generateSupportRequestLink } from '../../common/utils/reporting';
+import { buildKnownIssueFixesSubmenu } from './submenuBuilders';
+import { WalletSettingsStateEnum } from '../../common/ipc/api';
 
 const id = 'menu';
-const { isWindows, isBlankScreenFixActive } = environment;
 export const winLinuxMenu = (
   app: App,
   window: BrowserWindow,
@@ -17,6 +18,7 @@ export const winLinuxMenu = (
   translations: {},
   locale: string,
   isNavigationEnabled: boolean,
+  walletSettingsState: WalletSettingsStateEnum,
   translation: (...args: Array<any>) => any = getTranslation(translations, id)
 ) => [
   {
@@ -127,12 +129,15 @@ export const winLinuxMenu = (
           actions.openWalletSettingsPage();
         },
 
-        enabled: isNavigationEnabled,
+        enabled:
+          isNavigationEnabled &&
+          walletSettingsState === WalletSettingsStateEnum.enabled,
+        visible: walletSettingsState !== WalletSettingsStateEnum.hidden,
       },
       {
         type: 'separator',
       },
-      isWindows
+      environment.isWindows
         ? {
             label: translation('view.toggleFullScreen'),
             accelerator: 'F11',
@@ -167,23 +172,7 @@ export const winLinuxMenu = (
   {
     label: translation('helpSupport'),
     submenu: compact([
-      {
-        label: translation('helpSupport.knownIssues'),
-
-        click() {
-          const faqLink = translation('helpSupport.knownIssuesUrl');
-          shell.openExternal(faqLink);
-        },
-      },
-      {
-        label: translation('helpSupport.blankScreenFix'),
-        type: 'checkbox',
-        checked: isBlankScreenFixActive,
-
-        click(item) {
-          actions.toggleBlankScreenFix(item);
-        },
-      },
+      ...buildKnownIssueFixesSubmenu(actions, translations, translation),
       {
         type: 'separator',
       },
diff --git a/source/main/utils/blockSyncProgressHelpers.spec.ts b/source/main/utils/blockSyncProgressHelpers.spec.ts
new file mode 100644
index 0000000000..853347b9df
--- /dev/null
+++ b/source/main/utils/blockSyncProgressHelpers.spec.ts
@@ -0,0 +1,28 @@
+import moment from 'moment';
+import { isItFreshLog } from './blockSyncProgressHelpers';
+
+describe('blockSyncProgressHelpers', () => {
+  it('should return true for newer logs', () => {
+    const time = '2022-02-18 13:18:47.66';
+    const applicationStartDate = moment.utc(time).add(-1, 'minute');
+    const line = `[34m[XX-M:cardano.node.ChainDB:Info:30][0m [${time} UTC] Validating chunk no. 2256 out of 2256. Progress: 99.96%`;
+
+    expect(isItFreshLog(applicationStartDate, line)).toBe(true);
+  });
+
+  it('should return false for logs of same time', () => {
+    const time = '2022-02-18 13:18:47.66';
+    const applicationStartDate = moment.utc(time);
+    const line = `[34m[XX-M:cardano.node.ChainDB:Info:30][0m [${time} UTC] Validating chunk no. 2256 out of 2256. Progress: 99.96%`;
+
+    expect(isItFreshLog(applicationStartDate, line)).toBe(false);
+  });
+
+  it('should return false for older logs', () => {
+    const time = '2022-02-18 13:18:47.66';
+    const applicationStartDate = moment.utc(time).add(1, 'minute');
+    const line = `[34m[XX-M:cardano.node.ChainDB:Info:30][0m [${time} UTC] Validating chunk no. 2256 out of 2256. Progress: 99.96%`;
+
+    expect(isItFreshLog(applicationStartDate, line)).toBe(false);
+  });
+});
diff --git a/source/main/utils/blockSyncProgressHelpers.ts b/source/main/utils/blockSyncProgressHelpers.ts
new file mode 100644
index 0000000000..d7802474ad
--- /dev/null
+++ b/source/main/utils/blockSyncProgressHelpers.ts
@@ -0,0 +1,12 @@
+import moment, { Moment } from 'moment';
+
+export function isItFreshLog(applicationStartDate: Moment, line: string) {
+  const [, logDate] =
+    line.match(/\[(\d{4}-\d{2}-\d{2}\s\d{2}:\d{2}:\d{2}\.\d+) UTC]/) || [];
+
+  if (!logDate) {
+    return false;
+  }
+
+  return applicationStartDate.isBefore(moment.utc(logDate));
+}
diff --git a/source/main/utils/buildAppMenus.ts b/source/main/utils/buildAppMenus.ts
index bd6cb622b2..31ee34b3d7 100644
--- a/source/main/utils/buildAppMenus.ts
+++ b/source/main/utils/buildAppMenus.ts
@@ -1,4 +1,5 @@
-import { app, globalShortcut, Menu, BrowserWindow, dialog } from 'electron';
+import { app, BrowserWindow, dialog, globalShortcut, Menu } from 'electron';
+import { WalletSettingsStateEnum } from '../../common/ipc/api';
 import { environment } from '../environment';
 import { winLinuxMenu } from '../menus/win-linux';
 import { osxMenu } from '../menus/osx';
@@ -9,17 +10,23 @@ import { DIALOGS, PAGES } from '../../common/ipc/constants';
 import { showUiPartChannel } from '../ipc/control-ui-parts';
 import { getTranslation } from './getTranslation';
 
+interface Data {
+  isNavigationEnabled: boolean;
+  walletSettingsState: WalletSettingsStateEnum;
+}
 export const buildAppMenus = async (
   mainWindow: BrowserWindow,
   cardanoNode: CardanoNode | null | undefined,
   locale: string,
-  data: {
-    isNavigationEnabled: boolean;
-  }
+  { isNavigationEnabled, walletSettingsState }: Data
 ) => {
-  const { ABOUT, DAEDALUS_DIAGNOSTICS, ITN_REWARDS_REDEMPTION } = DIALOGS;
+  const {
+    ABOUT,
+    DAEDALUS_DIAGNOSTICS,
+    ITN_REWARDS_REDEMPTION,
+    TOGGLE_RTS_FLAGS_MODE,
+  } = DIALOGS;
   const { SETTINGS, WALLET_SETTINGS } = PAGES;
-  const { isNavigationEnabled } = data;
   const { isMacOS, isBlankScreenFixActive } = environment;
 
   const translations = require(`../locales/${locale}`);
@@ -53,6 +60,7 @@ export const buildAppMenus = async (
     // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('Restarting in BlankScreenFix...');
     if (cardanoNode) await cardanoNode.stop();
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('Exiting Daedalus with code 21', {
       code: 21,
     });
@@ -63,6 +71,7 @@ export const buildAppMenus = async (
     // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('Restarting without BlankScreenFix...');
     if (cardanoNode) await cardanoNode.stop();
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('Exiting Daedalus with code 22', {
       code: 22,
     });
@@ -103,6 +112,11 @@ export const buildAppMenus = async (
     item.checked = isBlankScreenFixActive;
   };
 
+  const openToggleRTSFlagsModeDialog = () => {
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'BrowserWindow' is not assignable... Remove this comment to see the full error message
+    if (mainWindow) showUiPartChannel.send(TOGGLE_RTS_FLAGS_MODE, mainWindow);
+  };
+
   const menuActions = {
     openAboutDialog,
     openDaedalusDiagnosticsDialog,
@@ -110,6 +124,7 @@ export const buildAppMenus = async (
     openSettingsPage,
     openWalletSettingsPage,
     toggleBlankScreenFix,
+    openToggleRTSFlagsModeDialog,
   };
   // Build app menus
   let menu;
@@ -123,7 +138,8 @@ export const buildAppMenus = async (
         menuActions,
         translations,
         locale,
-        isNavigationEnabled
+        isNavigationEnabled,
+        walletSettingsState
       )
     );
     Menu.setApplicationMenu(menu);
@@ -136,7 +152,8 @@ export const buildAppMenus = async (
         menuActions,
         translations,
         locale,
-        isNavigationEnabled
+        isNavigationEnabled,
+        walletSettingsState
       )
     );
     mainWindow.setMenu(menu);
diff --git a/source/main/utils/containsRTSFlags.ts b/source/main/utils/containsRTSFlags.ts
new file mode 100644
index 0000000000..c6c6a6266d
--- /dev/null
+++ b/source/main/utils/containsRTSFlags.ts
@@ -0,0 +1,4 @@
+import { isEqual } from 'lodash';
+import { RTS_FLAGS } from '../config';
+
+export const containsRTSFlags = (flags: string[]) => isEqual(flags, RTS_FLAGS);
diff --git a/source/main/utils/downloadManager.ts b/source/main/utils/downloadManager.ts
index 22b47b3947..dfe1bf7de4 100644
--- a/source/main/utils/downloadManager.ts
+++ b/source/main/utils/downloadManager.ts
@@ -17,7 +17,7 @@ import type {
   DownloadMainResponse,
 } from '../../common/ipc/api';
 import type {
-  AllowedDownloadDirectories,
+  AllowedDownloadDirectoriesValues,
   DownloadInfoInit,
   DownloadInfoProgress,
   DownloadInfoEnd,
@@ -31,7 +31,7 @@ export const downloads = {};
 export const getIdFromFileName = (fileName: string): string =>
   fileName.replace(/\./g, '-');
 export const getPathFromDirectoryName = (
-  directoryName: AllowedDownloadDirectories
+  directoryName: AllowedDownloadDirectoriesValues
 ) => {
   const downloadsDirectory = `${stateDirectoryPath}/Downloads`;
 
@@ -39,7 +39,7 @@ export const getPathFromDirectoryName = (
     case ALLOWED_DOWNLOAD_DIRECTORIES.DESKTOP:
       return app.getPath('desktop');
 
-    case ALLOWED_DOWNLOAD_DIRECTORIES.DOWLOADS:
+    case ALLOWED_DOWNLOAD_DIRECTORIES.DOWNLOADS:
       return app.getPath('downloads');
 
     default:
diff --git a/source/main/utils/handleCheckBlockReplayProgress.ts b/source/main/utils/handleCheckBlockReplayProgress.ts
index 6bc1d7594e..60510f5f93 100644
--- a/source/main/utils/handleCheckBlockReplayProgress.ts
+++ b/source/main/utils/handleCheckBlockReplayProgress.ts
@@ -1,49 +1,77 @@
 import { BrowserWindow } from 'electron';
 import fs from 'fs';
-import readline from 'readline';
+import moment from 'moment';
 import path from 'path';
-import { getBlockReplayProgressChannel } from '../ipc/get-block-replay-progress';
-import { BLOCK_REPLAY_PROGRESS_CHECK_INTERVAL } from '../config';
+import { Tail } from 'tail';
+import { getBlockSyncProgressChannel } from '../ipc/get-block-sync-progress';
+import type { GetBlockSyncProgressType } from '../../common/ipc/api';
+import { BlockSyncType } from '../../common/types/cardano-node.types';
+import { isItFreshLog } from './blockSyncProgressHelpers';
+
+const blockKeyword = 'Replayed block';
+const validatingChunkKeyword = 'Validating chunk';
+const validatedChunkKeyword = 'Validated chunk';
+const ledgerKeyword = 'Pushing ledger state';
+
+const progressKeywords = [
+  blockKeyword,
+  validatingChunkKeyword,
+  validatedChunkKeyword,
+  ledgerKeyword,
+];
+
+const keywordTypeMap: Record<string, GetBlockSyncProgressType> = {
+  [blockKeyword]: BlockSyncType.replayedBlock,
+  [validatingChunkKeyword]: BlockSyncType.validatingChunk,
+  [validatedChunkKeyword]: BlockSyncType.validatingChunk,
+  [ledgerKeyword]: BlockSyncType.pushingLedger,
+};
+
+function containProgressKeywords(line: string) {
+  return progressKeywords.some((keyword) => line.includes(keyword));
+}
+
+function getProgressType(line: string): GetBlockSyncProgressType | null {
+  const key = progressKeywords.find((k) => line.includes(k));
+
+  if (!key) {
+    return null;
+  }
+
+  return keywordTypeMap[key];
+}
+
+const applicationStartDate = moment.utc();
 
 export const handleCheckBlockReplayProgress = (
   mainWindow: BrowserWindow,
   logsDirectoryPath: string
 ) => {
-  const checkBlockReplayProgress = async () => {
-    const filename = 'node.log';
-    const logFilePath = `${logsDirectoryPath}/pub/`;
-    const filePath = path.join(logFilePath, filename);
-    if (!fs.existsSync(filePath)) return;
-    const fileStream = fs.createReadStream(filePath);
-    const rl = readline.createInterface({
-      input: fileStream,
-    });
-    const progress = [];
-
-    for await (const line of rl) {
-      if (line.includes('block replay')) {
-        progress.push(line);
-      }
+  const filename = 'node.log';
+  const logFilePath = `${logsDirectoryPath}/pub/`;
+  const filePath = path.join(logFilePath, filename);
+  if (!fs.existsSync(filePath)) return;
+
+  const tail = new Tail(filePath);
+
+  tail.on('line', (line) => {
+    if (
+      !isItFreshLog(applicationStartDate, line) ||
+      !containProgressKeywords(line)
+    ) {
+      return;
     }
 
-    if (!progress.length) return;
-    const finalProgress = progress.slice(-1).pop();
-    const percentage = finalProgress.split('block replay progress (%) =').pop();
+    const percentage = line.match(/Progress:([\s\d.,]+)%/)?.[1];
+    const progressType = getProgressType(line);
+    if (!percentage || !progressType) {
+      return;
+    }
     const finalProgressPercentage = parseFloat(percentage);
     // Send result to renderer process (NetworkStatusStore)
-    getBlockReplayProgressChannel.send(
-      finalProgressPercentage,
+    getBlockSyncProgressChannel.send(
+      { progress: finalProgressPercentage, type: progressType },
       mainWindow.webContents
     );
-  };
-
-  const setBlockReplayProgressCheckingInterval = () => {
-    setInterval(async () => {
-      checkBlockReplayProgress();
-    }, BLOCK_REPLAY_PROGRESS_CHECK_INTERVAL);
-  };
-
-  // Start default interval
-  setBlockReplayProgressCheckingInterval();
-  return checkBlockReplayProgress;
+  });
 };
diff --git a/source/main/utils/handleDiskSpace.ts b/source/main/utils/handleDiskSpace.ts
index 720c00810c..c18618ed55 100644
--- a/source/main/utils/handleDiskSpace.ts
+++ b/source/main/utils/handleDiskSpace.ts
@@ -1,6 +1,4 @@
 import { BrowserWindow } from 'electron';
-
-/* eslint import/no-unresolved: "off" */
 import checkDiskSpace from 'check-disk-space';
 import prettysize from 'prettysize';
 import { getDiskSpaceStatusChannel } from '../ipc/get-disk-space-status';
diff --git a/source/main/utils/restoreKeystore.ts b/source/main/utils/restoreKeystore.ts
index d04a0d1c8b..df221f1ebb 100644
--- a/source/main/utils/restoreKeystore.ts
+++ b/source/main/utils/restoreKeystore.ts
@@ -12,8 +12,8 @@ export type EncryptedSecretKey = {
 export type WalletId = string;
 export const decodeKeystore = async (
   bytes: Buffer
-): Promise<EncryptedSecretKeys> =>
-  cbor.decodeAll(bytes).then((obj) => {
+): Promise<EncryptedSecretKeys> => {
+  return cbor.decodeAll(bytes).then((obj) => {
     /**
      * The original 'UserSecret' from cardano-sl looks like this:
      *
@@ -48,6 +48,7 @@ export const decodeKeystore = async (
     const usWalletSet = obj[0][3].map((x) => toEncryptedSecretKey(x[0]));
     return usKeys.concat(usWalletSet);
   });
+};
 
 const toEncryptedSecretKey = ([encryptedPayload, passphraseHash]: [
   Buffer,
diff --git a/source/main/utils/rtsFlagsSettings.ts b/source/main/utils/rtsFlagsSettings.ts
new file mode 100644
index 0000000000..185e0ec04e
--- /dev/null
+++ b/source/main/utils/rtsFlagsSettings.ts
@@ -0,0 +1,34 @@
+import Store from 'electron-store';
+import { logger } from './logging';
+
+const store = new Store();
+
+const getStoreKey = (network: string): string => `${network}-RTS-FLAGS`;
+
+export const getRtsFlagsSettings = (network: string): string[] | null => {
+  try {
+    const flags = store.get(getStoreKey(network));
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
+    logger.info(`[RTS-FLAGS] Read ${network} flags: ${flags} from config`);
+    // @ts-ignore ts-migrate(2740) FIXME: Type '{}' is missing the following properties from... Remove this comment to see the full error message
+    return flags;
+  } catch (error) {
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
+    logger.error(
+      `[RTS-FLAGS] Failed to read ${network} flags from config`,
+      error
+    );
+  }
+
+  return null;
+};
+export const storeRtsFlagsSettings = (
+  network: string,
+  flags: string[]
+): void => {
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
+  logger.info(
+    `[RTS-FLAGS] Persisted ${network} flags: [${flags.toString()}] in config`
+  );
+  store.set(getStoreKey(network), flags);
+};
diff --git a/source/main/utils/safeExitWithCode.ts b/source/main/utils/safeExitWithCode.ts
index a7193a8163..de1f520478 100644
--- a/source/main/utils/safeExitWithCode.ts
+++ b/source/main/utils/safeExitWithCode.ts
@@ -12,3 +12,17 @@ export const safeExitWithCode = (exitCode = 0) => {
     app.exit(exitCode);
   });
 };
+export const relaunch = () => {
+  const { file } = log.transports;
+  // Prevent electron-log from writing to stream
+  file.level = false;
+  // Flush the stream to the log file and exit afterwards.
+  // https://nodejs.org/api/stream.html#stream_writable_end_chunk_encoding_callback
+  file.stream.end('', 'utf8', () => {
+    app.releaseSingleInstanceLock();
+    app.relaunch({
+      args: process.argv.slice(1).concat(['--relaunch']),
+    });
+    app.exit(0);
+  });
+};
diff --git a/source/main/windows/main.ts b/source/main/windows/main.ts
index 1cfbcc7ec6..1e7fe70d88 100644
--- a/source/main/windows/main.ts
+++ b/source/main/windows/main.ts
@@ -7,9 +7,11 @@ import { getTranslation } from '../utils/getTranslation';
 import { getContentMinimumSize } from '../utils/getContentMinimumSize';
 import { buildLabel, launcherConfig } from '../config';
 import { ledgerStatus } from '../ipc/getHardwareWalletChannel';
+import { getRtsFlagsSettings } from '../utils/rtsFlagsSettings';
 
 const rendererErrorHandler = new RendererErrorHandler();
-const { isDev, isTest, isLinux, isBlankScreenFixActive } = environment;
+const { isDev, isTest, isLinux, isBlankScreenFixActive, network } = environment;
+const rtsFlags = getRtsFlagsSettings(network);
 const id = 'window';
 
 const getWindowTitle = (locale: string): string => {
@@ -19,6 +21,8 @@ const getWindowTitle = (locale: string): string => {
   let title = buildLabel;
   if (isBlankScreenFixActive)
     title += ` ${translation('title.blankScreenFix')}`;
+  if (!!rtsFlags && rtsFlags?.length > 0)
+    title += ` ${translation('title.usingRtsFlags')}`;
   return title;
 };
 
@@ -34,15 +38,12 @@ type WindowOptionsType = {
   };
   icon?: string;
 };
-export const createMainWindow = (
-  locale: string,
-  getWindowBounds: () => Rectangle | null | undefined
-) => {
+export const createMainWindow = (locale: string, windowBounds?: Rectangle) => {
   const windowOptions: WindowOptionsType = {
     show: false,
     width: 1150,
     height: 870,
-    ...getWindowBounds(),
+    ...windowBounds,
     webPreferences: {
       nodeIntegration: isTest,
       webviewTag: false,
@@ -76,13 +77,7 @@ export const createMainWindow = (
     if (event.sender !== window.webContents) return;
     window.close();
   });
-
-  if (isDev) {
-    window.loadURL(`http://localhost:8080`);
-  } else {
-    window.loadURL(`file://${__dirname}/../renderer/index.html`);
-  }
-
+  window.loadURL(`file://${__dirname}/../renderer/index.html`);
   window.on('page-title-updated', (event) => {
     event.preventDefault();
   });
@@ -149,8 +144,6 @@ export const createMainWindow = (
    * window constructor above was buggy (height was not correctly applied)
    */
   window.on('ready-to-show', () => {
-    const windowBounds = getWindowBounds();
-
     if (windowBounds) {
       window.setBounds(windowBounds);
     }
diff --git a/source/renderer/app/App.tsx b/source/renderer/app/App.tsx
index d7f7433253..d89ec81216 100755
--- a/source/renderer/app/App.tsx
+++ b/source/renderer/app/App.tsx
@@ -19,6 +19,9 @@ import { DIALOGS } from '../../common/ipc/constants';
 import type { StoresMap } from './stores/index';
 import type { ActionsMap } from './actions/index';
 import NewsFeedContainer from './containers/news/NewsFeedContainer';
+import ToggleRTSFlagsDialogContainer from './containers/knownIssues/ToggleRTSFlagsDialogContainer';
+import RTSFlagsRecommendationOverlayContainer from './containers/knownIssues/RTSFlagsRecommendationOverlayContainer';
+import { MenuUpdater } from './containers/MenuUpdater';
 
 @observer
 class App extends Component<{
@@ -43,7 +46,7 @@ class App extends Component<{
 
     const themeVars = require(`./themes/daedalus/${currentTheme}.ts`).default;
 
-    const { ABOUT, DAEDALUS_DIAGNOSTICS } = DIALOGS;
+    const { ABOUT, DAEDALUS_DIAGNOSTICS, TOGGLE_RTS_FLAGS_MODE } = DIALOGS;
     const canShowNews =
       !isSetupPage && // Active page is not "Language Selection" or "Terms of Use"
       !isNodeStopping && // Daedalus is not shutting down
@@ -59,6 +62,7 @@ class App extends Component<{
         {/* @ts-ignore ts-migrate(2769) FIXME: No overload matches this call. */}
         <ThemeManager variables={themeVars} />
         <Provider stores={stores} actions={actions}>
+          <MenuUpdater />
           <ThemeProvider
             theme={daedalusTheme}
             skins={SimpleSkins}
@@ -84,8 +88,13 @@ class App extends Component<{
                   isActiveDialog(DAEDALUS_DIAGNOSTICS) && (
                     <DaedalusDiagnosticsDialog key="daedalusDiagnosticsDialog" />
                   ),
-                  <NotificationsContainer key="notificationsContainer" />,
+                  // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string' is not assignable to par... Remove this comment to see the full error message
+                  isActiveDialog(TOGGLE_RTS_FLAGS_MODE) && (
+                    <ToggleRTSFlagsDialogContainer key="toggleRTSFlagsDialog" />
+                  ),
                 ]}
+                <RTSFlagsRecommendationOverlayContainer />
+                <NotificationsContainer />
                 {canShowNews && [
                   <NewsFeedContainer key="newsFeedList" />,
                   <NewsOverlayContainer key="newsFeedOverlay" />,
diff --git a/source/renderer/app/actions/app-actions.ts b/source/renderer/app/actions/app-actions.ts
index 50610aab49..952fff8903 100644
--- a/source/renderer/app/actions/app-actions.ts
+++ b/source/renderer/app/actions/app-actions.ts
@@ -14,4 +14,6 @@ export default class AppActions {
   // Daedalus Diagnostics dialog actions
   closeDaedalusDiagnosticsDialog: Action<any> = new Action();
   openDaedalusDiagnosticsDialog: Action<any> = new Action();
+  closeToggleRTSFlagsModeDialog: Action<any> = new Action();
+  openToggleRTSFlagsModeDialog: Action<any> = new Action();
 }
diff --git a/source/renderer/app/actions/assets-actions.ts b/source/renderer/app/actions/assets-actions.ts
index 3ce30aff9f..8767768b69 100644
--- a/source/renderer/app/actions/assets-actions.ts
+++ b/source/renderer/app/actions/assets-actions.ts
@@ -2,14 +2,14 @@ import Action from './lib/Action';
 import type { AssetToken } from '../api/assets/types'; // ======= ASSETS ACTIONS =======
 
 export default class AssetsActions {
-  onAssetSettingsOpen: Action<{
+  setEditedAsset: Action<{
     asset: AssetToken;
   }> = new Action();
   onAssetSettingsSubmit: Action<{
     asset: AssetToken;
     decimals: number;
   }> = new Action();
-  onAssetSettingsCancel: Action<any> = new Action();
+  unsetEditedAsset: Action<any> = new Action();
   onOpenAssetSend: Action<{
     uniqueId: string;
   }> = new Action();
diff --git a/source/renderer/app/actions/lib/Action.ts b/source/renderer/app/actions/lib/Action.ts
index 34e1fbef6f..79b7aac220 100644
--- a/source/renderer/app/actions/lib/Action.ts
+++ b/source/renderer/app/actions/lib/Action.ts
@@ -30,7 +30,7 @@ export default class Action<Params> {
     this.listeners.push(listener);
   }
 
-  trigger(params: Params) {
+  trigger(params?: Params) {
     this.listeners.forEach((listener) => listener(params));
   }
 
diff --git a/source/renderer/app/actions/network-status-actions.ts b/source/renderer/app/actions/network-status-actions.ts
index 1daff53f4d..224c73c2c9 100644
--- a/source/renderer/app/actions/network-status-actions.ts
+++ b/source/renderer/app/actions/network-status-actions.ts
@@ -7,4 +7,5 @@ export default class NetworkStatusActions {
   toggleSplash: Action<any> = new Action();
   copyStateDirectoryPath: Action<any> = new Action();
   forceCheckNetworkClock: Action<any> = new Action();
+  toggleRTSFlagsMode: Action<any> = new Action();
 }
diff --git a/source/renderer/app/actions/profile-actions.ts b/source/renderer/app/actions/profile-actions.ts
index 8599f0015f..5732ac47e4 100644
--- a/source/renderer/app/actions/profile-actions.ts
+++ b/source/renderer/app/actions/profile-actions.ts
@@ -20,4 +20,5 @@ export default class ProfileActions {
     theme: string;
   }> = new Action();
   finishInitialScreenSettings: Action<any> = new Action();
+  acknowledgeRTSModeRecommendation: Action<any> = new Action();
 }
diff --git a/source/renderer/app/actions/wallets-actions.ts b/source/renderer/app/actions/wallets-actions.ts
index d05dc7795c..ed4149038b 100644
--- a/source/renderer/app/actions/wallets-actions.ts
+++ b/source/renderer/app/actions/wallets-actions.ts
@@ -60,6 +60,7 @@ export default class WalletsActions {
     passphrase: string;
     assets?: Array<AssetToken>;
     assetsAmounts?: Array<string>;
+    hasAssetsRemainingAfterTransaction?: boolean;
   }> = new Action();
   chooseWalletExportType: Action<{
     walletExportType: WalletExportTypeChoices;
diff --git a/source/renderer/app/api/api.ts b/source/renderer/app/api/api.ts
index f8a6d25c33..a4b54f5217 100644
--- a/source/renderer/app/api/api.ts
+++ b/source/renderer/app/api/api.ts
@@ -40,6 +40,7 @@ import { getPublicKey } from './transactions/requests/getPublicKey';
 import { getICOPublicKey } from './transactions/requests/getICOPublicKey';
 // Voting requests
 import { createWalletSignature } from './voting/requests/createWalletSignature';
+import { getCatalystFund } from './voting/requests/getCatalystFund';
 // Wallets requests
 import { updateSpendingPassword } from './wallets/requests/updateSpendingPassword';
 import { updateByronSpendingPassword } from './wallets/requests/updateByronSpendingPassword';
@@ -84,6 +85,7 @@ import { cardanoFaultInjectionChannel } from '../ipc/cardano.ipc';
 import patchAdaApi from './utils/patchAdaApi';
 import { getLegacyWalletId, utcStringToDate } from './utils';
 import { logger } from '../utils/logging';
+import { hexToString } from '../utils/strings';
 import {
   unscrambleMnemonics,
   scrambleMnemonics,
@@ -126,7 +128,7 @@ import type {
   GetNetworkParametersApiResponse,
 } from './network/types';
 // Transactions Types
-import type {
+import {
   Transaction,
   TransactionFee,
   TransactionWithdrawals,
@@ -148,7 +150,7 @@ import type {
   ICOPublicKeyParams,
 } from './transactions/types';
 // Wallets Types
-import type {
+import {
   AdaWallet,
   AdaWallets,
   CreateHardwareWalletRequest,
@@ -203,6 +205,8 @@ import type {
 import type {
   CreateVotingRegistrationRequest,
   CreateWalletSignatureRequest,
+  GetCatalystFundResponse,
+  CatalystFund,
 } from './voting/types';
 import type { StakePoolProps } from '../domains/StakePool';
 import type { FaultInjectionIpcRequest } from '../../../common/types/cardano-node.types';
@@ -211,7 +215,7 @@ import { getSHA256HexForString } from './utils/hashing';
 import { getNewsHash } from './news/requests/getNewsHash';
 import { deleteTransaction } from './transactions/requests/deleteTransaction';
 import { WALLET_BYRON_KINDS } from '../config/walletRestoreConfig';
-import ApiError from '../domains/ApiError';
+import ApiError, { ErrorType } from '../domains/ApiError';
 import { formattedAmountToLovelace } from '../utils/formatters';
 import type {
   GetAssetsRequest,
@@ -223,11 +227,12 @@ import type { AssetLocalData } from './utils/localStorage';
 import Asset from '../domains/Asset';
 import { getAssets } from './assets/requests/getAssets';
 import { getAccountPublicKey } from './wallets/requests/getAccountPublicKey';
+import { doesWalletRequireAdaToRemainToSupportTokens } from './utils/apiHelpers';
 
 export default class AdaApi {
   config: RequestConfig;
   // We need to preserve all asset metadata during single runtime in order
-  // to avoid losing it in case of Token Metadata Registry server unvailability
+  // to avoid losing it in case of Token Metadata Registry server unavailability
   storedAssetMetadata: StoredAssetMetadata = {};
 
   constructor(isTest: boolean, config: RequestConfig) {
@@ -240,13 +245,13 @@ export default class AdaApi {
   }
 
   getWallets = async (): Promise<Array<Wallet>> => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getWallets called');
-    const { getHardwareWalletLocalData, getHardwareWalletsLocalData } =
-      global.daedalus.api.localStorage;
+    const { getHardwareWalletsLocalData } = global.daedalus.api.localStorage;
 
     try {
-      const wallets: AdaWallets = await getWallets(this.config);
+      const wallets: Array<AdaWallet | LegacyAdaWallet> = await getWallets(
+        this.config
+      );
       const legacyWallets: LegacyAdaWallets = await getLegacyWallets(
         this.config
       );
@@ -267,14 +272,15 @@ export default class AdaApi {
           },
           isLegacy: true,
         };
-        // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ address_pool_gap: number; dele... Remove this comment to see the full error message
         wallets.push({ ...legacyAdaWallet, ...extraLegacyWalletProps });
       });
       // @TODO - Remove this once we get hardware wallet flag from WBE
       return await Promise.all(
-        wallets.map(async (wallet) => {
+        wallets.map(async (wallet: AdaWallet) => {
           const { id } = wallet;
-          const walletData = await getHardwareWalletLocalData(id);
+
+          const walletData = hwLocalData[id];
+
           return _createWalletFromServerData({
             ...wallet,
             isHardwareWallet:
@@ -453,18 +459,19 @@ export default class AdaApi {
       parameters: request,
     });
     const { walletId, order, fromDate, toDate, isLegacy } = request;
+
     const params = Object.assign(
       {},
       {
         order: order || 'descending',
+      },
+      !!fromDate && {
+        start: `${moment.utc(fromDate).format('YYYY-MM-DDTHH:mm:ss')}Z`,
+      },
+      !!toDate && {
+        end: `${moment.utc(toDate).format('YYYY-MM-DDTHH:mm:ss')}Z`,
       }
     );
-    if (fromDate)
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'start' does not exist on type '{ order: ... Remove this comment to see the full error message
-      params.start = `${moment.utc(fromDate).format('YYYY-MM-DDTHH:mm:ss')}Z`;
-    if (toDate)
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'end' does not exist on type '{ order: "a... Remove this comment to see the full error message
-      params.end = `${moment.utc(toDate).format('YYYY-MM-DDTHH:mm:ss')}Z`;
 
     try {
       let response;
@@ -832,7 +839,9 @@ export default class AdaApi {
     }
   };
   createTransaction = async (
-    request: CreateTransactionRequest
+    request: CreateTransactionRequest & {
+      hasAssetsRemainingAfterTransaction: boolean;
+    }
   ): Promise<WalletTransaction> => {
     logger.debug('AdaApi::createTransaction called', {
       parameters: filterLogData(request),
@@ -845,6 +854,7 @@ export default class AdaApi {
       isLegacy,
       assets,
       withdrawal = TransactionWithdrawal,
+      hasAssetsRemainingAfterTransaction,
     } = request;
 
     try {
@@ -884,7 +894,8 @@ export default class AdaApi {
       logger.error('AdaApi::createTransaction error', {
         error,
       });
-      throw new ApiError(error)
+
+      const apiError = new ApiError(error)
         .set('wrongEncryptionPassphrase')
         .where('code', 'bad_request')
         .inc('message', 'passphrase is too short')
@@ -892,8 +903,18 @@ export default class AdaApi {
           linkLabel: 'tooBigTransactionErrorLinkLabel',
           linkURL: 'tooBigTransactionErrorLinkURL',
         })
-        .where('code', 'transaction_is_too_big')
-        .result();
+        .where('code', 'transaction_is_too_big');
+
+      const { requiresAdaToRemainToSupportNativeTokens, adaToRemain } =
+        doesWalletRequireAdaToRemainToSupportTokens(
+          error,
+          hasAssetsRemainingAfterTransaction
+        );
+      if (requiresAdaToRemainToSupportNativeTokens) {
+        apiError.set('cannotLeaveWalletEmpty', true, { adaToRemain });
+      }
+
+      throw apiError.result();
     }
   };
   // For testing purpose ONLY
@@ -1020,6 +1041,7 @@ export default class AdaApi {
       const { fee, minimumAda } = _createTransactionFeeFromServerData(response);
 
       const amountWithFee = formattedTxAmount.plus(fee);
+      // @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'Array'.
       const isRewardsRedemptionRequest = Array.isArray(withdrawal);
 
       if (!isRewardsRedemptionRequest && amountWithFee.gt(walletBalance)) {
@@ -1067,6 +1089,7 @@ export default class AdaApi {
         .set(notEnoughMoneyError, true)
         .where('code', 'not_enough_money')
         .set('utxoTooSmall', true, {
+          // @ts-ignore ts-migrate(2339) FIXME: Property 'exec' does not exist on type '{}'.
           minimumAda: get(
             /(Expected min coin value: +)([0-9]+.[0-9]+)/.exec(error.message),
             2,
@@ -1135,7 +1158,7 @@ export default class AdaApi {
         walletId,
         data,
       });
-      // @TODO - handle CHANGE paramete on smarter way and change corresponding downstream logic
+      // @TODO - handle CHANGE parameter on smarter way and change corresponding downstream logic
       const outputs = concat(response.outputs, response.change);
       // Calculate fee from inputs and outputs
       const inputsData = [];
@@ -1145,7 +1168,7 @@ export default class AdaApi {
       let totalOutputs = new BigNumber(0);
       map(response.inputs, (input) => {
         const inputAmount = new BigNumber(input.amount.quantity.toString());
-        // @ts-ignore ts-migrate(2339) FIXME: Property 'assets' does not exist on type '{ addres... Remove this comment to see the full error message
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'assets' does not exist on type 'unknown'... Remove this comment to see the full error message
         const inputAssets = map(input.assets, (asset) => ({
           policyId: asset.policy_id,
           assetName: asset.asset_name,
@@ -1160,11 +1183,12 @@ export default class AdaApi {
           derivationPath: input.derivation_path,
           assets: inputAssets,
         };
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'push' does not exist on type '{}'.
         inputsData.push(inputData);
       });
       map(outputs, (output) => {
         const outputAmount = new BigNumber(output.amount.quantity.toString());
-        // @ts-ignore ts-migrate(2339) FIXME: Property 'assets' does not exist on type '{ addres... Remove this comment to see the full error message
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'assets' does not exist on type 'unknown'... Remove this comment to see the full error message
         const outputAssets = map(output.assets, (asset) => ({
           policyId: asset.policy_id,
           assetName: asset.asset_name,
@@ -1177,6 +1201,7 @@ export default class AdaApi {
           derivationPath: output.derivation_path || null,
           assets: outputAssets,
         };
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'push' does not exist on type '{}'.
         outputsData.push(outputData);
       });
 
@@ -1187,6 +1212,7 @@ export default class AdaApi {
             rewardAccountPath: certificate.reward_account_path,
             pool: certificate.pool || null,
           };
+          // @ts-ignore ts-migrate(2339) FIXME: Property 'push' does not exist on type '{}'.
           certificatesData.push(certificateData);
         });
       }
@@ -1454,14 +1480,12 @@ export default class AdaApi {
     mnemonic.split(' ').length === ADA_CERTIFICATE_MNEMONIC_LENGTH;
 
   getWalletRecoveryPhrase(): Promise<Array<string>> {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getWalletRecoveryPhrase called');
 
     try {
       const response: Promise<Array<string>> = new Promise((resolve) =>
         resolve(generateAccountMnemonics(WALLET_RECOVERY_PHRASE_WORD_COUNT))
       );
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.debug('AdaApi::getWalletRecoveryPhrase success');
       return response;
     } catch (error) {
@@ -1473,14 +1497,12 @@ export default class AdaApi {
   }
 
   getWalletCertificateAdditionalMnemonics(): Promise<Array<string>> {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getWalletCertificateAdditionalMnemonics called');
 
     try {
       const response: Promise<Array<string>> = new Promise((resolve) =>
         resolve(generateAdditionalMnemonics())
       );
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.debug('AdaApi::getWalletCertificateAdditionalMnemonics success');
       return response;
     } catch (error) {
@@ -1494,7 +1516,6 @@ export default class AdaApi {
   getWalletCertificateRecoveryPhrase(
     request: GetWalletCertificateRecoveryPhraseRequest
   ): Promise<Array<string>> {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getWalletCertificateRecoveryPhrase called');
     const { passphrase, input: scrambledInput } = request;
 
@@ -1507,7 +1528,6 @@ export default class AdaApi {
           })
         )
       );
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.debug('AdaApi::getWalletCertificateRecoveryPhrase success');
       return response;
     } catch (error) {
@@ -1521,7 +1541,6 @@ export default class AdaApi {
   getWalletRecoveryPhraseFromCertificate(
     request: GetWalletRecoveryPhraseFromCertificateRequest
   ): Promise<Array<string>> {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getWalletRecoveryPhraseFromCertificate called');
     const { passphrase, scrambledInput } = request;
 
@@ -1530,7 +1549,6 @@ export default class AdaApi {
         passphrase,
         scrambledInput,
       });
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.debug('AdaApi::getWalletRecoveryPhraseFromCertificate success');
       return Promise.resolve(response);
     } catch (error) {
@@ -1904,7 +1922,7 @@ export default class AdaApi {
       logger.debug('AdaApi::restoreByronLedgerWallet success', {
         wallet,
       });
-      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ address_pool_gap: number; dele... Remove this comment to see the full error message
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ address_pool_gap: number; delegation... Remove this comment to see the full error message
       return _createWalletFromServerData(wallet);
     } catch (error) {
       logger.error('AdaApi::restoreByronLedgerWallet error', {
@@ -2093,7 +2111,6 @@ export default class AdaApi {
         });
       }
 
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.debug('AdaApi::updateSpendingPassword success');
       return true;
     } catch (error) {
@@ -2136,7 +2153,6 @@ export default class AdaApi {
     }
   };
   getSmashSettings = async (): Promise<GetSmashSettingsApiResponse> => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getSmashSettings called');
 
     try {
@@ -2194,10 +2210,9 @@ export default class AdaApi {
       );
 
       if (!isSmashServerValid) {
-        const error = {
+        const error: ErrorType = {
           code: 'invalid_smash_server',
         };
-        // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ code: string; }' is not assign... Remove this comment to see the full error message
         throw new ApiError(error);
       }
 
@@ -2322,8 +2337,7 @@ export default class AdaApi {
     });
 
     try {
-      // @ts-ignore ts-migrate(2322) FIXME: Type '[]' is not assignable to type 'Promise<[]>'.
-      const response: Promise<[]> = await exportWalletAsJSON(this.config, {
+      const response: [] = await exportWalletAsJSON(this.config, {
         walletId,
         filePath,
       });
@@ -2469,7 +2483,6 @@ export default class AdaApi {
     }
   };
   testReset = async (): Promise<void> => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::testReset called');
 
     try {
@@ -2483,7 +2496,6 @@ export default class AdaApi {
           })
         )
       );
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.debug('AdaApi::testReset success');
     } catch (error) {
       logger.error('AdaApi::testReset error', {
@@ -2493,7 +2505,6 @@ export default class AdaApi {
     }
   };
   getNetworkInfo = async (): Promise<GetNetworkInfoResponse> => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getNetworkInfo called');
 
     try {
@@ -2554,6 +2565,7 @@ export default class AdaApi {
       throw new ApiError(error);
     }
   };
+  // @ts-ignore ts-migrate(2583) FIXME: Cannot find name 'Promise'. Do you need to change ... Remove this comment to see the full error message
   getNetworkClock = async (
     isForceCheck: boolean
   ): Promise<GetNetworkClockResponse> => {
@@ -2582,6 +2594,7 @@ export default class AdaApi {
       throw new ApiError(error);
     }
   };
+  // @ts-ignore ts-migrate(2583) FIXME: Cannot find name 'Promise'. Do you need to change ... Remove this comment to see the full error message
   getNetworkParameters = async (): Promise<GetNetworkParametersResponse> => {
     // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getNetworkParameters called');
@@ -2626,7 +2639,6 @@ export default class AdaApi {
     }
   };
   getNews = async (): Promise<GetNewsResponse> => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.debug('AdaApi::getNews called');
     // Fetch news json
     let rawNews: string;
@@ -2919,6 +2931,42 @@ export default class AdaApi {
     fakeStakePoolsJson: Array<StakePool>
   ) => void;
   setStakePoolsFetchingFailed: () => void;
+  getCatalystFund = async (): Promise<CatalystFund> => {
+    logger.debug('AdaApi::getCatalystFund called', {});
+
+    try {
+      const catalystFund = await getCatalystFund();
+
+      logger.debug('AdaApi::getCatalystFund success', {
+        catalystFund,
+      });
+
+      return {
+        current: {
+          number: catalystFund.id + 1,
+          startTime: new Date(catalystFund.fund_start_time),
+          endTime: new Date(catalystFund.fund_end_time),
+          resultsTime: new Date(
+            catalystFund.chain_vote_plans?.[0]?.chain_committee_end_time
+          ),
+          registrationSnapshotTime: new Date(
+            catalystFund.registration_snapshot_time
+          ),
+        },
+        next: {
+          number: catalystFund.id + 2,
+          startTime: new Date(catalystFund.next_fund_start_time),
+          registrationSnapshotTime: new Date(
+            catalystFund.next_registration_snapshot_time
+          ),
+        },
+      };
+    } catch (error) {
+      logger.error('AdaApi::getCatalystFund error', {
+        error,
+      });
+    }
+  };
 } // ========== TRANSFORM SERVER DATA INTO FRONTEND MODELS =========
 
 const _createWalletFromServerData = action(
@@ -2984,6 +3032,7 @@ const _createWalletFromServerData = action(
           uniqueId,
           policyId,
           assetName,
+          assetNameASCII: hexToString(assetName),
           quantity: new BigNumber(quantity.toString()),
         };
       }),
@@ -2994,6 +3043,7 @@ const _createWalletFromServerData = action(
           uniqueId,
           policyId,
           assetName,
+          assetNameASCII: hexToString(assetName),
           quantity: new BigNumber(quantity.toString()),
         };
       }),
diff --git a/source/renderer/app/api/assets/types.ts b/source/renderer/app/api/assets/types.ts
index 7c33c9de64..47a2d43f16 100644
--- a/source/renderer/app/api/assets/types.ts
+++ b/source/renderer/app/api/assets/types.ts
@@ -49,6 +49,7 @@ export type ApiTokens = Array<ApiToken>;
 export type Token = {
   policyId: string;
   assetName: string;
+  assetNameASCII?: string;
   quantity: BigNumber;
   address?: string | null | undefined;
   uniqueId: string;
diff --git a/source/renderer/app/api/staking/types.ts b/source/renderer/app/api/staking/types.ts
index 1a6729c6b2..eee5b6db55 100644
--- a/source/renderer/app/api/staking/types.ts
+++ b/source/renderer/app/api/staking/types.ts
@@ -56,8 +56,11 @@ export type AdaApiStakePools = Array<AdaApiStakePool>;
 export type Reward = {
   date?: string;
   wallet: string;
-  reward: BigNumber;
+  total: BigNumber;
+  unspent: BigNumber;
   rewardsAddress: string;
+  isRestoring: boolean;
+  syncingProgress: number;
   pool?: StakePool;
 };
 export type EpochData = {
diff --git a/source/renderer/app/api/transactions/requests/selectCoins.ts b/source/renderer/app/api/transactions/requests/selectCoins.ts
index 2f50197548..dfdd898023 100644
--- a/source/renderer/app/api/transactions/requests/selectCoins.ts
+++ b/source/renderer/app/api/transactions/requests/selectCoins.ts
@@ -63,8 +63,8 @@ export type SelectCoinsResponseType = {
 export const selectCoins = (
   config: RequestConfig,
   { walletId, data }: SelectCoinsRequestType
-): Promise<SelectCoinsResponseType> =>
-  request(
+): Promise<SelectCoinsResponseType> => {
+  return request(
     {
       method: 'POST',
       path: `/v2/wallets/${walletId}/coin-selections/random`,
@@ -73,3 +73,4 @@ export const selectCoins = (
     {},
     data
   );
+};
diff --git a/source/renderer/app/api/utils/apiHelpers.spec.ts b/source/renderer/app/api/utils/apiHelpers.spec.ts
new file mode 100644
index 0000000000..07fedfa470
--- /dev/null
+++ b/source/renderer/app/api/utils/apiHelpers.spec.ts
@@ -0,0 +1,76 @@
+import { ErrorType } from '../../domains/ApiError';
+import { doesWalletRequireAdaToRemainToSupportTokens } from './apiHelpers';
+
+describe('throw error if not enough Ada to support tokens', () => {
+  it('should not throw if error.code is not "cannot_cover_fee"', () => {
+    const error: ErrorType = { code: 'bad_request' };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error, true)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: false,
+    });
+  });
+  it('should not throw error if error code is "cannot_cover_fee" but hasAssetsRemainingAfterTransaction is undefined', () => {
+    const error: ErrorType = {
+      message:
+        'I cannot proceed with transaction, I need approximately 1.6 ada to proceed',
+      code: 'cannot_cover_fee',
+    };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: false,
+    });
+  });
+  it('should not throw error if error code is "cannot_cover_fee" but message does not match regex', () => {
+    const error: ErrorType = {
+      message: 'other message',
+      code: 'cannot_cover_fee',
+    };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error, true)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: false,
+    });
+  });
+  it('should not throw error if error code is not "cannot_cover_fee" and message matches regex', () => {
+    const error: ErrorType = {
+      message:
+        'I cannot proceed with transaction, I need approximately 1.6 ada to proceed',
+      code: 'bad_request',
+    };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error, true)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: false,
+    });
+  });
+  it('should not throw if there are no tokens remaining in wallet after transaction', () => {
+    const error: ErrorType = { code: 'cannot_cover_fee' };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error, true)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: false,
+    });
+  });
+  it('should throw if there are tokens remaining in wallet after transaction and error is "cannot_cover_fee" and round to 2 minimum ada', () => {
+    const error: ErrorType = {
+      message:
+        'I am unable to finalize the transaction, as there is not enough ada available to pay for the fee and also pay for the minimum ada quantities of all change outputs. I need approximately 0.629344 ada to proceed. Try increasing your wallet balance or sending a smaller amount.',
+      code: 'cannot_cover_fee',
+    };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error, true)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: true,
+      adaToRemain: 2,
+    });
+  });
+
+  it('should throw if there are tokens remaining in wallet after transaction and error is "cannot_cover_fee" and round to 2 nearest whole value provided by error', () => {
+    const error: ErrorType = {
+      message:
+        'I am unable to finalize the transaction, as there is not enough ada available to pay for the fee and also pay for the minimum ada quantities of all change outputs. I need approximately 2.629344 ada to proceed. Try increasing your wallet balance or sending a smaller amount.',
+      code: 'cannot_cover_fee',
+    };
+
+    expect(doesWalletRequireAdaToRemainToSupportTokens(error, true)).toEqual({
+      requiresAdaToRemainToSupportNativeTokens: true,
+      adaToRemain: 3,
+    });
+  });
+});
diff --git a/source/renderer/app/api/utils/apiHelpers.ts b/source/renderer/app/api/utils/apiHelpers.ts
index 8e20197929..85f51f2927 100644
--- a/source/renderer/app/api/utils/apiHelpers.ts
+++ b/source/renderer/app/api/utils/apiHelpers.ts
@@ -1,4 +1,5 @@
 import { ApiMethodNotYetImplementedError } from '../common/errors';
+import { ErrorType } from '../../domains/ApiError';
 
 export const notYetImplemented = async () =>
   new Promise((resolve, reject) => {
@@ -21,3 +22,27 @@ export const testSync = (apiMethod: (...args: Array<any>) => any) => {
 // helper code for deferring API call execution
 export const wait = (ms: number): Promise<void> =>
   new Promise((resolve) => setTimeout(resolve, ms));
+export const doesWalletRequireAdaToRemainToSupportTokens = (
+  error: ErrorType,
+  hasAssetsRemainingAfterTransaction?: boolean
+): {
+  requiresAdaToRemainToSupportNativeTokens: boolean;
+  adaToRemain?: number;
+} => {
+  const adaToProceedRegex = new RegExp(
+    /.*I need approximately([\s\d.,]+)ada to proceed.*/
+  );
+
+  if (
+    error.code === 'cannot_cover_fee' &&
+    hasAssetsRemainingAfterTransaction &&
+    adaToProceedRegex.test(error.message)
+  ) {
+    const roundedAda = Math.ceil(
+      Number(error.message.replace(adaToProceedRegex, '$1'))
+    );
+    const adaToRemain = roundedAda > 2 ? roundedAda : 2;
+    return { requiresAdaToRemainToSupportNativeTokens: true, adaToRemain };
+  }
+  return { requiresAdaToRemainToSupportNativeTokens: false };
+};
diff --git a/source/renderer/app/api/utils/localStorage.ts b/source/renderer/app/api/utils/localStorage.ts
index 70bf003c15..4951c37aba 100644
--- a/source/renderer/app/api/utils/localStorage.ts
+++ b/source/renderer/app/api/utils/localStorage.ts
@@ -306,12 +306,6 @@ export default class LocalStorageApi {
       assetLocalData,
       `${policyId}${assetName}`
     );
-  getAssetSettingsDialogWasOpened = (): Promise<boolean> =>
-    LocalStorageApi.get(keys.ASSET_SETTINGS_DIALOG_WAS_OPENED, false);
-  setAssetSettingsDialogWasOpened = (): Promise<void> =>
-    LocalStorageApi.set(keys.ASSET_SETTINGS_DIALOG_WAS_OPENED, true);
-  unsetAssetSettingsDialogWasOpened = (): Promise<void> =>
-    LocalStorageApi.unset(keys.ASSET_SETTINGS_DIALOG_WAS_OPENED);
   getSmashServer = (): Promise<string> =>
     LocalStorageApi.get(keys.SMASH_SERVER);
   setSmashServer = (smashServerUrl: string): Promise<void> =>
@@ -404,6 +398,12 @@ export default class LocalStorageApi {
     LocalStorageApi.unset(keys.HARDWARE_WALLET_DEVICES, deviceId);
   unsetHardwareWalletDevicesAll = async (): Promise<void> =>
     LocalStorageApi.unset(keys.HARDWARE_WALLET_DEVICES);
+  setStakePoolsListViewTooltip = async (visited: boolean): Promise<void> =>
+    LocalStorageApi.set(keys.STAKE_POOLS_LIST_VIEW_TOOLTIP, visited);
+  getStakePoolsListViewTooltip = async (): Promise<boolean> =>
+    LocalStorageApi.get(keys.STAKE_POOLS_LIST_VIEW_TOOLTIP, true);
+  unsetStakePoolsListViewTooltip = async (): Promise<void> =>
+    LocalStorageApi.unset(keys.STAKE_POOLS_LIST_VIEW_TOOLTIP);
   reset = async () => {
     await LocalStorageApi.reset();
   };
diff --git a/source/renderer/app/api/utils/patchAdaApi.ts b/source/renderer/app/api/utils/patchAdaApi.ts
index 313e017011..b25bfeaede 100644
--- a/source/renderer/app/api/utils/patchAdaApi.ts
+++ b/source/renderer/app/api/utils/patchAdaApi.ts
@@ -86,24 +86,29 @@ export default (api: AdaApi) => {
     }
 
     // Always mutate newsfeed target version to current app version
-    const newsFeedItems = map(testingNewsFeedData.items, (item) => ({
-      ...item,
-      target: {
-        ...item.target,
-        daedalusVersion: item.target.daedalusVersion ? packageJsonVersion : '',
-      },
-    }));
+    const newsFeedItems = map(testingNewsFeedData.items, (item) => {
+      return {
+        ...item,
+        target: {
+          ...item.target,
+          daedalusVersion: item.target.daedalusVersion
+            ? packageJsonVersion
+            : '',
+        },
+      };
+    });
     TESTING_NEWSFEED_JSON = { ...testingNewsFeedData, items: newsFeedItems };
   };
 
-  api.getNews = (): Promise<GetNewsResponse> =>
-    new Promise((resolve, reject) => {
+  api.getNews = (): Promise<GetNewsResponse> => {
+    return new Promise((resolve, reject) => {
       if (!TESTING_NEWSFEED_JSON) {
         reject(new Error('Unable to fetch news'));
       } else {
         resolve(TESTING_NEWSFEED_JSON);
       }
     });
+  };
 
   api.setTestingWallet = (
     testingWalletData: Record<string, any>,
@@ -155,10 +160,12 @@ export default (api: AdaApi) => {
     LOCAL_TIME_DIFFERENCE = timeDifference;
   };
 
-  api.getNetworkClock = async () => ({
-    status: 'available',
-    offset: LOCAL_TIME_DIFFERENCE,
-  });
+  api.getNetworkClock = async () => {
+    return {
+      status: 'available',
+      offset: LOCAL_TIME_DIFFERENCE,
+    };
+  };
 
   api.resetTestOverrides = () => {
     TESTING_WALLETS_DATA = {};
diff --git a/source/renderer/app/api/utils/requestV0.ts b/source/renderer/app/api/utils/requestV0.ts
index 32db8fa75c..fae10c3225 100644
--- a/source/renderer/app/api/utils/requestV0.ts
+++ b/source/renderer/app/api/utils/requestV0.ts
@@ -39,7 +39,7 @@ function typedRequest<Response>(
           queryString = `?passphrase=${encryptedPassphrase}`;
         }
 
-        // Passphrase must be ommited from rest query params
+        // Passphrase must be omitted from rest query params
         queryParams = omit(queryParams, 'passphrase');
 
         // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'boolean' is not assignable to pa... Remove this comment to see the full error message
diff --git a/source/renderer/app/api/voting/requests/getCatalystFund.ts b/source/renderer/app/api/voting/requests/getCatalystFund.ts
new file mode 100644
index 0000000000..dd0efc55cd
--- /dev/null
+++ b/source/renderer/app/api/voting/requests/getCatalystFund.ts
@@ -0,0 +1,11 @@
+import { externalRequest } from '../../utils/externalRequest';
+import { MAINNET_SERVICING_STATION_URL } from '../../../config/urlsConfig';
+import { GetCatalystFundResponse } from '../types';
+
+export const getCatalystFund = (): Promise<GetCatalystFundResponse> =>
+  externalRequest({
+    hostname: MAINNET_SERVICING_STATION_URL,
+    path: '/api/v0/fund',
+    method: 'GET',
+    protocol: 'https',
+  });
diff --git a/source/renderer/app/api/voting/types.ts b/source/renderer/app/api/voting/types.ts
index 288409ff2d..ab15db9d65 100644
--- a/source/renderer/app/api/voting/types.ts
+++ b/source/renderer/app/api/voting/types.ts
@@ -27,3 +27,29 @@ export type SignatureParams = {
     passphrase: string;
   };
 };
+export type GetCatalystFundResponse = {
+  id: number;
+  fund_end_time: string;
+  fund_name: string;
+  fund_start_time: string;
+  next_fund_start_time: string;
+  next_registration_snapshot_time: string;
+  registration_snapshot_time: string;
+  chain_vote_plans: Array<{
+    chain_committee_end_time: string;
+  }>;
+};
+export type CatalystFund = {
+  current: {
+    number: number;
+    startTime: Date;
+    endTime: Date;
+    resultsTime: Date;
+    registrationSnapshotTime: Date;
+  };
+  next: {
+    number: number;
+    startTime: Date;
+    registrationSnapshotTime: Date;
+  };
+};
diff --git a/source/renderer/app/api/wallets/requests/createHardwareWallet.ts b/source/renderer/app/api/wallets/requests/createHardwareWallet.ts
index 270ccf5241..8318736118 100644
--- a/source/renderer/app/api/wallets/requests/createHardwareWallet.ts
+++ b/source/renderer/app/api/wallets/requests/createHardwareWallet.ts
@@ -13,8 +13,8 @@ export const createHardwareWallet = (
   }: {
     walletInitData: WalletInitData;
   }
-): Promise<AdaWallet> =>
-  request(
+): Promise<AdaWallet> => {
+  return request(
     {
       method: 'POST',
       path: '/v2/wallets',
@@ -23,3 +23,4 @@ export const createHardwareWallet = (
     {},
     walletInitData
   );
+};
diff --git a/source/renderer/app/assets/images/check-mark-universal.inline.svg b/source/renderer/app/assets/images/check-mark-universal.inline.svg
new file mode 100644
index 0000000000..9def2a6cc5
--- /dev/null
+++ b/source/renderer/app/assets/images/check-mark-universal.inline.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg viewBox="0 0 56 56" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="Page-1" stroke="none" stroke-width="1" fill-rule="evenodd">
+        <g id="loading-progress-steps" transform="translate(-118.000000, -372.000000)" fill-rule="nonzero">
+            <g id="Group" transform="translate(56.000000, 288.000000)">
+                <g id="check" transform="translate(62.000000, 84.000000)">
+                    <polygon id="Path-3" points="38.5857864 18.5857864 41.4142136 21.4142136 24 38.8284271 14.5857864 29.4142136 17.4142136 26.5857864 24 33.171"></polygon>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/source/renderer/app/assets/images/question-mark-universal.inline.svg b/source/renderer/app/assets/images/question-mark-universal.inline.svg
new file mode 100644
index 0000000000..f764a39b03
--- /dev/null
+++ b/source/renderer/app/assets/images/question-mark-universal.inline.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg viewBox="0 0 56 56" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="Page-1" stroke="none" stroke-width="1" fill-rule="evenodd">
+        <g id="loading-progress-steps" transform="translate(-151.000000, -471.000000)">
+            <g id="Group" transform="translate(56.000000, 288.000000)">
+                <g id="spinner-copy" transform="translate(95.000000, 183.000000)">
+                    <path d="M28,14 C35.7319865,14 42,20.2680135 42,28 C42,35.7319865 35.7319865,42 28,42 C20.2680135,42 14,35.7319865 14,28 C14,20.2680135 20.2680135,14 28,14 Z M27.4003906,31.7773438 C26.140625,31.7773438 25.3984375,32.4316406 25.3984375,33.5644531 C25.3984375,34.6875 26.140625,35.3417969 27.4003906,35.3417969 C28.6601562,35.3417969 29.3925781,34.6875 29.3925781,33.5644531 C29.3925781,32.4316406 28.6601562,31.7773438 27.4003906,31.7773438 Z M27.7519531,20.78125 C24.6269531,20.78125 22.7714844,22.4511719 22.7421875,25.0097656 L25.9160156,25.0097656 C25.9453125,24.0625 26.5898438,23.4375 27.5273438,23.4375 C28.4453125,23.4375 29.0898438,23.984375 29.0898438,24.7753906 C29.0898438,25.6347656 28.7480469,26.0449219 27.4199219,26.8261719 C26.0625,27.6074219 25.5742188,28.4863281 25.7597656,30.15625 L25.7890625,30.546875 L28.8359375,30.546875 L28.8359375,30.0878906 C28.8359375,29.1699219 29.2070312,28.7304688 30.5449219,27.9589844 C31.9804688,27.1289062 32.6542969,26.1328125 32.6542969,24.6875 C32.6542969,22.34375 30.7207031,20.78125 27.7519531,20.78125 Z" id="Combined-Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/source/renderer/app/assets/images/remove.inline.svg b/source/renderer/app/assets/images/remove.inline.svg
new file mode 100644
index 0000000000..89d76e64ba
--- /dev/null
+++ b/source/renderer/app/assets/images/remove.inline.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="4" viewBox="0 0 20 4" xmlns="http://www.w3.org/2000/svg">
+    <path d="M20 2H0" stroke="currentColor" stroke-width="4" fill="none" fill-rule="evenodd"/>
+</svg>
diff --git a/source/renderer/app/assets/images/search.inline.svg b/source/renderer/app/assets/images/search.inline.svg
index 0304c9c043..f83eb9153d 100644
--- a/source/renderer/app/assets/images/search.inline.svg
+++ b/source/renderer/app/assets/images/search.inline.svg
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <svg width="30px" height="30px" viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.300000012">
-        <g id="wallet_screen_list_view_small_view_expanded_inline" transform="translate(-800.000000, -657.000000)" fill="#5E6066">
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="wallet_screen_list_view_small_view_expanded_inline" transform="translate(-800.000000, -657.000000)" fill="currentColor">
             <g id="content" transform="translate(720.000000, 168.000000)">
                 <g id="search" transform="translate(40.000000, 454.000000)">
                     <path d="M61.5063364,53.7137269 C64.8038988,49.0866643 64.3770757,42.6214189 60.2258669,38.4702101 C55.59892,33.8432633 48.097157,33.8432633 43.4702101,38.4702101 C38.8432633,43.097157 38.8432633,50.59892 43.4702101,55.2258669 C47.6214189,59.3770757 54.0866643,59.8038988 58.7137269,56.5063364 L67.2073905,65 L70,62.2073905 L61.5063364,53.7137269 L61.5063364,53.7137269 Z M57.4332574,52.4332574 C60.5178887,49.3486262 60.5178887,44.3474508 57.4332574,41.2628196 C54.3486262,38.1781884 49.3474508,38.1781884 46.2628196,41.2628196 C43.1781884,44.3474508 43.1781884,49.3486262 46.2628196,52.4332574 C49.3474508,55.5178887 54.3486262,55.5178887 57.4332574,52.4332574 L57.4332574,52.4332574 Z" id="search-ic"></path>
diff --git a/source/renderer/app/assets/images/sort-arrow.inline.svg b/source/renderer/app/assets/images/sort-arrow.inline.svg
new file mode 100644
index 0000000000..4a70848e34
--- /dev/null
+++ b/source/renderer/app/assets/images/sort-arrow.inline.svg
@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="10" height="14" viewBox="0 0 10 14">
+    <g fill="none" fill-rule="evenodd" opacity=".7">
+        <g stroke="#FAFBFC" stroke-width="2">
+            <g>
+                <g>
+                    <g>
+                        <g>
+                            <path d="M4 0L4 12M8 8L4 12 0 8" transform="translate(-281 -1481) translate(168) translate(40 1476) translate(66) translate(8 5)"/>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/source/renderer/app/assets/images/spinner-universal.inline.svg b/source/renderer/app/assets/images/spinner-universal.inline.svg
new file mode 100644
index 0000000000..ed7a719506
--- /dev/null
+++ b/source/renderer/app/assets/images/spinner-universal.inline.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg viewBox="0 0 56 56" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="Page-1" stroke="none" stroke-width="1" fill-rule="evenodd">
+        <g id="loading-progress-steps" transform="translate(-56.000000, -456.000000)" fill-rule="nonzero">
+            <g id="Group" transform="translate(56.000000, 288.000000)">
+                <g id="spinner" transform="translate(0.000000, 168.000000)">
+                    <path d="M28,16 C34.627417,16 40,21.372583 40,28 C40,31.1047483 38.812963,34.0262096 36.7296274,36.2337622 L36.4852814,36.4852814 L33.6568542,33.6568542 C35.1487603,32.1649482 36,30.1523915 36,28 C36,23.581722 32.418278,20 28,20 C25.9501034,20 24.0270409,20.7720995 22.5597759,22.1343973 L22.3431458,22.3431458 L19.5147186,19.5147186 C21.7493338,17.2801035 24.7758383,16 28,16 Z"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/source/renderer/app/components/appUpdate/AppUpdateOverlay.scss b/source/renderer/app/components/appUpdate/AppUpdateOverlay.scss
index 44ca406396..e3435d97db 100644
--- a/source/renderer/app/components/appUpdate/AppUpdateOverlay.scss
+++ b/source/renderer/app/components/appUpdate/AppUpdateOverlay.scss
@@ -1,5 +1,6 @@
 @import '../../themes/mixins/link';
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers.scss';
 
 .component {
   align-items: center;
@@ -14,7 +15,7 @@
   position: fixed;
   top: 0;
   width: 100vw;
-  z-index: 22;
+  z-index: $dialog-z-index;
   @include overlay-backrop;
 
   .content {
diff --git a/source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx b/source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx
index b5d9fce077..e41bf0e22e 100644
--- a/source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx
+++ b/source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx
@@ -13,13 +13,10 @@ import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { ButtonSpinnerSkin } from 'react-polymorph/lib/skins/simple/ButtonSpinnerSkin';
 import ReactMarkdown from 'react-markdown';
 import News from '../../domains/News';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AppUpdateOverlay.scss' or it... Remove this comment to see the full error message
 import styles from './AppUpdateOverlay.scss';
 import DialogCloseButton from '../widgets/DialogCloseButton';
 import ProgressBarLarge from '../widgets/ProgressBarLarge';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/link-ic.in... Remove this comment to see the full error message
 import externalLinkIcon from '../../assets/images/link-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCrossThin from '../../assets/images/close-cross-thin.inline.svg';
 
 const messages = defineMessages({
@@ -209,7 +206,6 @@ class AppUpdateOverlay extends Component<Props, State> {
     const buttonStyles = classnames([
       styles.button,
       isButtonDisabled ? styles.disabled : null,
-      isWaitingToQuitDaedalus ? styles.installing : null,
     ]);
     const buttonLabel = isLinux
       ? messages.buttonInstallUpdateLabel
diff --git a/source/renderer/app/components/assets/Asset.scss b/source/renderer/app/components/assets/Asset.scss
index 7338123177..bc387f2631 100644
--- a/source/renderer/app/components/assets/Asset.scss
+++ b/source/renderer/app/components/assets/Asset.scss
@@ -75,6 +75,10 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+
+  &.ascii {
+    color: var(--theme-tokens-list-header-text-color);
+  }
 }
 
 .metadata {
diff --git a/source/renderer/app/components/assets/Asset.spec.tsx b/source/renderer/app/components/assets/Asset.spec.tsx
new file mode 100644
index 0000000000..ad78d00306
--- /dev/null
+++ b/source/renderer/app/components/assets/Asset.spec.tsx
@@ -0,0 +1,71 @@
+import React from 'react';
+import BigNumber from 'bignumber.js';
+import { render, screen, cleanup } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import Asset from './Asset';
+import { TestDecorator } from '../../../../../tests/_utils/TestDecorator';
+
+const assetWithMetadataName = {
+  policyId: 'policyId',
+  assetName: '54657374636f696e',
+  quantity: new BigNumber(1),
+  fingerprint: 'fingerprint',
+  metadata: {
+    name: 'Testcoin',
+    description: 'Test coin',
+  },
+  uniqueId: 'uniqueId',
+  decimals: 1,
+  recommendedDecimals: null,
+};
+const assetWitoutMetadataName = {
+  policyId: 'policyId',
+  assetName: '436f696e74657374',
+  quantity: new BigNumber(1),
+  fingerprint: 'fingerprint',
+  uniqueId: 'uniqueId',
+  decimals: 1,
+  recommendedDecimals: null,
+};
+const assetWithoutName = {
+  policyId: 'policyId',
+  assetName: '',
+  quantity: new BigNumber(1),
+  fingerprint: 'fingerprint',
+  uniqueId: 'uniqueId',
+  decimals: 1,
+  recommendedDecimals: null,
+};
+
+describe('Asset', () => {
+  afterEach(cleanup);
+
+  test('Should display asset metadata name', () => {
+    render(
+      <TestDecorator>
+        <Asset asset={assetWithMetadataName} />
+      </TestDecorator>
+    );
+    expect(screen.queryByTestId('assetName')).toHaveTextContent('Testcoin');
+  });
+
+  test('Should display asset ASCII name when metadata name is not available', () => {
+    render(
+      <TestDecorator>
+        <Asset asset={assetWitoutMetadataName} />
+      </TestDecorator>
+    );
+    expect(screen.queryByTestId('assetName')).toHaveTextContent(
+      'ASCII: Cointest'
+    );
+  });
+
+  test('Should not display asset name when metadata and ASCII name are not available', () => {
+    render(
+      <TestDecorator>
+        <Asset asset={assetWithoutName} />
+      </TestDecorator>
+    );
+    expect(screen.queryByTestId('assetName')).toBeNull();
+  });
+});
diff --git a/source/renderer/app/components/assets/Asset.tsx b/source/renderer/app/components/assets/Asset.tsx
index da60f6f71b..7a252b4fe2 100644
--- a/source/renderer/app/components/assets/Asset.tsx
+++ b/source/renderer/app/components/assets/Asset.tsx
@@ -4,13 +4,10 @@ import classnames from 'classnames';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { defineMessages, intlShape } from 'react-intl';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Asset.scss' or its correspon... Remove this comment to see the full error message
 import styles from './Asset.scss';
-import { ellipsis } from '../../utils/strings';
+import { ellipsis, hexToString } from '../../utils/strings';
 import AssetContent from './AssetContent';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/asset-toke... Remove this comment to see the full error message
 import settingsIcon from '../../assets/images/asset-token-settings-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/asset-toke... Remove this comment to see the full error message
 import warningIcon from '../../assets/images/asset-token-warning-ic.inline.svg';
 import { ASSET_TOKEN_DISPLAY_DELAY } from '../../config/timingConfig';
 import type { Asset as AssetProps } from '../../api/assets/types';
@@ -171,18 +168,25 @@ class Asset extends Component<Props, State> {
     const {
       asset,
       metadataNameChars,
-      small,
+      small = true,
       fullFingerprint,
       hasWarning,
       hasError,
     } = this.props;
-    const { fingerprint, metadata, decimals, recommendedDecimals } = asset;
-    const { name } = metadata || {};
+    const { fingerprint, metadata, decimals, recommendedDecimals, assetName } =
+      asset;
+    const hasMetadataName = !!metadata?.name;
+    const name =
+      metadata?.name || (assetName && `ASCII: ${hexToString(assetName)}`) || '';
+
+    const displayName = metadataNameChars
+      ? ellipsis(name, metadataNameChars)
+      : name;
     const contentStyles = classnames([
       styles.pill,
-      small ? styles.small : null,
       hasError ? styles.error : null,
     ]);
+    const [startCharAmount, endCharAmount] = small ? [9, 4] : [12, 12];
     let warningPopOverMessage;
 
     if (hasWarning) {
@@ -195,11 +199,19 @@ class Asset extends Component<Props, State> {
     return (
       <div className={contentStyles}>
         <div className={styles.fingerprint}>
-          {fullFingerprint ? fingerprint : ellipsis(fingerprint || '', 9, 4)}
+          {fullFingerprint
+            ? fingerprint
+            : ellipsis(fingerprint || '', startCharAmount, endCharAmount)}
         </div>
-        {name && (
-          <div className={styles.metadataName}>
-            {metadataNameChars ? ellipsis(name, metadataNameChars) : name}
+        {displayName && (
+          <div
+            data-testid="assetName"
+            className={classnames(
+              styles.metadataName,
+              !hasMetadataName && styles.ascii
+            )}
+          >
+            {displayName}
           </div>
         )}
         {hasWarning && (
@@ -210,7 +222,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>
         )}
@@ -219,19 +233,12 @@ class Asset extends Component<Props, State> {
   }
 
   renderPillPopOverContainer = () => {
-    const {
-      asset,
-      onCopyAssetParam,
-      assetSettingsDialogWasOpened,
-      anyAssetWasHovered,
-    } = this.props;
+    const { asset, onCopyAssetParam } = this.props;
     const pillContent = this.renderPillContent();
     const popOverContent = (
       <AssetContent
         asset={asset}
         onCopyAssetParam={onCopyAssetParam}
-        assetSettingsDialogWasOpened={assetSettingsDialogWasOpened}
-        anyAssetWasHovered={anyAssetWasHovered}
         className={styles.popOverContent}
         highlightFingerprint
       />
@@ -255,7 +262,6 @@ class Asset extends Component<Props, State> {
             '--rp-pop-over-box-shadow':
               '0 5px 20px 0 var(--theme-widgets-asset-token-box-shadow)',
           }}
-          contentClassName={styles.popOver}
           content={popOverContent}
           visible={isPillPopOverVisible}
           appendTo="parent"
@@ -293,7 +299,6 @@ class Asset extends Component<Props, State> {
     return (
       <button className={styles.settingsButton} onClick={onClickSettingsBind}>
         <PopOver
-          className={styles.test}
           content={intl.formatMessage(messages.settingsCogPopOver)}
           visible={isSettingsPopOverVisible}
         >
diff --git a/source/renderer/app/components/assets/AssetAmount.tsx b/source/renderer/app/components/assets/AssetAmount.tsx
index 55daf0fdc7..37a4e70150 100644
--- a/source/renderer/app/components/assets/AssetAmount.tsx
+++ b/source/renderer/app/components/assets/AssetAmount.tsx
@@ -5,7 +5,6 @@ import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { defineMessages, FormattedHTMLMessage } from 'react-intl';
 import { observer } from 'mobx-react';
 import { discreetWalletTokenAmount } from '../../features/discreet-mode/replacers/discreetWalletTokenAmount';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetAmount.scss' or its cor... Remove this comment to see the full error message
 import styles from './AssetAmount.scss';
 import type { AssetMetadata } from '../../api/assets/types';
 import { useDiscreetModeFeature } from '../../features/discreet-mode';
diff --git a/source/renderer/app/components/assets/AssetContent.scss b/source/renderer/app/components/assets/AssetContent.scss
index 6a436d801b..dd931d39fc 100644
--- a/source/renderer/app/components/assets/AssetContent.scss
+++ b/source/renderer/app/components/assets/AssetContent.scss
@@ -30,7 +30,7 @@
     margin-left: 10px;
     max-height: 48px;
     overflow-y: auto;
-    width: calc(100% - 140px);
+    width: calc(100% - 100px);
 
     &:not(:first-of-type) {
       margin-top: 10px;
@@ -109,7 +109,7 @@
   flex-direction: column;
   width: 100%;
 
-  .assetASCIIName {
+  .assetAsciiName {
     opacity: 0.5;
   }
 }
diff --git a/source/renderer/app/components/assets/AssetContent.tsx b/source/renderer/app/components/assets/AssetContent.tsx
index c693372903..47d2227d42 100644
--- a/source/renderer/app/components/assets/AssetContent.tsx
+++ b/source/renderer/app/components/assets/AssetContent.tsx
@@ -4,12 +4,9 @@ import classnames from 'classnames';
 import { defineMessages, intlShape, injectIntl } from 'react-intl';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetContent.scss' or its co... Remove this comment to see the full error message
 import styles from './AssetContent.scss';
 import { hexToString } from '../../utils/strings';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/copy-asset... Remove this comment to see the full error message
 import copyIcon from '../../assets/images/copy-asset.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/check-w.in... Remove this comment to see the full error message
 import copyCheckmarkIcon from '../../assets/images/check-w.inline.svg';
 import { ASSET_TOKEN_ID_COPY_FEEDBACK } from '../../config/timingConfig';
 import type { Asset as AssetProps } from '../../api/assets/types';
@@ -123,7 +120,7 @@ const AssetContent = observer((props: Props) => {
             <SVGInline svg={icon} className={iconClassnames} />
           </div>
           {assetId === 'assetName' && (
-            <div className={styles.assetASCIIName}>
+            <div className={styles.assetAsciiName}>
               (ASCII: {hexToString(value)})
             </div>
           )}
diff --git a/source/renderer/app/components/assets/AssetSettingsDialog.spec.tsx b/source/renderer/app/components/assets/AssetSettingsDialog.spec.tsx
new file mode 100644
index 0000000000..045e6207e4
--- /dev/null
+++ b/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();
+  });
+});
diff --git a/source/renderer/app/components/assets/AssetSettingsDialog.tsx b/source/renderer/app/components/assets/AssetSettingsDialog.tsx
index 704e6fc773..00e56c4a3e 100644
--- a/source/renderer/app/components/assets/AssetSettingsDialog.tsx
+++ b/source/renderer/app/components/assets/AssetSettingsDialog.tsx
@@ -8,17 +8,16 @@ import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import Asset from './Asset';
 import DialogCloseButton from '../widgets/DialogCloseButton';
 import Dialog from '../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetSettingsDialog.scss' or... Remove this comment to see the full error message
 import styles from './AssetSettingsDialog.scss';
 import globalMessages from '../../i18n/global-messages';
 import type { AssetToken } from '../../api/assets/types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/asset-toke... Remove this comment to see the full error message
 import warningIcon from '../../assets/images/asset-token-warning-ic.inline.svg';
 import {
   DEFAULT_DECIMAL_PRECISION,
   MAX_DECIMAL_PRECISION,
 } from '../../config/assetsConfig';
 import { DiscreetTokenWalletAmount } from '../../features/discreet-mode';
+import { isRecommendedDecimal } from '../wallet/tokens/wallet-token/helpers';
 
 const messages = defineMessages({
   title: {
@@ -34,12 +33,12 @@ const messages = defineMessages({
   },
   formattedBalanceLabel: {
     id: 'assets.settings.dialog.formattedAmount.label',
-    defaultMessage: '!!!Unformated amount',
+    defaultMessage: '!!!Unformatted amount',
     description: '"formattedBalanceLabel" for the Asset settings dialog',
   },
   unformattedBalanceLabel: {
     id: 'assets.settings.dialog.unformattedAmount.label',
-    defaultMessage: '!!!Formated amount',
+    defaultMessage: '!!!Formatted amount',
     description: '"unformattedBalanceLabel" for the Asset settings dialog',
   },
   decimalPrecisionLabel: {
@@ -137,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,
     }));
@@ -155,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) {
@@ -169,7 +171,9 @@ class AssetSettingsDialog extends Component<Props, State> {
       <Dialog
         className={styles.component}
         title={intl.formatMessage(messages.title)}
-        subtitle={<Asset asset={asset} className={styles.assetToken} />}
+        subtitle={
+          <Asset asset={asset} small={false} className={styles.assetToken} />
+        }
         actions={actions}
         closeOnOverlayClick
         onClose={onCancel}
@@ -200,7 +204,6 @@ class AssetSettingsDialog extends Component<Props, State> {
           <Select
             options={options}
             value={decimals}
-            className={styles.decimalsDropdown}
             label={
               <span className={styles.decimalsDropdownLabel}>
                 {intl.formatMessage(messages.decimalPrecisionLabel)}
@@ -210,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>
diff --git a/source/renderer/app/components/assets/AssetTransactionConfirmation.tsx b/source/renderer/app/components/assets/AssetTransactionConfirmation.tsx
index e33da64432..bae57010b8 100644
--- a/source/renderer/app/components/assets/AssetTransactionConfirmation.tsx
+++ b/source/renderer/app/components/assets/AssetTransactionConfirmation.tsx
@@ -10,9 +10,7 @@ import {
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { observer } from 'mobx-react';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/question-m... Remove this comment to see the full error message
 import questionMarkIcon from '../../assets/images/question-mark.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetTransactionConfirmation... Remove this comment to see the full error message
 import styles from './AssetTransactionConfirmation.scss';
 import type { AssetToken } from '../../api/assets/types';
 import Asset from './Asset';
diff --git a/source/renderer/app/components/assets/AssetsTransactionConfirmation.tsx b/source/renderer/app/components/assets/AssetsTransactionConfirmation.tsx
index 70e721f2f4..3e389281e0 100644
--- a/source/renderer/app/components/assets/AssetsTransactionConfirmation.tsx
+++ b/source/renderer/app/components/assets/AssetsTransactionConfirmation.tsx
@@ -4,7 +4,6 @@ import { intlShape, injectIntl } from 'react-intl';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import BigNumber from 'bignumber.js';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetsTransactionConfirmatio... Remove this comment to see the full error message
 import styles from './AssetsTransactionConfirmation.scss';
 import AssetTransactionConfirmation from './AssetTransactionConfirmation';
 import Wallet from '../../domains/Wallet';
diff --git a/source/renderer/app/components/dapp/DappTransactionRequest.tsx b/source/renderer/app/components/dapp/DappTransactionRequest.tsx
index fb6a635d47..2b2db034b7 100644
--- a/source/renderer/app/components/dapp/DappTransactionRequest.tsx
+++ b/source/renderer/app/components/dapp/DappTransactionRequest.tsx
@@ -9,7 +9,6 @@ import {
   FormattedHTMLMessage,
 } from 'react-intl';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DappTransactionRequest.scss'... Remove this comment to see the full error message
 import styles from './DappTransactionRequest.scss';
 import Dialog from '../widgets/Dialog';
 import globalMessages from '../../i18n/global-messages';
@@ -119,7 +118,6 @@ const DappTransactionRequest = observer((props: Props) => {
     triggeredFrom,
     wallets,
   } = props;
-  let hasAmountError = false;
   const hasTokenError = useMemo(
     () =>
       assets.reduce((result, token, index) => {
@@ -136,10 +134,6 @@ const DappTransactionRequest = observer((props: Props) => {
   const walletsDropdownHasError =
     selectedWallet?.amount.isLessThan(adaBalanceRequired);
 
-  if (walletsDropdownHasError) {
-    hasAmountError = true;
-  }
-
   const adaAmountErrorMessage = walletsDropdownHasError ? (
     <FormattedHTMLMessage
       {...messages.insufficientBalanceErrorMessage}
@@ -151,7 +145,6 @@ const DappTransactionRequest = observer((props: Props) => {
   const walletsDropdownStyles = classnames([
     styles.walletsDropdown,
     walletsDropdownHasError || hasTokenError ? styles.error : null,
-    hasAmountError ? styles.amountError : null,
   ]);
   const canSubmit =
     !!selectedWallet && !hasTokenError && !walletsDropdownHasError;
diff --git a/source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx b/source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx
index 08ffcb866a..d5af11c3f8 100644
--- a/source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx
+++ b/source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx
@@ -5,14 +5,11 @@ import SVGInline from 'react-svg-inline';
 import classnames from 'classnames';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/hardware-w... Remove this comment to see the full error message
 import checkIcon from '../../assets/images/hardware-wallet/check.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/hardware-w... Remove this comment to see the full error message
 import clearIcon from '../../assets/images/hardware-wallet/close-cross-red.inline.svg';
 import LoadingSpinner from '../widgets/LoadingSpinner';
 import { HwDeviceStatuses } from '../../domains/Wallet';
 import type { HwDeviceStatus } from '../../domains/Wallet';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './HardwareWalletStatus.scss' o... Remove this comment to see the full error message
 import styles from './HardwareWalletStatus.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.scss b/source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.scss
new file mode 100644
index 0000000000..f99de1e410
--- /dev/null
+++ b/source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.scss
@@ -0,0 +1,126 @@
+@import '../../../themes/mixins/overlay-backdrop';
+@import '../../../themes/mixins/layers.scss';
+
+// TODO reduce duplication with AlertsOverlay
+// https://input-output.atlassian.net/browse/DDW-928
+
+.component {
+  align-items: center;
+  background-color: rgba(255, 185, 35, 0.98);
+  color: #2d2d2d;
+  display: flex;
+  flex-direction: column;
+  font-family: var(--font-regular);
+  height: 100vh;
+  justify-content: center;
+  position: fixed;
+  top: 0;
+  width: 100vw;
+  z-index: $dialog-z-index;
+  @include overlay-backrop;
+
+  .actionBtn {
+    background-color: rgba(45, 45, 45, 0.1);
+    border: 1px solid #2d2d2d;
+    border-radius: 5px;
+    box-sizing: border-box;
+    color: #2d2d2d;
+    font-family: var(--font-medium);
+    line-height: 1.36;
+    margin-bottom: 22.5px;
+    min-height: 50px;
+    width: 360px;
+
+    &:hover {
+      background-color: #2d2d2d;
+      color: #fff;
+    }
+  }
+
+  .closeButton {
+    cursor: pointer;
+    display: flex;
+    justify-content: flex-end;
+    position: fixed;
+    right: 10px;
+    top: 10px;
+    z-index: 4;
+
+    span {
+      border-radius: 50%;
+      height: 44px;
+      width: 44px;
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.16);
+        border-radius: 50%;
+      }
+    }
+
+    svg {
+      height: 12px;
+      margin-top: 16px;
+      width: 12px;
+
+      polygon {
+        fill: #2d2d2d;
+      }
+
+      path {
+        stroke: #2d2d2d;
+      }
+    }
+  }
+
+  .content {
+    background-color: rgba(45, 45, 45, 0.1);
+
+    font-size: 16px;
+    line-height: 1.2;
+    margin-bottom: 30px;
+    max-height: 464px;
+    max-width: 600px;
+    min-width: 600px;
+    opacity: 0.8;
+    overflow-y: scroll;
+    padding: 12px 20px;
+    word-break: break-word;
+
+    &::-webkit-scrollbar-thumb {
+      background-color: rgba(45, 45, 45, 0.3);
+      min-height: 60px;
+      outline: none;
+      width: 4px;
+
+      &:hover {
+        background-color: rgba(45, 45, 45, 0.5);
+      }
+    }
+
+    & p {
+      margin-bottom: 11px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  .title {
+    font-size: 20px;
+    line-height: 1.2;
+    margin-bottom: 16px;
+    margin-top: 0;
+  }
+
+  .decideLaterLink {
+    border-bottom: 1px solid #2d2d2d;
+    color: #2d2d2d;
+    cursor: pointer;
+    display: inline-block;
+    font-family: var(--font-regular);
+    font-size: 14px;
+    line-height: 1.36;
+    opacity: 0.8;
+  }
+}
diff --git a/source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx b/source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx
new file mode 100644
index 0000000000..1038ce6823
--- /dev/null
+++ b/source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx
@@ -0,0 +1,83 @@
+import React, { Component } from 'react';
+import { observer } from 'mobx-react';
+import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
+import { Button } from 'react-polymorph/lib/components/Button';
+import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
+import { Link } from 'react-polymorph/lib/components/Link';
+import DialogCloseButton from '../../widgets/DialogCloseButton';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message
+import closeCrossThin from '../../../assets/images/close-cross-thin.inline.svg';
+import styles from './RTSFlagsRecommendationOverlay.scss';
+
+type Props = {
+  onConfirm: () => void;
+  onClose: () => void;
+};
+const messages = defineMessages({
+  title: {
+    id: 'knownIssues.rtsRecommendationOverlay.title',
+    defaultMessage: '!!!Recommended hardware requirements status',
+    description: 'Title of the RTS flags recommendation overlay',
+  },
+  content: {
+    id: 'knownIssues.rtsRecommendationOverlay.content',
+    defaultMessage:
+      '!!!<p>Your system specifications do not meet Daedalus’ recommended hardware requirements.</p><p>You can enable RAM management (RTS Flags), an experimental setting that can reduce memory usage on computers with less than 16GB of RAM.</p><p>You can enable it now by clicking the ‘Enable and quit’ button. Note that you will have to restart Daedalus for this change to take effect. To enable or disable it at any time, go to the Help menu.</p>',
+    description: 'Content of the RTS flags recommendation overlay',
+  },
+  enableAndQuitButtonLabel: {
+    id: 'knownIssues.rtsRecommendationOverlay.enableAndQuitButtonLabel',
+    defaultMessage: '!!!Enable and quit',
+    description: 'Enable and quit button label',
+  },
+  decideLaterButtonLabel: {
+    id: 'knownIssues.rtsRecommendationOverlay.decideLaterButtonLabel',
+    defaultMessage: '!!!Decide later',
+    description: 'Decide later button label',
+  },
+});
+
+@observer
+class RTSFlagsRecommendationOverlay extends Component<Props> {
+  static contextTypes = {
+    intl: intlShape.isRequired,
+  };
+
+  render() {
+    const { intl } = this.context;
+    const { onClose, onConfirm } = this.props;
+    // TODO reduce duplication with AlertsOverlay
+    // https://input-output.atlassian.net/browse/DDW-928
+    return (
+      <div className={styles.component}>
+        <DialogCloseButton
+          className={styles.closeButton}
+          icon={closeCrossThin}
+          onClose={onClose}
+        />
+        <h1 className={styles.title}>{intl.formatMessage(messages.title)}</h1>
+        <div className={styles.content}>
+          <FormattedHTMLMessage {...messages.content} />
+        </div>
+        <Button
+          className={styles.actionBtn}
+          onClick={onConfirm}
+          label={intl.formatMessage(messages.enableAndQuitButtonLabel)}
+          linkProps={{
+            hasIconBefore: false,
+            hasIconAfter: false,
+          }}
+        />
+        <Link
+          className={styles.decideLaterLink}
+          onClick={onClose}
+          label={intl.formatMessage(messages.decideLaterButtonLabel)}
+          hasIconAfter={false}
+          skin={LinkSkin}
+        />
+      </div>
+    );
+  }
+}
+
+export default RTSFlagsRecommendationOverlay;
diff --git a/source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.scss b/source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.scss
new file mode 100644
index 0000000000..cb7c80717e
--- /dev/null
+++ b/source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.scss
@@ -0,0 +1,13 @@
+.dialog {
+  font-family: var(--font-light);
+
+  p {
+    line-height: 23px;
+  }
+
+  :global {
+    .SimpleCheckbox_root {
+      margin-top: 20px;
+    }
+  }
+}
diff --git a/source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx b/source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx
new file mode 100644
index 0000000000..ba1f0d4c28
--- /dev/null
+++ b/source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx
@@ -0,0 +1,125 @@
+import React, { Component } from 'react';
+import { observer } from 'mobx-react';
+import { defineMessages, intlShape } from 'react-intl';
+import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
+import DialogCloseButton from '../../widgets/DialogCloseButton';
+import Dialog from '../../widgets/Dialog';
+import globalMessages from '../../../i18n/global-messages';
+import styles from './ToggleRTSFlagsDialog.scss';
+
+const messages = defineMessages({
+  enableRTSFlagsModeHeadline: {
+    id: 'knownIssues.dialog.enableRtsFlagsMode.title',
+    defaultMessage: '!!!Enable RTS flags (RAM management system)',
+    description: 'Headline for the RTS flags dialog - when enabling',
+  },
+  enableRTSFlagsModeExplanation: {
+    id: 'knownIssues.dialog.enableRtsFlagsMode.explanation',
+    defaultMessage:
+      '!!!When enabled, the Cardano node will attempt to reduce its RAM usage. You will need to restart Daedalus for this change to take effect.',
+    description: 'Main body of the dialog - when enabling',
+  },
+  enableRTSFlagsModeActionButton: {
+    id: 'knownIssues.dialog.enableRtsFlagsMode.actionButton',
+    defaultMessage: '!!!Enable and quit',
+    description: 'Enable RTS flags button label',
+  },
+  disableRTSFlagsModeHeadline: {
+    id: 'knownIssues.dialog.disableRtsFlagsMode.title',
+    defaultMessage: '!!!Disable RTS flags (RAM management system)',
+    description: 'Headline for the RTS flags dialog - when disabling',
+  },
+  disableRTSFlagsModeExplanation: {
+    id: 'knownIssues.dialog.disableRtsFlagsMode.explanation',
+    defaultMessage:
+      '!!!When disabled, the Cardano node will start in default mode. You will need to restart Daedalus for this change to take effect.',
+    description: 'Main body of the dialog - when disabling',
+  },
+  disableRTSFlagsModeActionButton: {
+    id: 'knownIssues.dialog.disableRtsFlagsMode.actionButton',
+    defaultMessage: '!!!Disable and quit',
+    description: 'Disable RTS flags button label',
+  },
+  manualRelaunchConfirmationCheckboxLabel: {
+    id: 'knownIssues.dialog.toggleRtsFlagsMode.manualRelaunchConfirmationCheckboxLabel',
+    defaultMessage:
+      '!!!I understand that I will need to launch Daedalus manually',
+    description: 'Manual relaunch confirmation checkbox label',
+  },
+});
+type Props = {
+  onClose: () => void;
+  onConfirm: () => void;
+  isRTSFlagsModeEnabled: boolean;
+};
+type State = {
+  isConfirmationCheckboxChecked: boolean;
+};
+
+@observer
+class ToggleRTSFlagsDialog extends Component<Props, State> {
+  static contextTypes = {
+    intl: intlShape.isRequired,
+  };
+  state = {
+    isConfirmationCheckboxChecked: false,
+  };
+  handleCheckboxToggle = () => {
+    this.setState((prevState) => ({
+      isConfirmationCheckboxChecked: !prevState.isConfirmationCheckboxChecked,
+    }));
+  };
+
+  render() {
+    const { intl } = this.context;
+    const { isRTSFlagsModeEnabled, onClose, onConfirm } = this.props;
+    const { isConfirmationCheckboxChecked } = this.state;
+    const actions = [
+      {
+        label: intl.formatMessage(globalMessages.cancel),
+        onClick: onClose,
+      },
+      {
+        label: intl.formatMessage(
+          isRTSFlagsModeEnabled
+            ? messages.disableRTSFlagsModeActionButton
+            : messages.enableRTSFlagsModeActionButton
+        ),
+        primary: true,
+        onClick: onConfirm,
+        disabled: !isConfirmationCheckboxChecked,
+      },
+    ];
+    return (
+      <Dialog
+        className={styles.dialog}
+        title={intl.formatMessage(
+          isRTSFlagsModeEnabled
+            ? messages.disableRTSFlagsModeHeadline
+            : messages.enableRTSFlagsModeHeadline
+        )}
+        actions={actions}
+        closeOnOverlayClick
+        onClose={onClose}
+        closeButton={<DialogCloseButton onClose={onClose} />}
+      >
+        <p>
+          {intl.formatMessage(
+            isRTSFlagsModeEnabled
+              ? messages.disableRTSFlagsModeExplanation
+              : messages.enableRTSFlagsModeExplanation
+          )}
+        </p>
+        <Checkbox
+          label={intl.formatMessage(
+            messages.manualRelaunchConfirmationCheckboxLabel
+          )}
+          onChange={this.handleCheckboxToggle}
+          checked={isConfirmationCheckboxChecked}
+        />
+      </Dialog>
+    );
+  }
+}
+
+export default ToggleRTSFlagsDialog;
diff --git a/source/renderer/app/components/layout/CenteredLayout.tsx b/source/renderer/app/components/layout/CenteredLayout.tsx
index 8dc43a28f7..c6e730f8cc 100644
--- a/source/renderer/app/components/layout/CenteredLayout.tsx
+++ b/source/renderer/app/components/layout/CenteredLayout.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CenteredLayout.scss' or its ... Remove this comment to see the full error message
 import styles from './CenteredLayout.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/layout/SidebarLayout.scss b/source/renderer/app/components/layout/SidebarLayout.scss
index 648ac779b0..7aa7fbf723 100644
--- a/source/renderer/app/components/layout/SidebarLayout.scss
+++ b/source/renderer/app/components/layout/SidebarLayout.scss
@@ -12,8 +12,6 @@
   overflow: hidden;
   position: relative;
   width: 100%;
-  // Show elements that overflow the main above the sidebar area
-  z-index: 20;
 }
 
 .sidebar {
@@ -24,8 +22,6 @@
 .topbar {
   box-shadow: 0 5px 20px 0 var(--theme-sidebar-layout-topbar-shadow-color);
   flex-shrink: 0;
-  // Show elements that overflow the topbar above the content area
-  z-index: 20;
 }
 
 .contentWrapper {
diff --git a/source/renderer/app/components/layout/SidebarLayout.tsx b/source/renderer/app/components/layout/SidebarLayout.tsx
index 2c71a30f07..d73bc3b0d1 100644
--- a/source/renderer/app/components/layout/SidebarLayout.tsx
+++ b/source/renderer/app/components/layout/SidebarLayout.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SidebarLayout.scss' or its c... Remove this comment to see the full error message
 import styles from './SidebarLayout.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/layout/TopBar.tsx b/source/renderer/app/components/layout/TopBar.tsx
index a8de86e8c3..b50d4610bd 100644
--- a/source/renderer/app/components/layout/TopBar.tsx
+++ b/source/renderer/app/components/layout/TopBar.tsx
@@ -8,9 +8,7 @@ import { IS_BYRON_WALLET_MIGRATION_ENABLED } from '../../config/walletsConfig';
 import LegacyBadge, { LEGACY_BADGE_MODES } from '../notifications/LegacyBadge';
 import LegacyNotification from '../notifications/LegacyNotification';
 import Wallet from '../../domains/Wallet';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TopBar.scss' or its correspo... Remove this comment to see the full error message
 import styles from './TopBar.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/header-log... Remove this comment to see the full error message
 import headerLogo from '../../assets/images/header-logo.inline.svg';
 import { DiscreetWalletAmount } from '../../features/discreet-mode';
 
diff --git a/source/renderer/app/components/layout/TopBarLayout.tsx b/source/renderer/app/components/layout/TopBarLayout.tsx
index 8e4248014e..94094e7ea0 100644
--- a/source/renderer/app/components/layout/TopBarLayout.tsx
+++ b/source/renderer/app/components/layout/TopBarLayout.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TopBarLayout.scss' or its co... Remove this comment to see the full error message
 import styles from './TopBarLayout.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/layout/VerticalFlexContainer.tsx b/source/renderer/app/components/layout/VerticalFlexContainer.tsx
index 067a650581..a5d9fb9330 100644
--- a/source/renderer/app/components/layout/VerticalFlexContainer.tsx
+++ b/source/renderer/app/components/layout/VerticalFlexContainer.tsx
@@ -1,7 +1,6 @@
 import React, { memo } from 'react';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VerticalFlexContainer.scss' ... Remove this comment to see the full error message
 import styles from './VerticalFlexContainer.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/loading/no-disk-space-error/NoDiskSpaceError.tsx b/source/renderer/app/components/loading/no-disk-space-error/NoDiskSpaceError.tsx
index 377a754fc0..96813a2b2d 100644
--- a/source/renderer/app/components/loading/no-disk-space-error/NoDiskSpaceError.tsx
+++ b/source/renderer/app/components/loading/no-disk-space-error/NoDiskSpaceError.tsx
@@ -4,7 +4,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/attenti... Remove this comment to see the full error message
 import attentionIcon from '../../../assets/images/attention-big-light.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NoDiskSpaceError.scss' or it... Remove this comment to see the full error message
 import styles from './NoDiskSpaceError.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.scss b/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.scss
index 3343e14e2e..7961b95c08 100644
--- a/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.scss
+++ b/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.scss
@@ -1,5 +1,3 @@
-@use 'sass:math';
-
 .component {
   align-items: center;
   display: flex;
@@ -8,8 +6,8 @@
   width: 100%;
 }
 
-.ada-logo,
-.ada-apiLogo {
+.adaLogo,
+.adaApiLogo {
   & > svg {
     display: block;
     opacity: 0.5;
@@ -18,13 +16,13 @@
 }
 
 $cardanoLogoWidth: 86px;
-.ada-apiLogo > svg {
+.adaApiLogo > svg {
   width: $cardanoLogoWidth;
 }
 
 $adaLogoWidth: 43px;
-.ada-logo > svg {
-  margin: 3px math.div(($cardanoLogoWidth - $adaLogoWidth), 2) 0; // Visually align in the middle + Needs to be the same dimension as the apiLogo
+.adaLogo > svg {
+  margin: 3px ($cardanoLogoWidth - $adaLogoWidth) / 2 0; // Visually align in the middle + Needs to be the same dimension as the apiLogo
   width: $adaLogoWidth;
 }
 
@@ -39,7 +37,7 @@ $adaLogoWidth: 43px;
 }
 
 .connectingLogo {
-  &.ada-logo {
+  &.adaLogo {
     & svg > g > g path {
       fill: var(--theme-icon-connecting-ada-logo-color);
     }
@@ -49,7 +47,7 @@ $adaLogoWidth: 43px;
       fill: var(--theme-icon-connecting-daedalus-logo-color);
     }
   }
-  &.ada-apiLogo {
+  &.adaApiLogo {
     & svg > g > g path {
       fill: var(--theme-icon-connecting-ada-api-logo-color);
     }
@@ -57,7 +55,7 @@ $adaLogoWidth: 43px;
 }
 
 .syncingLogo {
-  &.ada-logo {
+  &.adaLogo {
     svg > g > g path {
       fill: var(--theme-icon-syncing-ada-logo-color);
     }
@@ -67,7 +65,7 @@ $adaLogoWidth: 43px;
       fill: var(--theme-icon-syncing-daedalus-logo-color);
     }
   }
-  &.ada-apiLogo {
+  &.adaApiLogo {
     & svg > g > g path {
       fill: var(--theme-icon-syncing-ada-api-logo-color);
     }
diff --git a/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.tsx b/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.tsx
index baa80d465e..8394f7b424 100644
--- a/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.tsx
+++ b/source/renderer/app/components/loading/syncing-connecting/LogosDisplay.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
 import classNames from 'classnames';
 import Lottie from 'react-lottie';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './LogosDisplay.scss' or its co... Remove this comment to see the full error message
 import styles from './LogosDisplay.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/ada-log... Remove this comment to see the full error message
 import adaLogo from '../../../assets/images/ada-logo.inline.svg';
@@ -33,7 +32,7 @@ export default class LogosDisplay extends Component<Props> {
   render() {
     const { isConnected } = this.props;
     const currencyLogoStyles = classNames([
-      styles['ada-logo'],
+      styles.adaLogo,
       !isConnected ? styles.connectingLogo : styles.syncingLogo,
     ]);
     const daedalusLogoStyles = classNames([
@@ -41,7 +40,7 @@ export default class LogosDisplay extends Component<Props> {
       !isConnected ? styles.connectingLogo : styles.syncingLogo,
     ]);
     const apiLogoStyles = classNames([
-      styles['ada-apiLogo'],
+      styles.adaApiLogo,
       !isConnected ? styles.connectingLogo : styles.syncingLogo,
     ]);
     return (
diff --git a/source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx b/source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx
index 714396b66e..ee231345b0 100644
--- a/source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx
+++ b/source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx
@@ -6,7 +6,6 @@ import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ReportIssue.scss' or its cor... Remove this comment to see the full error message
 import styles from './ReportIssue.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/link-ic... Remove this comment to see the full error message
 import externalLinkIcon from '../../../assets/images/link-ic.inline.svg';
diff --git a/source/renderer/app/components/loading/syncing-connecting/StatusIcons.scss b/source/renderer/app/components/loading/syncing-connecting/StatusIcons.scss
index 27112330ff..8787aebe55 100644
--- a/source/renderer/app/components/loading/syncing-connecting/StatusIcons.scss
+++ b/source/renderer/app/components/loading/syncing-connecting/StatusIcons.scss
@@ -23,14 +23,14 @@
   }
 }
 
-.icon-on path:nth-of-type(2) {
+.iconOn path:nth-of-type(2) {
   fill: var(--theme-loading-status-icons-on-color);
 }
-.icon-off path:nth-of-type(2) {
+.iconOff path:nth-of-type(2) {
   fill: var(--theme-loading-status-icons-off-color);
 }
-.icon-unloaded,
-.icon-unknown {
+.iconUnloaded,
+.iconUnknown {
   &.syncing {
     path:nth-of-type(2) {
       fill: var(--theme-loading-status-icons-unloaded-syncing-color);
@@ -42,7 +42,7 @@
     }
   }
 }
-.icon-unknown {
+.iconUnknown {
   opacity: 0.3;
 }
 
diff --git a/source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx b/source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx
index 24dc852d09..2f996887d4 100644
--- a/source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx
+++ b/source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx
@@ -3,7 +3,6 @@ import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StatusIcons.scss' or its cor... Remove this comment to see the full error message
 import styles from './StatusIcons.scss';
 import { CardanoNodeStates } from '../../../../../common/types/cardano-node.types';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/node-st... Remove this comment to see the full error message
@@ -221,10 +220,17 @@ export default class StatusIcons extends Component<Props> {
       status = 'unknown';
     }
 
+    const classesMap = {
+      on: styles.iconOn,
+      off: styles.iconOff,
+      unloaded: styles.iconUnloaded,
+      unknown: styles.iconUnknown,
+    };
+
     return classNames([
       styles.icon,
-      styles[`icon-${status}`],
-      styles[`icon-${paramName}`],
+      classesMap[status],
+      classesMap[paramName],
       isNodeSyncing ? styles.syncing : styles.loading,
     ]);
   };
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingConnecting.tsx b/source/renderer/app/components/loading/syncing-connecting/SyncingConnecting.tsx
index 7c1af6d1d4..c69f695891 100644
--- a/source/renderer/app/components/loading/syncing-connecting/SyncingConnecting.tsx
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingConnecting.tsx
@@ -7,9 +7,11 @@ import LogosDisplay from './LogosDisplay';
 import SyncingConnectingBackground from './SyncingConnectingBackground';
 import SyncingConnectingStatus from './SyncingConnectingStatus';
 import { CardanoNodeStates } from '../../../../../common/types/cardano-node.types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SyncingConnecting.scss' or i... Remove this comment to see the full error message
 import styles from './SyncingConnecting.scss';
-import type { CardanoNodeState } from '../../../../../common/types/cardano-node.types';
+import type {
+  CardanoNodeState,
+  BlockSyncType,
+} from '../../../../../common/types/cardano-node.types';
 import { REPORT_ISSUE_TIME_TRIGGER } from '../../../config/timingConfig';
 import NewsFeedIcon from '../../widgets/NewsFeedIcon';
 
@@ -17,9 +19,10 @@ let connectingInterval = null;
 type State = {
   connectingTime: number;
 };
-type Props = {
+
+export type Props = {
   cardanoNodeState: CardanoNodeState | null | undefined;
-  verificationProgress: number;
+  blockSyncProgress: Record<BlockSyncType, number>;
   hasBeenConnected: boolean;
   forceConnectivityIssue?: boolean;
   isConnected: boolean;
@@ -164,7 +167,7 @@ class SyncingConnecting extends Component<Props, State> {
       onToggleNewsFeedIconClick,
       showNewsFeedIcon,
       isVerifyingBlockchain,
-      verificationProgress,
+      blockSyncProgress,
     } = this.props;
     const newsFeedIconStyles = classNames([
       isConnecting ? 'connectingScreen' : null,
@@ -205,7 +208,7 @@ class SyncingConnecting extends Component<Props, State> {
           isNodeStopping={isNodeStopping}
           isNodeStopped={isNodeStopped}
           isVerifyingBlockchain={isVerifyingBlockchain}
-          verificationProgress={verificationProgress}
+          blockSyncProgress={blockSyncProgress}
         />
         <StatusIcons
           onIconClick={onStatusIconClick}
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingBackground.tsx b/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingBackground.tsx
index 2adfac52b8..939d1770fd 100644
--- a/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingBackground.tsx
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingBackground.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SyncingConnectingBackground.... Remove this comment to see the full error message
 import styles from './SyncingConnectingBackground.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.scss b/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.scss
index f785dee7de..39da99a749 100644
--- a/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.scss
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.scss
@@ -2,6 +2,7 @@
 
 .component {
   bottom: 64px;
+  font-family: var(--font-regular);
   position: absolute;
   text-align: center;
   width: 100%;
@@ -13,14 +14,12 @@
 }
 
 .headline {
-  font-family: var(--font-regular);
   font-size: 18px;
   margin-bottom: 14px;
 }
 
 .description {
   color: var(--theme-connecting-description-color);
-  font-family: var(--font-regular);
   font-size: 16px;
   line-height: 22px;
   margin: 0 auto;
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx b/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx
index ea57b688e4..cc3199cea8 100644
--- a/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx
@@ -1,10 +1,13 @@
-import React, { Component } from 'react';
-import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SyncingConnectingStatus.scss... Remove this comment to see the full error message
+import React, { Component } from 'react';
+import { defineMessages, FormattedHTMLMessage, intlShape } from 'react-intl';
+import {
+  BlockSyncType,
+  CardanoNodeState,
+  CardanoNodeStates,
+} from '../../../../../common/types/cardano-node.types';
 import styles from './SyncingConnectingStatus.scss';
-import { CardanoNodeStates } from '../../../../../common/types/cardano-node.types';
-import type { CardanoNodeState } from '../../../../../common/types/cardano-node.types';
+import SyncingProgress from './SyncingProgress';
 
 const messages = defineMessages({
   starting: {
@@ -15,7 +18,7 @@ const messages = defineMessages({
   startingDescription: {
     id: 'loading.screen.startingCardanoDescription',
     defaultMessage:
-      '!!!This process validates the integrity of local blockchain data and could take several minutes.',
+      '!!!This process validates the integrity of local blockchain data.',
     description: 'Message "Starting Cardano node" on the loading screen.',
   },
   stopping: {
@@ -77,17 +80,11 @@ const messages = defineMessages({
     defaultMessage: '!!!TLS certificate is not valid, please restart Daedalus.',
     description: 'The TLS cert is not valid and Daedalus should be restarted',
   },
-  verifyingBlockchain: {
-    id: 'loading.screen.verifyingBlockchainMessage',
-    defaultMessage:
-      '!!!Verifying the blockchain ({verificationProgress}% complete)',
-    description:
-      'Message "Verifying the blockchain (65% complete) ..." on the loading screen.',
-  },
 });
-type Props = {
+
+interface Props {
   cardanoNodeState: CardanoNodeState | null | undefined;
-  verificationProgress: number;
+  blockSyncProgress: Record<BlockSyncType, number>;
   hasLoadedCurrentLocale: boolean;
   hasBeenConnected: boolean;
   isTlsCertInvalid: boolean;
@@ -95,11 +92,13 @@ type Props = {
   isNodeStopping: boolean;
   isNodeStopped: boolean;
   isVerifyingBlockchain: boolean;
-};
+}
+
 export default class SyncingConnectingStatus extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
+
   _getConnectingMessage = (): {
     connectingMessage: string;
     connectingDescription?: string;
@@ -107,7 +106,6 @@ export default class SyncingConnectingStatus extends Component<Props> {
     const {
       cardanoNodeState,
       hasBeenConnected,
-      isVerifyingBlockchain,
       isTlsCertInvalid,
       isConnected,
     } = this.props;
@@ -156,8 +154,8 @@ export default class SyncingConnectingStatus extends Component<Props> {
         connectingMessage = messages.unrecoverable;
         break;
 
+      case CardanoNodeStates.RUNNING:
       default:
-        // also covers CardanoNodeStates.RUNNING state
         connectingMessage = hasBeenConnected
           ? messages.reconnecting
           : messages.connecting;
@@ -169,9 +167,6 @@ export default class SyncingConnectingStatus extends Component<Props> {
 
     if (isTlsCertInvalid && isConnectingMessage) {
       connectingMessage = messages.tlsCertificateNotValidError;
-    } else if (isVerifyingBlockchain && isConnectingMessage) {
-      connectingMessage = messages.verifyingBlockchain;
-      connectingDescription = messages.startingDescription;
     }
 
     return {
@@ -187,10 +182,27 @@ export default class SyncingConnectingStatus extends Component<Props> {
       isNodeStopping,
       isNodeStopped,
       isTlsCertInvalid,
+      isVerifyingBlockchain,
       hasLoadedCurrentLocale,
-      verificationProgress,
+      blockSyncProgress,
+      cardanoNodeState,
     } = this.props;
     if (!hasLoadedCurrentLocale) return null;
+
+    const { connectingMessage, connectingDescription } =
+      this._getConnectingMessage();
+
+    if (
+      cardanoNodeState === CardanoNodeStates.RUNNING &&
+      isVerifyingBlockchain
+    ) {
+      return (
+        <div className={styles.component}>
+          <SyncingProgress {...blockSyncProgress} />
+        </div>
+      );
+    }
+
     const showEllipsis =
       !isConnected && (isNodeStopped || (isTlsCertInvalid && !isNodeStopping));
     const componentStyles = classNames([
@@ -202,15 +214,10 @@ export default class SyncingConnectingStatus extends Component<Props> {
       showEllipsis ? styles.withoutAnimation : null,
     ]);
 
-    const { connectingMessage, connectingDescription } =
-      this._getConnectingMessage();
-
     return (
       <div className={componentStyles}>
         <h1 className={headlineStyles}>
-          {intl.formatMessage(connectingMessage, {
-            verificationProgress,
-          })}
+          {intl.formatMessage(connectingMessage)}
         </h1>
         <div className={styles.description}>
           {connectingDescription && (
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts
new file mode 100644
index 0000000000..628b178193
--- /dev/null
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts
@@ -0,0 +1,43 @@
+import { defineMessages } from 'react-intl';
+import { ReactIntlMessage } from '../../../../types/i18nTypes';
+
+const messages: Record<string, ReactIntlMessage> = defineMessages({
+  validatingChunk: {
+    id: 'loading.screen.validatingChunk',
+    defaultMessage: '!!!Verifying on-disk blockchain state',
+    description: 'One of three progress names on the loading screen.',
+  },
+  validatingChunkDescription: {
+    id: 'loading.screen.validatingChunkDescription',
+    defaultMessage:
+      '!!!Verifying the integrity of the blockchain calculating hashes',
+    description:
+      'Description of one of three progress names on the loading screen.',
+  },
+  replayedBlock: {
+    id: 'loading.screen.replayedBlock',
+    defaultMessage: '!!!Replaying ledger from on-disk blockchain',
+    description: 'One of three progress names on the loading screen.',
+  },
+  replayedBlockDescription: {
+    id: 'loading.screen.replayedBlockDescription',
+    defaultMessage:
+      '!!!Looking for a ledger snapshot and updating (recomputing) the latest state',
+    description:
+      'Description of one of three progress names on the loading screen.',
+  },
+  pushingLedger: {
+    id: 'loading.screen.pushingLedger',
+    defaultMessage: '!!!Syncing blockchain',
+    description: 'One of three progress names on the loading screen.',
+  },
+  pushingLedgerDescription: {
+    id: 'loading.screen.pushingLedgerDescription',
+    defaultMessage:
+      '!!!Performing initial chain selection and finalizing blockchain state',
+    description:
+      'Description of one of three progress names on the loading screen.',
+  },
+});
+
+export default messages;
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.scss b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.scss
new file mode 100644
index 0000000000..85c6eae6af
--- /dev/null
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.scss
@@ -0,0 +1,67 @@
+.root {
+  display: flex;
+  justify-content: center;
+}
+
+.column {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.columnIcons {
+  margin-right: 12px;
+}
+
+.columnMessages {
+  margin-right: 60px;
+  text-align: left;
+}
+
+.cell {
+  align-items: center;
+  color: var(--theme-connecting-sync-progress-color);
+  display: flex;
+  font-size: 18px;
+  height: 28px;
+  line-height: 1.22;
+  margin-bottom: 14px;
+}
+
+.cell:last-child {
+  margin: 0;
+}
+
+.cellTextRight {
+  justify-content: flex-end;
+}
+
+.faded {
+  opacity: 0.5;
+}
+
+.icon {
+  font-size: 28px;
+
+  svg {
+    fill: currentColor;
+    height: 1em;
+    position: relative;
+    top: 0.125em;
+    width: 1em;
+  }
+}
+
+.iconRotating {
+  :global {
+    animation: loading-spin 1.2s linear infinite;
+  }
+}
+
+.iconDescription {
+  opacity: 0.3;
+
+  &:hover {
+    opacity: 0.5;
+  }
+}
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.tsx b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.tsx
new file mode 100644
index 0000000000..40e17337a0
--- /dev/null
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.tsx
@@ -0,0 +1,91 @@
+import cx from 'classnames';
+import React, { FC } from 'react';
+import { intlShape } from 'react-intl';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import SVGInline from 'react-svg-inline';
+import spinnerIcon from '../../../../assets/images/spinner-universal.inline.svg';
+import checkMarkIcon from '../../../../assets/images/check-mark-universal.inline.svg';
+import questionMarkIcon from '../../../../assets/images/question-mark-universal.inline.svg';
+import { BlockSyncType } from '../../../../../../common/types/cardano-node.types';
+import { Intl } from '../../../../types/i18nTypes';
+import styles from './SyncingProgress.scss';
+import {
+  getProgressDescriptionByBlockSyncType,
+  getProgressNameByBlockSyncType,
+} from './utils';
+
+type Props = Record<BlockSyncType, number>;
+
+interface Context {
+  intl: Intl;
+}
+
+const blockSyncTypesOrdered: Array<BlockSyncType> = [
+  BlockSyncType.validatingChunk,
+  BlockSyncType.replayedBlock,
+  BlockSyncType.pushingLedger,
+];
+
+const iconsColumnStyles = cx(styles.column, styles.columnIcons);
+const messagesColumnStyles = cx(styles.column, styles.columnMessages);
+const questionMarkIconStyles = cx(styles.icon, styles.iconDescription);
+const makeLeftColumnIconStyles = (loading: boolean) =>
+  cx(styles.icon, styles.faded, {
+    [styles.iconRotating]: loading,
+  });
+const makeMainMessageStyles = (loaded: boolean) =>
+  cx({ [styles.faded]: loaded });
+const makePercentageCellStyles = (loaded: boolean) =>
+  cx(styles.cell, styles.cellTextRight, {
+    [styles.faded]: loaded,
+  });
+
+const SyncingProgress: FC<Props> = (props, { intl }: Context) => (
+  <div className={styles.root}>
+    <div className={iconsColumnStyles}>
+      {blockSyncTypesOrdered.map((type) => (
+        <div key={type} className={styles.cell}>
+          <SVGInline
+            svg={props[type] < 100 ? spinnerIcon : checkMarkIcon}
+            className={makeLeftColumnIconStyles(props[type] < 100)}
+          />
+        </div>
+      ))}
+    </div>
+    <div className={messagesColumnStyles}>
+      {blockSyncTypesOrdered.map((type) => (
+        <div key={type} className={styles.cell}>
+          <span className={makeMainMessageStyles(props[type] === 100)}>
+            {intl.formatMessage(getProgressNameByBlockSyncType(type))}
+          </span>
+          <PopOver
+            content={intl.formatMessage(
+              getProgressDescriptionByBlockSyncType(type)
+            )}
+          >
+            <SVGInline
+              svg={questionMarkIcon}
+              className={questionMarkIconStyles}
+            />
+          </PopOver>
+        </div>
+      ))}
+    </div>
+    <div className={styles.column}>
+      {blockSyncTypesOrdered.map((type) => (
+        <div
+          key={type}
+          className={makePercentageCellStyles(props[type] === 100)}
+        >
+          {Math.floor(props[type])}%
+        </div>
+      ))}
+    </div>
+  </div>
+);
+
+SyncingProgress.contextTypes = {
+  intl: intlShape.isRequired,
+};
+
+export default SyncingProgress;
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/index.ts b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/index.ts
new file mode 100644
index 0000000000..9b9d94a83e
--- /dev/null
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/index.ts
@@ -0,0 +1 @@
+export { default } from './SyncingProgress';
diff --git a/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/utils.ts b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/utils.ts
new file mode 100644
index 0000000000..11f669f1b6
--- /dev/null
+++ b/source/renderer/app/components/loading/syncing-connecting/SyncingProgress/utils.ts
@@ -0,0 +1,30 @@
+import { BlockSyncType } from '../../../../../../common/types/cardano-node.types';
+import { ReactIntlMessage } from '../../../../types/i18nTypes';
+import messages from './SyncingProgress.messages';
+
+const mapOfBlockSyncTypeToProgressDescription: {
+  [key in BlockSyncType]: ReactIntlMessage;
+} = {
+  [BlockSyncType.validatingChunk]: messages.validatingChunkDescription,
+  [BlockSyncType.replayedBlock]: messages.replayedBlockDescription,
+  [BlockSyncType.pushingLedger]: messages.pushingLedgerDescription,
+};
+
+const getProgressDescriptionByBlockSyncType = (type: BlockSyncType) =>
+  mapOfBlockSyncTypeToProgressDescription[type];
+
+const mapOfBlockSyncTypeToProgressName: {
+  [key in BlockSyncType]: ReactIntlMessage;
+} = {
+  [BlockSyncType.validatingChunk]: messages.validatingChunk,
+  [BlockSyncType.replayedBlock]: messages.replayedBlock,
+  [BlockSyncType.pushingLedger]: messages.pushingLedger,
+};
+
+const getProgressNameByBlockSyncType = (type: BlockSyncType) =>
+  mapOfBlockSyncTypeToProgressName[type];
+
+export {
+  getProgressDescriptionByBlockSyncType,
+  getProgressNameByBlockSyncType,
+};
diff --git a/source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx b/source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx
index b32161ea38..40ac301d1f 100644
--- a/source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx
+++ b/source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx
@@ -9,7 +9,6 @@ import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import attentionIcon from '../../../assets/images/attention-big-light.inline.svg';
 import { ALLOWED_TIME_DIFFERENCE } from '../../../config/timingConfig';
 import humanizeDurationByLocale from '../../../utils/humanizeDurationByLocale';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SystemTimeError.scss' or its... Remove this comment to see the full error message
 import styles from './SystemTimeError.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/navigation/NavButton.tsx b/source/renderer/app/components/navigation/NavButton.tsx
index 4639688ac9..5221052334 100755
--- a/source/renderer/app/components/navigation/NavButton.tsx
+++ b/source/renderer/app/components/navigation/NavButton.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NavButton.scss' or its corre... Remove this comment to see the full error message
 import styles from './NavButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/navigation/NavDropdown.tsx b/source/renderer/app/components/navigation/NavDropdown.tsx
index b1d7b3ea0d..2db0506865 100644
--- a/source/renderer/app/components/navigation/NavDropdown.tsx
+++ b/source/renderer/app/components/navigation/NavDropdown.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { Dropdown } from 'react-polymorph/lib/components/Dropdown';
 import NavButton from './NavButton';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NavDropdown.scss' or its cor... Remove this comment to see the full error message
 import styles from './NavDropdown.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/navigation/Navigation.tsx b/source/renderer/app/components/navigation/Navigation.tsx
index 087b75a0bd..ec78693b83 100755
--- a/source/renderer/app/components/navigation/Navigation.tsx
+++ b/source/renderer/app/components/navigation/Navigation.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Navigation.scss' or its corr... Remove this comment to see the full error message
 import styles from './Navigation.scss';
 import NavButton from './NavButton';
 import NavDropdown from './NavDropdown';
diff --git a/source/renderer/app/components/news/AlertsOverlay.scss b/source/renderer/app/components/news/AlertsOverlay.scss
index dbc2822ef1..de17114710 100644
--- a/source/renderer/app/components/news/AlertsOverlay.scss
+++ b/source/renderer/app/components/news/AlertsOverlay.scss
@@ -1,4 +1,5 @@
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers.scss';
 
 .component {
   align-items: center;
@@ -12,7 +13,7 @@
   position: fixed;
   top: 0;
   width: 100vw;
-  z-index: 22;
+  z-index: $dialog-z-index;
   @include overlay-backrop;
 
   .actionBtn {
diff --git a/source/renderer/app/components/news/AlertsOverlay.tsx b/source/renderer/app/components/news/AlertsOverlay.tsx
index 58825f70e2..5886bfed43 100644
--- a/source/renderer/app/components/news/AlertsOverlay.tsx
+++ b/source/renderer/app/components/news/AlertsOverlay.tsx
@@ -6,10 +6,8 @@ import ReactMarkdown from 'react-markdown';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import News from '../../domains/News';
 import DialogCloseButton from '../widgets/DialogCloseButton';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCrossThin from '../../assets/images/close-cross-thin.inline.svg';
 import ButtonLink from '../widgets/ButtonLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AlertsOverlay.scss' or its c... Remove this comment to see the full error message
 import styles from './AlertsOverlay.scss';
 
 type State = {
diff --git a/source/renderer/app/components/news/IncidentOverlay.scss b/source/renderer/app/components/news/IncidentOverlay.scss
index f516ce03e6..81ccdc738c 100644
--- a/source/renderer/app/components/news/IncidentOverlay.scss
+++ b/source/renderer/app/components/news/IncidentOverlay.scss
@@ -1,4 +1,5 @@
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers.scss';
 
 .component {
   align-items: center;
@@ -12,7 +13,7 @@
   position: fixed;
   top: 0;
   width: 100vw;
-  z-index: 22;
+  z-index: $dialog-z-index;
   @include overlay-backrop;
 
   .actionBtn {
diff --git a/source/renderer/app/components/news/IncidentOverlay.tsx b/source/renderer/app/components/news/IncidentOverlay.tsx
index 5ea246f564..4c4d119501 100644
--- a/source/renderer/app/components/news/IncidentOverlay.tsx
+++ b/source/renderer/app/components/news/IncidentOverlay.tsx
@@ -7,7 +7,6 @@ import classnames from 'classnames';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import News from '../../domains/News';
 import ButtonLink from '../widgets/ButtonLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './IncidentOverlay.scss' or its... Remove this comment to see the full error message
 import styles from './IncidentOverlay.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/news/NewsFeed.scss b/source/renderer/app/components/news/NewsFeed.scss
index ab7757caac..7f7bad1bc9 100644
--- a/source/renderer/app/components/news/NewsFeed.scss
+++ b/source/renderer/app/components/news/NewsFeed.scss
@@ -1,3 +1,5 @@
+@import '../../themes/mixins/layers.scss';
+
 .component {
   background: var(--theme-news-feed-background-color);
   box-shadow: var(--theme-news-feed-box-shadow-color);
@@ -11,7 +13,7 @@
   top: 0;
   transition: margin-right 400ms ease;
   width: 460px;
-  z-index: 20;
+  z-index: $dialog-z-index;
 
   &.noTransition {
     transition: none;
diff --git a/source/renderer/app/components/news/NewsFeed.tsx b/source/renderer/app/components/news/NewsFeed.tsx
index 9d189a1927..09e62a6677 100644
--- a/source/renderer/app/components/news/NewsFeed.tsx
+++ b/source/renderer/app/components/news/NewsFeed.tsx
@@ -4,9 +4,7 @@ import { defineMessages, intlShape } from 'react-intl';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
 import { get } from 'lodash';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCrossThin from '../../assets/images/close-cross-thin.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NewsFeed.scss' or its corres... Remove this comment to see the full error message
 import styles from './NewsFeed.scss';
 import News from '../../domains/News';
 import NewsItem from './NewsItem';
diff --git a/source/renderer/app/components/news/NewsItem.tsx b/source/renderer/app/components/news/NewsItem.tsx
index ad995fc6e9..e70faa6f10 100644
--- a/source/renderer/app/components/news/NewsItem.tsx
+++ b/source/renderer/app/components/news/NewsItem.tsx
@@ -8,7 +8,6 @@ import AnimateHeight from 'react-animate-height';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import News, { NewsTypes } from '../../domains/News';
 import ButtonLink from '../widgets/ButtonLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NewsItem.scss' or its corres... Remove this comment to see the full error message
 import styles from './NewsItem.scss';
 
 type Props = {
@@ -133,7 +132,7 @@ class NewsItem extends Component<Props, State> {
         <div className={styles.newsItemDate}>
           {moment(newsItem.date).format(currentDateFormat)}
         </div>
-        <div className={styles.newsItemContentWrapper}>
+        <div>
           <AnimateHeight
             duration={expandWithoutTransition ? 0 : 500}
             height={this.state.newsItemExpanded ? 'auto' : 0}
diff --git a/source/renderer/app/components/news/UpdateItem.tsx b/source/renderer/app/components/news/UpdateItem.tsx
index 321b74f8b3..16917f91ef 100644
--- a/source/renderer/app/components/news/UpdateItem.tsx
+++ b/source/renderer/app/components/news/UpdateItem.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import classNames from 'classnames';
 import moment from 'moment';
 import News /* , { NewsTypes } */ from '../../domains/News';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './UpdateItem.scss' or its corr... Remove this comment to see the full error message
 import styles from './UpdateItem.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/notifications/InlineNotification.tsx b/source/renderer/app/components/notifications/InlineNotification.tsx
index 6892215142..0a09748918 100644
--- a/source/renderer/app/components/notifications/InlineNotification.tsx
+++ b/source/renderer/app/components/notifications/InlineNotification.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InlineNotification.scss' or ... Remove this comment to see the full error message
 import styles from './InlineNotification.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/notifications/LegacyBadge.tsx b/source/renderer/app/components/notifications/LegacyBadge.tsx
index 1f6c260a4e..d6ce49abcb 100644
--- a/source/renderer/app/components/notifications/LegacyBadge.tsx
+++ b/source/renderer/app/components/notifications/LegacyBadge.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './LegacyBadge.scss' or its cor... Remove this comment to see the full error message
 import styles from './LegacyBadge.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/notifications/LegacyNotification.tsx b/source/renderer/app/components/notifications/LegacyNotification.tsx
index 3b57868157..81b9762d90 100644
--- a/source/renderer/app/components/notifications/LegacyNotification.tsx
+++ b/source/renderer/app/components/notifications/LegacyNotification.tsx
@@ -6,7 +6,6 @@ import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import ButtonLink from '../widgets/ButtonLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './LegacyNotification.scss' or ... Remove this comment to see the full error message
 import styles from './LegacyNotification.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/notifications/Notification.scss b/source/renderer/app/components/notifications/Notification.scss
index f7a5d8a093..e8211ce872 100644
--- a/source/renderer/app/components/notifications/Notification.scss
+++ b/source/renderer/app/components/notifications/Notification.scss
@@ -18,7 +18,7 @@
     padding: 9px 0;
   }
 
-  &.theme-override-grey {
+  &.themeOverrideGrey {
     background-color: rgba(94, 96, 102, 0.95);
 
     .closeButton svg polygon,
diff --git a/source/renderer/app/components/notifications/Notification.tsx b/source/renderer/app/components/notifications/Notification.tsx
index 26eabe7b62..b90a25aec7 100644
--- a/source/renderer/app/components/notifications/Notification.tsx
+++ b/source/renderer/app/components/notifications/Notification.tsx
@@ -3,9 +3,7 @@ import React, { Component, Fragment } from 'react';
 import type { Node } from 'react';
 import SVGInline from 'react-svg-inline';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Notification.scss' or its co... Remove this comment to see the full error message
 import styles from './Notification.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCross from '../../assets/images/close-cross.inline.svg';
 import NotificationActions from './NotificationActions';
 import type { NotificationActionItems } from './NotificationActions';
@@ -54,7 +52,7 @@ export default class Notification extends Component<Props> {
       styles.component,
       isVisible ? styles.isVisible : null,
       isClickToClose ? styles.clickToClose : null,
-      themeOverride ? styles[`theme-override-${themeOverride}`] : null,
+      themeOverride === 'grey' ? styles.themeOverrideGrey : null,
     ]);
     const messageStyles = classNames([
       styles.message,
diff --git a/source/renderer/app/components/notifications/NotificationActions.tsx b/source/renderer/app/components/notifications/NotificationActions.tsx
index 41d26c98ac..92687d21e7 100644
--- a/source/renderer/app/components/notifications/NotificationActions.tsx
+++ b/source/renderer/app/components/notifications/NotificationActions.tsx
@@ -4,7 +4,6 @@ import { map } from 'lodash';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NotificationActions.scss' or... Remove this comment to see the full error message
 import styles from './NotificationActions.scss';
 
 export type NotificationActionItems = Array<NotificationActionItem>;
diff --git a/source/renderer/app/components/notifications/RestoreNotification.tsx b/source/renderer/app/components/notifications/RestoreNotification.tsx
index 8ea43fad76..4959ed77da 100644
--- a/source/renderer/app/components/notifications/RestoreNotification.tsx
+++ b/source/renderer/app/components/notifications/RestoreNotification.tsx
@@ -3,10 +3,8 @@ import classnames from 'classnames';
 import { observer } from 'mobx-react';
 import SVGInline from 'react-svg-inline';
 import { defineMessages, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/spinner-da... Remove this comment to see the full error message
 import spinnerIcon from '../../assets/images/spinner-dark.inline.svg';
 import { formattedNumber } from '../../utils/formatters';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RestoreNotification.scss' or... Remove this comment to see the full error message
 import styles from './RestoreNotification.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx b/source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx
index eb036fd683..51eeeafdb3 100644
--- a/source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx
+++ b/source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx
@@ -4,7 +4,6 @@ import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DataLayerMigrationForm.scss'... Remove this comment to see the full error message
 import styles from './DataLayerMigrationForm.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/profile/initial-settings/InitialSettings.tsx b/source/renderer/app/components/profile/initial-settings/InitialSettings.tsx
index b8a9f0be8a..724f255152 100644
--- a/source/renderer/app/components/profile/initial-settings/InitialSettings.tsx
+++ b/source/renderer/app/components/profile/initial-settings/InitialSettings.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InitialSettings.scss' or its... Remove this comment to see the full error message
 import styles from './InitialSettings.scss';
 import ProfileSettingsForm from '../../widgets/forms/ProfileSettingsForm';
 import type { ProfileSettingsFormProps } from '../../widgets/forms/ProfileSettingsForm';
diff --git a/source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx b/source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx
index 52015b4ab9..07860f87f2 100644
--- a/source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx
+++ b/source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx
@@ -8,7 +8,6 @@ import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import { defineMessages, intlShape } from 'react-intl';
 import LocalizableError from '../../../i18n/LocalizableError';
 import TermsOfUseText from './TermsOfUseText';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TermsOfUseForm.scss' or its ... Remove this comment to see the full error message
 import styles from './TermsOfUseForm.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/profile/terms-of-use/TermsOfUseText.tsx b/source/renderer/app/components/profile/terms-of-use/TermsOfUseText.tsx
index 196bd7809f..df265a6636 100644
--- a/source/renderer/app/components/profile/terms-of-use/TermsOfUseText.tsx
+++ b/source/renderer/app/components/profile/terms-of-use/TermsOfUseText.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { get } from 'lodash';
 import ReactMarkdown from 'react-markdown';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TermsOfUseText.scss' or its ... Remove this comment to see the full error message
 import styles from './TermsOfUseText.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/settings/SettingsLayout.tsx b/source/renderer/app/components/settings/SettingsLayout.tsx
index 5c544bad25..69cc130bba 100644
--- a/source/renderer/app/components/settings/SettingsLayout.tsx
+++ b/source/renderer/app/components/settings/SettingsLayout.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SettingsLayout.scss' or its ... Remove this comment to see the full error message
 import styles from './SettingsLayout.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/settings/categories/DisplaySettings.tsx b/source/renderer/app/components/settings/categories/DisplaySettings.tsx
index a2fe9128ce..4b613202dc 100644
--- a/source/renderer/app/components/settings/categories/DisplaySettings.tsx
+++ b/source/renderer/app/components/settings/categories/DisplaySettings.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DisplaySettings.scss' or its... Remove this comment to see the full error message
 import styles from './DisplaySettings.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/themes/... Remove this comment to see the full error message
 import themeIncentivizedTestnetPreview from '../../../assets/images/themes/incentivized-testnet.png';
diff --git a/source/renderer/app/components/settings/categories/SecuritySettings.tsx b/source/renderer/app/components/settings/categories/SecuritySettings.tsx
index 03bcba80ea..8e097268c4 100644
--- a/source/renderer/app/components/settings/categories/SecuritySettings.tsx
+++ b/source/renderer/app/components/settings/categories/SecuritySettings.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { injectIntl } from 'react-intl';
 import NormalSwitch from '../../widgets/forms/NormalSwitch';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SecuritySettings.scss' or it... Remove this comment to see the full error message
 import styles from './SecuritySettings.scss';
 import messages from './SecuritySettings.messages';
 import type { Intl } from '../../../types/i18nTypes';
@@ -20,34 +19,39 @@ const SecuritySettings = ({
   openDiscreetMode,
   onDiscreetModeToggle,
   onOpenDiscreetModeToggle,
-}: Props) => (
-  <div className={styles.root}>
-    <div className={styles.setting}>
-      <div className={styles.title}>
-        {intl.formatMessage(messages.discreetModeTitle)}
+}: Props) => {
+  return (
+    <div className={styles.root}>
+      <div className={styles.setting}>
+        <div className={styles.title}>
+          {intl.formatMessage(messages.discreetModeTitle)}
+        </div>
+        <div className={styles.settingContent}>
+          <p className={styles.description}>
+            {intl.formatMessage(messages.discreetModeDescription)}
+          </p>
+          <NormalSwitch
+            checked={discreetMode}
+            onChange={onDiscreetModeToggle}
+          />
+        </div>
       </div>
-      <div className={styles.settingContent}>
-        <p className={styles.description}>
-          {intl.formatMessage(messages.discreetModeDescription)}
-        </p>
-        <NormalSwitch checked={discreetMode} onChange={onDiscreetModeToggle} />
+      <div className={styles.setting}>
+        <div className={styles.title}>
+          {intl.formatMessage(messages.openInDiscreetModeTitle)}
+        </div>
+        <div className={styles.settingContent}>
+          <p className={styles.description}>
+            {intl.formatMessage(messages.openInDiscreetModeDescription)}
+          </p>
+          <NormalSwitch
+            checked={openDiscreetMode}
+            onChange={onOpenDiscreetModeToggle}
+          />
+        </div>
       </div>
     </div>
-    <div className={styles.setting}>
-      <div className={styles.title}>
-        {intl.formatMessage(messages.openInDiscreetModeTitle)}
-      </div>
-      <div className={styles.settingContent}>
-        <p className={styles.description}>
-          {intl.formatMessage(messages.openInDiscreetModeDescription)}
-        </p>
-        <NormalSwitch
-          checked={openDiscreetMode}
-          onChange={onOpenDiscreetModeToggle}
-        />
-      </div>
-    </div>
-  </div>
-);
+  );
+};
 
 export default injectIntl(SecuritySettings);
diff --git a/source/renderer/app/components/settings/categories/StakePoolsSettings.tsx b/source/renderer/app/components/settings/categories/StakePoolsSettings.tsx
index 335832f117..e766293857 100644
--- a/source/renderer/app/components/settings/categories/StakePoolsSettings.tsx
+++ b/source/renderer/app/components/settings/categories/StakePoolsSettings.tsx
@@ -13,7 +13,6 @@ import {
 } from 'react-intl';
 import { getSmashServerIdFromUrl, getUrlParts } from '../../../utils/staking';
 import InlineEditingInput from '../../widgets/forms/InlineEditingInput';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsSettings.scss' or ... Remove this comment to see the full error message
 import styles from './StakePoolsSettings.scss';
 import {
   SMASH_SERVERS_LIST,
@@ -270,7 +269,6 @@ class StakePoolsSettings extends Component<Props, State> {
         value={smashServerType}
         options={smashSelectOptions}
         onChange={this.handleOnSelectSmashServerType}
-        className={styles.select}
         optionHeight={50}
         selectionRenderer={({ label }) => (
           <div className={styles.selectionRenderer}>{label}</div>
diff --git a/source/renderer/app/components/settings/categories/SupportSettings.tsx b/source/renderer/app/components/settings/categories/SupportSettings.tsx
index ad0229367c..e5f424598f 100644
--- a/source/renderer/app/components/settings/categories/SupportSettings.tsx
+++ b/source/renderer/app/components/settings/categories/SupportSettings.tsx
@@ -4,7 +4,6 @@ import { defineMessages, intlShape, FormattedMessage } from 'react-intl';
 import classNames from 'classnames';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SupportSettings.scss' or its... Remove this comment to see the full error message
 import styles from './SupportSettings.scss';
 import globalMessages from '../../../i18n/global-messages';
 
diff --git a/source/renderer/app/components/settings/categories/TermsOfUseSettings.tsx b/source/renderer/app/components/settings/categories/TermsOfUseSettings.tsx
index 395c3f1200..16b0e8de7b 100644
--- a/source/renderer/app/components/settings/categories/TermsOfUseSettings.tsx
+++ b/source/renderer/app/components/settings/categories/TermsOfUseSettings.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import TermsOfUseText from '../../profile/terms-of-use/TermsOfUseText';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TermsOfUseSettings.scss' or ... Remove this comment to see the full error message
 import styles from './TermsOfUseSettings.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/settings/categories/WalletsSettings.scss b/source/renderer/app/components/settings/categories/WalletsSettings.scss
index 40143ceb61..09a0c23650 100644
--- a/source/renderer/app/components/settings/categories/WalletsSettings.scss
+++ b/source/renderer/app/components/settings/categories/WalletsSettings.scss
@@ -24,10 +24,6 @@
     position: relative;
   }
 
-  .switch {
-    margin: 0;
-  }
-
   .label {
     display: block;
     font-family: var(--font-semibold);
@@ -76,4 +72,10 @@
     height: 1px;
     margin: 15px 0;
   }
+
+  :global {
+    .SimpleOptions_search:before {
+      opacity: 1;
+    }
+  }
 }
diff --git a/source/renderer/app/components/settings/categories/WalletsSettings.tsx b/source/renderer/app/components/settings/categories/WalletsSettings.tsx
index 4416e79e5e..4db714bf37 100644
--- a/source/renderer/app/components/settings/categories/WalletsSettings.tsx
+++ b/source/renderer/app/components/settings/categories/WalletsSettings.tsx
@@ -5,7 +5,6 @@ import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import { Select } from 'react-polymorph/lib/components/Select';
 import { Link } from 'react-polymorph/lib/components/Link';
 import NormalSwitch from '../../widgets/forms/NormalSwitch';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletsSettings.scss' or its... Remove this comment to see the full error message
 import styles from './WalletsSettings.scss';
 import { currencyConfig } from '../../../config/currencyConfig';
 import globalMessages from '../../../i18n/global-messages';
@@ -84,8 +83,6 @@ class WalletSettings extends Component<Props> {
           <NormalSwitch
             checked={currencyIsActive}
             onChange={onToggleCurrencyIsActive}
-            // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-            className={styles.switch}
           />
         </div>
         {currencyIsActive && (
diff --git a/source/renderer/app/components/settings/menu/SettingsMenu.scss b/source/renderer/app/components/settings/menu/SettingsMenu.scss
index 41af69fd78..105f08cc60 100644
--- a/source/renderer/app/components/settings/menu/SettingsMenu.scss
+++ b/source/renderer/app/components/settings/menu/SettingsMenu.scss
@@ -7,17 +7,4 @@
   margin: 20px 0;
   padding: 16px 0;
   width: 240px;
-
-  .dot {
-    right: 140px;
-    top: 22px;
-
-    &.active {
-      right: 134px;
-    }
-
-    &:lang(ja-JP) {
-      right: 108px;
-    }
-  }
 }
diff --git a/source/renderer/app/components/settings/menu/SettingsMenu.tsx b/source/renderer/app/components/settings/menu/SettingsMenu.tsx
index cdd3ba1f5e..02ccc21038 100644
--- a/source/renderer/app/components/settings/menu/SettingsMenu.tsx
+++ b/source/renderer/app/components/settings/menu/SettingsMenu.tsx
@@ -2,12 +2,10 @@ import React from 'react';
 import { observer } from 'mobx-react';
 import { injectIntl } from 'react-intl';
 import SettingsMenuItem from './SettingsMenuItem';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SettingsMenu.scss' or its co... Remove this comment to see the full error message
 import styles from './SettingsMenu.scss';
 import { ROUTES } from '../../../routes-config';
 import messages from './SettingsMenu.messages';
 import type { Intl } from '../../../types/i18nTypes';
-import SecurityMenuItem from './SecurityMenuItem';
 
 type Props = {
   intl: Intl;
@@ -16,50 +14,57 @@ type Props = {
   onItemClick: (...args: Array<any>) => any;
 };
 
-const SettingsMenu = ({ intl, onItemClick, isActiveItem, isFlight }: Props) => (
-  <div>
-    <div className={styles.component}>
-      <SettingsMenuItem
-        label={intl.formatMessage(messages.general)}
-        onClick={() => onItemClick(ROUTES.SETTINGS.GENERAL)}
-        active={isActiveItem(ROUTES.SETTINGS.GENERAL)}
-        className="general"
-      />
-      <SecurityMenuItem isActiveItem={isActiveItem} onClick={onItemClick} />
-      <SettingsMenuItem
-        label={intl.formatMessage(messages.wallets)}
-        onClick={() => onItemClick(ROUTES.SETTINGS.WALLETS)}
-        active={isActiveItem(ROUTES.SETTINGS.WALLETS)}
-        className="wallets"
-      />
-      <SettingsMenuItem
-        label={intl.formatMessage(messages.stakePools)}
-        onClick={() => onItemClick(ROUTES.SETTINGS.STAKE_POOLS)}
-        active={isActiveItem(ROUTES.SETTINGS.STAKE_POOLS)}
-        className="stakePools"
-      />
-      {!isFlight && (
+const SettingsMenu = ({ intl, onItemClick, isActiveItem, isFlight }: Props) => {
+  return (
+    <div>
+      <div className={styles.component}>
         <SettingsMenuItem
-          label={intl.formatMessage(messages.display)}
-          onClick={() => onItemClick(ROUTES.SETTINGS.DISPLAY)}
-          active={isActiveItem(ROUTES.SETTINGS.DISPLAY)}
-          className="display"
+          label={intl.formatMessage(messages.general)}
+          onClick={() => onItemClick(ROUTES.SETTINGS.GENERAL)}
+          active={isActiveItem(ROUTES.SETTINGS.GENERAL)}
+          className="general"
         />
-      )}
-      <SettingsMenuItem
-        label={intl.formatMessage(messages.termsOfUse)}
-        onClick={() => onItemClick(ROUTES.SETTINGS.TERMS_OF_USE)}
-        active={isActiveItem(ROUTES.SETTINGS.TERMS_OF_USE)}
-        className="termsOfService"
-      />
-      <SettingsMenuItem
-        label={intl.formatMessage(messages.support)}
-        onClick={() => onItemClick(ROUTES.SETTINGS.SUPPORT)}
-        active={isActiveItem(ROUTES.SETTINGS.SUPPORT)}
-        className="support"
-      />
+        <SettingsMenuItem
+          active={isActiveItem(ROUTES.SETTINGS.SECURITY)}
+          label={intl.formatMessage(messages.security)}
+          onClick={() => onItemClick(ROUTES.SETTINGS.SECURITY)}
+          className="security"
+        />
+        <SettingsMenuItem
+          label={intl.formatMessage(messages.wallets)}
+          onClick={() => onItemClick(ROUTES.SETTINGS.WALLETS)}
+          active={isActiveItem(ROUTES.SETTINGS.WALLETS)}
+          className="wallets"
+        />
+        <SettingsMenuItem
+          label={intl.formatMessage(messages.stakePools)}
+          onClick={() => onItemClick(ROUTES.SETTINGS.STAKE_POOLS)}
+          active={isActiveItem(ROUTES.SETTINGS.STAKE_POOLS)}
+          className="stakePools"
+        />
+        {!isFlight && (
+          <SettingsMenuItem
+            label={intl.formatMessage(messages.display)}
+            onClick={() => onItemClick(ROUTES.SETTINGS.DISPLAY)}
+            active={isActiveItem(ROUTES.SETTINGS.DISPLAY)}
+            className="display"
+          />
+        )}
+        <SettingsMenuItem
+          label={intl.formatMessage(messages.termsOfUse)}
+          onClick={() => onItemClick(ROUTES.SETTINGS.TERMS_OF_USE)}
+          active={isActiveItem(ROUTES.SETTINGS.TERMS_OF_USE)}
+          className="termsOfService"
+        />
+        <SettingsMenuItem
+          label={intl.formatMessage(messages.support)}
+          onClick={() => onItemClick(ROUTES.SETTINGS.SUPPORT)}
+          active={isActiveItem(ROUTES.SETTINGS.SUPPORT)}
+          className="support"
+        />
+      </div>
     </div>
-  </div>
-);
+  );
+};
 
 export default injectIntl(observer(SettingsMenu));
diff --git a/source/renderer/app/components/settings/menu/SettingsMenuItem.tsx b/source/renderer/app/components/settings/menu/SettingsMenuItem.tsx
index 7053be1a9f..04f926c328 100644
--- a/source/renderer/app/components/settings/menu/SettingsMenuItem.tsx
+++ b/source/renderer/app/components/settings/menu/SettingsMenuItem.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SettingsMenuItem.scss' or it... Remove this comment to see the full error message
 import styles from './SettingsMenuItem.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/sidebar/Sidebar.tsx b/source/renderer/app/components/sidebar/Sidebar.tsx
index 7f77a9b561..7f57de7fbf 100644
--- a/source/renderer/app/components/sidebar/Sidebar.tsx
+++ b/source/renderer/app/components/sidebar/Sidebar.tsx
@@ -1,11 +1,9 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Sidebar.scss' or its corresp... Remove this comment to see the full error message
 import styles from './Sidebar.scss';
 import { shouldShowWalletSubMenu } from './helpers';
 import SidebarCategory from './SidebarCategory';
-import SidebarCategoryWrapper from './SidebarCategoryWrapper';
 import SidebarCategoryNetworkInfo from './SidebarCategoryNetworkInfo';
 import SidebarWalletsMenu from './wallets/SidebarWalletsMenu';
 import { CATEGORIES_BY_NAME } from '../../config/sidebarConfig';
@@ -59,17 +57,13 @@ const Sidebar = ({
           const content = getCategoryContent(category.name, network);
           const isActive = activeSidebarCategory === category.route;
           return (
-            <SidebarCategoryWrapper
+            <SidebarCategory
               key={category.name}
-              categoryName={category.name}
-            >
-              <SidebarCategory
-                category={category}
-                isActive={isActive}
-                onClick={onActivateCategory}
-                content={content}
-              />
-            </SidebarCategoryWrapper>
+              category={category}
+              isActive={isActive}
+              onClick={onActivateCategory}
+              content={content}
+            />
           );
         })}
       </div>
@@ -77,11 +71,16 @@ const Sidebar = ({
         <SidebarWalletsMenu
           wallets={menus?.wallets?.items || []}
           onAddWallet={onAddWallet}
-          onWalletItemClick={menus?.wallets?.actions?.onWalletItemClick}
+          onWalletItemClick={menus?.wallets?.actions.onWalletItemClick}
           isActiveWallet={(id) => id === menus?.wallets?.activeWalletId}
           isAddWalletButtonActive={pathname === ROUTES.WALLETS.ADD}
           isShelleyActivated={isShelleyActivated}
           visible={isShowingSubMenus}
+          onWalletSortBy={menus?.wallets?.actions.onWalletSortBy}
+          sortBy={menus?.wallets?.walletSortConfig?.sortBy}
+          sortOrder={menus?.wallets?.walletSortConfig?.sortOrder}
+          searchValue={menus?.wallets?.searchValue}
+          onSearch={menus?.wallets?.actions.onSearch}
         />
       )}
     </div>
diff --git a/source/renderer/app/components/sidebar/SidebarCategory.tsx b/source/renderer/app/components/sidebar/SidebarCategory.tsx
index 5f2dee227e..a4412b1cde 100644
--- a/source/renderer/app/components/sidebar/SidebarCategory.tsx
+++ b/source/renderer/app/components/sidebar/SidebarCategory.tsx
@@ -6,7 +6,6 @@ import { observer } from 'mobx-react';
 import classNames from 'classnames';
 import { camelCase } from 'lodash';
 import type { SidebarCategoryInfo } from '../../config/sidebarConfig';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SidebarCategory.scss' or its... Remove this comment to see the full error message
 import styles from './SidebarCategory.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx b/source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx
index 2136e24dbd..a4ffc1a7cf 100644
--- a/source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx
+++ b/source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SidebarCategoryNetworkInfo.s... Remove this comment to see the full error message
 import styles from './SidebarCategoryNetworkInfo.scss';
 import type { networkType } from '../../types/networkTypes';
 
diff --git a/source/renderer/app/components/sidebar/SidebarCategoryWrapper.scss b/source/renderer/app/components/sidebar/SidebarCategoryWrapper.scss
deleted file mode 100644
index 4f5e5c538a..0000000000
--- a/source/renderer/app/components/sidebar/SidebarCategoryWrapper.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-.popOver {
-  transform: translate(-20px, -15px);
-  width: 218px;
-
-  .content {
-    align-items: flex-end;
-    display: flex;
-    flex-direction: column;
-    font-family: var(--font-regular);
-    font-size: 14px;
-    line-height: 1.36;
-
-    b {
-      font-family: var(--font-semibold);
-    }
-  }
-
-  :global {
-    .tippy-arrow {
-      transform: translateY(-5px);
-    }
-  }
-}
-
-.dot {
-  right: 20px;
-  top: 20px;
-}
diff --git a/source/renderer/app/components/sidebar/SidebarMenu.scss b/source/renderer/app/components/sidebar/SidebarMenu.scss
index 52fb8c2e00..e9deffee81 100644
--- a/source/renderer/app/components/sidebar/SidebarMenu.scss
+++ b/source/renderer/app/components/sidebar/SidebarMenu.scss
@@ -10,5 +10,6 @@
 }
 
 .visible {
-  display: block;
+  display: flex;
+  flex-direction: column;
 }
diff --git a/source/renderer/app/components/sidebar/SidebarMenu.tsx b/source/renderer/app/components/sidebar/SidebarMenu.tsx
index 19c6107ae0..4978c75f2a 100644
--- a/source/renderer/app/components/sidebar/SidebarMenu.tsx
+++ b/source/renderer/app/components/sidebar/SidebarMenu.tsx
@@ -3,7 +3,6 @@ import React, { Component } from 'react';
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SidebarMenu.scss' or its cor... Remove this comment to see the full error message
 import styles from './SidebarMenu.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/sidebar/types.ts b/source/renderer/app/components/sidebar/types.ts
index d4f6dabcba..826ef2e665 100644
--- a/source/renderer/app/components/sidebar/types.ts
+++ b/source/renderer/app/components/sidebar/types.ts
@@ -1,4 +1,9 @@
-import type { SidebarWalletType } from '../../types/sidebarTypes';
+import type {
+  SidebarWalletType,
+  WalletSortByOptions,
+  WalletSortOrderOptions,
+  WalletSortConfig,
+} from '../../types/sidebarTypes';
 
 export type SidebarMenus = {
   wallets:
@@ -7,7 +12,14 @@ export type SidebarMenus = {
         activeWalletId: string | null | undefined;
         actions: {
           onWalletItemClick: (...args: Array<any>) => any;
+          onWalletSortBy: (arg0: {
+            sortBy: WalletSortByOptions;
+            sortOrder: WalletSortOrderOptions;
+          }) => void;
+          onSearch: (term: string) => void;
         };
+        walletSortConfig: WalletSortConfig;
+        searchValue: string;
       }
     | null
     | undefined;
diff --git a/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.scss b/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.scss
index 1131cba7cd..19c8b380cd 100644
--- a/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.scss
+++ b/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.scss
@@ -86,7 +86,6 @@
       justify-content: space-between;
 
       .title {
-        color: var(--theme-sidebar-menu-item-wallet-name-color);
         font-family: var(--font-regular);
         font-size: 18px;
         line-height: 1.5em;
@@ -94,6 +93,15 @@
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
+
+        .searchMatch {
+          color: var(--theme-sidebar-menu-item-wallet-name-color);
+        }
+
+        .searchUnmatch {
+          color: var(--theme-sidebar-menu-item-wallet-name-color);
+          opacity: 0.7;
+        }
       }
 
       .hardwareWalletsIconWrapper {
diff --git a/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.tsx b/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.tsx
index 41d98cb385..85890330fd 100644
--- a/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.tsx
+++ b/source/renderer/app/components/sidebar/wallets/SidebarWalletMenuItem.tsx
@@ -1,12 +1,12 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classNames from 'classnames';
+import highlightWords from 'highlight-words';
 import SVGInline from 'react-svg-inline';
 import LegacyBadge, {
   LEGACY_BADGE_MODES,
 } from '../../notifications/LegacyBadge';
 import ProgressBar from '../../widgets/ProgressBar';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SidebarWalletMenuItem.scss' ... Remove this comment to see the full error message
 import styles from './SidebarWalletMenuItem.scss';
 import { isHardwareWalletIndicatorEnabled } from '../../../config/hardwareWalletsConfig';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/hardwar... Remove this comment to see the full error message
@@ -27,6 +27,7 @@ type Props = {
   hasNotification: boolean;
   isHardwareWalletDisconnected?: boolean;
   isHardwareWallet: boolean;
+  searchValue: string;
 };
 
 @observer
@@ -46,6 +47,7 @@ class SidebarWalletMenuItem extends Component<Props> {
       hasNotification,
       isHardwareWalletDisconnected,
       isHardwareWallet,
+      searchValue,
     } = this.props;
     const showLegacyBadge = isLegacy && isShelleyActivated;
     const componentStyles = classNames([
@@ -62,13 +64,30 @@ class SidebarWalletMenuItem extends Component<Props> {
       isHardwareWalletDisconnected &&
       isHardwareWalletIndicatorEnabled
         ? styles.disconnected
-        : styles.connected,
+        : null,
     ]);
+    const chunks = highlightWords({
+      text: title,
+      query: `/(${searchValue.split('').join('|')})/i`,
+    });
     return (
-      <button className={componentStyles} onClick={onClick}>
+      <button
+        className={componentStyles}
+        onClick={onClick}
+        data-testid="walletMenu"
+      >
         <div className={styles.meta}>
           <div className={styles.topContainer}>
-            <div className={styles.title}>{title}</div>
+            <div className={styles.title} data-testid={title}>
+              {chunks.map(({ text, match, key }) => (
+                <span
+                  key={key}
+                  className={match ? styles.searchMatch : styles.searchUnmatch}
+                >
+                  {text}
+                </span>
+              ))}
+            </div>
             {isHardwareWallet && (
               <div className={styles.hardwareWalletsIconWrapper}>
                 <SVGInline svg={hardwareWalletsIcon} className={hwIconStyles} />
diff --git a/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.scss b/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.scss
index 60c62fe4e9..72e63a7347 100644
--- a/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.scss
+++ b/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.scss
@@ -24,18 +24,16 @@
 }
 
 .wallets {
-  height: calc(100% - #{$sidebar-button-height});
+  flex: 1 1 auto;
 }
 
 .addWalletButton {
   @include button;
   align-items: center;
   background-color: var(--theme-sidebar-menu-add-button-background-color);
-  bottom: 0;
   color: var(--theme-sidebar-menu-add-button-text-color);
   display: flex;
   height: $sidebar-button-height;
-  position: absolute;
   width: $sidebar-width - $sidebar-minimized-category-width;
 
   &:hover {
@@ -68,3 +66,23 @@
     cursor: default;
   }
 }
+
+.walletSortControls {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  margin-bottom: 14px;
+  margin-top: 14px;
+  width: 100%;
+
+  .walletSortOffset {
+    margin-right: 12px;
+  }
+}
+
+.walletSearchContainer {
+  align-items: center;
+  display: flex;
+  height: 84px;
+  padding: 0 20px;
+}
diff --git a/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.spec.tsx b/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.spec.tsx
new file mode 100644
index 0000000000..a07d0c50e3
--- /dev/null
+++ b/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.spec.tsx
@@ -0,0 +1,99 @@
+import React from 'react';
+import { IntlProvider } from 'react-intl';
+import { render, screen, cleanup } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { Provider as MobxProvider } from 'mobx-react';
+import translations from '../../../i18n/locales/en-US.json';
+import StoryDecorator from '../../../../../../storybook/stories/_support/StoryDecorator';
+import {
+  DiscreetModeFeatureProvider,
+  BrowserLocalStorageBridge,
+} from '../../../features';
+import type { SidebarWalletType } from '../../../types/sidebarTypes';
+import SidebarWalletsMenu from './SidebarWalletsMenu';
+
+describe('Sidebar Wallets Menu', () => {
+  afterEach(cleanup);
+
+  function TestDecorator({
+    wallets,
+    searchValue,
+  }: {
+    wallets: Array<SidebarWalletType>;
+    searchValue: string;
+  }) {
+    return (
+      <StoryDecorator>
+        <MobxProvider>
+          <IntlProvider locale="en-US" messages={translations}>
+            <BrowserLocalStorageBridge>
+              <DiscreetModeFeatureProvider>
+                <SidebarWalletsMenu
+                  wallets={wallets}
+                  onAddWallet={jest.fn()}
+                  onWalletItemClick={() => {}}
+                  isActiveWallet={() => false}
+                  isAddWalletButtonActive={false}
+                  isShelleyActivated
+                  visible={false}
+                  searchValue={searchValue}
+                />
+              </DiscreetModeFeatureProvider>
+            </BrowserLocalStorageBridge>
+          </IntlProvider>
+        </MobxProvider>
+      </StoryDecorator>
+    );
+  }
+
+  function createWallet() {
+    let id = 0;
+    return (title: string): SidebarWalletType => {
+      id += 1;
+      return {
+        id: id.toString(),
+        title,
+        // @ts-ignore ts-migrate(2322) FIXME: Type 'number' is not assignable to type 'BigNumber... Remove this comment to see the full error message
+        amount: 0,
+        isConnected: false,
+        isRestoreActive: false,
+        restoreProgress: 0,
+        isNotResponding: false,
+        isLegacy: false,
+        createdAt: new Date(),
+        recoveryPhraseVerificationDate: new Date(),
+        hasNotification: false,
+      };
+    };
+  }
+
+  const wallet = createWallet();
+  const wallets = [
+    wallet('Loki'),
+    wallet('Ledger Nano X'),
+    wallet('Ledger Nano S'),
+    wallet('Odin'),
+    wallet('byron'),
+    wallet('byron new new1'),
+  ];
+  test.each([
+    [' ', ['Ledger Nano X', 'Ledger Nano S', 'byron new new1']],
+    ['OKI', ['Loki', 'Odin']],
+    ['byron1111', ['byron', 'byron new new1']],
+    ['brom', ['byron', 'byron new new1']],
+    ['asdf', []],
+    ['legasdf', []],
+  ])(
+    '<SidebarWalletsMenu /> should filter by %s and display %s',
+    (searchValue, results) => {
+      const assertVisibleItems = 1;
+      const assertSearchResult = results.length;
+      expect.assertions(assertSearchResult + assertVisibleItems);
+      render(<TestDecorator wallets={wallets} searchValue={searchValue} />);
+      results.forEach((r) => expect(screen.queryByTestId(r)).toBeVisible());
+      expect(screen.queryAllByTestId('walletMenu')).toHaveLength(
+        assertSearchResult
+      );
+    }
+  );
+});
diff --git a/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx b/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx
index a64de4bba8..3df9aa6f2c 100644
--- a/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx
+++ b/source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx
@@ -4,14 +4,22 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import classNames from 'classnames';
 import { Scrollbars } from 'react-custom-scrollbars';
-import { map } from 'lodash';
+import { map, noop } from 'lodash';
+import Fuse from 'fuse.js';
+import { FUZZY_SEARCH_THRESHOLD } from '../../../config/sidebarConfig';
 import SidebarSubMenu from '../SidebarMenu';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SidebarWalletsMenu.scss' or ... Remove this comment to see the full error message
 import styles from './SidebarWalletsMenu.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/sidebar... Remove this comment to see the full error message
 import addWalletIcon from '../../../assets/images/sidebar/add-wallet-ic.inline.svg';
 import SidebarWalletMenuItem from './SidebarWalletMenuItem';
-import type { SidebarWalletType } from '../../../types/sidebarTypes';
+import type {
+  SidebarWalletType,
+  WalletSortByOptions,
+  WalletSortOrderOptions,
+} from '../../../types/sidebarTypes';
+import { WalletSortBy, WalletSortOrder } from '../../../types/sidebarTypes';
+import { WalletSortButton } from './WalletSortButton';
+import { WalletSearch } from './WalletSearch';
 
 const messages = defineMessages({
   addAdaWallet: {
@@ -19,6 +27,36 @@ const messages = defineMessages({
     defaultMessage: '!!!Add wallet',
     description: 'Label for the "Add wallet" button in wallet sidebar menu.',
   },
+  sortByDateButton: {
+    id: 'sidebar.wallets.sortByDateButton',
+    defaultMessage: '!!!Date',
+    description: 'Label for the "Date" sort button',
+  },
+  sortByDateTooltip: {
+    id: 'sidebar.wallets.sortByDateTooltip',
+    defaultMessage: '!!!Sort wallets by creation date',
+    description: 'Tooltip message for Date sort button',
+  },
+  sortByBalanceButton: {
+    id: 'sidebar.wallets.sortByBalanceButton',
+    defaultMessage: '!!!Balance',
+    description: 'Label for the "Balance" sort button',
+  },
+  sortByBalanceTooltip: {
+    id: 'sidebar.wallets.sortByBalanceTooltip',
+    defaultMessage: '!!!Sort wallets by balance',
+    description: 'Tooltip message for Balance sort button',
+  },
+  sortByNameButton: {
+    id: 'sidebar.wallets.sortByNameButton',
+    defaultMessage: '!!!A – Z',
+    description: 'Label for the "Name" sort button',
+  },
+  sortByNameTooltip: {
+    id: 'sidebar.wallets.sortByNameTooltip',
+    defaultMessage: '!!!Sort wallets by name',
+    description: 'Tooltip message for Name sort button',
+  },
 });
 type Props = {
   wallets: Array<SidebarWalletType>;
@@ -28,6 +66,14 @@ type Props = {
   visible: boolean;
   isAddWalletButtonActive: boolean;
   isShelleyActivated: boolean;
+  onWalletSortBy?: (arg0: {
+    sortBy: WalletSortByOptions;
+    sortOrder: WalletSortOrderOptions;
+  }) => void;
+  sortBy?: WalletSortByOptions;
+  sortOrder?: WalletSortOrderOptions;
+  searchValue?: string;
+  onSearch?: (term: string) => void;
 };
 
 @observer
@@ -38,6 +84,38 @@ class SidebarWalletsMenu extends Component<Props> {
   renderThumb = (props: any) => (
     <div {...props} className={styles.scrollbarThumb} />
   );
+  walletSort = (sortBy: WalletSortByOptions) => {
+    const { sortOrder = WalletSortOrder.asc, onWalletSortBy = noop } =
+      this.props;
+    return onWalletSortBy({
+      sortBy,
+      sortOrder,
+    });
+  };
+  filterWalletsBySearchValue = (
+    searchValue: string,
+    wallets: SidebarWalletType[]
+  ): SidebarWalletType[] => {
+    if (searchValue.length > 0) {
+      const fuse = new Fuse(
+        wallets.map((w) => ({
+          ...w,
+          // fix encode issue on fuse lib related to empty space
+          // https://github.com/krisk/Fuse/issues/610
+          title: w.title.replace(/\s/g, ' '),
+        })),
+        {
+          keys: ['title'],
+          includeScore: true,
+          ignoreLocation: true,
+          threshold: FUZZY_SEARCH_THRESHOLD,
+        }
+      );
+      return fuse.search(searchValue).map((r) => r.item);
+    }
+
+    return wallets;
+  };
 
   render() {
     const { intl } = this.context;
@@ -48,20 +126,31 @@ class SidebarWalletsMenu extends Component<Props> {
       onWalletItemClick,
       isAddWalletButtonActive,
       isShelleyActivated,
+      sortBy = WalletSortBy.Date,
+      sortOrder = WalletSortOrder.Asc,
+      searchValue = '',
+      onSearch = noop,
     } = this.props;
     const addWalletButtonStyles = classNames([
       styles.addWalletButton,
       isAddWalletButtonActive ? styles.active : null,
     ]);
+    const filteredWallets = this.filterWalletsBySearchValue(
+      searchValue,
+      wallets
+    );
     return (
       <SidebarSubMenu visible={this.props.visible}>
+        <div className={styles.walletSearchContainer}>
+          <WalletSearch searchValue={searchValue} onSearch={onSearch} />
+        </div>
         <div className={styles.wallets}>
           <Scrollbars
             renderThumbHorizontal={() => <div className={styles.hideThumb} />}
             renderThumbVertical={this.renderThumb}
             hideTracksWhenNotNeeded
           >
-            {map(wallets, (wallet) => (
+            {map(filteredWallets, (wallet) => (
               <SidebarWalletMenuItem
                 title={wallet.title}
                 // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
@@ -78,6 +167,7 @@ class SidebarWalletsMenu extends Component<Props> {
                 // @ts-ignore ts-migrate(2339) FIXME: Property 'isHardwareWallet' does not exist on type... Remove this comment to see the full error message
                 isHardwareWallet={wallet.isHardwareWallet}
                 hasNotification={wallet.hasNotification}
+                searchValue={searchValue}
                 isHardwareWalletDisconnected={
                   // @ts-ignore ts-migrate(2339) FIXME: Property 'isHardwareWalletDisconnected' does not e... Remove this comment to see the full error message
                   wallet.isHardwareWalletDisconnected
@@ -86,6 +176,33 @@ class SidebarWalletsMenu extends Component<Props> {
             ))}
           </Scrollbars>
         </div>
+        <div className={styles.walletSortControls}>
+          <div className={styles.walletSortOffset}>
+            <WalletSortButton
+              isActive={sortBy === WalletSortBy.Date}
+              sortOrder={sortOrder}
+              onClick={() => this.walletSort(WalletSortBy.Date)}
+              label={intl.formatMessage(messages.sortByDateButton)}
+              tooltip={intl.formatMessage(messages.sortByDateTooltip)}
+            />
+          </div>
+          <div className={styles.walletSortOffset}>
+            <WalletSortButton
+              isActive={sortBy === WalletSortBy.Balance}
+              sortOrder={sortOrder}
+              onClick={() => this.walletSort(WalletSortBy.Balance)}
+              label={intl.formatMessage(messages.sortByBalanceButton)}
+              tooltip={intl.formatMessage(messages.sortByBalanceTooltip)}
+            />
+          </div>
+          <WalletSortButton
+            isActive={sortBy === WalletSortBy.Name}
+            sortOrder={sortOrder}
+            onClick={() => this.walletSort(WalletSortBy.Name)}
+            label={intl.formatMessage(messages.sortByNameButton)}
+            tooltip={intl.formatMessage(messages.sortByNameTooltip)}
+          />
+        </div>
         <button className={addWalletButtonStyles} onClick={onAddWallet}>
           <SVGInline svg={addWalletIcon} className={styles.icon} />
           <span>{intl.formatMessage(messages.addAdaWallet)}</span>
diff --git a/source/renderer/app/components/sidebar/wallets/WalletSearch.scss b/source/renderer/app/components/sidebar/wallets/WalletSearch.scss
new file mode 100644
index 0000000000..de3d582413
--- /dev/null
+++ b/source/renderer/app/components/sidebar/wallets/WalletSearch.scss
@@ -0,0 +1,69 @@
+$inactive-color: rgba(var(--theme-sidebar-search-field-border-color), 0.1);
+$active-color: rgba(var(--theme-sidebar-search-field-border-color), 0.5);
+
+.component {
+  align-items: center;
+
+  border-bottom: 1px solid $inactive-color;
+  display: flex;
+  position: relative;
+
+  &:focus,
+  &:active,
+  &:focus-within {
+    border-bottom-color: $active-color;
+
+    .searchIcon {
+      color: $active-color;
+    }
+  }
+}
+
+.searchIcon {
+  bottom: 6px;
+  color: rgba(var(--theme-sidebar-search-field-border-color), 0.2);
+  position: absolute;
+  svg {
+    height: 15px;
+    width: 15px;
+  }
+}
+
+.input {
+  border-radius: 4px;
+
+  input {
+    background: none;
+    border: none;
+    color: var(--theme-sidebar-menu-add-button-text-color);
+
+    padding-bottom: 6px;
+    padding-left: 25px;
+    padding-top: 5px;
+
+    &::placeholder {
+      color: rgba(var(--theme-sidebar-search-field-border-color), 0.3);
+    }
+  }
+}
+
+.clearButton {
+  border-radius: 3px;
+  bottom: 4px;
+  cursor: pointer;
+  height: 28px;
+  opacity: 0.5;
+  position: absolute;
+  right: 0;
+  width: 28px;
+  &:hover {
+    opacity: 1;
+  }
+  svg {
+    height: 8px;
+    width: 8px;
+    polygon {
+      fill: var(--theme-sidebar-menu-add-button-text-color);
+    }
+  }
+}
diff --git a/source/renderer/app/components/sidebar/wallets/WalletSearch.tsx b/source/renderer/app/components/sidebar/wallets/WalletSearch.tsx
new file mode 100644
index 0000000000..2d3628cc49
--- /dev/null
+++ b/source/renderer/app/components/sidebar/wallets/WalletSearch.tsx
@@ -0,0 +1,52 @@
+import React from 'react';
+import { intlShape, injectIntl, defineMessages } from 'react-intl';
+import { noop } from 'lodash/fp';
+import { Input } from 'react-polymorph/lib/components/Input';
+import SVGInline from 'react-svg-inline';
+import { observer } from 'mobx-react';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/search.... Remove this comment to see the full error message
+import searchIcon from '../../../assets/images/search.inline.svg';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message
+import crossIcon from '../../../assets/images/close-cross.inline.svg';
+import styles from './WalletSearch.scss';
+
+const messages = defineMessages({
+  placeholder: {
+    id: 'sidebar.wallets.search.placeholder',
+    defaultMessage: '!!!Filter',
+    description: 'Search placeholder for the sidebar wallet menu',
+  },
+});
+type Props = {
+  intl: intlShape.isRequired;
+  onSearch?: (...args: Array<any>) => any;
+  searchValue?: string;
+};
+
+const WalletSearchComponent = ({
+  searchValue = '',
+  onSearch = noop,
+  intl,
+}: Props) => {
+  const hasValue = !!searchValue.length;
+  return (
+    <label htmlFor="sidebarWalletSearch" className={styles.component}>
+      <SVGInline svg={searchIcon} className={styles.searchIcon} />
+      <Input
+        id="sidebarWalletSearch"
+        className={styles.input}
+        onChange={onSearch}
+        spellCheck={false}
+        value={searchValue}
+        placeholder={intl.formatMessage(messages.placeholder)}
+      />
+      {hasValue && (
+        <button className={styles.clearButton} onClick={() => onSearch('')}>
+          <SVGInline svg={crossIcon} />
+        </button>
+      )}
+    </label>
+  );
+};
+
+export const WalletSearch = injectIntl(observer(WalletSearchComponent));
diff --git a/source/renderer/app/components/sidebar/wallets/WalletSortButton.scss b/source/renderer/app/components/sidebar/wallets/WalletSortButton.scss
new file mode 100644
index 0000000000..4cba3c2c34
--- /dev/null
+++ b/source/renderer/app/components/sidebar/wallets/WalletSortButton.scss
@@ -0,0 +1,86 @@
+.walletSortButtonContainer {
+  position: relative;
+
+  .walletSortButton {
+    align-items: center;
+    background-color: rgba(
+      var(--theme-sidebar-sort-button-background-color),
+      0.1
+    );
+    color: var(--theme-sidebar-menu-add-button-text-color);
+    display: flex;
+    font-size: 11px;
+    height: 22px;
+    opacity: 0.3;
+    padding: 0 8px;
+    width: auto;
+
+    &.walletSortButtonActive,
+    &:hover,
+    &:active {
+      opacity: 1;
+    }
+
+    &.walletSortButtonActive {
+      background-color: rgba(
+        var(--theme-sidebar-sort-button-background-color),
+        0.1
+      );
+    }
+
+    &:hover {
+      background-color: rgba(
+        var(--theme-sidebar-sort-button-background-color),
+        0.05
+      );
+    }
+
+    &:active {
+      background-color: rgba(
+        var(--theme-sidebar-sort-button-background-color),
+        0.12
+      );
+    }
+  }
+}
+
+.walletSortButtonActive {
+  opacity: 1;
+}
+
+.walletSortOrderArrowContainer {
+  align-items: center;
+  background-color: var(--theme-sidebar-menu-background-color);
+
+  border-radius: 4px;
+
+  display: flex;
+  height: 12px;
+  justify-content: center;
+  position: absolute;
+  right: -4px;
+  top: -2px;
+
+  width: 12px;
+  z-index: 1;
+}
+
+.walletSortOrderArrow {
+  align-items: center;
+  display: flex;
+  height: 100%;
+  justify-content: center;
+  width: 100%;
+
+  > svg {
+    transform: scale(0.5);
+
+    path {
+      stroke: var(--theme-sidebar-menu-add-button-text-color);
+    }
+  }
+}
+
+.walletSortOrderArrowAsc {
+  transform: rotate(-180deg);
+}
diff --git a/source/renderer/app/components/sidebar/wallets/WalletSortButton.tsx b/source/renderer/app/components/sidebar/wallets/WalletSortButton.tsx
new file mode 100644
index 0000000000..9fd5460449
--- /dev/null
+++ b/source/renderer/app/components/sidebar/wallets/WalletSortButton.tsx
@@ -0,0 +1,57 @@
+import React from 'react';
+import SVGInline from 'react-svg-inline';
+import classNames from 'classnames';
+import { Button } from 'react-polymorph/lib/components/Button';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import type { WalletSortOrderOptions } from '../../../types/sidebarTypes';
+import { WalletSortOrder } from '../../../types/sidebarTypes';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/sort-ar... Remove this comment to see the full error message
+import arrow from '../../../assets/images/sort-arrow.inline.svg';
+import styles from './WalletSortButton.scss';
+
+type Props = {
+  onClick: () => void;
+  label: string;
+  isActive: boolean;
+  sortOrder: WalletSortOrderOptions;
+  tooltip: string;
+};
+export function WalletSortButton({
+  onClick,
+  label,
+  isActive,
+  sortOrder,
+  tooltip,
+}: Props) {
+  const walletSortButtonStyles = classNames([
+    styles.walletSortButton,
+    isActive ? styles.walletSortButtonActive : null,
+  ]);
+  const walletSortOrderArrowStyles = classNames([
+    styles.walletSortOrderArrowContainer,
+    sortOrder === WalletSortOrder.Asc ? styles.walletSortOrderArrowAsc : null,
+  ]);
+  return (
+    <PopOver content={tooltip}>
+      <div className={styles.walletSortButtonContainer}>
+        <Button
+          className={walletSortButtonStyles}
+          onClick={onClick}
+          label={
+            <>
+              {isActive ? (
+                <div className={walletSortOrderArrowStyles}>
+                  <SVGInline
+                    svg={arrow}
+                    className={styles.walletSortOrderArrow}
+                  />
+                </div>
+              ) : null}
+              {label}
+            </>
+          }
+        />
+      </div>
+    </PopOver>
+  );
+}
diff --git a/source/renderer/app/components/staking/StakingUnavailable.tsx b/source/renderer/app/components/staking/StakingUnavailable.tsx
index 8da2b1c351..d511ff0f9c 100644
--- a/source/renderer/app/components/staking/StakingUnavailable.tsx
+++ b/source/renderer/app/components/staking/StakingUnavailable.tsx
@@ -4,7 +4,6 @@ import { FormattedHTMLMessage } from 'react-intl';
 import BigNumber from 'bignumber.js';
 import globalMessages from '../../i18n/global-messages';
 import LoadingSpinner from '../widgets/LoadingSpinner';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingUnavailable.scss' or ... Remove this comment to see the full error message
 import styles from './StakingUnavailable.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/staking/_stakingConfig.scss b/source/renderer/app/components/staking/_stakingConfig.scss
index e358a562df..2e3b45d381 100644
--- a/source/renderer/app/components/staking/_stakingConfig.scss
+++ b/source/renderer/app/components/staking/_stakingConfig.scss
@@ -32,3 +32,9 @@
   color: var(--theme-staking-font-color-light);
   font-family: var(--font-regular);
 }
+
+%stakePoolTicker {
+  font-size: 14px;
+  letter-spacing: -0.5px;
+  text-transform: uppercase;
+}
diff --git a/source/renderer/app/components/staking/countdown/StakingCountdown.tsx b/source/renderer/app/components/staking/countdown/StakingCountdown.tsx
index f1cd67b8d9..feefd05565 100644
--- a/source/renderer/app/components/staking/countdown/StakingCountdown.tsx
+++ b/source/renderer/app/components/staking/countdown/StakingCountdown.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import CountdownWidget from '../../widgets/CountdownWidget';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingCountdown.scss' or it... Remove this comment to see the full error message
 import styles from './StakingCountdown.scss';
 import ButtonLink from '../../widgets/ButtonLink';
 
diff --git a/source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx b/source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx
index a6cac6115e..22c8c611c8 100644
--- a/source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx
+++ b/source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx
@@ -5,7 +5,6 @@ import { defineMessages, intlShape } from 'react-intl';
 import { get } from 'lodash';
 import Wallet from '../../../domains/Wallet';
 import WalletRow from './WalletRow';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationCenterBody.scss' o... Remove this comment to see the full error message
 import styles from './DelegationCenterBody.scss';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
 import type { FutureEpoch, NextEpoch } from '../../../api/network/types';
@@ -91,14 +90,14 @@ class DelegationCenterBody extends Component<Props> {
     return (
       <div className={componentClasses}>
         {isLoading ? (
-          <div className={styles.loadinBlockWrapper}>
+          <div>
             <p>{intl.formatMessage(messages.loadingStakePoolsMessage)}</p>
             {loadingSpinner}
           </div>
         ) : (
           <div>
             <div className={styles.bodyTitle}>
-              <div className={styles.leftBodyTitle}>{title}</div>
+              <div>{title}</div>
               {nextEpochNumber && futureEpochNumber && (
                 <div className={styles.rightBodyTitle}>
                   <span>{currentEpochTitle}</span>
diff --git a/source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx b/source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx
index 565b6bd946..0392df3b70 100644
--- a/source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx
+++ b/source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx
@@ -2,7 +2,6 @@ import React, { Component, Fragment } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { get } from 'lodash';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationCenterHeader.scss'... Remove this comment to see the full error message
 import styles from './DelegationCenterHeader.scss';
 import CountdownWidget from '../../widgets/CountdownWidget';
 import humanizeDurationByLocale from '../../../utils/humanizeDurationByLocale';
diff --git a/source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx b/source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx
index 5dc9187f96..ad82c18e0d 100644
--- a/source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx
+++ b/source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx
@@ -4,7 +4,6 @@ import SVGInline from 'react-svg-inline';
 import BigNumber from 'bignumber.js';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationCenterNoWallets.sc... Remove this comment to see the full error message
 import styles from './DelegationCenterNoWallets.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/attenti... Remove this comment to see the full error message
 import icon from '../../../assets/images/attention-big-thin.inline.svg';
diff --git a/source/renderer/app/components/staking/delegation-center/DonutRing.tsx b/source/renderer/app/components/staking/delegation-center/DonutRing.tsx
index ab89fa74c0..1496e76682 100644
--- a/source/renderer/app/components/staking/delegation-center/DonutRing.tsx
+++ b/source/renderer/app/components/staking/delegation-center/DonutRing.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DonutRing.scss' or its corre... Remove this comment to see the full error message
 import styles from './DonutRing.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/staking/delegation-center/DropdownMenu.tsx b/source/renderer/app/components/staking/delegation-center/DropdownMenu.tsx
index 1cff80964c..93440c8942 100644
--- a/source/renderer/app/components/staking/delegation-center/DropdownMenu.tsx
+++ b/source/renderer/app/components/staking/delegation-center/DropdownMenu.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { Dropdown } from 'react-polymorph/lib/components/Dropdown';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DropdownMenu.scss' or its co... Remove this comment to see the full error message
 import styles from './DropdownMenu.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/staking/delegation-center/WalletRow.scss b/source/renderer/app/components/staking/delegation-center/WalletRow.scss
index 984431e747..947a239407 100644
--- a/source/renderer/app/components/staking/delegation-center/WalletRow.scss
+++ b/source/renderer/app/components/staking/delegation-center/WalletRow.scss
@@ -114,8 +114,7 @@
 
       .stakePoolTicker {
         @extend %accentText;
-        font-size: 14px;
-        letter-spacing: -0.5px;
+        @extend %stakePoolTicker;
         line-height: 1.57;
       }
 
@@ -142,6 +141,7 @@
         .stakePoolTicker {
           padding-left: 0;
           position: relative;
+          text-transform: uppercase;
           top: 0;
           transition: top 200ms ease-in-out;
         }
diff --git a/source/renderer/app/components/staking/delegation-center/WalletRow.tsx b/source/renderer/app/components/staking/delegation-center/WalletRow.tsx
index 289a5b6ae3..8551c5fc42 100644
--- a/source/renderer/app/components/staking/delegation-center/WalletRow.tsx
+++ b/source/renderer/app/components/staking/delegation-center/WalletRow.tsx
@@ -13,14 +13,12 @@ import { getColorFromRange, getSaturationColor } from '../../../utils/colors';
 import adaIcon from '../../../assets/images/ada-symbol.inline.svg';
 import { DECIMAL_PLACES_IN_ADA } from '../../../config/numbersConfig';
 import { PoolPopOver } from '../widgets/PoolPopOver';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRow.scss' or its corre... Remove this comment to see the full error message
 import styles from './WalletRow.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRowPopOverOverrides.sc... Remove this comment to see the full error message
 import popOverThemeOverrides from './WalletRowPopOverOverrides.scss';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/collaps... Remove this comment to see the full error message
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/collapse... Remove this comment to see the full error message
 import arrow from '../../../assets/images/collapse-arrow.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/hardwar... Remove this comment to see the full error message
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/hardware... Remove this comment to see the full error message
 import hardwareWalletsIcon from '../../../assets/images/hardware-wallet/connect-ic.inline.svg';
 import {
   IS_RANKING_DATA_AVAILABLE,
@@ -321,9 +319,7 @@ class WalletRow extends Component<Props, WalletRowState> {
                     className={styles.stakePoolTile}
                     ref={this.stakePoolFirstTileRef}
                   >
-                    <div
-                      className={!delegatedStakePool ? styles.unknown : null}
-                    >
+                    <div>
                       {delegatedStakePool ? (
                         <div className={styles.stakePoolName}>
                           <div
@@ -354,11 +350,7 @@ class WalletRow extends Component<Props, WalletRowState> {
               <SVGInline svg={arrow} className={styles.arrow} />
               <div className={styles.stakePoolTile}>
                 {nextPendingDelegatedStakePoolId ? (
-                  <div
-                    className={
-                      !nextPendingDelegatedStakePool ? styles.unknown : null
-                    }
-                  >
+                  <div>
                     {nextPendingDelegatedStakePool ? (
                       <div className={styles.stakePoolTicker}>
                         {nextPendingDelegatedStakePool.ticker}
diff --git a/source/renderer/app/components/staking/delegation-center/helpers.tsx b/source/renderer/app/components/staking/delegation-center/helpers.tsx
index 3c4437ae2a..64b683189b 100644
--- a/source/renderer/app/components/staking/delegation-center/helpers.tsx
+++ b/source/renderer/app/components/staking/delegation-center/helpers.tsx
@@ -1,7 +1,6 @@
 import { get } from 'lodash';
 import React from 'react';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationCenterHeader.scss'... Remove this comment to see the full error message
 import styles from './DelegationCenterHeader.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/delimet... Remove this comment to see the full error message
 import delimeterIcon from '../../../assets/images/delimeter.inline.svg';
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts
index a5a3267e38..8f5dd9b69b 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts
@@ -40,14 +40,14 @@ export const getMessages = () => {
     delegatedStakePoolLabel: {
       id: 'staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolLabel',
       defaultMessage:
-        '!!!You are already delegating <span>{selectedWalletName}</span> wallet to <span>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>',
+        '!!!You are already delegating <span>{selectedWalletName}</span> wallet to <span class="ticker">[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>',
       description:
         '"You are already delegating to stake pool" label on the delegation setup "choose stake pool" dialog.',
     },
     delegatedStakePoolNextLabel: {
       id: 'staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolNextLabel',
       defaultMessage:
-        '!!!You are already pending delegation <span>{selectedWalletName}</span> wallet to <span>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>',
+        '!!!You are already pending delegation <span>{selectedWalletName}</span> wallet to <span class="ticker">[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>',
       description:
         '"You are already delegating to stake pool" label on the delegation setup "choose stake pool" dialog.',
     },
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.scss b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.scss
index d5ad51d830..6ea895951e 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.scss
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.scss
@@ -1,3 +1,5 @@
+@import '../stakingConfig';
+
 .delegationStepsChooseStakePoolDialogWrapper {
   :global {
     .StakePoolThumbnail_content {
@@ -19,6 +21,10 @@
     .Dialog_contentWrapper::-webkit-scrollbar-track {
       margin-top: -8px;
     }
+
+    .ticker {
+      text-transform: uppercase;
+    }
   }
 
   .stakePoolsListWrapper {
@@ -85,11 +91,10 @@
             --theme-delegation-steps-choose-stake-pool-selected-ticker-color
           );
           font-family: var(--font-semibold);
-          font-size: 14px;
-          letter-spacing: -0.5px;
           line-height: 1.57;
           margin-top: 8px;
           text-align: center;
+          @extend %stakePoolTicker;
         }
 
         .icon {
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.tsx
index a6b98d3c9d..9200224db4 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.tsx
@@ -24,9 +24,7 @@ import { StakePoolsList } from '../stake-pools/StakePoolsList';
 import { StakePoolsSearch } from '../stake-pools/StakePoolsSearch';
 import { getFilteredStakePoolsList } from '../stake-pools/helpers';
 import BackToTopButton from '../../widgets/BackToTopButton';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationSteps.scss' or its... Remove this comment to see the full error message
 import commonStyles from './DelegationSteps.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationStepsChooseStakePo... Remove this comment to see the full error message
 import styles from './DelegationStepsChooseStakePoolDialog.scss';
 import Wallet from '../../../domains/Wallet';
 import ThumbSelectedPool from '../widgets/ThumbSelectedPool';
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx
index aa21c2e533..c2f7a5541b 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx
@@ -8,7 +8,6 @@ import {
 import classNames from 'classnames';
 import { Stepper } from 'react-polymorph/lib/components/Stepper';
 import { StepperSkin } from 'react-polymorph/lib/skins/simple/StepperSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationSteps.scss' or its... Remove this comment to see the full error message
 import commonStyles from './DelegationSteps.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationStepsChooseWalletD... Remove this comment to see the full error message
 import styles from './DelegationStepsChooseWalletDialog.scss';
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.tsx
index 5a817f002a..b3fff1a5e0 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.tsx
@@ -8,9 +8,7 @@ import { Stepper } from 'react-polymorph/lib/components/Stepper';
 import { StepperSkin } from 'react-polymorph/lib/skins/simple/StepperSkin';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationSteps.scss' or its... Remove this comment to see the full error message
 import commonStyles from './DelegationSteps.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationStepsConfirmationD... Remove this comment to see the full error message
 import styles from './DelegationStepsConfirmationDialog.scss';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import DialogBackButton from '../../widgets/DialogBackButton';
@@ -51,13 +49,16 @@ type Props = {
   oversaturationPercentage: number;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class DelegationStepsConfirmationDialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -102,7 +103,6 @@ class DelegationStepsConfirmationDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { selectedWallet } = this.props;
@@ -136,7 +136,6 @@ class DelegationStepsConfirmationDialog extends Component<Props> {
     const isHardwareWallet = get(selectedWallet, 'isHardwareWallet');
     const selectedPoolTicker = get(selectedPool, 'ticker');
     const selectedPoolId = get(selectedPool, 'id');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
     const buttonLabel = !isSubmitting ? (
       intl.formatMessage(messages.confirmButtonLabel)
@@ -278,7 +277,6 @@ class DelegationStepsConfirmationDialog extends Component<Props> {
             </div>
           ) : (
             <Input
-              className={styles.spendingPassword}
               {...spendingPasswordField.bind()}
               skin={InputSkin}
               error={spendingPasswordField.error}
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx
index a3cab97528..8b58b0a6b1 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx
@@ -2,9 +2,7 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import classNames from 'classnames';
 // import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationSteps.scss' or its... Remove this comment to see the full error message
 import commonStyles from './DelegationSteps.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationStepsIntroDialog.s... Remove this comment to see the full error message
 import styles from './DelegationStepsIntroDialog.scss';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
@@ -102,9 +100,7 @@ export default class DelegationStepsIntroDialog extends Component<Props> {
         closeButton={<DialogCloseButton onClose={onClose} />}
       >
         <div className={contentClassName}>
-          <p className={styles.description}>
-            {intl.formatMessage(messages.description)}
-          </p>
+          <p>{intl.formatMessage(messages.description)}</p>
           {/*
            <button className={styles.link} onClick={onLearnMoreClick}>
              {intl.formatMessage(messages.learnMoreButtonLabel)}
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx
index 780c6a624b..2989de6c91 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx
@@ -2,9 +2,7 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationSteps.scss' or its... Remove this comment to see the full error message
 import commonStyles from './DelegationSteps.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationStepsNotAvailableD... Remove this comment to see the full error message
 import styles from './DelegationStepsNotAvailableDialog.scss';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx
index 68c3fe47cf..62d6634431 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx
@@ -4,9 +4,7 @@ import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import classNames from 'classnames';
 import { get } from 'lodash';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationSteps.scss' or its... Remove this comment to see the full error message
 import commonStyles from './DelegationSteps.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegationStepsSuccessDialog... Remove this comment to see the full error message
 import styles from './DelegationStepsSuccessDialog.scss';
 import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
diff --git a/source/renderer/app/components/staking/delegation-setup-wizard/OversaturationText.tsx b/source/renderer/app/components/staking/delegation-setup-wizard/OversaturationText.tsx
index 50bd2d30ca..68db43268d 100644
--- a/source/renderer/app/components/staking/delegation-setup-wizard/OversaturationText.tsx
+++ b/source/renderer/app/components/staking/delegation-setup-wizard/OversaturationText.tsx
@@ -7,7 +7,6 @@ import {
 } from 'react-intl';
 import classnames from 'classnames';
 import type { ReactIntlMessage } from '../../../types/i18nTypes';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './OversaturationText.scss' or ... Remove this comment to see the full error message
 import styles from './OversaturationText.scss';
 
 const messages: Record<string, ReactIntlMessage> = defineMessages({
diff --git a/source/renderer/app/components/staking/epochs/StakingEpochs.tsx b/source/renderer/app/components/staking/epochs/StakingEpochs.tsx
index 7a1a798bf6..b0157cb90a 100644
--- a/source/renderer/app/components/staking/epochs/StakingEpochs.tsx
+++ b/source/renderer/app/components/staking/epochs/StakingEpochs.tsx
@@ -9,7 +9,6 @@ import StakingEpochsCurrentEpochData from './StakingEpochsCurrentEpochData';
 import StakingEpochsPreviousEpochData from './StakingEpochsPreviousEpochData';
 import { SELECTED_EPOCH_OPTIONS, humanizeDurationToShort } from './helpers';
 import type { EpochData } from '../../../api/staking/types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingEpochs.scss' or its c... Remove this comment to see the full error message
 import styles from './StakingEpochs.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/staking/epochs/StakingEpochsCurrentEpochData.tsx b/source/renderer/app/components/staking/epochs/StakingEpochsCurrentEpochData.tsx
index 250799fbcd..f672bb1e01 100644
--- a/source/renderer/app/components/staking/epochs/StakingEpochsCurrentEpochData.tsx
+++ b/source/renderer/app/components/staking/epochs/StakingEpochsCurrentEpochData.tsx
@@ -11,7 +11,6 @@ import {
   sortData,
 } from './helpers';
 import type { EpochData } from '../../../api/staking/types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingEpochs.scss' or its c... Remove this comment to see the full error message
 import styles from './StakingEpochs.scss';
 
 const messages = defineMessages({
@@ -107,9 +106,9 @@ class StakingEpochsCurrentEpochData extends Component<Props, State> {
                 </p>
               </td>
               <td>
-                <span className={styles.mediumText}>
-                  {`${slotsElected[0]}%`}
-                </span>
+                <span
+                  className={styles.mediumText}
+                >{`${slotsElected[0]}%`}</span>
               </td>
             </tr>
           );
diff --git a/source/renderer/app/components/staking/epochs/StakingEpochsDataTable.tsx b/source/renderer/app/components/staking/epochs/StakingEpochsDataTable.tsx
index be482fb97c..0bce3520da 100644
--- a/source/renderer/app/components/staking/epochs/StakingEpochsDataTable.tsx
+++ b/source/renderer/app/components/staking/epochs/StakingEpochsDataTable.tsx
@@ -7,7 +7,6 @@ import { map } from 'lodash';
 import classNames from 'classnames';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/ascendi... Remove this comment to see the full error message
 import sortIcon from '../../../assets/images/ascending.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingEpochs.scss' or its c... Remove this comment to see the full error message
 import styles from './StakingEpochs.scss';
 
 type TableHeaders = {
diff --git a/source/renderer/app/components/staking/epochs/StakingEpochsNoData.tsx b/source/renderer/app/components/staking/epochs/StakingEpochsNoData.tsx
index 1fcc71f779..32e993f5df 100644
--- a/source/renderer/app/components/staking/epochs/StakingEpochsNoData.tsx
+++ b/source/renderer/app/components/staking/epochs/StakingEpochsNoData.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingEpochs.scss' or its c... Remove this comment to see the full error message
 import styles from './StakingEpochs.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx b/source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx
index cdf8cec025..084f8d5f41 100644
--- a/source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx
+++ b/source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx
@@ -11,7 +11,6 @@ import {
   sortData,
 } from './helpers';
 import type { EpochData } from '../../../api/staking/types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingEpochs.scss' or its c... Remove this comment to see the full error message
 import styles from './StakingEpochs.scss';
 import globalMessages from '../../../i18n/global-messages';
 
@@ -131,33 +130,31 @@ class StakingEpochsPreviousEpochData extends Component<Props, State> {
               </td>
               <td>
                 <span className={styles.mediumText}>{slotsElected[0]}</span>
-                <span>
-                  {` ${intl.formatMessage(messages.tableBodySlots)} - `}
-                </span>
-                <span className={styles.mediumText}>
-                  {`${slotsElected[1]}%`}
-                </span>
+                <span>{` ${intl.formatMessage(
+                  messages.tableBodySlots
+                )} - `}</span>
+                <span
+                  className={styles.mediumText}
+                >{`${slotsElected[1]}%`}</span>
               </td>
               <td>
-                <span>
-                  {`${performance[0]} ${intl.formatMessage(
-                    messages.tableBodyOf
-                  )} ${performance[1]} - `}
-                </span>
-                <span className={styles.mediumText}>
-                  {`${performance[2]}%`}
-                </span>
+                <span>{`${performance[0]} ${intl.formatMessage(
+                  messages.tableBodyOf
+                )} ${performance[1]} - `}</span>
+                <span
+                  className={styles.mediumText}
+                >{`${performance[2]}%`}</span>
               </td>
               <td>
                 <span className={styles.mediumText}>{sharedRewards[0]}</span>
-                <span className={styles.uppercaseText}>
-                  {` ${intl.formatMessage(globalMessages.adaUnit)} `}
-                </span>
+                <span className={styles.uppercaseText}>{` ${intl.formatMessage(
+                  globalMessages.adaUnit
+                )} `}</span>
                 <span>{`${intl.formatMessage(messages.tableBodyOf)} `}</span>
                 <span className={styles.mediumText}>{sharedRewards[1]}</span>
-                <span className={styles.uppercaseText}>
-                  {` ${intl.formatMessage(globalMessages.adaUnit)}`}
-                </span>
+                <span className={styles.uppercaseText}>{` ${intl.formatMessage(
+                  globalMessages.adaUnit
+                )}`}</span>
               </td>
             </tr>
           );
diff --git a/source/renderer/app/components/staking/info/StakingInfo.tsx b/source/renderer/app/components/staking/info/StakingInfo.tsx
index 7176d0f398..8b87f6af1b 100644
--- a/source/renderer/app/components/staking/info/StakingInfo.tsx
+++ b/source/renderer/app/components/staking/info/StakingInfo.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape, FormattedMessage } from 'react-intl';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import ButtonLink from '../../widgets/ButtonLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingInfo.scss' or its cor... Remove this comment to see the full error message
 import styles from './StakingInfo.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/staking/info/StakingInfoCountdown.tsx b/source/renderer/app/components/staking/info/StakingInfoCountdown.tsx
index 80c3707feb..1cebc2f3bb 100644
--- a/source/renderer/app/components/staking/info/StakingInfoCountdown.tsx
+++ b/source/renderer/app/components/staking/info/StakingInfoCountdown.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import ButtonLink from '../../widgets/ButtonLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingInfoCountdown.scss' o... Remove this comment to see the full error message
 import styles from './StakingInfoCountdown.scss';
 import FullyDecentralizedEffect from '../../widgets/FullyDecentralizedEffect';
 import CountdownWidget from '../../widgets/CountdownWidget';
diff --git a/source/renderer/app/components/staking/layouts/StakingWithNavigation.scss b/source/renderer/app/components/staking/layouts/StakingWithNavigation.scss
index 19a028042d..5574770be4 100644
--- a/source/renderer/app/components/staking/layouts/StakingWithNavigation.scss
+++ b/source/renderer/app/components/staking/layouts/StakingWithNavigation.scss
@@ -1,3 +1,5 @@
+$stake-pools-search-z-index: 25;
+
 .component {
   display: flex;
   flex-direction: column;
@@ -14,7 +16,7 @@
   flex-shrink: 0;
   height: 50px;
   position: relative;
-  z-index: 2;
+  z-index: $stake-pools-search-z-index;
 }
 
 .page {
diff --git a/source/renderer/app/components/staking/layouts/StakingWithNavigation.tsx b/source/renderer/app/components/staking/layouts/StakingWithNavigation.tsx
index 031e7ff6fe..9f0973ad92 100644
--- a/source/renderer/app/components/staking/layouts/StakingWithNavigation.tsx
+++ b/source/renderer/app/components/staking/layouts/StakingWithNavigation.tsx
@@ -1,21 +1,18 @@
 import React, { Component, createRef } from 'react';
-// @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
-import type { ElementRef, Node } from 'react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react';
 import StakingNavigation from '../navigation/StakingNavigation';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingWithNavigation.scss' ... Remove this comment to see the full error message
 import styles from './StakingWithNavigation.scss';
 
 type Props = {
-  children?: Node;
+  children?: React.ReactNode;
   activeItem: string;
   showInfoTab: boolean;
   onNavItemClick: (...args: Array<any>) => any;
   isActiveNavItem: (...args: Array<any>) => any;
 };
 type ContextValue = {
-  scrollElementRef: ElementRef<any> | null | undefined;
+  scrollElementRef: React.RefObject<HTMLDivElement> | null | undefined;
 };
 export const StakingPageScrollContext = React.createContext<ContextValue>({
   scrollElementRef: null,
@@ -23,7 +20,7 @@ export const StakingPageScrollContext = React.createContext<ContextValue>({
 
 @observer
 class StakingWithNavigation extends Component<Props> {
-  stakingPageRef = createRef<any>();
+  stakingPageRef = createRef<HTMLDivElement>();
 
   render() {
     const {
@@ -49,13 +46,7 @@ class StakingWithNavigation extends Component<Props> {
               showInfoTab={showInfoTab}
             />
           </div>
-          <div
-            className={styles.page}
-            ref={(ref) => {
-              // @ts-ignore ts-migrate(2540) FIXME: Cannot assign to 'current' because it is a read-on... Remove this comment to see the full error message
-              this.stakingPageRef.current = ref;
-            }}
-          >
+          <div className={styles.page} ref={this.stakingPageRef}>
             {children}
           </div>
         </div>
diff --git a/source/renderer/app/components/staking/legacy/BlockGenerationInfo.tsx b/source/renderer/app/components/staking/legacy/BlockGenerationInfo.tsx
index ce03be865c..1450d906d1 100644
--- a/source/renderer/app/components/staking/legacy/BlockGenerationInfo.tsx
+++ b/source/renderer/app/components/staking/legacy/BlockGenerationInfo.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './BlockGenerationInfo.scss' or... Remove this comment to see the full error message
 import styles from './BlockGenerationInfo.scss';
 
 @observer
diff --git a/source/renderer/app/components/staking/legacy/Staking.tsx b/source/renderer/app/components/staking/legacy/Staking.tsx
index 2c81f13dee..28946c20b1 100644
--- a/source/renderer/app/components/staking/legacy/Staking.tsx
+++ b/source/renderer/app/components/staking/legacy/Staking.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import BlockGenerationInfo from './BlockGenerationInfo';
 import StakingSwitch from './StakingSwitch';
 import StakingSystemState from './StakingSystemState';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Staking.scss' or its corresp... Remove this comment to see the full error message
 import styles from './Staking.scss';
 
 @observer
diff --git a/source/renderer/app/components/staking/legacy/StakingChart.tsx b/source/renderer/app/components/staking/legacy/StakingChart.tsx
index e38d647d94..d5af81d92e 100644
--- a/source/renderer/app/components/staking/legacy/StakingChart.tsx
+++ b/source/renderer/app/components/staking/legacy/StakingChart.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { BarChart, Bar, YAxis, XAxis, Cell, ReferenceLine } from 'recharts';
 import StakingChartTooltip from './StakingChartTooltip';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingChart.scss' or its co... Remove this comment to see the full error message
 import styles from './StakingChart.scss';
 
 class CustomReferenceLine extends ReferenceLine {
diff --git a/source/renderer/app/components/staking/legacy/StakingChartTooltip.tsx b/source/renderer/app/components/staking/legacy/StakingChartTooltip.tsx
index 6853c279b5..2d1642e85f 100644
--- a/source/renderer/app/components/staking/legacy/StakingChartTooltip.tsx
+++ b/source/renderer/app/components/staking/legacy/StakingChartTooltip.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import moment from 'moment';
 import StakingChartTooltipItem from './StakingChartTooltipItem';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingChartTooltip.scss' or... Remove this comment to see the full error message
 import styles from './StakingChartTooltip.scss';
 
 const dateFormat = 'YYYY-MM-DD-HH:mm';
diff --git a/source/renderer/app/components/staking/legacy/StakingChartTooltipItem.tsx b/source/renderer/app/components/staking/legacy/StakingChartTooltipItem.tsx
index 90fdd1e367..3511d58920 100644
--- a/source/renderer/app/components/staking/legacy/StakingChartTooltipItem.tsx
+++ b/source/renderer/app/components/staking/legacy/StakingChartTooltipItem.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingChartTooltipItem.scss... Remove this comment to see the full error message
 import styles from './StakingChartTooltipItem.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/staking/legacy/StakingSwitch.tsx b/source/renderer/app/components/staking/legacy/StakingSwitch.tsx
index 1db81907ea..4a297c3281 100644
--- a/source/renderer/app/components/staking/legacy/StakingSwitch.tsx
+++ b/source/renderer/app/components/staking/legacy/StakingSwitch.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { SwitchSkin } from 'react-polymorph/lib/skins/simple/SwitchSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingSwitch.scss' or its c... Remove this comment to see the full error message
 import styles from './StakingSwitch.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/staking/legacy/StakingSystemState.tsx b/source/renderer/app/components/staking/legacy/StakingSystemState.tsx
index 14d546d7d7..f25886ea2f 100644
--- a/source/renderer/app/components/staking/legacy/StakingSystemState.tsx
+++ b/source/renderer/app/components/staking/legacy/StakingSystemState.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import StakingSystemStateElement from './StakingSystemStateElement';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingSystemState.scss' or ... Remove this comment to see the full error message
 import styles from './StakingSystemState.scss';
 
 @observer
diff --git a/source/renderer/app/components/staking/legacy/StakingSystemStateElement.tsx b/source/renderer/app/components/staking/legacy/StakingSystemStateElement.tsx
index 20182c953a..00ae1b7cd5 100644
--- a/source/renderer/app/components/staking/legacy/StakingSystemStateElement.tsx
+++ b/source/renderer/app/components/staking/legacy/StakingSystemStateElement.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingSystemStateElement.sc... Remove this comment to see the full error message
 import styles from './StakingSystemStateElement.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/LoadingOverlay.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/LoadingOverlay.tsx
index 42ac8b938c..de5dbbc5fa 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/LoadingOverlay.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/LoadingOverlay.tsx
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './LoadingOverlay.scss' or its ... Remove this comment to see the full error message
 import styles from './LoadingOverlay.scss';
 
 type Props = {};
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/NoWalletsDialog.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/NoWalletsDialog.tsx
index 391ebf0a64..bc168465a2 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/NoWalletsDialog.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/NoWalletsDialog.tsx
@@ -4,7 +4,6 @@ import { defineMessages, intlShape } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NoWalletsDialog.scss' or its... Remove this comment to see the full error message
 import styles from './NoWalletsDialog.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/sad-wal... Remove this comment to see the full error message
 import sadWalletImage from '../../../assets/images/sad-wallet.inline.svg';
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/RedemptionUnavailableDialog.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/RedemptionUnavailableDialog.tsx
index 1cf330277f..00bbc11250 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/RedemptionUnavailableDialog.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/RedemptionUnavailableDialog.tsx
@@ -6,7 +6,6 @@ import globalMessages from '../../../i18n/global-messages';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RedemptionUnavailableDialog.... Remove this comment to see the full error message
 import styles from './RedemptionUnavailableDialog.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message
 import closeCrossThin from '../../../assets/images/close-cross-thin.inline.svg';
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.scss b/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.scss
index f151ee4ef1..c74e7a7a66 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.scss
+++ b/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;
 
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx
index 35e4769fef..bfdbe289d6 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx
@@ -24,7 +24,6 @@ import {
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import WalletsDropdown from '../../widgets/forms/WalletsDropdown';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Step1ConfigurationDialog.scs... Remove this comment to see the full error message
 import styles from './Step1ConfigurationDialog.scss';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import globalMessages from '../../../i18n/global-messages';
@@ -143,8 +142,19 @@ type Props = {
   wallets: Array<Wallet>;
 };
 
+type State = {
+  wasRecoveryPhraseValidAtLeastOnce: boolean;
+};
+
+interface FormFields {
+  checkboxAcceptance1: string;
+  checkboxAcceptance2: string;
+  walletsDropdown: string;
+  recoveryPhrase: string;
+}
+
 @observer
-class Step1ConfigurationDialog extends Component<Props> {
+class Step1ConfigurationDialog extends Component<Props, State> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
@@ -152,9 +162,13 @@ class Step1ConfigurationDialog extends Component<Props> {
     error: null,
     recoveryPhrase: [],
   };
+
+  state = {
+    wasRecoveryPhraseValidAtLeastOnce: false,
+  };
+
   recoveryPhraseAutocomplete: Autocomplete;
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         recoveryPhrase: {
@@ -172,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',
@@ -198,7 +222,6 @@ class Step1ConfigurationDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: () => this.props.onContinue(),
     });
@@ -207,11 +230,9 @@ class Step1ConfigurationDialog extends Component<Props> {
   get canSubmit() {
     const { isCalculatingReedemFees, wallet, error } = this.props;
     const { form } = this;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const { checked: checkboxAcceptance1isChecked } = form.$(
       'checkboxAcceptance1'
     );
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const { checked: checkboxAcceptance2isChecked } = form.$(
       'checkboxAcceptance2'
     );
@@ -221,7 +242,6 @@ class Step1ConfigurationDialog extends Component<Props> {
       !error &&
       checkboxAcceptance1isChecked &&
       checkboxAcceptance2isChecked &&
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
       form.isValid
     );
   }
@@ -270,29 +290,21 @@ class Step1ConfigurationDialog extends Component<Props> {
           />
         </p>
       );
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = form.$('recoveryPhrase');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const walletsDropdownField = form.$('walletsDropdown');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const checkboxAcceptance1Field = form.$('checkboxAcceptance1');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const checkboxAcceptance2Field = form.$('checkboxAcceptance2');
     const walletId = get(wallet, 'id', null);
-    const validRecoveryPhase = recoveryPhraseField.isValid;
-    const buttonClasses = classnames([
-      'primary',
-      isCalculatingReedemFees ? styles.isSubmitting : null,
-    ]);
-    const walletsDropdownClasses = classnames([
-      styles.walletsDropdown,
-      !validRecoveryPhase ? styles.disabled : null,
-    ]);
+    const walletsDropdownDisabled = !(
+      recoveryPhraseField.isValid ||
+      this.state.wasRecoveryPhraseValidAtLeastOnce
+    );
+
     const actions = {
       direction: 'column',
       items: [
         {
-          className: buttonClasses,
+          className: 'primary',
           disabled: !this.canSubmit,
           primary: true,
           label: intl.formatMessage(messages.continueButtonLabel),
@@ -372,7 +384,6 @@ class Step1ConfigurationDialog extends Component<Props> {
           />
           <div className={styles.walletsDropdownWrapper}>
             <WalletsDropdown
-              className={walletsDropdownClasses}
               {...walletsDropdownField.bind()}
               numberOfStakePools={4}
               wallets={wallets}
@@ -383,6 +394,7 @@ class Step1ConfigurationDialog extends Component<Props> {
               value={walletId}
               getStakePoolById={() => {}}
               errorPosition="bottom"
+              disabled={walletsDropdownDisabled}
             />
           </div>
           <Checkbox
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx
index 11f5dfb802..677c7074ca 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx
@@ -7,7 +7,6 @@ import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import vjf from 'mobx-react-form/lib/validators/VJF';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Step2ConfirmationDialog.scss... Remove this comment to see the full error message
 import styles from './Step2ConfirmationDialog.scss';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import Wallet from '../../../domains/Wallet';
@@ -77,6 +76,10 @@ type Props = {
   error?: LocalizableError | null | undefined;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class Step2ConfirmationDialog extends Component<Props> {
   static contextTypes = {
@@ -85,8 +88,7 @@ class Step2ConfirmationDialog extends Component<Props> {
   static defaultProps = {
     error: null,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -104,12 +106,14 @@ class Step2ConfirmationDialog extends Component<Props> {
           ),
           value: '',
           validators: [
-            ({ field }) => [
-              isValidSpendingPassword(field.value),
-              this.context.intl.formatMessage(
-                globalMessages.invalidSpendingPassword
-              ),
-            ],
+            ({ field }) => {
+              return [
+                isValidSpendingPassword(field.value),
+                this.context.intl.formatMessage(
+                  globalMessages.invalidSpendingPassword
+                ),
+              ];
+            },
           ],
         },
       },
@@ -125,7 +129,6 @@ class Step2ConfirmationDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { spendingPassword } = form.values();
@@ -161,13 +164,11 @@ class Step2ConfirmationDialog extends Component<Props> {
       ? amount
       : transactionFees;
     const { name: walletName } = wallet;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
     const actions = {
       direction: 'column',
       items: [
         {
-          className: isSubmitting ? styles.isSubmitting : null,
           // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
           disabled: !form.isValid,
           primary: true,
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx
index fc38ade204..241e83f834 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx
@@ -4,7 +4,6 @@ import { defineMessages, intlShape } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Step3FailureDialog.scss' or ... Remove this comment to see the full error message
 import styles from './Step3FailureDialog.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/sad-wal... Remove this comment to see the full error message
 import sadWalletImage from '../../../assets/images/sad-wallet.inline.svg';
diff --git a/source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx b/source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx
index 6167258985..efd7656bf6 100644
--- a/source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx
+++ b/source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx
@@ -5,7 +5,6 @@ import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Step3SuccessDialog.scss' or ... Remove this comment to see the full error message
 import styles from './Step3SuccessDialog.scss';
 import Wallet from '../../../domains/Wallet';
 import { formattedWalletAmount } from '../../../utils/formatters';
diff --git a/source/renderer/app/components/staking/rewards/StakingRewards.scss b/source/renderer/app/components/staking/rewards/StakingRewards.scss
index 09e8a9a981..ca18c26da9 100644
--- a/source/renderer/app/components/staking/rewards/StakingRewards.scss
+++ b/source/renderer/app/components/staking/rewards/StakingRewards.scss
@@ -180,6 +180,12 @@
           visibility: visible;
         }
       }
+
+      &.total,
+      &.unspent {
+        padding-right: 10px;
+        text-align: right;
+      }
     }
 
     td {
@@ -209,12 +215,9 @@
 
       .syncingProgress {
         position: absolute;
-        right: 10px;
-        top: 0;
-
+        right: 22px;
+        top: 10px;
         :global .LoadingSpinner_component.LoadingSpinner_medium {
-          margin: 10px auto !important;
-
           .LoadingSpinner_icon svg path {
             fill: var(--theme-loading-spinner-color);
             opacity: 0.3;
@@ -273,16 +276,11 @@
 
       &.rewardWallet {
         max-width: 200px;
-        min-width: 200px;
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
       }
 
-      &.rewardAmount {
-        min-width: 250px;
-      }
-
       &.rewardsAddress {
         min-width: 100px;
 
@@ -301,7 +299,7 @@
             overflow: hidden;
             text-overflow: ellipsis;
             white-space: nowrap;
-            width: 237px;
+            width: 200px;
 
             &:hover {
               cursor: pointer;
@@ -325,6 +323,12 @@
           }
         }
       }
+
+      &.rewardTotal,
+      &.rewardUnspent {
+        padding-right: 23px;
+        text-align: right;
+      }
     }
   }
 }
diff --git a/source/renderer/app/components/staking/rewards/StakingRewards.tsx b/source/renderer/app/components/staking/rewards/StakingRewards.tsx
index c3f7013ccb..fbce0f2f4d 100644
--- a/source/renderer/app/components/staking/rewards/StakingRewards.tsx
+++ b/source/renderer/app/components/staking/rewards/StakingRewards.tsx
@@ -9,6 +9,7 @@ import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import { DECIMAL_PLACES_IN_ADA } from '../../../config/numbersConfig';
+import { formattedWalletAmount } from '../../../utils/formatters';
 import {
   bigNumberComparator,
   stringComparator,
@@ -20,7 +21,6 @@ import sortIcon from '../../../assets/images/ascending.inline.svg';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/downloa... Remove this comment to see the full error message
 import downloadIcon from '../../../assets/images/download-ic.inline.svg';
 import type { Reward } from '../../../api/staking/types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakingRewards.scss' or its ... Remove this comment to see the full error message
 import styles from './StakingRewards.scss';
 import globalMessages from '../../../i18n/global-messages';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
@@ -57,10 +57,15 @@ const messages = defineMessages({
     defaultMessage: '!!!Wallet',
     description: 'Table header "Wallet" label on staking rewards page',
   },
-  tableHeaderReward: {
-    id: 'staking.rewards.tableHeader.reward',
+  tableHeaderRewardTotal: {
+    id: 'staking.rewards.tableHeader.total',
     defaultMessage: '!!!Total rewards earned (ADA)',
-    description: 'Table header "Reward" label on staking rewards page',
+    description: 'Table header "Total Reward" label on staking rewards page',
+  },
+  tableHeaderRewardUnspent: {
+    id: 'staking.rewards.tableHeader.unspent',
+    defaultMessage: '!!!Unspent (ADA)',
+    description: 'Table header "Unspent" label on staking rewards page',
   },
   tableHeaderRewardsAddress: {
     id: 'staking.rewards.tableHeader.rewardsAddress',
@@ -93,7 +98,8 @@ const REWARD_FIELDS = {
   WALLET_NAME: 'wallet',
   IS_RESTORING: 'isRestoring',
   SYNCING_PROGRESS: 'syncingProgress',
-  REWARD: 'reward',
+  REWARD_TOTAL: 'total',
+  REWARD_UNSPENT: 'unspent',
   REWARDS_ADDRESS: 'rewardsAddress',
 };
 const REWARD_ORDERS = {
@@ -116,7 +122,7 @@ type State = {
 };
 
 @observer
-class StakingRewards extends Component<Props, State> {
+export class StakingRewards extends Component<Props, State> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
@@ -140,23 +146,22 @@ class StakingRewards extends Component<Props, State> {
   ) => {
     const { onExportCsv } = this.props;
     const { intl } = this.context;
-    const exportedHeader = [
-      ...availableTableHeaders.map((header) => header.title),
-      intl.formatMessage(messages.tableHeaderDate),
-    ];
-    const date = new Date().toISOString();
+    const exportedHeader = availableTableHeaders.map((header) => header.title);
     const exportedBody = sortedRewards.map((reward) => {
       const rewardWallet = get(reward, REWARD_FIELDS.WALLET_NAME);
       const isRestoring = get(reward, REWARD_FIELDS.IS_RESTORING);
-      const rewardAmount = get(reward, REWARD_FIELDS.REWARD).toFormat(
+      const rewardTotal = get(reward, REWARD_FIELDS.REWARD_TOTAL)?.toFixed(
+        DECIMAL_PLACES_IN_ADA
+      );
+      const rewardUnspent = get(reward, REWARD_FIELDS.REWARD_UNSPENT)?.toFixed(
         DECIMAL_PLACES_IN_ADA
       );
       const rewardsAddress = get(reward, REWARD_FIELDS.REWARDS_ADDRESS);
       return [
         rewardWallet,
         rewardsAddress,
-        isRestoring ? '-' : rewardAmount,
-        date,
+        isRestoring ? '-' : rewardTotal,
+        isRestoring ? '-' : rewardUnspent,
       ];
     });
     const exportedContent = [exportedHeader, ...exportedBody];
@@ -169,9 +174,14 @@ class StakingRewards extends Component<Props, State> {
     const { rewards } = this.props;
     const { rewardsOrder, rewardsSortBy } = this.state;
     return rewards.slice().sort((rewardA: Reward, rewardB: Reward) => {
-      const rewardCompareResult = bigNumberComparator(
-        rewardA.reward,
-        rewardB.reward,
+      const totalCompareResult = bigNumberComparator(
+        rewardA.total,
+        rewardB.total,
+        rewardsOrder === REWARD_ORDERS.ASCENDING
+      );
+      const unspentCompareResult = bigNumberComparator(
+        rewardA.unspent,
+        rewardB.unspent,
         rewardsOrder === REWARD_ORDERS.ASCENDING
       );
       const walletNameCompareResult = stringComparator(
@@ -185,40 +195,28 @@ class StakingRewards extends Component<Props, State> {
         rewardsOrder === REWARD_ORDERS.ASCENDING
       );
 
-      if (rewardsSortBy === REWARD_FIELDS.REWARD) {
-        if (rewardCompareResult === 0 && walletAddressCompareResult === 0) {
-          return walletNameCompareResult;
-        }
-
-        if (rewardCompareResult === 0 && walletNameCompareResult === 0) {
-          return walletAddressCompareResult;
-        }
+      if (rewardsSortBy === REWARD_FIELDS.REWARD_TOTAL) {
+        if (totalCompareResult !== 0) return totalCompareResult;
+        if (walletNameCompareResult !== 0) return walletNameCompareResult;
+        return walletAddressCompareResult;
+      }
 
-        return rewardCompareResult;
+      if (rewardsSortBy === REWARD_FIELDS.REWARD_UNSPENT) {
+        if (unspentCompareResult !== 0) return unspentCompareResult;
+        if (walletNameCompareResult !== 0) return walletNameCompareResult;
+        return walletAddressCompareResult;
       }
 
       if (rewardsSortBy === REWARD_FIELDS.WALLET_NAME) {
-        if (walletNameCompareResult === 0 && walletAddressCompareResult) {
-          return rewardCompareResult;
-        }
-
-        if (rewardCompareResult === 0 && walletNameCompareResult === 0) {
-          return walletAddressCompareResult;
-        }
-
-        return walletNameCompareResult;
+        if (walletNameCompareResult !== 0) return walletNameCompareResult;
+        if (totalCompareResult !== 0) return totalCompareResult;
+        return walletAddressCompareResult;
       }
 
       if (rewardsSortBy === REWARD_FIELDS.REWARDS_ADDRESS) {
-        if (walletAddressCompareResult === 0 && rewardCompareResult === 0) {
-          return walletNameCompareResult;
-        }
-
-        if (walletAddressCompareResult === 0 && walletNameCompareResult === 0) {
-          return rewardCompareResult;
-        }
-
-        return walletAddressCompareResult;
+        if (walletAddressCompareResult !== 0) return walletAddressCompareResult;
+        if (walletNameCompareResult !== 0) return walletNameCompareResult;
+        return totalCompareResult;
       }
 
       return 0;
@@ -253,9 +251,15 @@ class StakingRewards extends Component<Props, State> {
         title: intl.formatMessage(messages.tableHeaderRewardsAddress),
       },
       {
-        name: REWARD_FIELDS.REWARD,
+        name: REWARD_FIELDS.REWARD_TOTAL,
         title: `${intl.formatMessage(
-          messages.tableHeaderReward
+          messages.tableHeaderRewardTotal
+        )} (${intl.formatMessage(globalMessages.adaUnit)})`,
+      },
+      {
+        name: REWARD_FIELDS.REWARD_UNSPENT,
+        title: `${intl.formatMessage(
+          messages.tableHeaderRewardUnspent
         )} (${intl.formatMessage(globalMessages.adaUnit)})`,
       },
     ];
@@ -323,6 +327,7 @@ class StakingRewards extends Component<Props, State> {
                       ]);
                       return (
                         <th
+                          className={styles[tableHeader.name]}
                           key={tableHeader.name}
                           onClick={() =>
                             this.handleRewardsSort(tableHeader.name)
@@ -346,9 +351,13 @@ class StakingRewards extends Component<Props, State> {
                       reward,
                       REWARD_FIELDS.SYNCING_PROGRESS
                     );
-                    const rewardAmount = get(
+                    const rewardTotal = get(
                       reward,
-                      REWARD_FIELDS.REWARD
+                      REWARD_FIELDS.REWARD_TOTAL
+                    ).toFormat(DECIMAL_PLACES_IN_ADA);
+                    const rewardUnspent = get(
+                      reward,
+                      REWARD_FIELDS.REWARD_UNSPENT
                     ).toFormat(DECIMAL_PLACES_IN_ADA);
                     const rewardsAddress = get(
                       reward,
@@ -397,11 +406,9 @@ class StakingRewards extends Component<Props, State> {
                             </div>
                           )}
                         </td>
-                        <td className={styles.rewardAmount}>
-                          {isRestoring ? (
-                            '-'
-                          ) : (
-                            <RewardAmount amount={rewardAmount} />
+                        <td className={styles.rewardTotal}>
+                          {!isRestoring && (
+                            <RewardAmount amount={rewardTotal} />
                           )}
                           {isRestoring && (
                             <div className={styles.syncingProgress}>
@@ -418,6 +425,13 @@ class StakingRewards extends Component<Props, State> {
                             </div>
                           )}
                         </td>
+                        <td className={styles.rewardUnspent}>
+                          {isRestoring ? (
+                            '-'
+                          ) : (
+                            <RewardAmount amount={rewardUnspent} />
+                          )}
+                        </td>
                       </tr>
                     );
                   })}
@@ -432,7 +446,7 @@ class StakingRewards extends Component<Props, State> {
             )}
           </BorderedBox>
           <div className={styles.note}>
-            <div className={styles.noteContent}>
+            <div>
               <FormattedHTMLMessage {...messages.note} />
             </div>
           </div>
@@ -459,5 +473,3 @@ class StakingRewards extends Component<Props, State> {
     });
   };
 }
-
-export default StakingRewards;
diff --git a/source/renderer/app/components/staking/stake-pools/StakePools.tsx b/source/renderer/app/components/staking/stake-pools/StakePools.tsx
index e06f0cc95e..746d0c5c3f 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePools.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePools.tsx
@@ -11,7 +11,6 @@ import { StakePoolsSearch } from './StakePoolsSearch';
 import BackToTopButton from '../../widgets/BackToTopButton';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
 import Wallet from '../../../domains/Wallet';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePools.scss' or its corr... Remove this comment to see the full error message
 import styles from './StakePools.scss';
 import { getFilteredStakePoolsList } from './helpers';
 import { formattedNumber } from '../../../utils/formatters';
@@ -71,24 +70,26 @@ const messages = defineMessages({
 });
 const SELECTED_INDEX_TABLE = 'selectedIndexTable';
 type Props = {
-  wallets: Array<Wallet>;
   currentLocale: string;
-  stakePoolsList: Array<StakePool>;
-  onOpenExternalLink: (...args: Array<any>) => any;
   currentTheme: string;
-  updateDelegatingStake: (...args: Array<any>) => any;
-  rankStakePools: (...args: Array<any>) => any;
-  selectedDelegationWalletId?: string | null | undefined;
-  stake?: number | null | undefined;
-  onDelegate: (...args: Array<any>) => any;
-  isLoading: boolean;
+  getStakePoolById: (...args: Array<any>) => any;
   isFetching: boolean;
+  isListViewTooltipVisible?: boolean;
+  isLoading: boolean;
   isRanking: boolean;
-  stakePoolsDelegatingList: Array<StakePool>;
-  getStakePoolById: (...args: Array<any>) => any;
+  maxDelegationFunds: number;
+  onDelegate: (...args: Array<any>) => any;
+  onListViewVisited: () => void;
+  onOpenExternalLink: (...args: Array<any>) => any;
   onSmashSettingsClick: (...args: Array<any>) => any;
+  rankStakePools: (...args: Array<any>) => any;
+  selectedDelegationWalletId?: string | null | undefined;
   smashServerUrl: string | null | undefined;
-  maxDelegationFunds: number;
+  stake?: number | null | undefined;
+  stakePoolsDelegatingList: Array<StakePool>;
+  stakePoolsList: Array<StakePool>;
+  updateDelegatingStake: (...args: Array<any>) => any;
+  wallets: Array<Wallet>;
 };
 type State = {
   search: string;
@@ -135,12 +136,13 @@ class StakePools extends Component<Props, State> {
       isListView: false,
     });
   };
-  handleListView = () =>
+  handleListView = () => {
     this.setState({
       isGridView: false,
       isGridRewardsView: false,
       isListView: true,
     });
+  };
   handleSetListActive = (selectedList: string) =>
     this.setState({
       selectedList,
@@ -169,9 +171,11 @@ class StakePools extends Component<Props, State> {
       selectedDelegationWalletId,
       stake,
       onOpenExternalLink,
+      onListViewVisited,
       currentTheme,
-      isLoading,
       isFetching,
+      isListViewTooltipVisible,
+      isLoading,
       isRanking,
       stakePoolsDelegatingList,
       getStakePoolById,
@@ -269,7 +273,9 @@ class StakePools extends Component<Props, State> {
               onGridView={this.handleGridView}
               onGridRewardsView={this.handleGridRewardsView}
               onListView={this.handleListView}
+              onListViewVisited={onListViewVisited}
               isListView={isListView}
+              isListViewTooltipVisible={isListViewTooltipVisible}
               isGridView={isGridView}
               isGridRewardsView={isGridRewardsView}
               // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
@@ -284,23 +290,41 @@ class StakePools extends Component<Props, State> {
                     </span>
                   </span>
                 </h2>
-                <StakingPageScrollContext.Consumer>
-                  {(stakePoolsScrollContext) => (
-                    <StakePoolsList
-                      stakePoolsList={stakePoolsDelegatingList}
-                      onOpenExternalLink={onOpenExternalLink}
-                      currentTheme={currentTheme}
-                      containerClassName="StakingWithNavigation_page"
-                      onSelect={this.onDelegate}
-                      numberOfRankedStakePools={numberOfRankedStakePools}
-                      isGridRewardsView={isGridRewardsView}
-                      showWithSelectButton
-                      scrollElementRef={
-                        stakePoolsScrollContext.scrollElementRef
-                      }
-                    />
-                  )}
-                </StakingPageScrollContext.Consumer>
+                {isListView ? (
+                  <StakePoolsTable
+                    listName={SELECTED_INDEX_TABLE}
+                    currentLocale={currentLocale}
+                    stakePoolsList={stakePoolsDelegatingList}
+                    onOpenExternalLink={onOpenExternalLink}
+                    currentTheme={currentTheme}
+                    isListActive={selectedList === SELECTED_INDEX_TABLE}
+                    setListActive={this.handleSetListActive}
+                    containerClassName="StakingWithNavigation_page"
+                    onSelect={this.onDelegate}
+                    numberOfRankedStakePools={numberOfRankedStakePools}
+                    showWithSelectButton
+                    onTableHeaderMouseEnter={this.handleTableHeaderMouseEnter}
+                    onTableHeaderMouseLeave={this.handleTableHeaderMouseLeave}
+                  />
+                ) : (
+                  <StakingPageScrollContext.Consumer>
+                    {(stakePoolsScrollContext) => (
+                      <StakePoolsList
+                        stakePoolsList={stakePoolsDelegatingList}
+                        onOpenExternalLink={onOpenExternalLink}
+                        currentTheme={currentTheme}
+                        containerClassName="StakingWithNavigation_page"
+                        onSelect={this.onDelegate}
+                        numberOfRankedStakePools={numberOfRankedStakePools}
+                        isGridRewardsView={isGridRewardsView}
+                        showWithSelectButton
+                        scrollElementRef={
+                          stakePoolsScrollContext.scrollElementRef
+                        }
+                      />
+                    )}
+                  </StakingPageScrollContext.Consumer>
+                )}
               </Fragment>
             )}
             {isListView && (
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsList.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsList.tsx
index a3e98bf938..6740bae46d 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsList.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsList.tsx
@@ -5,7 +5,6 @@ import type { ElementRef } from 'react';
 import { AutoSizer, List, WindowScroller } from 'react-virtualized';
 import { Instance } from 'tippy.js';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsList.scss' or its ... Remove this comment to see the full error message
 import styles from './StakePoolsList.scss';
 import StakePool from '../../../domains/StakePool';
 import { ThumbPool } from '../widgets/ThumbPool';
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsRanking.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsRanking.tsx
index 023d4b88b8..02ef5be5be 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsRanking.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsRanking.tsx
@@ -33,7 +33,7 @@ import type { DiscreetModeFeature } from '../../../features/discreet-mode';
 import WalletsDropdown from '../../widgets/forms/WalletsDropdown';
 import ButtonLink from '../../widgets/ButtonLink';
 import { Slider } from '../../widgets/Slider';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsRanking.scss' or i... Remove this comment to see the full error message
+import { StakingPageScrollContext } from '../layouts/StakingWithNavigation';
 import styles from './StakePoolsRanking.scss';
 
 const messages = defineMessages({
@@ -388,42 +388,50 @@ class StakePoolsRanking extends Component<Props, State> {
             />
           ) : null}
         </div>
-        <div className={styles.lower}>
-          <div className={styles.row}>
-            <div className={styles.col}>
-              <div className={styles.outOfSliderRangeStart} />
-            </div>
-            <div className={styles.slider}>
-              <Slider
-                min={Math.round(
-                  MIN_DELEGATION_FUNDS_LOG * RANKING_SLIDER_RATIO
-                )}
-                minDisplayValue={MIN_DELEGATION_FUNDS}
-                max={Math.round(maxDelegationFundsLog * RANKING_SLIDER_RATIO)}
-                maxDisplayValue={maxDelegationFunds}
-                value={sliderValue}
-                displayValue={displayValue}
-                showRawValue
-                onChange={this.onSliderChange}
-                onAfterChange={rankStakePools}
-                disabled={isLoading || isRanking}
-                showTooltip
-                minTooltip={intl.formatMessage(messages.rankingMinTooltip)}
-                maxTooltip={intl.formatMessage(messages.rankingMaxTooltip)}
-              />
-            </div>
-            <div className={styles.col}>
-              <div className={styles.outOfRangeMaxAmount}>
-                <PopOver
-                  content={intl.formatMessage(messages.rankingExtraTooltip)}
-                >
-                  {shortNumber(CIRCULATING_SUPPLY)}
-                </PopOver>
+        <StakingPageScrollContext.Consumer>
+          {({ scrollElementRef }) => (
+            <div className={styles.lower}>
+              <div className={styles.row}>
+                <div className={styles.col}>
+                  <div className={styles.outOfSliderRangeStart} />
+                </div>
+                <div className={styles.slider}>
+                  <Slider
+                    min={Math.round(
+                      MIN_DELEGATION_FUNDS_LOG * RANKING_SLIDER_RATIO
+                    )}
+                    minDisplayValue={MIN_DELEGATION_FUNDS}
+                    max={Math.round(
+                      maxDelegationFundsLog * RANKING_SLIDER_RATIO
+                    )}
+                    maxDisplayValue={maxDelegationFunds}
+                    value={sliderValue}
+                    displayValue={displayValue}
+                    showRawValue
+                    onChange={this.onSliderChange}
+                    onAfterChange={rankStakePools}
+                    disabled={isLoading || isRanking}
+                    showTooltip
+                    minTooltip={intl.formatMessage(messages.rankingMinTooltip)}
+                    maxTooltip={intl.formatMessage(messages.rankingMaxTooltip)}
+                    tooltipAppendTo={() => scrollElementRef.current}
+                  />
+                </div>
+                <div className={styles.col}>
+                  <div className={styles.outOfRangeMaxAmount}>
+                    <PopOver
+                      content={intl.formatMessage(messages.rankingExtraTooltip)}
+                      appendTo={() => scrollElementRef.current}
+                    >
+                      {shortNumber(CIRCULATING_SUPPLY)}
+                    </PopOver>
+                  </div>
+                  <div className={styles.outOfSliderRangeEnd} />
+                </div>
               </div>
-              <div className={styles.outOfSliderRangeEnd} />
             </div>
-          </div>
-        </div>
+          )}
+        </StakingPageScrollContext.Consumer>
       </div>
     );
   }
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.scss b/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.scss
index dc1d1e8cbf..1d6ee6ae1a 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.scss
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.scss
@@ -1,3 +1,5 @@
+@import '../../../themes/mixins/layers.scss';
+
 .component {
   align-items: center;
   background-color: var(--rp-modal-overlay-bg-color);
@@ -8,5 +10,5 @@
   position: fixed;
   right: 0;
   top: 134px;
-  z-index: 5000;
+  z-index: $loader-backdrop-z-index;
 }
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.tsx
index a00da53aff..3c21d89019 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsRankingLoader.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsRankingLoader.scss... Remove this comment to see the full error message
 import styles from './StakePoolsRankingLoader.scss';
 
 @observer
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts b/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts
new file mode 100644
index 0000000000..0e53b54b10
--- /dev/null
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts
@@ -0,0 +1,39 @@
+import { defineMessages } from 'react-intl';
+
+export const messages = defineMessages({
+  searchInputPlaceholder: {
+    id: 'staking.stakePools.search.searchInputPlaceholder',
+    defaultMessage: '!!!Search stake pools',
+    description: '"Delegating List Title" for the Stake Pools search.',
+  },
+  delegatingListTitle: {
+    id: 'staking.stakePools.search.delegatingListTitle',
+    defaultMessage: '!!!Stake pools to which you are delegating',
+    description: '"delegatingListTitle" for the Stake Pools search.',
+  },
+  listTitle: {
+    id: 'staking.stakePools.search.listTitle',
+    defaultMessage: '!!!Stake pools ({pools})',
+    description: '"listTitle" for the Stake Pools search.',
+  },
+  gridIconTooltip: {
+    id: 'staking.stakePools.search.gridIconTooltip',
+    defaultMessage: '!!!Grid View',
+    description: '"gridIconTooltip" for the Stake Pools search.',
+  },
+  gridRewardsIconTooltip: {
+    id: 'staking.stakePools.search.gridRewardsIconTooltip',
+    defaultMessage: '!!!Grid Rewards View',
+    description: '"gridRewardsIconTooltip" for the Stake Pools search.',
+  },
+  listIconTooltip: {
+    id: 'staking.stakePools.search.listIconTooltip',
+    defaultMessage: '!!!List View',
+    description: '"listIconTooltip" for the Stake Pools search.',
+  },
+  clearTooltip: {
+    id: 'staking.stakePools.search.clearTooltip',
+    defaultMessage: '!!!Clear',
+    description: '"clearTooltip" for the Stake Pools search.',
+  },
+});
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.scss b/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.scss
index de493589ee..c37ab4404b 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.scss
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.scss
@@ -1,5 +1,8 @@
+@import '../stakingConfig';
+
 .component {
   background: transparent;
+  display: flex;
   padding: 20px 0 0;
   position: initial;
   transition: position 1s ease-out, top 1s ease-out;
@@ -7,23 +10,33 @@
 }
 
 .container {
+  flex: 1 1 auto;
   position: relative;
 }
 
 .searchIcon {
   bottom: 12.5px;
+  color: var(--theme-staking-stake-pools-search-icon-color);
   left: 20px;
   position: absolute;
   z-index: 1;
 
   svg {
+    opacity: 0.3;
     width: 15px;
+
     g > g {
       fill: var(--theme-staking-stake-pools-search-icon-color);
     }
   }
 }
 
+.searchIconFocus {
+  svg {
+    opacity: 0.7;
+  }
+}
+
 .searchInput {
   input {
     border-radius: 4px;
@@ -49,14 +62,6 @@
   line-height: 48px;
   position: absolute;
   right: 20px;
-
-  &.inputExtrasSearch {
-    right: 110px;
-
-    &.withGridRewardsView {
-      right: 145px;
-    }
-  }
 }
 
 .clearSearchButton {
@@ -90,36 +95,38 @@
 }
 
 .viewButtons {
+  @extend %contentBorderAndBackground;
   align-items: center;
-  bottom: 0.5px;
   display: flex;
-  height: 48px;
+  height: 50px;
   justify-content: space-between;
   line-height: 48px;
-  padding-left: 20px;
-  position: absolute;
-  right: 11px;
+  margin-left: 10px;
+  padding: 0 20px;
+  width: auto;
 
-  .separator {
-    color: var(--theme-staking-stake-pools-search-clear-button-color);
-    opacity: 0.2;
-    padding-right: 10px;
-    position: relative;
-    top: -2px;
+  & > span {
+    display: flex;
+    margin-right: 15px;
+
+    &:last-child {
+      margin-right: 0;
+    }
   }
 
   button {
     border-radius: 3px;
     color: var(--theme-about-window-icon-close-button-color);
     cursor: pointer;
-    height: 28px;
-    margin: 0 2px;
-    width: 28px;
+    height: 15px;
+    width: 15px;
 
     &:hover {
-      background-color: var(
-        --theme-staking-stake-pools-search-clear-button-background-color
-      );
+      svg {
+        > g > g {
+          opacity: 0.7;
+        }
+      }
     }
 
     svg {
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx
index c5fa652584..1224920fcb 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx
@@ -1,11 +1,10 @@
-import React, { Component } from 'react';
+import React, { useRef, useState } from 'react';
 import SVGInline from 'react-svg-inline';
-import { defineMessages, intlShape } from 'react-intl';
+import { injectIntl } from 'react-intl';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsSearch.scss' or it... Remove this comment to see the full error message
 import styles from './StakePoolsSearch.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/search.... Remove this comment to see the full error message
 import searchIcon from '../../../assets/images/search.inline.svg';
@@ -15,51 +14,17 @@ import closeIcon from '../../../assets/images/close-cross.inline.svg';
 import gridIcon from '../../../assets/images/grid-ic.inline.svg';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/grid-re... Remove this comment to see the full error message
 import gridRewardsIcon from '../../../assets/images/grid-rewards.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/list-ic... Remove this comment to see the full error message
-import listIcon from '../../../assets/images/list-ic.inline.svg';
 import { IS_GRID_REWARDS_VIEW_AVAILABLE } from '../../../config/stakingConfig';
+import type { Intl } from '../../../types/i18nTypes';
+import { messages } from './StakePoolsSearch.messages';
+import { StakePoolsSearchListViewButton } from './StakePoolsSearchListViewButton';
+import { StakingPageScrollContext } from '../layouts/StakingWithNavigation';
 
-const messages = defineMessages({
-  searchInputPlaceholder: {
-    id: 'staking.stakePools.search.searchInputPlaceholder',
-    defaultMessage: '!!!Search stake pools',
-    description: '"Delegating List Title" for the Stake Pools search.',
-  },
-  delegatingListTitle: {
-    id: 'staking.stakePools.search.delegatingListTitle',
-    defaultMessage: '!!!Stake pools to which you are delegating',
-    description: '"delegatingListTitle" for the Stake Pools search.',
-  },
-  listTitle: {
-    id: 'staking.stakePools.search.listTitle',
-    defaultMessage: '!!!Stake pools ({pools})',
-    description: '"listTitle" for the Stake Pools search.',
-  },
-  gridIconTooltip: {
-    id: 'staking.stakePools.search.gridIconTooltip',
-    defaultMessage: '!!!Grid View',
-    description: '"gridIconTooltip" for the Stake Pools search.',
-  },
-  gridRewardsIconTooltip: {
-    id: 'staking.stakePools.search.gridRewardsIconTooltip',
-    defaultMessage: '!!!Grid Rewards View',
-    description: '"gridRewardsIconTooltip" for the Stake Pools search.',
-  },
-  listIconTooltip: {
-    id: 'staking.stakePools.search.listIconTooltip',
-    defaultMessage: '!!!List View',
-    description: '"listIconTooltip" for the Stake Pools search.',
-  },
-  clearTooltip: {
-    id: 'staking.stakePools.search.clearTooltip',
-    defaultMessage: '!!!Clear',
-    description: '"clearTooltip" for the Stake Pools search.',
-  },
-});
 type Props = {
   label?: string;
   placeholder?: string;
   isListView?: boolean;
+  isListViewTooltipVisible?: boolean;
   isGridView?: boolean;
   isGridRewardsView?: boolean;
   onSearch: (...args: Array<any>) => any;
@@ -67,104 +32,133 @@ type Props = {
   onGridView?: (...args: Array<any>) => any;
   onGridRewardsView?: (...args: Array<any>) => any;
   onListView?: (...args: Array<any>) => any;
+  onListViewVisited?: () => void;
   search: string;
+  intl: Intl;
 };
-export class StakePoolsSearch extends Component<Props> {
-  static contextTypes = {
-    intl: intlShape.isRequired,
-  };
-  searchInput: Record<string, any> | null | undefined = null;
-  autoSelectOnFocus = () =>
-    this.searchInput ? this.searchInput.inputElement.current.select() : false;
 
-  get hasSearchClearButton() {
-    return this.props.search.length > 0;
-  }
+function StakePoolsSearchComponent({
+  label,
+  onClearSearch,
+  onSearch,
+  onGridView,
+  onGridRewardsView,
+  onListView,
+  onListViewVisited,
+  placeholder,
+  search,
+  isListView,
+  isListViewTooltipVisible,
+  isGridView,
+  isGridRewardsView,
+  intl,
+}: Props) {
+  const searchInput =
+    useRef<{ inputElement: { current: HTMLInputElement } }>(null);
+
+  const [isSearchInputFocused, setSearchInputFocused] = useState(false);
 
-  handleClearSearch = () => {
-    this.props.onClearSearch();
+  const autoSelectOnFocus = () => {
+    searchInput?.current
+      ? searchInput.current.inputElement?.current?.select()
+      : false;
 
-    if (this.searchInput) {
-      this.searchInput.focus();
-    }
+    setSearchInputFocused(true);
   };
 
-  render() {
-    const { intl } = this.context;
-    const {
-      label,
-      onSearch,
-      onGridView,
-      onGridRewardsView,
-      onListView,
-      placeholder,
-      search,
-      isListView,
-      isGridView,
-      isGridRewardsView,
-    } = this.props;
-    const gridButtonClasses = classnames([
-      styles.gridView,
-      isGridView ? styles.selected : null,
-    ]);
-    const gridRewardsButtonClasses = classnames([
-      styles.gridRewardsView,
-      isGridRewardsView ? styles.selected : null,
-    ]);
-    const listButtonClasses = classnames([
-      styles.listView,
-      isListView ? styles.selected : null,
-    ]);
-    const isBigSearchComponent = isListView || isGridView || isGridRewardsView;
-    const searchInputClases = classnames([
-      styles.searchInput,
-      isBigSearchComponent ? styles.inputExtrasSearch : null,
-      IS_GRID_REWARDS_VIEW_AVAILABLE ? styles.withGridRewardsView : null,
-    ]);
-    const clearSearchClasses = classnames([
-      styles.inputExtras,
-      isBigSearchComponent ? styles.inputExtrasSearch : null,
-      IS_GRID_REWARDS_VIEW_AVAILABLE ? styles.withGridRewardsView : null,
-    ]);
-    return (
-      <div className={styles.component}>
-        <div className={styles.container}>
-          <SVGInline svg={searchIcon} className={styles.searchIcon} />
-          <Input
-            autoFocus
-            label={label || null}
-            className={searchInputClases}
-            onChange={onSearch}
-            ref={(input) => {
-              this.searchInput = input;
-            }}
-            placeholder={
-              placeholder || intl.formatMessage(messages.searchInputPlaceholder)
-            }
-            skin={InputSkin}
-            value={search}
-            maxLength={150}
-            onFocus={this.autoSelectOnFocus}
-          />
-          {this.hasSearchClearButton && (
-            <div className={clearSearchClasses}>
-              <PopOver content={intl.formatMessage(messages.clearTooltip)}>
-                <button
-                  onClick={this.handleClearSearch}
-                  className={styles.clearSearchButton}
-                >
-                  <SVGInline
-                    svg={closeIcon}
-                    className={styles.clearSearchIcon}
-                  />
-                </button>
-              </PopOver>
-            </div>
-          )}
+  const handleClearSearch = () => {
+    onClearSearch();
+    searchInput?.current?.inputElement.current.focus();
+    setSearchInputFocused(true);
+  };
+
+  const hasSearchClearButton = () => {
+    return search.length > 0;
+  };
+
+  const gridButtonClasses = classnames([
+    styles.gridView,
+    isGridView ? styles.selected : null,
+  ]);
+  const gridRewardsButtonClasses = classnames([
+    styles.gridRewardsView,
+    isGridRewardsView ? styles.selected : null,
+  ]);
+  const isBigSearchComponent = isListView || isGridView || isGridRewardsView;
+  const searchInputClasses = classnames([
+    styles.searchInput,
+    isBigSearchComponent ? styles.inputExtrasSearch : null,
+    IS_GRID_REWARDS_VIEW_AVAILABLE ? styles.withGridRewardsView : null,
+  ]);
+  const clearSearchClasses = classnames([
+    styles.inputExtras,
+    isBigSearchComponent ? styles.inputExtrasSearch : null,
+    IS_GRID_REWARDS_VIEW_AVAILABLE ? styles.withGridRewardsView : null,
+  ]);
+  return (
+    <StakingPageScrollContext.Consumer>
+      {({ scrollElementRef }) => (
+        <div className={styles.component}>
+          <div className={styles.container}>
+            <SVGInline
+              svg={searchIcon}
+              className={classnames(
+                styles.searchIcon,
+                isSearchInputFocused && styles.searchIconFocus
+              )}
+            />
+            <Input
+              autoFocus
+              label={label || null}
+              className={searchInputClasses}
+              onChange={onSearch}
+              ref={(input) => {
+                searchInput.current = input;
+              }}
+              onFocus={autoSelectOnFocus}
+              onBlur={() => setSearchInputFocused(false)}
+              placeholder={
+                placeholder ||
+                intl.formatMessage(messages.searchInputPlaceholder)
+              }
+              skin={InputSkin}
+              value={search}
+              maxLength={150}
+            />
+            {hasSearchClearButton && (
+              <div className={clearSearchClasses}>
+                <PopOver content={intl.formatMessage(messages.clearTooltip)}>
+                  <button
+                    onClick={handleClearSearch}
+                    className={styles.clearSearchButton}
+                  >
+                    <SVGInline
+                      svg={closeIcon}
+                      className={styles.clearSearchIcon}
+                    />
+                  </button>
+                </PopOver>
+              </div>
+            )}
+          </div>
+
           {isBigSearchComponent && (
             <div className={styles.viewButtons}>
-              <span className={styles.separator}>|</span>
-              <PopOver content={intl.formatMessage(messages.gridIconTooltip)}>
+              <PopOver
+                content={intl.formatMessage(messages.gridIconTooltip)}
+                appendTo={() => scrollElementRef.current}
+                popperOptions={{
+                  placement: 'top',
+                  modifiers: [
+                    {
+                      name: 'flip',
+                      options: {
+                        fallbackPlacements: ['bottom'],
+                      },
+                    },
+                  ],
+                }}
+              >
                 <button className={gridButtonClasses} onClick={onGridView}>
                   <SVGInline svg={gridIcon} />
                 </button>
@@ -172,6 +166,18 @@ export class StakePoolsSearch extends Component<Props> {
               {IS_GRID_REWARDS_VIEW_AVAILABLE && (
                 <PopOver
                   content={intl.formatMessage(messages.gridRewardsIconTooltip)}
+                  appendTo={() => scrollElementRef.current}
+                  popperOptions={{
+                    placement: 'top',
+                    modifiers: [
+                      {
+                        name: 'flip',
+                        options: {
+                          fallbackPlacements: ['bottom', 'left'],
+                        },
+                      },
+                    ],
+                  }}
                 >
                   <button
                     className={gridRewardsButtonClasses}
@@ -181,15 +187,19 @@ export class StakePoolsSearch extends Component<Props> {
                   </button>
                 </PopOver>
               )}
-              <PopOver content={intl.formatMessage(messages.listIconTooltip)}>
-                <button className={listButtonClasses} onClick={onListView}>
-                  <SVGInline svg={listIcon} />
-                </button>
-              </PopOver>
+              <StakePoolsSearchListViewButton
+                isListViewTooltipVisible={isListViewTooltipVisible}
+                isListView={isListView}
+                onClick={onListView}
+                onListViewVisited={onListViewVisited}
+                tooltipTarget={scrollElementRef.current}
+              />
             </div>
           )}
         </div>
-      </div>
-    );
-  }
+      )}
+    </StakingPageScrollContext.Consumer>
+  );
 }
+
+export const StakePoolsSearch = injectIntl(StakePoolsSearchComponent);
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsSearchListViewButton.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsSearchListViewButton.tsx
new file mode 100644
index 0000000000..3fdc75fca0
--- /dev/null
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsSearchListViewButton.tsx
@@ -0,0 +1,54 @@
+import React, { useState } from 'react';
+import SVGInline from 'react-svg-inline';
+import { injectIntl } from 'react-intl';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import styles from './StakePoolsSearch.scss';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/list-ic... Remove this comment to see the full error message
+import listIcon from '../../../assets/images/list-ic.inline.svg';
+import type { Intl } from '../../../types/i18nTypes';
+import { messages } from './StakePoolsSearch.messages';
+
+type Props = {
+  isListView?: boolean;
+  isListViewTooltipVisible?: boolean;
+  onClick?: () => void;
+  onListViewVisited?: () => void;
+  intl: Intl;
+  tooltipTarget?: HTMLDivElement;
+};
+
+function StakePoolsSearchListViewButtonComponent({
+  onClick,
+  onListViewVisited,
+  isListView,
+  isListViewTooltipVisible,
+  intl,
+  tooltipTarget,
+}: Props) {
+  const [visible, setVisible] = useState(false);
+  const isPopOverVisible = visible || isListViewTooltipVisible;
+
+  return (
+    <PopOver
+      visible={isPopOverVisible}
+      content={intl.formatMessage(messages.listIconTooltip)}
+      appendTo={() => tooltipTarget}
+    >
+      <button
+        className={isListView ? styles.selected : null}
+        onClick={onClick}
+        onMouseEnter={() => setVisible(true)}
+        onMouseLeave={() => {
+          setVisible(false);
+          onListViewVisited();
+        }}
+      >
+        <SVGInline svg={listIcon} />
+      </button>
+    </PopOver>
+  );
+}
+
+export const StakePoolsSearchListViewButton = injectIntl(
+  StakePoolsSearchListViewButtonComponent
+);
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsTable.scss b/source/renderer/app/components/staking/stake-pools/StakePoolsTable.scss
index 6424cede01..c87f455cea 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsTable.scss
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsTable.scss
@@ -1,5 +1,6 @@
 @import '../../../themes/mixins/link';
 @import '../../../themes/mixins/loading-spinner';
+@import '../../../themes/mixins/layers';
 
 .component {
   .headerWrapper {
@@ -105,7 +106,7 @@
       padding: 0 20px;
       position: sticky;
       top: 0;
-      z-index: 999;
+      z-index: $sticky-header-z-index;
 
       tr {
         border: 0;
@@ -113,7 +114,7 @@
         justify-content: space-between;
         width: 100%;
 
-        .tooltipWithHTMLContent {
+        .tooltipWithHtmlContent {
           p {
             -webkit-box-orient: horizontal;
             display: block;
@@ -218,7 +219,7 @@
       -ms-user-select: none;
       user-select: none;
 
-      // Right alligned cells need this padding
+      // Right aligned cells need this padding
       // because of the sorting icon
       &:nth-child(7),
       &:nth-child(8) {
@@ -227,6 +228,7 @@
 
       .ticker {
         color: var(--theme-staking-stake-pool-tooltip-link-color);
+        text-transform: uppercase;
       }
 
       &:nth-child(2) {
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx
index 551007a019..ca95bf4e2a 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx
@@ -4,7 +4,6 @@ import { orderBy } from 'lodash';
 import classNames from 'classnames';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsTable.scss' or its... Remove this comment to see the full error message
 import styles from './StakePoolsTable.scss';
 import StakePool from '../../../domains/StakePool';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
@@ -277,7 +276,7 @@ class StakePoolsTable extends Component<Props, State> {
             key="ranking"
             placement="bottom"
             content={
-              <div className={styles.tooltipWithHTMLContent}>
+              <div className={styles.tooltipWithHtmlContent}>
                 <FormattedHTMLMessage {...messages.tableHeaderRankTooltip} />
               </div>
             }
@@ -390,11 +389,7 @@ class StakePoolsTable extends Component<Props, State> {
                     />
                   </tr>
                 </thead>
-                <tbody
-                  className={
-                    currentLocale === 'ja-JP' ? styles.japaneseHeader : null
-                  }
-                >
+                <tbody>
                   <StakePoolsTableBody
                     // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
                     sortedStakePoolList={sortedStakePoolList}
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsTableBody.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsTableBody.tsx
index 56c64b9598..69d1b24e77 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsTableBody.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsTableBody.tsx
@@ -10,7 +10,6 @@ import {
   toFixedUserFormat,
 } from '../../../utils/formatters';
 import { PoolPopOver } from '../widgets/PoolPopOver';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsTable.scss' or its... Remove this comment to see the full error message
 import styles from './StakePoolsTable.scss';
 import { getColorFromRange, getSaturationColor } from '../../../utils/colors';
 import StakePool from '../../../domains/StakePool';
diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsTableHeader.tsx b/source/renderer/app/components/staking/stake-pools/StakePoolsTableHeader.tsx
index b0685493ae..dd63573049 100644
--- a/source/renderer/app/components/staking/stake-pools/StakePoolsTableHeader.tsx
+++ b/source/renderer/app/components/staking/stake-pools/StakePoolsTableHeader.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { map } from 'lodash';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StakePoolsTable.scss' or its... Remove this comment to see the full error message
 import styles from './StakePoolsTable.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/ascendi... Remove this comment to see the full error message
 import sortIcon from '../../../assets/images/ascending.inline.svg';
@@ -36,7 +35,6 @@ class StakePoolsTableHeader extends Component<TableHeaderProps> {
       const sortIconClasses = classNames([
         styles.sortIcon,
         isSorted ? styles.sorted : null,
-        isSorted && stakePoolsOrder === 'asc' ? styles.ascending : null,
         isSorted && styles[`${stakePoolsOrder}CurrentOrdering`],
         styles[`${defaultOrdering}DefaultOrdering`],
       ]);
diff --git a/source/renderer/app/components/staking/widgets/PoolPopOver.tsx b/source/renderer/app/components/staking/widgets/PoolPopOver.tsx
index 2e12dd5a49..592c3ea904 100644
--- a/source/renderer/app/components/staking/widgets/PoolPopOver.tsx
+++ b/source/renderer/app/components/staking/widgets/PoolPopOver.tsx
@@ -5,7 +5,6 @@ import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { STAKE_POOL_TOOLTIP_HOVER_WAIT } from '../../../config/timingConfig';
 import StakePool from '../../../domains/StakePool';
 import TooltipPool from './TooltipPool';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PoolPopOver.scss' or its cor... Remove this comment to see the full error message
 import styles from './PoolPopOver.scss';
 
 /**
diff --git a/source/renderer/app/components/staking/widgets/ThumbPool.tsx b/source/renderer/app/components/staking/widgets/ThumbPool.tsx
index 7f5fc3b46b..1d8a81d560 100644
--- a/source/renderer/app/components/staking/widgets/ThumbPool.tsx
+++ b/source/renderer/app/components/staking/widgets/ThumbPool.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react';
 import classnames from 'classnames';
 import { PoolPopOver } from './PoolPopOver';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ThumbPool.scss' or its corre... Remove this comment to see the full error message
 import styles from './ThumbPool.scss';
 import { getColorFromRange } from '../../../utils/colors';
 import StakePool from '../../../domains/StakePool';
diff --git a/source/renderer/app/components/staking/widgets/ThumbPoolContent.scss b/source/renderer/app/components/staking/widgets/ThumbPoolContent.scss
index de1193d99e..6ec229facb 100644
--- a/source/renderer/app/components/staking/widgets/ThumbPoolContent.scss
+++ b/source/renderer/app/components/staking/widgets/ThumbPoolContent.scss
@@ -1,3 +1,5 @@
+@import '../stakingConfig';
+
 .component {
   height: 69px;
   padding: 9px 0 0;
@@ -15,11 +17,10 @@
   .ticker {
     color: var(--theme-staking-stake-pool-ticker-color);
     font-family: var(--font-semibold);
-    font-size: 14px;
-    letter-spacing: -0.5px;
     line-height: 1;
     margin: 0 0 1px;
     text-align: center;
+    @extend %stakePoolTicker;
   }
 
   .ranking {
diff --git a/source/renderer/app/components/staking/widgets/ThumbPoolContent.tsx b/source/renderer/app/components/staking/widgets/ThumbPoolContent.tsx
index 82b9610bdd..08aea04366 100644
--- a/source/renderer/app/components/staking/widgets/ThumbPoolContent.tsx
+++ b/source/renderer/app/components/staking/widgets/ThumbPoolContent.tsx
@@ -7,7 +7,6 @@ import classnames from 'classnames';
 import clockIcon from '../../../assets/images/clock-corner.inline.svg';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/no-data... Remove this comment to see the full error message
 import noDataDashBigImage from '../../../assets/images/no-data-dash-big.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ThumbPoolContent.scss' or it... Remove this comment to see the full error message
 import styles from './ThumbPoolContent.scss';
 import { getColorFromRange, getSaturationColor } from '../../../utils/colors';
 import StakePool from '../../../domains/StakePool';
diff --git a/source/renderer/app/components/staking/widgets/ThumbSelectedPool.scss b/source/renderer/app/components/staking/widgets/ThumbSelectedPool.scss
index 10e85463ab..a1f8c742f9 100644
--- a/source/renderer/app/components/staking/widgets/ThumbSelectedPool.scss
+++ b/source/renderer/app/components/staking/widgets/ThumbSelectedPool.scss
@@ -38,6 +38,7 @@
       letter-spacing: -0.5px;
       line-height: 1.57;
       text-align: center;
+      text-transform: uppercase;
     }
 
     .icon {
diff --git a/source/renderer/app/components/staking/widgets/ThumbSelectedPool.tsx b/source/renderer/app/components/staking/widgets/ThumbSelectedPool.tsx
index cc67c667a1..9adf88a691 100644
--- a/source/renderer/app/components/staking/widgets/ThumbSelectedPool.tsx
+++ b/source/renderer/app/components/staking/widgets/ThumbSelectedPool.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import SVGInline from 'react-svg-inline';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ThumbSelectedPool.scss' or i... Remove this comment to see the full error message
 import styles from './ThumbSelectedPool.scss';
 import { getColorFromRange } from '../../../utils/colors';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/check-w... Remove this comment to see the full error message
diff --git a/source/renderer/app/components/staking/widgets/TooltipPool.scss b/source/renderer/app/components/staking/widgets/TooltipPool.scss
index e3816b3bfd..3cfb562080 100644
--- a/source/renderer/app/components/staking/widgets/TooltipPool.scss
+++ b/source/renderer/app/components/staking/widgets/TooltipPool.scss
@@ -230,11 +230,11 @@ $tooltip-width: 280px;
 .ticker {
   color: var(--theme-staking-stake-pool-tooltip-text-color);
   display: inline-block;
-  font-size: 14px;
   line-height: 1.36;
   margin-bottom: 9px;
   opacity: 0.6;
   vertical-align: middle;
+  @extend %stakePoolTicker;
 }
 
 .retirement {
@@ -367,7 +367,7 @@ $tooltip-width: 280px;
         }
       }
 
-      .tooltipWithHTMLContent {
+      .tooltipWithHtmlContent {
         p {
           -webkit-box-orient: horizontal;
           display: block;
diff --git a/source/renderer/app/components/staking/widgets/TooltipPool.tsx b/source/renderer/app/components/staking/widgets/TooltipPool.tsx
index 235bb7f8d0..c41ee80735 100644
--- a/source/renderer/app/components/staking/widgets/TooltipPool.tsx
+++ b/source/renderer/app/components/staking/widgets/TooltipPool.tsx
@@ -16,7 +16,6 @@ import SVGInline from 'react-svg-inline';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TooltipPool.scss' or its cor... Remove this comment to see the full error message
 import styles from './TooltipPool.scss';
 import StakePool from '../../../domains/StakePool';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message
@@ -298,11 +297,12 @@ class TooltipPool extends Component<Props, State> {
       {
         key: 'relativeStake',
         value: (
-          <div className={styles.defaultColor}>
-            <span className={styles.defaultColorContent}>
-              {/* @ts-ignore ts-migrate(2345) FIXME: Argument of type 'BigNumber' is not assignable to ... Remove this comment to see the full error message */}
-              {`${toFixedUserFormat(relativeStake, 2)}%`}
-            </span>
+          <div>
+            <span className={styles.defaultColorContent}>{`${toFixedUserFormat(
+              // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'BigNumber' is not assignable to ... Remove this comment to see the full error message
+              relativeStake,
+              2
+            )}%`}</span>
           </div>
         ),
       },
@@ -326,7 +326,7 @@ class TooltipPool extends Component<Props, State> {
       {
         key: 'pledge',
         value: (
-          <div className={styles.defaultColor}>
+          <div>
             <span className={styles.defaultColorContent}>
               {formattedWalletAmount(pledge, true, false)}
             </span>
@@ -353,7 +353,7 @@ class TooltipPool extends Component<Props, State> {
       {
         key: 'producedBlocks',
         value: (
-          <div className={styles.defaultColor}>
+          <div>
             <span className={styles.defaultColorContent}>
               {toFixedUserFormat(producedBlocks, 0)}
             </span>
@@ -363,7 +363,7 @@ class TooltipPool extends Component<Props, State> {
       {
         key: 'potentialRewards',
         value: (
-          <div className={styles.defaultColor}>
+          <div>
             {isGridRewardsView &&
             potentialRewards.isZero &&
             potentialRewards.isZero() ? (
@@ -392,7 +392,7 @@ class TooltipPool extends Component<Props, State> {
                   offset={[0, 10]}
                   key={field.key}
                   content={
-                    <div className={styles.tooltipWithHTMLContent}>
+                    <div className={styles.tooltipWithHtmlContent}>
                       <FormattedHTMLMessage
                         {...messages[`${field.key}Tooltip`]}
                       />
@@ -486,7 +486,7 @@ class TooltipPool extends Component<Props, State> {
           <PopOver
             key="id"
             content={
-              <div className={styles.tooltipWithHTMLContent}>
+              <div className={styles.tooltipWithHtmlContent}>
                 {stakePoolAddressHoverCopy}
               </div>
             }
diff --git a/source/renderer/app/components/static/About.scss b/source/renderer/app/components/static/About.scss
index 6563b50953..54aed6e811 100644
--- a/source/renderer/app/components/static/About.scss
+++ b/source/renderer/app/components/static/About.scss
@@ -55,7 +55,7 @@
     }
 
     .daedalusTitleVersion {
-      color: var(--theme-about-window-title-varsion-color);
+      color: var(--theme-about-window-title-version-color);
       display: flex;
       flex-direction: column;
       justify-content: center;
diff --git a/source/renderer/app/components/static/About.tsx b/source/renderer/app/components/static/About.tsx
index 137a1fe292..717da52728 100644
--- a/source/renderer/app/components/static/About.tsx
+++ b/source/renderer/app/components/static/About.tsx
@@ -5,13 +5,9 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import DialogCloseButton from '../widgets/DialogCloseButton';
 import globalMessages from '../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './About.scss' or its correspon... Remove this comment to see the full error message
 import styles from './About.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCrossThin from '../../assets/images/close-cross-thin.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/daedalus-l... Remove this comment to see the full error message
 import daedalusIcon from '../../assets/images/daedalus-logo-loading-grey.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/cardano-lo... Remove this comment to see the full error message
 import cardanoIcon from '../../assets/images/cardano-logo.inline.svg';
 
 const messages = defineMessages({
@@ -33,13 +29,13 @@ const messages = defineMessages({
   aboutContentDaedalusMembers: {
     id: 'static.about.content.daedalus.members',
     defaultMessage:
-      '!!!Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Danilo Prates, Darko Mijić, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Manus McCole, Michael Bishop, Mior Sufian, Nikola Glumac, Piotr Stachyra, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov',
+      '!!!Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Daniel Main, Danilo Prates, Darko Mijić, Dmitrii Gaico, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Lucas Araujo, Manus McCole, Marcin Mazurek, Michael Bishop, Michael Chappell, Mior Sufian, Nikola Glumac, Piotr Stachyra, Przemysław Włodek, Renan Ferreira, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Szymon Masłowski, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov',
     description: 'About page daedalus team members',
   },
   aboutContentCardanoMembers: {
     id: 'static.about.content.cardano.members',
     defaultMessage:
-      "!!!Alexander Sukhoverkhov, Alexander Vieth, Alexandre Rodrigues Baldé, Alfredo Di Napoli, Anastasiya Besman, Andrzej Rybczak, Ante Kegalj, Anton Belyy, Anupam Jain, Arseniy Seroka, Artyom Kazak, Carlos D'Agostino, Charles Hoskinson, Dan Friedman, Denis Shevchenko, Dmitry Kovanikov, Dmitry Mukhutdinov, Dmitry Nikulin, Domen Kožar, Duncan Coutts, Edsko de Vries, Eileen Fitzgerald, George Agapov, Hiroto Shioi, Ilya Lubimov, Ilya Peresadin, Ivan Gromakovskii, Jake Mitchell, Jane Wild, Jens Krause, Jeremy Wood, Joel Mislov Kunst, Jonn Mostovoy, Konstantin Ivanov, Kristijan Šarić, Lars Brünjes, Laurie Wang, Lionel Miller, Michael Bishop, Mikhail Volkhov, Niklas Hambüchen, Peter Gaži, Philipp Kant, Serge Kosyrev, Vincent Hanquez",
+      '!!!Alan McNicholas, Alejandro Garcia, Alexander Diemand, Alexander Vieth, Anatoli Ivanou, Andreas Triantafyllos, Ante Kegalj, Armando Santos, Ben Ford, Charles Hoskinson, Dan Friedman, Deepak Kapiswe, Denis Shevchenko, Dorin Solomon, Duncan Coutts, Edsko de Vries, Erik de Castro Lopo, Gerard Moroney, Hiroto Shioi, Jane Wild, Jean-Christophe Mincke, Jeremy Wood, Johannes Lund, Jordan Millar, Karl Knutsson, Kristijan Šarić, Lars Brünjes, Laurie Wang, Liz Bancroft, Luke Nadur, Marc Fontaine, Marcin Szamotulski, Matt Parsons, Matthias Benkort, Michael Bishop, Michael Hueschen, Moritz Angermann, Neil Davis, Niamh Ahern, Nicholas Clarke, Nicolas Di Prima, Noel Rimbert, Patrick Kelly, Pawel Jakubas, Peter Gaži, Peter Thompson, Philipp Kant, Piotr Stachyra, Ravi Patel, Richard Wild, Rob Cohen, Rodney Lorrimar, Ryan Lemmer, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tom Flynn, Vasileios Gkoumas, Vincent Hanquez',
     description: 'About page cardano team members',
   },
   aboutCopyright: {
@@ -130,7 +126,7 @@ export default class About extends Component<Props> {
 
           <h2>{apiHeadline}</h2>
 
-          <div className={styles.apiMembers}>{apiMembers}</div>
+          <div>{apiMembers}</div>
         </div>
 
         <div className={styles.footerWrapper}>
diff --git a/source/renderer/app/components/status/DaedalusDiagnostics.tsx b/source/renderer/app/components/status/DaedalusDiagnostics.tsx
index dbc1e56407..71da9d39c7 100644
--- a/source/renderer/app/components/status/DaedalusDiagnostics.tsx
+++ b/source/renderer/app/components/status/DaedalusDiagnostics.tsx
@@ -13,25 +13,18 @@ import SVGInline from 'react-svg-inline';
 import { ALLOWED_TIME_DIFFERENCE } from '../../config/timingConfig';
 import globalMessages from '../../i18n/global-messages';
 import DialogCloseButton from '../widgets/DialogCloseButton';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCrossThin from '../../assets/images/close-cross-thin.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/clipboard-... Remove this comment to see the full error message
 import iconCopy from '../../assets/images/clipboard-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/sand-clock... Remove this comment to see the full error message
 import sandClockIcon from '../../assets/images/sand-clock-xs.inline.svg';
 import LocalizableError from '../../i18n/LocalizableError';
-import {
-  formattedNumber,
-  formattedCpuModel,
-  formattedSize,
-} from '../../utils/formatters';
+import { formattedNumber, formattedSize } from '../../utils/formatters';
 import { CardanoNodeStates } from '../../../../common/types/cardano-node.types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DaedalusDiagnostics.scss' or... Remove this comment to see the full error message
 import styles from './DaedalusDiagnostics.scss';
 import type { CardanoNodeState } from '../../../../common/types/cardano-node.types';
 import type { SystemInfo } from '../../types/systemInfoTypes';
 import type { CoreSystemInfo } from '../../types/coreSystemInfoTypes';
 import type { TipInfo } from '../../api/network/types';
+import { ErrorType } from '../../domains/ApiError';
 
 const messages = defineMessages({
   systemInfo: {
@@ -74,6 +67,43 @@ const messages = defineMessages({
     defaultMessage: '!!!https://iohk.zendesk.com/hc',
     description: '"Support" link URL while disk space is unknown',
   },
+  hasMetHardwareRequirementsLabel: {
+    id: 'daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatus',
+    defaultMessage: '!!!Recommended system requirements status',
+    description:
+      'Displayed on the left of the Recommended system requirements status row',
+  },
+  hasMetHardwareRequirementsStatusLowValue: {
+    id: 'daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowValue',
+    defaultMessage: '!!!Low',
+    description:
+      'Displayed on the right of the Recommended system requirements status row when hardware requirements are insufficient',
+  },
+  hasMetHardwareRequirementsStatusGoodValue: {
+    id: 'daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodValue',
+    defaultMessage: '!!!Good',
+    description:
+      'Displayed on the right of the Recommended system requirements status row when hardware requirements are ok',
+  },
+  hasMetHardwareRequirementsStatusLowTooltip: {
+    id: 'daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowTooltip',
+    defaultMessage:
+      '!!!Your system specifications do not meet Daedalus’ recommended hardware requirements. We suggest using a machine with at least 16 GB of RAM',
+    description:
+      'Visible on hovering over Recommended system requirement status when status is Low',
+  },
+  hasMetHardwareRequirementsStatusGoodTooltip: {
+    id: 'daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodTooltip',
+    defaultMessage:
+      '!!!Your system specifications meet Daedalus’ recommended hardware requirements',
+    description:
+      'Visible on hovering over Recommended system requirement status when status is Good',
+  },
+  isRTSFlagsModeEnabled: {
+    id: 'daedalus.diagnostics.dialog.isRTSFlagsModeEnabled',
+    defaultMessage: '!!!RTS Flags Mode',
+    description: 'Indicates whether RTS Flags Mode is enabled or not',
+  },
   coreInfo: {
     id: 'daedalus.diagnostics.dialog.coreInfo',
     defaultMessage: '!!!CORE INFO',
@@ -301,13 +331,23 @@ const messages = defineMessages({
   },
   statusOn: {
     id: 'daedalus.diagnostics.dialog.statusOn',
-    defaultMessage: '!!!YES',
-    description: 'YES',
+    defaultMessage: '!!!Yes',
+    description: 'Yes',
   },
   statusOff: {
     id: 'daedalus.diagnostics.dialog.statusOff',
-    defaultMessage: '!!!NO',
-    description: 'NO',
+    defaultMessage: '!!!No',
+    description: 'No',
+  },
+  statusOnForUserSettings: {
+    id: 'daedalus.diagnostics.dialog.statusOnForUserSettings',
+    defaultMessage: '!!!On',
+    description: 'On',
+  },
+  statusOffForUserSettings: {
+    id: 'daedalus.diagnostics.dialog.statusOffForUserSettings',
+    defaultMessage: '!!!Off',
+    description: 'Off',
   },
   serviceUnreachable: {
     id: 'daedalus.diagnostics.dialog.serviceUnreachable',
@@ -410,15 +450,17 @@ class DaedalusDiagnostics extends Component<Props, State> {
     }
   }
 
-  getSectionRow = (messageId: string, content?: Node) => (
-    <div className={styles.layoutRow}>
-      <div className={styles.sectionTitle}>
-        <span>{this.context.intl.formatMessage(messages[messageId])}</span>
-        {content}
-        <hr />
+  getSectionRow = (messageId: string, content?: Node) => {
+    return (
+      <div className={styles.layoutRow}>
+        <div className={styles.sectionTitle}>
+          <span>{this.context.intl.formatMessage(messages[messageId])}</span>
+          {content}
+          <hr />
+        </div>
       </div>
-    </div>
-  );
+    );
+  };
   getRow = (messageId: string, value: Node | boolean) => {
     const { intl } = this.context;
     const key = intl.formatMessage(messages[messageId]);
@@ -483,11 +525,12 @@ class DaedalusDiagnostics extends Component<Props, State> {
     const {
       platform,
       platformVersion,
-      cpu: cpuInOriginalFormat,
+      cpu,
       ram,
       availableDiskSpace: availableDiskSpaceInOriginalFormat,
+      hasMetHardwareRequirements,
+      isRTSFlagsModeEnabled,
     } = systemInfo;
-    const cpu = formattedCpuModel(cpuInOriginalFormat);
     const availableDiskSpace = formattedSize(
       availableDiskSpaceInOriginalFormat
     );
@@ -508,7 +551,7 @@ class DaedalusDiagnostics extends Component<Props, State> {
     const { isNodeRestarting } = this.state;
     const isNTPServiceReachable = localTimeDifference != null;
     const connectionError = get(nodeConnectionError, 'values', '{}');
-    const { message, code } = connectionError;
+    const { message, code } = connectionError as ErrorType;
     const unknownDiskSpaceSupportUrl = intl.formatMessage(
       messages.unknownDiskSpaceSupportUrl
     );
@@ -555,6 +598,37 @@ class DaedalusDiagnostics extends Component<Props, State> {
                   />
                 )
               )}
+              {getRow(
+                'hasMetHardwareRequirementsLabel',
+                <PopOver
+                  content={intl.formatMessage(
+                    hasMetHardwareRequirements
+                      ? messages.hasMetHardwareRequirementsStatusGoodTooltip
+                      : messages.hasMetHardwareRequirementsStatusLowTooltip
+                  )}
+                >
+                  <div
+                    className={classNames(
+                      styles.layoutData,
+                      hasMetHardwareRequirements ? styles.green : styles.red
+                    )}
+                  >
+                    {intl.formatMessage(
+                      hasMetHardwareRequirements
+                        ? messages.hasMetHardwareRequirementsStatusGoodValue
+                        : messages.hasMetHardwareRequirementsStatusLowValue
+                    )}
+                  </div>
+                </PopOver>
+              )}
+              {getRow(
+                'isRTSFlagsModeEnabled',
+                intl.formatMessage(
+                  isRTSFlagsModeEnabled
+                    ? messages.statusOnForUserSettings
+                    : messages.statusOffForUserSettings
+                )
+              )}
             </div>
             <div>
               {getSectionRow('coreInfo')}
@@ -565,8 +639,8 @@ class DaedalusDiagnostics extends Component<Props, State> {
               {getRow(
                 'blankScreenFix',
                 isBlankScreenFixActive
-                  ? intl.formatMessage(messages.statusOn)
-                  : intl.formatMessage(messages.statusOff)
+                  ? intl.formatMessage(messages.statusOnForUserSettings)
+                  : intl.formatMessage(messages.statusOffForUserSettings)
               )}
               {getRow(
                 'stateDirectoryPath',
diff --git a/source/renderer/app/components/voting/VotingFooterLinks.tsx b/source/renderer/app/components/voting/VotingFooterLinks.tsx
index 6a44498f77..60b76d2625 100644
--- a/source/renderer/app/components/voting/VotingFooterLinks.tsx
+++ b/source/renderer/app/components/voting/VotingFooterLinks.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape, injectIntl } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingFooterLinks.scss' or i... Remove this comment to see the full error message
 import styles from './VotingFooterLinks.scss';
 
 type FooterLink = {
diff --git a/source/renderer/app/components/voting/VotingNoWallets.tsx b/source/renderer/app/components/voting/VotingNoWallets.tsx
index 1ba1bbf948..bf08ff8b65 100644
--- a/source/renderer/app/components/voting/VotingNoWallets.tsx
+++ b/source/renderer/app/components/voting/VotingNoWallets.tsx
@@ -4,11 +4,8 @@ import SVGInline from 'react-svg-inline';
 import BigNumber from 'bignumber.js';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingNoWallets.scss' or its... Remove this comment to see the full error message
 import styles from './VotingNoWallets.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/attention-... Remove this comment to see the full error message
 import icon from '../../assets/images/attention-big-thin.inline.svg';
-import { NEXT_VOTING_FUND_NUMBER } from '../../config/votingConfig';
 
 const messages = defineMessages({
   headLine: {
@@ -33,6 +30,7 @@ const messages = defineMessages({
 type Props = {
   onGoToCreateWalletClick: (...args: Array<any>) => any;
   minVotingFunds: number;
+  nextFundNumber: number;
 };
 export default class VotingNoWallets extends Component<Props> {
   static contextTypes = {
@@ -41,13 +39,14 @@ export default class VotingNoWallets extends Component<Props> {
 
   render() {
     const { intl } = this.context;
-    const { onGoToCreateWalletClick, minVotingFunds } = this.props;
+    const { onGoToCreateWalletClick, minVotingFunds, nextFundNumber } =
+      this.props;
     return (
       <div className={styles.component}>
         <SVGInline svg={icon} className={styles.icon} />
         <h1>
           {intl.formatMessage(messages.headLine, {
-            nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+            nextVotingFundNumber: nextFundNumber,
           })}
         </h1>
         <p>
diff --git a/source/renderer/app/components/voting/VotingRegistrationDialogWizard.tsx b/source/renderer/app/components/voting/VotingRegistrationDialogWizard.tsx
index 66b11a6838..04242acf42 100644
--- a/source/renderer/app/components/voting/VotingRegistrationDialogWizard.tsx
+++ b/source/renderer/app/components/voting/VotingRegistrationDialogWizard.tsx
@@ -42,6 +42,7 @@ type Props = {
   onRestart: (...args: Array<any>) => any;
   onExternalLinkClick: (...args: Array<any>) => any;
   hwDeviceStatus: HwDeviceStatus;
+  nextFundNumber: number;
 };
 
 @observer
@@ -75,6 +76,7 @@ class VotingRegistrationDialogWizard extends Component<Props> {
       hwDeviceStatus,
       isTrezor,
       isHardwareWallet,
+      nextFundNumber,
     } = this.props;
     const selectedWalletId = get(selectedWallet, 'id', null);
     let content = null;
@@ -93,6 +95,7 @@ class VotingRegistrationDialogWizard extends Component<Props> {
             onSelectWallet={onSelectWallet}
             isWalletAcceptable={isWalletAcceptable}
             getStakePoolById={getStakePoolById}
+            nextFundNumber={nextFundNumber}
           />
         );
         break;
@@ -114,6 +117,7 @@ class VotingRegistrationDialogWizard extends Component<Props> {
             selectedWallet={selectedWallet}
             isTrezor={isTrezor}
             isHardwareWallet={isHardwareWallet}
+            nextFundNumber={nextFundNumber}
           />
         );
         break;
@@ -130,6 +134,7 @@ class VotingRegistrationDialogWizard extends Component<Props> {
             transactionError={transactionError}
             onConfirm={onContinue}
             onRestart={onRestart}
+            nextFundNumber={nextFundNumber}
           />
         );
         break;
@@ -141,6 +146,7 @@ class VotingRegistrationDialogWizard extends Component<Props> {
             onClose={onClose}
             stepsList={stepsList}
             activeStep={activeStep}
+            nextFundNumber={nextFundNumber}
           />
         );
         break;
@@ -153,6 +159,7 @@ class VotingRegistrationDialogWizard extends Component<Props> {
             onDownloadPDF={onDownloadPDF}
             stepsList={stepsList}
             activeStep={activeStep}
+            nextFundNumber={nextFundNumber}
           />
         );
         break;
diff --git a/source/renderer/app/components/voting/VotingUnavailable.tsx b/source/renderer/app/components/voting/VotingUnavailable.tsx
index e615fa4a30..d2e4d72ab4 100644
--- a/source/renderer/app/components/voting/VotingUnavailable.tsx
+++ b/source/renderer/app/components/voting/VotingUnavailable.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { FormattedHTMLMessage } from 'react-intl';
 import globalMessages from '../../i18n/global-messages';
 import LoadingSpinner from '../widgets/LoadingSpinner';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingUnavailable.scss' or i... Remove this comment to see the full error message
 import styles from './VotingUnavailable.scss';
 import { formattedNumber } from '../../utils/formatters';
 
@@ -11,18 +10,20 @@ type Props = {
   syncPercentage: number;
 };
 
-const VotingUnavailable = ({ syncPercentage }: Props) => (
-  <div className={styles.component}>
-    <LoadingSpinner big />
-    <div className={styles.description}>
-      <FormattedHTMLMessage
-        {...globalMessages.featureUnavailableWhileSyncing}
-        values={{
-          syncPercentage: formattedNumber(syncPercentage, 2),
-        }}
-      />
+const VotingUnavailable = ({ syncPercentage }: Props) => {
+  return (
+    <div className={styles.component}>
+      <LoadingSpinner big />
+      <div className={styles.description}>
+        <FormattedHTMLMessage
+          {...globalMessages.featureUnavailableWhileSyncing}
+          values={{
+            syncPercentage: formattedNumber(syncPercentage, 2),
+          }}
+        />
+      </div>
     </div>
-  </div>
-);
+  );
+};
 
 export default observer(VotingUnavailable);
diff --git a/source/renderer/app/components/voting/voting-info/ApiError.messages.ts b/source/renderer/app/components/voting/voting-info/ApiError.messages.ts
new file mode 100644
index 0000000000..ed16d80eda
--- /dev/null
+++ b/source/renderer/app/components/voting/voting-info/ApiError.messages.ts
@@ -0,0 +1,20 @@
+import { defineMessages } from 'react-intl';
+
+export const messages = defineMessages({
+  title: {
+    id: 'voting.apiError.title',
+    defaultMessage: '!!!Catalyst API unavailable',
+    description: 'Title',
+  },
+  description1: {
+    id: 'voting.apiError.description1',
+    defaultMessage:
+      '!!!Unable to communicate with the API that retrieves the Catalyst date information.',
+    description: 'Description 1',
+  },
+  description2: {
+    id: 'voting.apiError.description2',
+    defaultMessage: '!!!Please, try again later.',
+    description: 'Description 2',
+  },
+});
diff --git a/source/renderer/app/components/voting/voting-info/ApiError.scss b/source/renderer/app/components/voting/voting-info/ApiError.scss
new file mode 100644
index 0000000000..5d1a99280b
--- /dev/null
+++ b/source/renderer/app/components/voting/voting-info/ApiError.scss
@@ -0,0 +1,24 @@
+@import '../votingConfig';
+
+.root {
+  @extend %regularText;
+  align-items: start;
+  background-color: var(--theme-button-flat-background-color);
+  border-radius: 5px;
+  color: var(--theme-button-flat-text-color);
+  display: flex;
+  flex-direction: column;
+  padding: 20px;
+  width: 100%;
+
+  .title {
+    font-family: var(--font-semibold);
+    font-size: 18px;
+    line-height: 1.33;
+    margin-bottom: 11px;
+  }
+
+  .description2 {
+    font-family: var(--font-medium);
+  }
+}
diff --git a/source/renderer/app/components/voting/voting-info/ApiError.tsx b/source/renderer/app/components/voting/voting-info/ApiError.tsx
new file mode 100644
index 0000000000..6999e10c84
--- /dev/null
+++ b/source/renderer/app/components/voting/voting-info/ApiError.tsx
@@ -0,0 +1,23 @@
+import React from 'react';
+import { injectIntl } from 'react-intl';
+import type { Intl } from '../../../types/i18nTypes';
+import styles from './ApiError.scss';
+import { messages } from './ApiError.messages';
+
+type Props = {
+  intl: Intl;
+};
+
+function ApiError({ intl }: Props) {
+  return (
+    <section className={styles.root}>
+      <h1 className={styles.title}>{intl.formatMessage(messages.title)}</h1>
+      <span>{intl.formatMessage(messages.description1)}</span>
+      <span className={styles.description2}>
+        {intl.formatMessage(messages.description2)}
+      </span>
+    </section>
+  );
+}
+
+export default injectIntl(ApiError);
diff --git a/source/renderer/app/components/voting/voting-info/AppStore.tsx b/source/renderer/app/components/voting/voting-info/AppStore.tsx
index 9a88c17128..3dfbb8f704 100644
--- a/source/renderer/app/components/voting/voting-info/AppStore.tsx
+++ b/source/renderer/app/components/voting/voting-info/AppStore.tsx
@@ -7,7 +7,6 @@ import downloadAppStoreIcon from '../../../assets/images/voting/download-app-sto
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/voting/... Remove this comment to see the full error message
 import downloadPlayStoreIcon from '../../../assets/images/voting/download-play-store-icon-ic.inline.svg';
 import type { Intl } from '../../../types/i18nTypes';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AppStore.scss' or its corres... Remove this comment to see the full error message
 import styles from './AppStore.scss';
 import { messages } from './AppStore.messages';
 
diff --git a/source/renderer/app/components/voting/voting-info/CurrentPhase.scss b/source/renderer/app/components/voting/voting-info/CurrentPhase.scss
index 1d90208480..ba427e1344 100644
--- a/source/renderer/app/components/voting/voting-info/CurrentPhase.scss
+++ b/source/renderer/app/components/voting/voting-info/CurrentPhase.scss
@@ -12,7 +12,7 @@
 
   .fundName {
     color: var(--theme-button-flat-text-color);
-    font-family: var(--font-bold);
+    font-family: var(--font-semibold);
     font-size: 18px;
     line-height: 1.33;
     margin-bottom: 11px;
diff --git a/source/renderer/app/components/voting/voting-info/Headline.scss b/source/renderer/app/components/voting/voting-info/Headline.scss
index 7e80851187..b7e1c742d1 100644
--- a/source/renderer/app/components/voting/voting-info/Headline.scss
+++ b/source/renderer/app/components/voting/voting-info/Headline.scss
@@ -4,7 +4,8 @@
   .heading {
     @extend %accentText;
     font-family: var(--font-semibold);
-    font-size: 19px;
+    font-size: 18px;
+    letter-spacing: 2px;
     margin-bottom: 14px;
     text-align: center;
     text-transform: uppercase;
diff --git a/source/renderer/app/components/voting/voting-info/Headline.tsx b/source/renderer/app/components/voting/voting-info/Headline.tsx
index a670b353c9..904df4c6d5 100644
--- a/source/renderer/app/components/voting/voting-info/Headline.tsx
+++ b/source/renderer/app/components/voting/voting-info/Headline.tsx
@@ -4,7 +4,6 @@ import { injectIntl } from 'react-intl';
 import { ExternalLinkButton } from '../../widgets/ExternalLinkButton';
 import { VOTING_REWARD } from '../../../config/votingConfig';
 import type { Intl } from '../../../types/i18nTypes';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Headline.scss' or its corres... Remove this comment to see the full error message
 import styles from './Headline.scss';
 import { messages } from './Headline.messages';
 
diff --git a/source/renderer/app/components/voting/voting-info/RegisterToVote.scss b/source/renderer/app/components/voting/voting-info/RegisterToVote.scss
index dbdd57b02f..6b2f5dba14 100644
--- a/source/renderer/app/components/voting/voting-info/RegisterToVote.scss
+++ b/source/renderer/app/components/voting/voting-info/RegisterToVote.scss
@@ -7,7 +7,7 @@
   padding: 20px;
 
   .title {
-    font-family: var(--font-bold);
+    font-family: var(--font-semibold);
     font-size: 18px;
     line-height: 1.33;
   }
diff --git a/source/renderer/app/components/voting/voting-info/RegisterToVote.tsx b/source/renderer/app/components/voting/voting-info/RegisterToVote.tsx
index d56267a43d..1c55f62f5c 100644
--- a/source/renderer/app/components/voting/voting-info/RegisterToVote.tsx
+++ b/source/renderer/app/components/voting/voting-info/RegisterToVote.tsx
@@ -2,10 +2,6 @@ import React, { useState } from 'react';
 import { injectIntl } from 'react-intl';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
-import {
-  VOTING_NEW_SNAPSHOT_DATE,
-  NEXT_VOTING_FUND_NUMBER,
-} from '../../../config/votingConfig';
 import {
   formattedDateTime,
   mapToLongDateTimeFormat,
@@ -14,15 +10,15 @@ import type { Locale } from '../../../../../common/types/locales.types';
 import type { Intl } from '../../../types/i18nTypes';
 import { messages } from './RegisterToVote.messages';
 import { messages as votingMessages } from './VotingInfo.messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RegisterToVote.scss' or its ... Remove this comment to see the full error message
 import styles from './RegisterToVote.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingInfo.scss' or its corr... Remove this comment to see the full error message
 import votingStyles from './VotingInfo.scss';
+import type { CatalystFund } from '../../../api/voting/types';
 
 type Props = {
   currentLocale: Locale;
   currentDateFormat: string;
   currentTimeFormat: string;
+  fundInfo: CatalystFund;
   intl: Intl;
   onRegisterToVoteClick: (...args: Array<any>) => any;
 };
@@ -31,38 +27,41 @@ function RegisterToVote({
   currentLocale,
   currentDateFormat,
   currentTimeFormat,
+  fundInfo,
   intl,
   onRegisterToVoteClick,
 }: Props) {
   const [step1, setStep1] = useState(false);
   const [step2, setStep2] = useState(false);
   const canRegister = step1 && step2;
-  const castEndDate = formattedDateTime(VOTING_NEW_SNAPSHOT_DATE, {
-    currentLocale,
-    ...mapToLongDateTimeFormat({
+  const snapshotDate = formattedDateTime(
+    fundInfo.next.registrationSnapshotTime,
+    {
       currentLocale,
-      currentDateFormat,
-      currentTimeFormat,
-    }),
-  });
+      ...mapToLongDateTimeFormat({
+        currentLocale,
+        currentDateFormat,
+        currentTimeFormat,
+      }),
+    }
+  );
   return (
     <div className={styles.root}>
       <span className={styles.title}>
         {intl.formatMessage(votingMessages.fundName, {
-          votingFundNumber: NEXT_VOTING_FUND_NUMBER,
+          votingFundNumber: fundInfo.next.number,
         })}
       </span>
       <span className={styles.dateLabel}>
         {intl.formatMessage(messages.dateLabel)}
       </span>
-      <span className={styles.date}>{castEndDate}</span>
+      <span className={styles.date}>{snapshotDate}</span>
       <hr className={votingStyles.separator} />
       <span className={styles.stepsTitle}>
         {intl.formatMessage(messages.stepsTitle)}
       </span>
       <div className={styles.step}>
         <Checkbox
-          className={styles.checkbox}
           checked={step1}
           onChange={setStep1}
           label={intl.formatMessage(messages.step1CheckBoxLabel)}
@@ -70,7 +69,6 @@ function RegisterToVote({
       </div>
       <div className={styles.step}>
         <Checkbox
-          className={styles.checkbox}
           checked={step2}
           label={intl.formatMessage(messages.step2CheckBoxLabel)}
           onChange={setStep2}
diff --git a/source/renderer/app/components/voting/voting-info/ResultsPhase.tsx b/source/renderer/app/components/voting/voting-info/ResultsPhase.tsx
index 3969ff9999..c25bc4339f 100644
--- a/source/renderer/app/components/voting/voting-info/ResultsPhase.tsx
+++ b/source/renderer/app/components/voting/voting-info/ResultsPhase.tsx
@@ -1,34 +1,21 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import { injectIntl } from 'react-intl';
-import {
-  VOTING_CAST_END_DATE,
-  CURRENT_VOTING_FUND_NUMBER,
-} from '../../../config/votingConfig';
 import {
   formattedDateTime,
   mapToLongDateTimeFormat,
 } from '../../../utils/formatters';
-import type { Locale } from '../../../../../common/types/locales.types';
 import { ExternalLinkButton } from '../../widgets/ExternalLinkButton';
-import type { Intl } from '../../../types/i18nTypes';
 import { messages } from './ResultsPhase.messages';
 import { messages as votingMessages } from './VotingInfo.messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CurrentPhase.scss' or its co... Remove this comment to see the full error message
 import styles from './CurrentPhase.scss';
-
-type Props = {
-  currentLocale: Locale;
-  currentDateFormat: string;
-  currentTimeFormat: string;
-  onExternalLinkClick: (...args: Array<any>) => any;
-  intl: Intl;
-};
+import type { PhaseIntlProps as Props } from './types';
 
 function ResultsPhase({
   currentLocale,
   currentDateFormat,
   currentTimeFormat,
+  fundInfo,
   onExternalLinkClick,
   intl,
 }: Props) {
@@ -37,7 +24,7 @@ function ResultsPhase({
     currentDateFormat,
     currentTimeFormat,
   });
-  const endDate = formattedDateTime(VOTING_CAST_END_DATE, {
+  const endDate = formattedDateTime(fundInfo.current.endTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
     currentTimeFormat: mappedFormats.currentTimeFormat,
@@ -46,7 +33,7 @@ function ResultsPhase({
     <section className={styles.root}>
       <h1 className={styles.fundName}>
         {intl.formatMessage(votingMessages.fundName, {
-          votingFundNumber: CURRENT_VOTING_FUND_NUMBER,
+          votingFundNumber: fundInfo.current.number,
         })}
       </h1>
 
diff --git a/source/renderer/app/components/voting/voting-info/SnapshotPhase.tsx b/source/renderer/app/components/voting/voting-info/SnapshotPhase.tsx
index ecb5c87a91..3d73d1b86c 100644
--- a/source/renderer/app/components/voting/voting-info/SnapshotPhase.tsx
+++ b/source/renderer/app/components/voting/voting-info/SnapshotPhase.tsx
@@ -1,34 +1,20 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import { injectIntl } from 'react-intl';
-import {
-  CURRENT_VOTING_FUND_NUMBER,
-  VOTING_SNAPSHOT_DATE,
-  VOTING_CAST_START_DATE,
-  VOTING_CAST_END_DATE,
-} from '../../../config/votingConfig';
 import {
   formattedDateTime,
   mapToLongDateTimeFormat,
 } from '../../../utils/formatters';
-import type { Locale } from '../../../../../common/types/locales.types';
-import type { Intl } from '../../../types/i18nTypes';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CurrentPhase.scss' or its co... Remove this comment to see the full error message
 import styles from './CurrentPhase.scss';
 import { messages } from './SnapshotPhase.messages';
 import { messages as votingMessages } from './VotingInfo.messages';
-
-type Props = {
-  currentLocale: Locale;
-  currentDateFormat: string;
-  currentTimeFormat: string;
-  intl: Intl;
-};
+import type { PhaseIntlProps as Props } from './types';
 
 function SnapshotPhase({
   currentLocale,
   currentDateFormat,
   currentTimeFormat,
+  fundInfo,
   intl,
 }: Props) {
   const mappedFormats = mapToLongDateTimeFormat({
@@ -36,16 +22,19 @@ function SnapshotPhase({
     currentDateFormat,
     currentTimeFormat,
   });
-  const snapshotDate = formattedDateTime(VOTING_SNAPSHOT_DATE, {
-    currentLocale,
-    currentDateFormat: mappedFormats.currentDateFormat,
-    currentTimeFormat: mappedFormats.currentTimeFormat,
-  });
-  const startDate = formattedDateTime(VOTING_CAST_START_DATE, {
+  const snapshotDate = formattedDateTime(
+    fundInfo.current.registrationSnapshotTime,
+    {
+      currentLocale,
+      currentDateFormat: mappedFormats.currentDateFormat,
+      currentTimeFormat: mappedFormats.currentTimeFormat,
+    }
+  );
+  const startDate = formattedDateTime(fundInfo.current.startTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
   });
-  const endDate = formattedDateTime(VOTING_CAST_END_DATE, {
+  const endDate = formattedDateTime(fundInfo.current.endTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
   });
@@ -53,7 +42,7 @@ function SnapshotPhase({
     <section className={styles.root}>
       <h1 className={styles.fundName}>
         {intl.formatMessage(votingMessages.fundName, {
-          votingFundNumber: CURRENT_VOTING_FUND_NUMBER,
+          votingFundNumber: fundInfo.current.number,
         })}
       </h1>
       <div className={styles.block}>
diff --git a/source/renderer/app/components/voting/voting-info/TallyingPhase.tsx b/source/renderer/app/components/voting/voting-info/TallyingPhase.tsx
index 19d4b4bc51..532b11ebcf 100644
--- a/source/renderer/app/components/voting/voting-info/TallyingPhase.tsx
+++ b/source/renderer/app/components/voting/voting-info/TallyingPhase.tsx
@@ -1,33 +1,20 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import { injectIntl } from 'react-intl';
-import {
-  CURRENT_VOTING_FUND_NUMBER,
-  VOTING_RESULTS_DATE,
-  VOTING_CAST_END_DATE,
-} from '../../../config/votingConfig';
 import {
   formattedDateTime,
   mapToLongDateTimeFormat,
 } from '../../../utils/formatters';
-import type { Locale } from '../../../../../common/types/locales.types';
-import type { Intl } from '../../../types/i18nTypes';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CurrentPhase.scss' or its co... Remove this comment to see the full error message
 import styles from './CurrentPhase.scss';
 import { messages } from './TallyingPhase.messages';
 import { messages as votingMessages } from './VotingInfo.messages';
-
-type Props = {
-  currentLocale: Locale;
-  currentDateFormat: string;
-  currentTimeFormat: string;
-  intl: Intl;
-};
+import type { PhaseIntlProps as Props } from './types';
 
 function TallyingPhase({
   currentLocale,
   currentDateFormat,
   currentTimeFormat,
+  fundInfo,
   intl,
 }: Props) {
   const mappedFormats = mapToLongDateTimeFormat({
@@ -35,11 +22,11 @@ function TallyingPhase({
     currentDateFormat,
     currentTimeFormat,
   });
-  const endDated = formattedDateTime(VOTING_CAST_END_DATE, {
+  const endDated = formattedDateTime(fundInfo.current.endTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
   });
-  const resultsDate = formattedDateTime(VOTING_RESULTS_DATE, {
+  const resultsDate = formattedDateTime(fundInfo.current.resultsTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
   });
@@ -47,7 +34,7 @@ function TallyingPhase({
     <section className={styles.root}>
       <h1 className={styles.fundName}>
         {intl.formatMessage(votingMessages.fundName, {
-          votingFundNumber: CURRENT_VOTING_FUND_NUMBER,
+          votingFundNumber: fundInfo.current.number,
         })}
       </h1>
       <div className={styles.block}>
diff --git a/source/renderer/app/components/voting/voting-info/VotingInfo.tsx b/source/renderer/app/components/voting/voting-info/VotingInfo.tsx
index 9586d9516f..525099eae2 100644
--- a/source/renderer/app/components/voting/voting-info/VotingInfo.tsx
+++ b/source/renderer/app/components/voting/voting-info/VotingInfo.tsx
@@ -1,8 +1,6 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import BorderedBox from '../../widgets/BorderedBox';
-import type { Locale } from '../../../../../common/types/locales.types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingInfo.scss' or its corr... Remove this comment to see the full error message
 import styles from './VotingInfo.scss';
 import ResultsPhase from './ResultsPhase';
 import SnapshotPhase from './SnapshotPhase';
@@ -11,22 +9,15 @@ import TallyingPhase from './TallyingPhase';
 import Headline from './Headline';
 import AppStore from './AppStore';
 import RegisterToVote from './RegisterToVote';
-import { FundPhases } from '../../../stores/VotingStore';
-import type { FundPhase } from '../../../stores/VotingStore';
+import ApiError from './ApiError';
+import { FundPhase } from '../../../stores/VotingStore';
+import { VotingProps as Props, PhaseProps } from './types';
 
-type Props = {
-  currentLocale: Locale;
-  currentDateFormat: string;
-  currentTimeFormat: string;
-  fundPhase: FundPhase;
-  onRegisterToVoteClick: (...args: Array<any>) => any;
-  onExternalLinkClick: (...args: Array<any>) => any;
-};
-const phaseToComponentMap = {
-  [FundPhases.SNAPSHOT]: SnapshotPhase,
-  [FundPhases.VOTING]: VotingPhase,
-  [FundPhases.TALLYING]: TallyingPhase,
-  [FundPhases.RESULTS]: ResultsPhase,
+const phaseToComponentMap: { [key in FundPhase]: React.FC<PhaseProps> } = {
+  [FundPhase.SNAPSHOT]: SnapshotPhase,
+  [FundPhase.VOTING]: VotingPhase,
+  [FundPhase.TALLYING]: TallyingPhase,
+  [FundPhase.RESULTS]: ResultsPhase,
 };
 
 const VotingInfo = ({
@@ -34,38 +25,46 @@ const VotingInfo = ({
   currentDateFormat,
   currentTimeFormat,
   fundPhase,
+  fundInfo,
   onRegisterToVoteClick,
   onExternalLinkClick,
 }: Props) => {
-  const PhaseComponent = phaseToComponentMap[fundPhase || FundPhases.SNAPSHOT];
+  const PhaseComponent = phaseToComponentMap[fundPhase];
   return (
     <div className={styles.component}>
       <BorderedBox>
         <Headline onExternalLinkClick={onExternalLinkClick} />
         <hr className={styles.separator} />
         <div className={styles.bottomContent}>
-          <div className={styles.leftContent}>
-            <PhaseComponent
-              currentLocale={currentLocale}
-              currentDateFormat={currentDateFormat}
-              currentTimeFormat={currentTimeFormat}
-              onExternalLinkClick={onExternalLinkClick}
-            />
-            <div className={styles.appStoreSpacing}>
-              <AppStore
-                onAppleStoreLinkClick={onExternalLinkClick}
-                onAndroidStoreLinkClick={onExternalLinkClick}
-              />
-            </div>
-          </div>
-          <div className={styles.rightContent}>
-            <RegisterToVote
-              currentLocale={currentLocale}
-              currentDateFormat={currentDateFormat}
-              currentTimeFormat={currentTimeFormat}
-              onRegisterToVoteClick={onRegisterToVoteClick}
-            />
-          </div>
+          {fundPhase === null && <ApiError />}
+          {fundPhase && (
+            <>
+              <div className={styles.leftContent}>
+                <PhaseComponent
+                  fundInfo={fundInfo}
+                  currentLocale={currentLocale}
+                  currentDateFormat={currentDateFormat}
+                  currentTimeFormat={currentTimeFormat}
+                  onExternalLinkClick={onExternalLinkClick}
+                />
+                <div className={styles.appStoreSpacing}>
+                  <AppStore
+                    onAppleStoreLinkClick={onExternalLinkClick}
+                    onAndroidStoreLinkClick={onExternalLinkClick}
+                  />
+                </div>
+              </div>
+              <div className={styles.rightContent}>
+                <RegisterToVote
+                  fundInfo={fundInfo}
+                  currentLocale={currentLocale}
+                  currentDateFormat={currentDateFormat}
+                  currentTimeFormat={currentTimeFormat}
+                  onRegisterToVoteClick={onRegisterToVoteClick}
+                />
+              </div>
+            </>
+          )}
         </div>
       </BorderedBox>
     </div>
diff --git a/source/renderer/app/components/voting/voting-info/VotingPhase.tsx b/source/renderer/app/components/voting/voting-info/VotingPhase.tsx
index f5eb9d964b..5135cb65ef 100644
--- a/source/renderer/app/components/voting/voting-info/VotingPhase.tsx
+++ b/source/renderer/app/components/voting/voting-info/VotingPhase.tsx
@@ -1,35 +1,21 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import { injectIntl } from 'react-intl';
-import {
-  CURRENT_VOTING_FUND_NUMBER,
-  VOTING_CAST_START_DATE,
-  VOTING_CAST_END_DATE,
-} from '../../../config/votingConfig';
 import {
   formattedDateTime,
   mapToLongDateTimeFormat,
 } from '../../../utils/formatters';
-import type { Locale } from '../../../../../common/types/locales.types';
-import type { Intl } from '../../../types/i18nTypes';
 import { messages } from './VotingPhase.messages';
 import { messages as votingMessages } from './VotingInfo.messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CurrentPhase.scss' or its co... Remove this comment to see the full error message
 import styles from './CurrentPhase.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingInfo.scss' or its corr... Remove this comment to see the full error message
 import votingStyles from './VotingInfo.scss';
-
-type Props = {
-  currentLocale: Locale;
-  currentDateFormat: string;
-  currentTimeFormat: string;
-  intl: Intl;
-};
+import type { PhaseIntlProps as Props } from './types';
 
 function VotingPhase({
   currentLocale,
   currentDateFormat,
   currentTimeFormat,
+  fundInfo,
   intl,
 }: Props) {
   const mappedFormats = mapToLongDateTimeFormat({
@@ -37,11 +23,11 @@ function VotingPhase({
     currentDateFormat,
     currentTimeFormat,
   });
-  const startDate = formattedDateTime(VOTING_CAST_START_DATE, {
+  const startDate = formattedDateTime(fundInfo.current.startTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
   });
-  const endDate = formattedDateTime(VOTING_CAST_END_DATE, {
+  const endDate = formattedDateTime(fundInfo.current.endTime, {
     currentLocale,
     currentDateFormat: mappedFormats.currentDateFormat,
   });
@@ -49,7 +35,7 @@ function VotingPhase({
     <section className={styles.root}>
       <h1 className={styles.fundName}>
         {intl.formatMessage(votingMessages.fundName, {
-          votingFundNumber: CURRENT_VOTING_FUND_NUMBER,
+          votingFundNumber: fundInfo.current.number,
         })}
       </h1>
       <div className={styles.block}>
diff --git a/source/renderer/app/components/voting/voting-info/types.ts b/source/renderer/app/components/voting/voting-info/types.ts
new file mode 100644
index 0000000000..3e5e8d6fd0
--- /dev/null
+++ b/source/renderer/app/components/voting/voting-info/types.ts
@@ -0,0 +1,21 @@
+import { FundPhase } from '../../../stores/VotingStore';
+import type { Intl } from '../../../types/i18nTypes';
+import type { CatalystFund } from '../../../api/voting/types';
+import type { Locale } from '../../../../../common/types/locales.types';
+
+export type VotingProps = {
+  currentLocale: Locale;
+  currentDateFormat: string;
+  currentTimeFormat: string;
+  fundPhase: FundPhase;
+  fundInfo: CatalystFund;
+  onRegisterToVoteClick: (...args: Array<any>) => any;
+  onExternalLinkClick: (...args: Array<any>) => any;
+};
+
+export type PhaseProps = {} & Omit<
+  VotingProps,
+  'fundPhase' | 'onRegisterToVoteClick'
+>;
+
+export type PhaseIntlProps = { intl: Intl } & PhaseProps;
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx
index 234cd68dad..a184f4b30b 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx
@@ -4,7 +4,6 @@ import BigNumber from 'bignumber.js';
 import classNames from 'classnames';
 import WalletsDropdown from '../../widgets/forms/WalletsDropdown';
 import Wallet from '../../../domains/Wallet';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingRegistrationStepsChoos... Remove this comment to see the full error message
 import styles from './VotingRegistrationStepsChooseWallet.scss';
 import VotingRegistrationDialog from './widgets/VotingRegistrationDialog';
 
@@ -73,6 +72,7 @@ type Props = {
   selectedWalletId: string | null | undefined;
   isWalletAcceptable: (...args: Array<any>) => any;
   getStakePoolById: (...args: Array<any>) => any;
+  nextFundNumber: number;
 };
 type State = {
   selectedWalletId: string | null | undefined;
@@ -109,6 +109,7 @@ export default class VotingRegistrationStepsChooseWallet extends Component<
       isWalletAcceptable,
       numberOfStakePools,
       getStakePoolById,
+      nextFundNumber,
     } = this.props;
     const buttonLabel = intl.formatMessage(messages.continueButtonLabel);
     const selectedWallet: Wallet | null | undefined = wallets.find(
@@ -165,6 +166,7 @@ export default class VotingRegistrationStepsChooseWallet extends Component<
         activeStep={activeStep}
         actions={actions}
         containerClassName={styles.component}
+        nextFundNumber={nextFundNumber}
       >
         <p className={styles.description}>
           <FormattedHTMLMessage {...messages.description} />
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsConfirm.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsConfirm.tsx
index 4bf86ac35b..4c1bb5a5fc 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsConfirm.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsConfirm.tsx
@@ -80,6 +80,7 @@ type Props = {
     | (LocalizableError | null | undefined);
   onConfirm: (...args: Array<any>) => any;
   onRestart: (...args: Array<any>) => any;
+  nextFundNumber: number;
 };
 
 @observer
@@ -100,6 +101,7 @@ class VotingRegistrationStepsConfirm extends Component<Props> {
       transactionConfirmations,
       transactionError,
       onClose,
+      nextFundNumber,
     } = this.props;
     const description = intl.formatMessage(messages.description);
     const descriptionRestart = (
@@ -154,6 +156,7 @@ class VotingRegistrationStepsConfirm extends Component<Props> {
         actions={actions}
         containerClassName={styles.component}
         hideSteps={!!transactionError}
+        nextFundNumber={nextFundNumber}
       >
         {transactionError ? (
           <Fragment>
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx
index 72935565b7..793cadffd3 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx
@@ -9,11 +9,7 @@ import {
   isValidRepeatPinCode,
 } from '../../../utils/validations';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
-import {
-  VOTING_REGISTRATION_PIN_CODE_LENGTH,
-  NEXT_VOTING_FUND_NUMBER,
-} from '../../../config/votingConfig';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingRegistrationStepsEnter... Remove this comment to see the full error message
+import { VOTING_REGISTRATION_PIN_CODE_LENGTH } from '../../../config/votingConfig';
 import styles from './VotingRegistrationStepsEnterPinCode.scss';
 import VotingRegistrationDialog from './widgets/VotingRegistrationDialog';
 
@@ -65,15 +61,20 @@ type Props = {
   stepsList: Array<string>;
   activeStep: number;
   onSetPinCode: (...args: Array<any>) => any;
+  nextFundNumber: number;
 };
 
+interface FormFields {
+  pinCode: string[];
+  repeatPinCode: string[];
+}
+
 @observer
 class VotingRegistrationStepsEnterPinCode extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         pinCode: {
@@ -124,7 +125,6 @@ class VotingRegistrationStepsEnterPinCode extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { pinCode } = form.values();
@@ -136,13 +136,11 @@ class VotingRegistrationStepsEnterPinCode extends Component<Props> {
   render() {
     const { form } = this;
     const { intl } = this.context;
-    const { onClose, stepsList, activeStep } = this.props;
+    const { onClose, stepsList, activeStep, nextFundNumber } = this.props;
     const buttonLabel = intl.formatMessage(messages.continueButtonLabel);
     const enterPinCodeLabel = intl.formatMessage(messages.enterPinCodeLabel);
     const repeatPinCodeLabel = intl.formatMessage(messages.repeatPinCodeLabel);
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const pinCodeField = form.$('pinCode');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const repeatPinCodeField = form.$('repeatPinCode');
     const pinCodeFieldProps = pinCodeField.bind();
     const repeatPinCodeFieldProps = repeatPinCodeField.bind();
@@ -150,7 +148,6 @@ class VotingRegistrationStepsEnterPinCode extends Component<Props> {
       {
         label: buttonLabel,
         onClick: this.submit,
-        // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
         disabled: !form.isValid,
         primary: true,
       },
@@ -164,12 +161,13 @@ class VotingRegistrationStepsEnterPinCode extends Component<Props> {
         activeStep={activeStep}
         actions={actions}
         containerClassName={styles.component}
+        nextFundNumber={nextFundNumber}
       >
         <p className={styles.description}>
           <FormattedHTMLMessage
             {...messages.description}
             values={{
-              nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+              nextVotingFundNumber: nextFundNumber,
             }}
           />
         </p>
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx
index ce48d1805d..d4bc826e47 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx
@@ -5,7 +5,6 @@ import { set } from 'lodash';
 import { observer } from 'mobx-react';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import VotingRegistrationDialog from './widgets/VotingRegistrationDialog';
-import { NEXT_VOTING_FUND_NUMBER } from '../../../config/votingConfig';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingRegistrationStepsQrCod... Remove this comment to see the full error message
 import styles from './VotingRegistrationStepsQrCode.scss';
 
@@ -68,6 +67,7 @@ type Props = {
   stepsList: Array<string>;
   activeStep: number;
   qrCode: string | null | undefined;
+  nextFundNumber: number;
 };
 type State = {
   isCheckbox1Accepted: boolean;
@@ -96,14 +96,15 @@ class VotingRegistrationStepsQrCode extends Component<Props, State> {
   render() {
     const { intl } = this.context;
     const { isCheckbox1Accepted, isCheckbox2Accepted } = this.state;
-    const { stepsList, activeStep, qrCode, onDownloadPDF } = this.props;
+    const { stepsList, activeStep, qrCode, onDownloadPDF, nextFundNumber } =
+      this.props;
     const qrCodeTitle = intl.formatMessage(messages.qrCodeTitle);
     const qrCodeDescription1 = intl.formatMessage(messages.qrCodeDescription1);
     const qrCodeDescription2 = intl.formatMessage(messages.qrCodeDescription2);
     const qrCodeWarning = <FormattedHTMLMessage {...messages.qrCodeWarning} />;
     const checkbox1Label = intl.formatMessage(messages.checkbox1Label);
     const checkbox2Label = intl.formatMessage(messages.checkbox2Label, {
-      nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+      nextVotingFundNumber: nextFundNumber,
     });
     const closeButtonLabel = intl.formatMessage(messages.closeButtonLabel);
     const saveAsPdfButtonLabel = intl.formatMessage(
@@ -142,6 +143,7 @@ class VotingRegistrationStepsQrCode extends Component<Props, State> {
         actions={actions}
         containerClassName={styles.component}
         hideCloseButton={!areBothCheckboxesAccepted}
+        nextFundNumber={nextFundNumber}
       >
         <div className={styles.qrCode}>
           {qrCode && (
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx
index dddb75284b..887721bc71 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx
@@ -16,12 +16,10 @@ import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import { formattedWalletAmount } from '../../../utils/formatters';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VotingRegistrationStepsRegis... Remove this comment to see the full error message
 import styles from './VotingRegistrationStepsRegister.scss';
 import VotingRegistrationDialog from './widgets/VotingRegistrationDialog';
 import Wallet, { HwDeviceStatuses } from '../../../domains/Wallet';
 import HardwareWalletStatus from '../../hardware-wallet/HardwareWalletStatus';
-import { NEXT_VOTING_FUND_NUMBER } from '../../../config/votingConfig';
 import type { HwDeviceStatus } from '../../../domains/Wallet';
 
 const messages = defineMessages({
@@ -78,6 +76,7 @@ type Props = {
   transactionError?: LocalizableError | null | undefined;
   hwDeviceStatus: HwDeviceStatus;
   selectedWallet: Wallet | null | undefined;
+  nextFundNumber: number;
   isTrezor: boolean;
   isHardwareWallet: boolean;
   isSubmitting: boolean;
@@ -87,13 +86,16 @@ type Props = {
   onExternalLinkClick: (...args: Array<any>) => any;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class VotingRegistrationStepsRegister extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -133,7 +135,6 @@ class VotingRegistrationStepsRegister extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'ReactToo... Remove this comment to see the full error message
     const { spendingPassword } = this.form.values();
     this.props.onConfirm(spendingPassword);
   };
@@ -156,8 +157,8 @@ class VotingRegistrationStepsRegister extends Component<Props> {
       selectedWallet,
       isTrezor,
       isHardwareWallet,
+      nextFundNumber,
     } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
     const buttonLabel = intl.formatMessage(messages.continueButtonLabel);
     const learnMoreLinkUrl = intl.formatMessage(messages.learntMoreLinkUrl);
@@ -185,12 +186,13 @@ class VotingRegistrationStepsRegister extends Component<Props> {
         actions={actions}
         onBack={onBack}
         containerClassName={styles.component}
+        nextFundNumber={nextFundNumber}
       >
         <p className={styles.description}>
           <FormattedHTMLMessage
             {...messages.description}
             values={{
-              nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+              nextVotingFundNumber: nextFundNumber,
             }}
           />
         </p>
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx
index f607bd00d7..b818c91e86 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import Dialog from '../../../widgets/Dialog';
-import { NEXT_VOTING_FUND_NUMBER } from '../../../../config/votingConfig';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ConfirmationDialog.scss' or ... Remove this comment to see the full error message
 import styles from './ConfirmationDialog.scss';
 
@@ -35,6 +34,7 @@ const messages = defineMessages({
   },
 });
 type Props = {
+  nextFundNumber: number;
   onConfirm: (...args: Array<any>) => any;
   onCancel: (...args: Array<any>) => any;
 };
@@ -47,12 +47,8 @@ class ConfirmationDialog extends Component<Props> {
 
   render() {
     const { intl } = this.context;
-    const { onConfirm, onCancel } = this.props;
+    const { nextFundNumber, onConfirm, onCancel } = this.props;
     const dialogClasses = classnames([styles.component, 'ConfirmDialog']);
-    const confirmButtonClasses = classnames([
-      'confirmButton', // 'attention',
-      styles.confirmButton,
-    ]);
     const actions = [
       {
         className: 'cancelButton',
@@ -60,7 +56,7 @@ class ConfirmationDialog extends Component<Props> {
         onClick: onCancel,
       },
       {
-        className: confirmButtonClasses,
+        className: 'confirmButton',
         label: intl.formatMessage(messages.confirmButtonLabel),
         primary: true,
         onClick: onConfirm,
@@ -70,7 +66,7 @@ class ConfirmationDialog extends Component<Props> {
       <Dialog
         className={dialogClasses}
         title={intl.formatMessage(messages.headline, {
-          nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+          nextVotingFundNumber: nextFundNumber,
         })}
         actions={actions}
         closeOnOverlayClick={false}
@@ -78,7 +74,7 @@ class ConfirmationDialog extends Component<Props> {
       >
         <p>
           {intl.formatMessage(messages.content, {
-            nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+            nextVotingFundNumber: nextFundNumber,
           })}
         </p>
       </Dialog>
diff --git a/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/VotingRegistrationDialog.tsx b/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/VotingRegistrationDialog.tsx
index cb41e79d2e..a193e99bfd 100644
--- a/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/VotingRegistrationDialog.tsx
+++ b/source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/VotingRegistrationDialog.tsx
@@ -12,7 +12,6 @@ import Dialog from '../../../widgets/Dialog';
 import DialogCloseButton from '../../../widgets/DialogCloseButton';
 import DialogBackButton from '../../../widgets/DialogBackButton';
 import type { DialogActions } from '../../../widgets/Dialog';
-import { NEXT_VOTING_FUND_NUMBER } from '../../../../config/votingConfig';
 
 const messages = defineMessages({
   dialogTitle: {
@@ -37,6 +36,7 @@ type Props = {
   contentClassName?: string | null | undefined;
   hideCloseButton?: boolean;
   hideSteps?: boolean;
+  nextFundNumber: number;
 };
 
 @observer
@@ -61,6 +61,7 @@ class VotingRegistrationDialog extends Component<Props> {
       contentClassName,
       hideCloseButton,
       hideSteps,
+      nextFundNumber,
     } = this.props;
     const containerStyles = classnames([styles.container, containerClassName]);
     const contentStyles = classnames([styles.content, contentClassName]);
@@ -77,7 +78,7 @@ class VotingRegistrationDialog extends Component<Props> {
       <Dialog
         className={styles.component}
         title={intl.formatMessage(messages.dialogTitle, {
-          nextVotingFundNumber: NEXT_VOTING_FUND_NUMBER,
+          nextVotingFundNumber: nextFundNumber,
         })}
         subtitle={!hideSteps && stepsIndicatorLabel}
         onClose={onClose}
diff --git a/source/renderer/app/components/wallet/WalletAdd.tsx b/source/renderer/app/components/wallet/WalletAdd.tsx
index 7aa5b56a26..7b4c1368ae 100644
--- a/source/renderer/app/components/wallet/WalletAdd.tsx
+++ b/source/renderer/app/components/wallet/WalletAdd.tsx
@@ -2,16 +2,11 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletAdd.scss' or its corre... Remove this comment to see the full error message
 import styles from './WalletAdd.scss';
 import BigButtonForDialogs from '../widgets/BigButtonForDialogs';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/create-ic.... Remove this comment to see the full error message
 import createIcon from '../../assets/images/create-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/import-ic.... Remove this comment to see the full error message
 import importIcon from '../../assets/images/import-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/connect-ic... Remove this comment to see the full error message
 import connectIcon from '../../assets/images/connect-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/restore-ic... Remove this comment to see the full error message
 import restoreIcon from '../../assets/images/restore-ic.inline.svg';
 import { MAX_ADA_WALLETS_COUNT } from '../../config/numbersConfig';
 import { isHardwareWalletSupportEnabled } from '../../config/hardwareWalletsConfig';
diff --git a/source/renderer/app/components/wallet/WalletConnectDialog.tsx b/source/renderer/app/components/wallet/WalletConnectDialog.tsx
index 37314a123f..be444e3eb6 100644
--- a/source/renderer/app/components/wallet/WalletConnectDialog.tsx
+++ b/source/renderer/app/components/wallet/WalletConnectDialog.tsx
@@ -12,18 +12,13 @@ import SVGInline from 'react-svg-inline';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import { get } from 'lodash';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/hardware-w... Remove this comment to see the full error message
 import ledgerIcon from '../../assets/images/hardware-wallet/ledger-cropped.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/hardware-w... Remove this comment to see the full error message
 import ledgerXIcon from '../../assets/images/hardware-wallet/ledger-x-cropped.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/hardware-w... Remove this comment to see the full error message
 import trezorIcon from '../../assets/images/hardware-wallet/trezor.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/hardware-w... Remove this comment to see the full error message
 import unknownDeviceIcon from '../../assets/images/hardware-wallet/trezor-ledger.inline.svg';
 import DialogCloseButton from '../widgets/DialogCloseButton';
 import LocalizableError from '../../i18n/LocalizableError';
 import Dialog from '../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletConnectDialog.scss' or... Remove this comment to see the full error message
 import styles from './WalletConnectDialog.scss';
 import LoadingSpinner from '../widgets/LoadingSpinner';
 import HardwareWalletStatus from '../hardware-wallet/HardwareWalletStatus';
diff --git a/source/renderer/app/components/wallet/WalletCreateDialog.tsx b/source/renderer/app/components/wallet/WalletCreateDialog.tsx
index 4d7534900f..f4253bb1dd 100644
--- a/source/renderer/app/components/wallet/WalletCreateDialog.tsx
+++ b/source/renderer/app/components/wallet/WalletCreateDialog.tsx
@@ -20,11 +20,9 @@ import {
 } from '../../utils/validations';
 import globalMessages from '../../i18n/global-messages';
 import { PasswordInput } from '../widgets/forms/PasswordInput';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateDialog.scss' or ... Remove this comment to see the full error message
 import styles from './WalletCreateDialog.scss';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../config/timingConfig';
 import { submitOnEnter } from '../../utils/form';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/info-icon.... Remove this comment to see the full error message
 import infoIconInline from '../../assets/images/info-icon.inline.svg';
 import LoadingSpinner from '../widgets/LoadingSpinner';
 
@@ -96,6 +94,12 @@ type State = {
   isSubmitting: boolean;
 };
 
+interface FormFields {
+  repeatPassword: string;
+  spendingPassword: string;
+  walletName: string;
+}
+
 @observer
 class WalletCreateDialog extends Component<Props, State> {
   static contextTypes = {
@@ -112,8 +116,7 @@ class WalletCreateDialog extends Component<Props, State> {
   }
 
   walletNameInput: Input;
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         walletName: {
@@ -188,7 +191,6 @@ class WalletCreateDialog extends Component<Props, State> {
     this.setState({
       isSubmitting: false,
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         this.setState({
@@ -223,13 +225,9 @@ class WalletCreateDialog extends Component<Props, State> {
       styles.spendingPasswordField,
       currentLocale === 'ja-JP' ? styles.jpLangTooltipIcon : '',
     ]);
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const walletNameField = form.$('walletName');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const repeatedPasswordField = form.$('repeatPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
     const canSubmit = !isSubmitting && form.isValid;
     const buttonLabel = !isSubmitting ? (
       this.context.intl.formatMessage(messages.createPersonalWallet)
diff --git a/source/renderer/app/components/wallet/WalletRestoreDialog.tsx b/source/renderer/app/components/wallet/WalletRestoreDialog.tsx
index c46bef931c..6c7e7a3ff5 100644
--- a/source/renderer/app/components/wallet/WalletRestoreDialog.tsx
+++ b/source/renderer/app/components/wallet/WalletRestoreDialog.tsx
@@ -25,7 +25,6 @@ import {
 import globalMessages from '../../i18n/global-messages';
 import LocalizableError from '../../i18n/LocalizableError';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../config/timingConfig';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRestoreDialog.scss' or... Remove this comment to see the full error message
 import styles from './WalletRestoreDialog.scss';
 import { submitOnEnter } from '../../utils/form';
 import {
@@ -37,7 +36,6 @@ import {
   WALLET_RECOVERY_PHRASE_WORD_COUNT,
   YOROI_WALLET_RECOVERY_PHRASE_WORD_COUNT,
 } from '../../config/cryptoConfig';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/info-icon.... Remove this comment to see the full error message
 import infoIconInline from '../../assets/images/info-icon.inline.svg';
 import LoadingSpinner from '../widgets/LoadingSpinner';
 
@@ -209,6 +207,13 @@ type State = {
   walletType: string;
 };
 
+interface FormFields {
+  repeatPassword: string;
+  spendingPassword: string;
+  recoveryPhrase: string;
+  walletName: string;
+}
+
 @observer
 class WalletRestoreDialog extends Component<Props, State> {
   static contextTypes = {
@@ -228,8 +233,7 @@ class WalletRestoreDialog extends Component<Props, State> {
     }
   }
 
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         walletName: {
@@ -327,7 +331,6 @@ class WalletRestoreDialog extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { onSubmit } = this.props;
@@ -350,17 +353,13 @@ class WalletRestoreDialog extends Component<Props, State> {
   resetForm = () => {
     const { form } = this;
     // Cancel all debounced field validations
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'each' does not exist on type 'ReactToolb... Remove this comment to see the full error message
     form.each((field) => {
       field.debouncedValidation.cancel();
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'reset' does not exist on type 'ReactTool... Remove this comment to see the full error message
     form.reset();
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'showErrors' does not exist on type 'Reac... Remove this comment to see the full error message
     form.showErrors(false);
   };
   resetMnemonics = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = this.form.$('recoveryPhrase');
     recoveryPhraseField.debouncedValidation.cancel();
     recoveryPhraseField.reset();
@@ -374,22 +373,14 @@ class WalletRestoreDialog extends Component<Props, State> {
     const { form } = this;
     const { walletType } = this.state;
     const { suggestedMnemonics, isSubmitting, error, onCancel } = this.props;
-    const dialogClasses = classnames([
-      styles.component,
-      styles.dialogWithCertificateRestore,
-      'WalletRestoreDialog',
-    ]);
+    const dialogClasses = classnames([styles.component, 'WalletRestoreDialog']);
     const walletNameFieldClasses = classnames([
       'walletName',
       styles.walletName,
     ]);
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const walletNameField = form.$('walletName');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = form.$('recoveryPhrase');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const repeatedPasswordField = form.$('repeatPassword');
     const label = this.isCertificate()
       ? this.context.intl.formatMessage(messages.restorePaperWalletButtonLabel)
diff --git a/source/renderer/app/components/wallet/WalletSendForm.scss b/source/renderer/app/components/wallet/WalletSendForm.scss
index a3cb966490..de5a2aaade 100755
--- a/source/renderer/app/components/wallet/WalletSendForm.scss
+++ b/source/renderer/app/components/wallet/WalletSendForm.scss
@@ -52,9 +52,11 @@
 }
 
 .estimatedFeeInput {
+  margin-bottom: 30px;
+
   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;
 
@@ -62,13 +64,41 @@
       font-family: var(--font-regular);
     }
   }
+
+  &.withOffset {
+    margin-bottom: 20px;
+  }
+}
+
+.minimumAmountNotice {
+  align-items: center;
+  background-color: var(--rp-input-bg-color-disabled);
+  border-radius: 4px;
+  color: var(--theme-button-flat-text-color);
+  display: flex;
+  font-family: var(--font-light);
+  font-style: italic;
+  line-height: 22px;
+  margin: 20px 0 30px 0;
+  padding: 14px 20px;
+  width: 100%;
+
+  b {
+    font-family: var(--font-medium);
+    font-weight: normal;
+  }
 }
 
 .assetInput,
 .receiverInput,
-.estimatedFeeInput,
 .depositInput {
   margin-bottom: 20px;
+}
+
+.assetInput,
+.receiverInput,
+.estimatedFeeInput,
+.depositInput {
   position: relative;
 
   :global {
@@ -99,34 +129,6 @@
     padding-left: 20px;
     position: absolute;
     right: 10px;
-
-    .clearReceiverButton {
-      background-color: var(
-        --theme-staking-stake-pools-search-clear-button-background-color
-      );
-      border-radius: 3px;
-      cursor: pointer;
-      height: 28px;
-      width: 28px;
-
-      &:hover {
-        background-color: var(
-          --theme-staking-stake-pools-search-clear-button-hover-background-color
-        );
-      }
-
-      .clearReceiverIcon {
-        > svg {
-          position: relative;
-          top: 0.5px;
-          width: 10px;
-
-          > g > g {
-            fill: var(--theme-staking-stake-pools-search-clear-button-color);
-          }
-        }
-      }
-    }
   }
 
   &.sameReceiverInput {
@@ -136,6 +138,24 @@
   }
 }
 
+.adaInput {
+  position: relative;
+
+  .clearAdaContainer {
+    align-items: center;
+    bottom: 0;
+    display: flex;
+    height: 48px;
+    padding-left: 20px;
+    position: absolute;
+    right: 50px;
+  }
+
+  .dividerContainer {
+    margin: 0px;
+  }
+}
+
 .estimatedFeeInput,
 .depositInput {
   :global {
@@ -189,9 +209,15 @@
   color: var(--theme-input-placeholder-color);
   font-family: var(--font-regular);
   font-size: 14px;
+  height: 20px;
   line-height: 1.36;
-  padding-bottom: 10px;
-  padding-top: 10px;
+  margin: 10px 0;
+
+  & > span {
+    align-items: center;
+    display: inline-flex;
+    height: 100%;
+  }
 }
 
 .addAssetButton {
@@ -201,6 +227,7 @@
   height: 20px;
   letter-spacing: 0.5px;
   line-height: 1.2;
+  margin-right: 6px;
   margin-top: 0;
   padding: 0 8px;
   text-transform: uppercase;
diff --git a/source/renderer/app/components/wallet/WalletSendForm.spec.tsx b/source/renderer/app/components/wallet/WalletSendForm.spec.tsx
new file mode 100644
index 0000000000..ca61fbf5f1
--- /dev/null
+++ b/source/renderer/app/components/wallet/WalletSendForm.spec.tsx
@@ -0,0 +1,418 @@
+import React, { useState } from 'react';
+import { addLocaleData } from 'react-intl';
+import BigNumber from 'bignumber.js';
+import { Provider as MobxProvider } from 'mobx-react';
+import faker from 'faker';
+import {
+  render,
+  fireEvent,
+  screen,
+  cleanup,
+  within,
+  waitForElementToBeRemoved,
+} from '@testing-library/react';
+import '@testing-library/jest-dom';
+import en from 'react-intl/locale-data/en';
+// Assets and helpers
+import { TestDecorator } from '../../../../../tests/_utils/TestDecorator';
+import { NUMBER_OPTIONS } from '../../config/profileConfig';
+import { DiscreetModeFeatureProvider } from '../../features/discreet-mode';
+import { BrowserLocalStorageBridge } from '../../features/local-storage';
+import { HwDeviceStatuses } from '../../domains/Wallet';
+import WalletTokenPicker from './tokens/wallet-token-picker/WalletTokenPicker';
+import WalletSendForm from './WalletSendForm';
+
+describe('wallet/Wallet Send Form', () => {
+  beforeEach(() => addLocaleData([...en]));
+  afterEach(cleanup);
+  const currencyMaxFractionalDigits = 6;
+
+  function createAssets(index: number) {
+    const id = `${faker.random.uuid()}:${index}`;
+    return {
+      policyId: id,
+      assetName: faker.internet.domainWord(),
+      uniqueId: id,
+      fingerprint: faker.random.uuid(),
+      quantity: new BigNumber(faker.finance.amount()),
+      decimals: 0,
+      recommendedDecimals: null,
+      metadata: {
+        name: id,
+        ticker: faker.finance.currencyCode(),
+        description: '',
+      },
+    };
+  }
+
+  const assets = [createAssets(0), createAssets(1)];
+
+  function SetupWallet({
+    calculateTransactionFee,
+    currentNumberFormat = NUMBER_OPTIONS[0].value,
+  }: {
+    calculateTransactionFee: (...args: Array<any>) => any;
+    currentNumberFormat?: string;
+  }) {
+    const [tokenPickerOpen, setTokenPickerOpen] = useState<boolean>(false);
+
+    return (
+      <TestDecorator>
+        <BrowserLocalStorageBridge>
+          <DiscreetModeFeatureProvider>
+            <MobxProvider>
+              <WalletSendForm
+                currencyMaxFractionalDigits={currencyMaxFractionalDigits}
+                currencyMaxIntegerDigits={11}
+                currentNumberFormat={currentNumberFormat}
+                validateAmount={jest.fn().mockResolvedValue(true)}
+                validateAssetAmount={jest.fn().mockResolvedValue(true)}
+                calculateTransactionFee={calculateTransactionFee}
+                walletAmount={new BigNumber(123)}
+                assets={assets}
+                addressValidator={() => true}
+                onSubmit={jest.fn()}
+                isDialogOpen={(dialog) =>
+                  dialog === WalletTokenPicker && tokenPickerOpen
+                }
+                isRestoreActive={false}
+                hwDeviceStatus={HwDeviceStatuses.READY}
+                isHardwareWallet={false}
+                isLoadingAssets={false}
+                onExternalLinkClick={jest.fn()}
+                hasAssets
+                selectedAsset={null}
+                onUnsetActiveAsset={() => {}}
+                isAddressFromSameWallet={false}
+                tokenFavorites={{}}
+                walletName={faker.name.firstName()}
+                onTokenPickerDialogClose={() => setTokenPickerOpen(false)}
+                onTokenPickerDialogOpen={() => setTokenPickerOpen(true)}
+              />
+            </MobxProvider>
+          </DiscreetModeFeatureProvider>
+        </BrowserLocalStorageBridge>
+      </TestDecorator>
+    );
+  }
+
+  function enterReceiverAddress() {
+    const address =
+      'addr_test1qrjzmxr4x7vhlusn05fd4lt7cs6dy8wtcv6vaf9lff7m9yqkw6whlsg36t3laez562llhkvfy5tny4p9y8zrspe48vgsea3q6m';
+    const receiverAddress = screen.getByPlaceholderText('Paste an address');
+    fireEvent.change(receiverAddress, {
+      target: {
+        value: address,
+      },
+    });
+  }
+
+  function getInput(label: string) {
+    return screen.getByLabelText(label);
+  }
+
+  async function findInput(label: string) {
+    return screen.findByLabelText(label);
+  }
+
+  async function addToken(value = 1, tokenIndex = 0) {
+    const addTokenButton = await screen.findByText('+ Add a token');
+    fireEvent.click(addTokenButton);
+    const tokenPicker = await screen.findByTestId('WalletTokenPicker');
+    const tokenCheckbox = tokenPicker.querySelectorAll(
+      'input[type="checkbox"]'
+    )[tokenIndex];
+    fireEvent.click(tokenCheckbox);
+    const addTokenPickerButton = await screen.findByText('Add');
+    fireEvent.click(addTokenPickerButton);
+
+    const { uniqueId } = assets[tokenIndex];
+
+    const token = await screen.findByTestId(`assetInput:${uniqueId}`);
+    fireEvent.change(token, {
+      target: {
+        value,
+      },
+    });
+    return async () => {
+      fireEvent.mouseEnter(token);
+      const removeTokenButton = await screen.findByTestId(
+        `removeAsset:${uniqueId}`
+      );
+      fireEvent.click(removeTokenButton);
+    };
+  }
+
+  async function waitForMinimumAdaRequiredMsg(minimumAda = 2) {
+    const minimumAdaRequiredMsg = screen.getByTestId('minimumAdaRequiredMsg');
+    await within(minimumAdaRequiredMsg).findByText(
+      `a minimum of ${minimumAda} ADA required`
+    );
+  }
+
+  function assertAdaInput(amount: number) {
+    const adaInput = getInput('Ada');
+    expect(adaInput).toHaveValue(
+      new BigNumber(amount).toFormat(currencyMaxFractionalDigits)
+    );
+  }
+
+  function createTransactionFeeMock(times: number, minimumAda: number) {
+    const mock = jest.fn().mockResolvedValue({
+      fee: new BigNumber(1),
+      minimumAda: new BigNumber(1),
+    });
+    Array.from({
+      length: times,
+    }).forEach(() => {
+      // @ts-ignore
+      mock.mockResolvedValueOnce({
+        fee: new BigNumber(1),
+        minimumAda: new BigNumber(minimumAda),
+      });
+    });
+    return mock;
+  }
+
+  const MINIMUM_AMOUNT_UPDATED_MESSAGE_TEST_ID =
+    'WalletSendForm::minimumAmountNotice::updated';
+
+  function assertMinimumAmountNoticeMessage(minimumAda: number) {
+    expect(
+      screen.getByTestId(MINIMUM_AMOUNT_UPDATED_MESSAGE_TEST_ID)
+    ).toHaveTextContent(
+      `Note: the ada field was automatically updated because this transaction requires a minimum of ${minimumAda} ADA.`
+    );
+  }
+
+  test('should update Ada input field to minimum required and restore to original value when tokens are removed', async () => {
+    expect.assertions(4);
+
+    const minimumAda = 2;
+    const calculateTransactionFeeMock = createTransactionFeeMock(1, minimumAda);
+
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+
+    enterReceiverAddress();
+
+    const removeToken1 = await addToken();
+
+    await waitForMinimumAdaRequiredMsg();
+    assertAdaInput(minimumAda);
+
+    const minimumAmountNoticeTestId =
+      'WalletSendForm::minimumAmountNotice::updated';
+
+    expect(screen.getByTestId(minimumAmountNoticeTestId)).toHaveTextContent(
+      `Note: the ada field was automatically updated because this transaction requires a minimum of ${minimumAda} ADA.`
+    );
+
+    await removeToken1();
+
+    await waitForMinimumAdaRequiredMsg(1);
+
+    assertAdaInput(1);
+
+    expect(screen.queryByTestId(minimumAmountNoticeTestId)).toBeInTheDocument();
+  });
+
+  test('should display an update button when Ada input field is less than minimum required', async () => {
+    expect.assertions(3);
+    const minimumAda = 2;
+    const calculateTransactionFeeMock = createTransactionFeeMock(2, minimumAda);
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+    enterReceiverAddress();
+    await addToken();
+    await waitForMinimumAdaRequiredMsg();
+    assertAdaInput(minimumAda);
+    const lowerAdaValue = 1.5;
+    const adaInput = getInput('Ada');
+    fireEvent.change(adaInput, {
+      target: {
+        value: lowerAdaValue,
+      },
+    });
+    const minimumAdaRequiredMsg = screen.getByTestId('minimumAdaRequiredMsg');
+    const updateButton = await within(minimumAdaRequiredMsg).findByText(
+      'UPDATE'
+    );
+    assertAdaInput(lowerAdaValue);
+    fireEvent.click(updateButton);
+    await waitForElementToBeRemoved(updateButton);
+    assertAdaInput(minimumAda);
+  });
+
+  test('should favour user Ada input instead of minimum required when the value is greater than the minimum one', async () => {
+    expect.assertions(2);
+    const minimumAda = 2.5;
+    const calculateTransactionFeeMock = createTransactionFeeMock(2, minimumAda);
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+    enterReceiverAddress();
+    const userAdaAmount = 1.5;
+    const adaInput = await findInput('Ada');
+    fireEvent.change(adaInput, {
+      target: {
+        value: userAdaAmount,
+      },
+    });
+    const removeToken1 = await addToken();
+    await waitForMinimumAdaRequiredMsg(minimumAda);
+    assertAdaInput(minimumAda);
+    await removeToken1();
+    const minimumAmountNotice = await screen.findByTestId(
+      'WalletSendForm::minimumAmountNotice::restored'
+    );
+    expect(minimumAmountNotice).toHaveTextContent(
+      `Note: the ada field was automatically updated to ${userAdaAmount} ADA because now it fulfills the minimum amount of 1 ADA for the transaction.`
+    );
+  });
+
+  test('should remove message when user entry is higher than minimum amount', async () => {
+    expect.assertions(3);
+    const minimumAda = 2.5;
+    const calculateTransactionFeeMock = createTransactionFeeMock(2, minimumAda);
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+    enterReceiverAddress();
+    const userAdaAmount = 1.5;
+    const adaInput = await findInput('Ada');
+    fireEvent.change(adaInput, {
+      target: {
+        value: userAdaAmount,
+      },
+    });
+    const removeToken1 = await addToken();
+    await waitForMinimumAdaRequiredMsg(minimumAda);
+    assertAdaInput(minimumAda);
+    await removeToken1();
+    const minimumAmountNoticeTestId =
+      'WalletSendForm::minimumAmountNotice::restored';
+    const minimumAmountNotice = await screen.findByTestId(
+      minimumAmountNoticeTestId
+    );
+    expect(minimumAmountNotice).toBeInTheDocument();
+    fireEvent.change(adaInput, {
+      target: {
+        value: userAdaAmount + 1,
+      },
+    });
+    expect(
+      screen.queryByTestId(minimumAmountNoticeTestId)
+    ).not.toBeInTheDocument();
+  });
+
+  test('should not display any minimum amount notice message when ada input is greater than minimum amount', async () => {
+    expect.assertions(2);
+    const calculateTransactionFeeMock = jest.fn().mockResolvedValue({
+      fee: new BigNumber(1),
+      minimumAda: new BigNumber(2),
+    });
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+    enterReceiverAddress();
+    const userAdaAmount = 3.5;
+    const adaInput = await findInput('Ada');
+    fireEvent.change(adaInput, {
+      target: {
+        value: userAdaAmount,
+      },
+    });
+    await addToken();
+    await waitForMinimumAdaRequiredMsg();
+    assertAdaInput(userAdaAmount);
+    await expect(
+      screen.findByTestId('WalletSendForm::minimumAmountNotice::restored')
+    ).rejects.toBeTruthy();
+  });
+
+  test('should apply minimum fee to ada field when user has removed the previous update', async () => {
+    expect.assertions(3);
+    const minimumAda = 2;
+    const calculateTransactionFeeMock = createTransactionFeeMock(4, minimumAda);
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+    enterReceiverAddress();
+    const removeToken1 = await addToken();
+    await waitForMinimumAdaRequiredMsg();
+    assertAdaInput(minimumAda);
+    const adaInput = await findInput('Ada');
+    fireEvent.change(adaInput, {
+      target: {
+        value: '',
+      },
+    });
+    await removeToken1();
+    expect(adaInput).toHaveValue('');
+    await addToken();
+    await waitForMinimumAdaRequiredMsg();
+    assertAdaInput(minimumAda);
+  });
+
+  test('should format ada input field using numeric format profile', async () => {
+    expect.assertions(1);
+    const minimumAda = 2;
+    const calculateTransactionFeeMock = createTransactionFeeMock(4, minimumAda);
+    render(
+      <SetupWallet
+        calculateTransactionFee={calculateTransactionFeeMock}
+        currentNumberFormat={NUMBER_OPTIONS[1].value}
+      />
+    );
+    enterReceiverAddress();
+    await addToken();
+    await waitForMinimumAdaRequiredMsg();
+    const adaInput = getInput('Ada');
+    expect(adaInput).toHaveValue(`${minimumAda},000000`);
+  });
+
+  test('should calculate transaction fee even when one of the assets are empty', async () => {
+    expect.assertions(2);
+    const minimumAda = 2;
+    const calculateTransactionFeeMock = createTransactionFeeMock(4, minimumAda);
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+    enterReceiverAddress();
+    await addToken(0);
+    await waitForMinimumAdaRequiredMsg(1);
+    expect(getInput('Ada')).toHaveValue('');
+    await addToken(minimumAda, 1);
+    await waitForMinimumAdaRequiredMsg();
+    assertAdaInput(minimumAda);
+  });
+
+  test('should keep transaction fee when assets are removed and ada field is untouched', async () => {
+    expect.assertions(3);
+
+    const fee = 2;
+    const minimumAda = 1;
+    const calculateTransactionFeeMock = createTransactionFeeMock(1, fee);
+
+    render(
+      <SetupWallet calculateTransactionFee={calculateTransactionFeeMock} />
+    );
+
+    enterReceiverAddress();
+
+    const removeToken = await addToken();
+    await waitForMinimumAdaRequiredMsg();
+
+    assertAdaInput(fee);
+
+    await removeToken();
+
+    await waitForMinimumAdaRequiredMsg(minimumAda);
+
+    assertAdaInput(minimumAda);
+    assertMinimumAmountNoticeMessage(minimumAda);
+  });
+});
diff --git a/source/renderer/app/components/wallet/WalletSendForm.tsx b/source/renderer/app/components/wallet/WalletSendForm.tsx
index 4f5cd77211..853687d1dd 100755
--- a/source/renderer/app/components/wallet/WalletSendForm.tsx
+++ b/source/renderer/app/components/wallet/WalletSendForm.tsx
@@ -4,7 +4,7 @@ import type { Node } from 'react';
 import type { Field } from 'mobx-react-form';
 import { observer } from 'mobx-react';
 import { intlShape, FormattedHTMLMessage } from 'react-intl';
-import { filter, get, indexOf, omit, map, without } from 'lodash';
+import { filter, get, indexOf, omit, map, without, isEmpty } from 'lodash';
 import BigNumber from 'bignumber.js';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
@@ -17,10 +17,7 @@ import BorderedBox from '../widgets/BorderedBox';
 import LoadingSpinner from '../widgets/LoadingSpinner';
 import ReadOnlyInput from '../widgets/forms/ReadOnlyInput';
 import { FormattedHTMLMessageWithLink } from '../widgets/FormattedHTMLMessageWithLink';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/question-m... Remove this comment to see the full error message
 import questionMarkIcon from '../../assets/images/question-mark.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
-import closeIcon from '../../assets/images/close-cross.inline.svg';
 import globalMessages from '../../i18n/global-messages';
 import messages from './send-form/messages';
 import { messages as apiErrorMessages } from '../../api/errors';
@@ -35,14 +32,25 @@ import { NUMBER_FORMATS } from '../../../../common/types/number.types';
 import AssetInput from './send-form/AssetInput';
 import WalletSendAssetsConfirmationDialog from './send-form/WalletSendAssetsConfirmationDialog';
 import WalletSendConfirmationDialogContainer from '../../containers/wallet/dialogs/WalletSendConfirmationDialogContainer';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSendForm.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletSendForm.scss';
 import Asset from '../../domains/Asset';
 import type { HwDeviceStatus } from '../../domains/Wallet';
 import type { AssetToken, ApiTokens } from '../../api/assets/types';
+import type { ReactIntlMessage } from '../../types/i18nTypes';
 import { DiscreetWalletAmount } from '../../features/discreet-mode';
+import WalletTokenPicker from './tokens/wallet-token-picker/WalletTokenPicker';
+import { ClearButton } from './widgets/ClearButton';
+import { Divider } from './widgets/Divider';
 
 messages.fieldIsRequired = globalMessages.fieldIsRequired;
+type AdaInputState = 'restored' | 'updated' | 'reset' | 'none';
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
+const AdaInputStateType: EnumMap<string, AdaInputState> = {
+  Restored: 'restored',
+  Updated: 'updated',
+  None: 'none',
+  Reset: 'reset',
+};
 type Props = {
   currencyMaxIntegerDigits: number;
   currencyMaxFractionalDigits: number;
@@ -60,11 +68,22 @@ type Props = {
   isRestoreActive: boolean;
   isHardwareWallet: boolean;
   hwDeviceStatus: HwDeviceStatus;
-  onOpenDialogAction: (...args: Array<any>) => any;
+  onSubmit: (...args: Array<any>) => any;
   onUnsetActiveAsset: (...args: Array<any>) => any;
   onExternalLinkClick: (...args: Array<any>) => any;
   isAddressFromSameWallet: boolean;
+  tokenFavorites: Record<string, boolean>;
+  walletName: string;
+  onTokenPickerDialogOpen: (...args: Array<any>) => any;
+  onTokenPickerDialogClose: (...args: Array<any>) => any;
 };
+
+interface FormFields {
+  receiver: string;
+  adaAmount: string;
+  [assets: string]: string;
+}
+
 type State = {
   formFields: {
     receiver: {
@@ -75,14 +94,17 @@ type State = {
     };
   };
   minimumAda: BigNumber;
+  adaAmountInputTrack: BigNumber;
   feeCalculationRequestQue: number;
   transactionFee: BigNumber;
   transactionFeeError: (string | null | undefined) | (Node | null | undefined);
-  showRemoveAssetButton: Record<string, boolean>;
   selectedAssetUniqueIds: Array<string>;
   isResetButtonDisabled: boolean;
   isReceiverAddressValid: boolean;
+  isReceiverAddressValidOnce: boolean;
   isTransactionFeeCalculated: boolean;
+  isCalculatingTransactionFee: boolean;
+  adaInputState: AdaInputState;
 };
 
 @observer
@@ -90,25 +112,21 @@ class WalletSendForm extends Component<Props, State> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  // @ts-ignore ts-migrate(2416) FIXME: Property 'state' in type 'WalletSendForm' is not a... Remove this comment to see the full error message
   state = {
-    formFields: {},
+    formFields: {} as State['formFields'],
     minimumAda: new BigNumber(0),
+    adaAmountInputTrack: new BigNumber(0),
     feeCalculationRequestQue: 0,
     transactionFee: new BigNumber(0),
     transactionFeeError: null,
-    showRemoveAssetButton: {},
     selectedAssetUniqueIds: [],
     isResetButtonDisabled: true,
     isReceiverAddressValid: false,
+    isReceiverAddressValidOnce: false,
     isTransactionFeeCalculated: false,
+    isCalculatingTransactionFee: false,
+    adaInputState: AdaInputStateType.None,
   };
-  // We need to track the fee calculation state in order to disable
-  // the "Submit" button as soon as either receiver or amount field changes.
-  // This is required as we are using debounced validation and we need to
-  // disable the "Submit" button as soon as the value changes and then wait for
-  // the validation to end in order to see if the button should be enabled or not.
-  _isCalculatingTransactionFee = false;
   // We need to track the mounted state in order to avoid calling
   // setState promise handling code after the component was already unmounted:
   // Read more: https://facebook.github.io/react/blog/2015/12/16/ismounted-antipattern.html
@@ -174,7 +192,7 @@ class WalletSendForm extends Component<Props, State> {
     return allAssets.find((asset) => asset.uniqueId === uniqueId);
   };
   focusableFields: Record<string, Field> = {};
-  addFocusableField = (field: Field | null | undefined) => {
+  addFocusableField = (field: Input | null | undefined) => {
     if (field) {
       const { name: fieldName } = field.props;
       this.focusableFields[fieldName] = field;
@@ -189,49 +207,46 @@ class WalletSendForm extends Component<Props, State> {
     }
   };
   handleSubmitOnEnter = (event: KeyboardEvent): void => {
-    if (event.target instanceof HTMLInputElement && event.key === 'Enter')
-      this.handleOnSubmit();
+    if (event.target instanceof HTMLInputElement && event.key === 'Enter') {
+      setTimeout(() => {
+        this.handleOnSubmit();
+      }, FORM_VALIDATION_DEBOUNCE_WAIT);
+    }
   };
   handleOnSubmit = () => {
     if (this.isDisabled()) {
       return;
     }
-
-    this.props.onOpenDialogAction({
-      dialog: WalletSendAssetsConfirmationDialog,
-    });
+    this.props.onSubmit();
   };
   handleOnReset = () => {
     // Cancel all debounced field validations
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'each' does not exist on type 'ReactToolb... Remove this comment to see the full error message
     this.form.each((field) => {
       field.debouncedValidation.cancel();
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'reset' does not exist on type 'ReactTool... Remove this comment to see the full error message
     this.form.reset();
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'showErrors' does not exist on type 'Reac... Remove this comment to see the full error message
     this.form.showErrors(false);
     this.clearReceiverFieldValue();
     this.clearAdaAmountFieldValue();
     this.updateFormFields(true);
     this.setState({
       minimumAda: new BigNumber(0),
-      showRemoveAssetButton: {},
+      adaAmountInputTrack: new BigNumber(0),
       isResetButtonDisabled: true,
+      adaInputState: AdaInputStateType.None,
+      isReceiverAddressValidOnce: false,
     });
   };
   clearReceiverFieldValue = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const receiverField = this.form.$('receiver');
 
     if (receiverField) {
-      receiverField.clear();
+      receiverField.onChange('');
       this.setReceiverValidity(false);
       this.focusField(receiverField);
     }
   };
   clearAdaAmountFieldValue = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const adaAmountField = this.form.$('adaAmount');
 
     if (adaAmountField) {
@@ -247,7 +262,6 @@ class WalletSendForm extends Component<Props, State> {
     this.resetTransactionFee();
   };
   updateFormFields = (resetFormFields: boolean, uniqueId?: string) => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'fields' does not exist on type 'ReactToo... Remove this comment to see the full error message
     const formFields = this.form.fields;
     const receiverField = formFields.get('receiver');
     const adaAmountField = formFields.get('adaAmount');
@@ -265,7 +279,6 @@ class WalletSendForm extends Component<Props, State> {
         },
       });
     } else if (uniqueId) {
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'receiver' does not exist on type '{}'.
       const { assetFields, assetsDropdown } = this.state.formFields.receiver;
       const assetField = formFields.get(`asset_${uniqueId}`);
 
@@ -292,13 +305,15 @@ class WalletSendForm extends Component<Props, State> {
     }
   };
   hasReceiverValue = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const receiverField = this.form.$('receiver');
     return receiverField.value.length > 0;
   };
+  hasAdaAmountValue = () => {
+    const adaAmountField = this.form.$('adaAmount');
+    return adaAmountField.value.length > 0;
+  };
   isAddressFromSameWallet = () => {
     const { isAddressFromSameWallet } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const receiverField = this.form.$('receiver');
     return (
       this.hasReceiverValue() &&
@@ -307,12 +322,11 @@ class WalletSendForm extends Component<Props, State> {
     );
   };
   isDisabled = () =>
-    this._isCalculatingTransactionFee ||
+    this.state.isCalculatingTransactionFee ||
     !this.state.isTransactionFeeCalculated ||
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
-    !this.form.isValid;
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+    !this.form.isValid ||
+    this.form.validating;
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         receiver: {
@@ -343,7 +357,7 @@ class WalletSendForm extends Component<Props, State> {
               const isAdaAmountValid = adaAmountField.isValid;
 
               if (isValid && isAdaAmountValid) {
-                this.calculateTransactionFee();
+                await this.calculateTransactionFee();
               } else {
                 this.resetTransactionFee();
               }
@@ -381,7 +395,7 @@ class WalletSendForm extends Component<Props, State> {
               );
 
               if (isValid) {
-                this.calculateTransactionFee();
+                await this.calculateTransactionFee();
               } else {
                 this.resetTransactionFee();
               }
@@ -416,9 +430,10 @@ class WalletSendForm extends Component<Props, State> {
 
   setReceiverValidity(isValid: boolean) {
     if (this._isMounted) {
-      this.setState({
+      this.setState(({ isReceiverAddressValidOnce }) => ({
         isReceiverAddressValid: isValid,
-      });
+        isReceiverAddressValidOnce: isValid || isReceiverAddressValidOnce,
+      }));
     }
   }
 
@@ -426,37 +441,40 @@ class WalletSendForm extends Component<Props, State> {
     currentFeeCalculationRequestQue: number,
     prevFeeCalculationRequestQue: number
   ) => currentFeeCalculationRequestQue - prevFeeCalculationRequestQue === 1;
-  calculateTransactionFee = async () => {
-    const { form } = this;
-    const emptyAssetFieldValue = '0';
-    const hasEmptyAssetFields =
-      this.selectedAssetsAmounts.includes(emptyAssetFieldValue);
-
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
-    if (!form.isValid || hasEmptyAssetFields) {
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'showErrors' does not exist on type 'Reac... Remove this comment to see the full error message
-      form.showErrors(true);
+  validateEmptyAssets = () => {
+    return this.selectedAssets
+      .filter((_, index) => {
+        const quantity = new BigNumber(this.selectedAssetsAmounts[index]);
+        return quantity.isZero();
+      })
+      .forEach(({ uniqueId }) => {
+        this.form.$(`asset_${uniqueId}`).validate({
+          showErrors: true,
+        });
+      });
+  };
+  calculateTransactionFee = async (shouldUpdateMinimumAdaAmount = false) => {
+    if (!this.state.isReceiverAddressValid) {
       return;
     }
 
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
+    this.validateEmptyAssets();
+    const { form } = this;
     const receiverField = form.$('receiver');
     const receiver = receiverField.value;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const adaAmountField = form.$('adaAmount');
     const adaAmount = formattedAmountToLovelace(adaAmountField.value);
     // @ts-ignore ts-migrate(2322) FIXME: Type '{ policy_id: string; asset_name: string; qua... Remove this comment to see the full error message
-    const assets: ApiTokens = filter(
-      this.selectedAssets.map(({ policyId, assetName }, index) => {
+    const assets: ApiTokens = this.selectedAssets
+      .map(({ policyId, assetName }, index) => {
         const quantity = new BigNumber(this.selectedAssetsAmounts[index]);
         return {
           policy_id: policyId,
           asset_name: assetName,
           quantity, // BigNumber or number - prevent parsing a BigNumber to Number (Integer) because of JS number length limitation
         };
-      }),
-      'quantity'
-    );
+      })
+      .filter(({ quantity }: { quantity: BigNumber }) => quantity.gt(0));
     const {
       selectedAssetUniqueIds,
       feeCalculationRequestQue: prevFeeCalculationRequestQue,
@@ -464,12 +482,11 @@ class WalletSendForm extends Component<Props, State> {
     this.setState((prevState) => ({
       feeCalculationRequestQue: prevState.feeCalculationRequestQue + 1,
       isTransactionFeeCalculated: false,
-      transactionFee: new BigNumber(0),
       transactionFeeError: null,
+      isCalculatingTransactionFee: true,
     }));
 
     try {
-      this._isCalculatingTransactionFee = true;
       const { fee, minimumAda } = await this.props.calculateTransactionFee(
         receiver,
         adaAmount,
@@ -481,16 +498,26 @@ class WalletSendForm extends Component<Props, State> {
         this.isLatestTransactionFeeRequest(
           this.state.feeCalculationRequestQue,
           prevFeeCalculationRequestQue
-        ) &&
-        !this.selectedAssetsAmounts.includes(emptyAssetFieldValue)
+        )
       ) {
-        this._isCalculatingTransactionFee = false;
-        this.setState({
+        const minimumAdaValue = minimumAda || new BigNumber(0);
+        const adaAmountValue = new BigNumber(adaAmountField.value || 0);
+        const nextState = {
           isTransactionFeeCalculated: true,
-          minimumAda: minimumAda || new BigNumber(0),
+          minimumAda: minimumAdaValue,
           transactionFee: fee,
           transactionFeeError: null,
-        });
+          isCalculatingTransactionFee: false,
+          adaInputState: this.state.adaInputState,
+        };
+
+        if (shouldUpdateMinimumAdaAmount) {
+          const adaInputState = await this.checkAdaInputState(minimumAdaValue);
+          nextState.adaInputState = adaInputState;
+          this.trySetMinimumAdaAmount(adaInputState, minimumAdaValue);
+        }
+
+        this.setState(nextState);
       }
     } catch (error) {
       if (
@@ -504,6 +531,11 @@ class WalletSendForm extends Component<Props, State> {
         let transactionFeeError;
         let localizableError = error;
         let values;
+        let nextState = {
+          isCalculatingTransactionFee: false,
+          isTransactionFeeCalculated: false,
+          transactionFee: new BigNumber(0),
+        };
 
         if (error.id === 'api.errors.utxoTooSmall') {
           const minimumAda = get(error, 'values.minimumAda');
@@ -515,9 +547,23 @@ class WalletSendForm extends Component<Props, State> {
             values = {
               minimumAda,
             };
-            this.setState({
-              minimumAda: new BigNumber(minimumAda),
-            });
+
+            if (shouldUpdateMinimumAdaAmount) {
+              const minimumAdaValue = new BigNumber(minimumAda);
+              const adaInputState = await this.checkAdaInputState(
+                minimumAdaValue
+              );
+              this.trySetMinimumAdaAmount(adaInputState, minimumAdaValue);
+              this.setState({
+                ...nextState,
+                adaInputState,
+                minimumAda: new BigNumber(minimumAda),
+              });
+              return;
+            }
+
+            // @ts-ignore ts-migrate(2322) FIXME: Type '{ minimumAda: BigNumber; isCalculatingTransa... Remove this comment to see the full error message
+            nextState = { ...nextState, minimumAda: new BigNumber(minimumAda) };
           }
         }
 
@@ -534,41 +580,102 @@ class WalletSendForm extends Component<Props, State> {
           );
         }
 
-        this._isCalculatingTransactionFee = false;
-        this.setState({
-          isTransactionFeeCalculated: false,
-          transactionFee: new BigNumber(0),
-          transactionFeeError,
-        });
+        this.setState({ ...nextState, transactionFeeError });
       }
     }
   };
+  checkAdaInputState = async (
+    minimumAda: BigNumber
+  ): Promise<AdaInputState> => {
+    const { adaAmountInputTrack, selectedAssetUniqueIds, adaInputState } =
+      this.state;
+
+    if (
+      adaAmountInputTrack.gte(minimumAda) &&
+      adaInputState === AdaInputStateType.Updated
+    ) {
+      return AdaInputStateType.Restored;
+    }
+
+    if (adaAmountInputTrack.lt(minimumAda)) {
+      const isValid = await this.props.validateAmount(
+        formattedAmountToNaturalUnits(minimumAda.toString())
+      );
+
+      if (!isValid) {
+        return AdaInputStateType.None;
+      }
+
+      return AdaInputStateType.Updated;
+    }
+
+    return AdaInputStateType.None;
+  };
+  trySetMinimumAdaAmount = (
+    adaInputState: AdaInputState,
+    minimumAda: BigNumber
+  ) => {
+    const { formFields } = this.state;
+    const { adaAmount: adaAmountField } = formFields.receiver;
+
+    switch (adaInputState) {
+      case 'updated':
+        adaAmountField.onChange(minimumAda.toString());
+        break;
+
+      case 'restored':
+      case 'reset':
+        adaAmountField.onChange(this.state.adaAmountInputTrack.toString());
+        break;
+
+      case 'none':
+      default:
+    }
+  };
+  updateAdaAmount = async () => {
+    const { minimumAda } = this.state;
+    const formattedMinimumAda = minimumAda.toString();
+    const isValid = await this.props.validateAmount(
+      formattedAmountToNaturalUnits(formattedMinimumAda)
+    );
+
+    if (!isValid) {
+      return;
+    }
+
+    this.form.$('adaAmount').onChange(formattedMinimumAda);
+    this.setState({
+      adaInputState: AdaInputStateType.None,
+      adaAmountInputTrack: minimumAda,
+    });
+  };
+  onAdaAmountFieldChange = (value: string) => {
+    const { formFields } = this.state;
+    const { adaAmount: adaAmountField } = formFields.receiver;
+    adaAmountField.onChange(value != null ? value : '');
+    const adaAmount = new BigNumber(value != null ? value : 0);
+    this.setState({
+      adaAmountInputTrack: adaAmount,
+      adaInputState: AdaInputStateType.None,
+    });
+  };
+  isAdaAmountLessThanMinimumRequired = () => {
+    const adaAmountField = this.form.$('adaAmount');
+    const adaAmount = new BigNumber(adaAmountField.value || 0);
+    return adaAmount.lt(this.state.minimumAda);
+  };
 
   resetTransactionFee() {
     if (this._isMounted) {
-      this._isCalculatingTransactionFee = false;
       this.setState({
         isTransactionFeeCalculated: false,
         transactionFee: new BigNumber(0),
         transactionFeeError: null,
+        isCalculatingTransactionFee: false,
       });
     }
   }
 
-  showRemoveAssetButton = (uniqueId: string) => {
-    const { showRemoveAssetButton } = this.state;
-    showRemoveAssetButton[uniqueId] = true;
-    this.setState({
-      showRemoveAssetButton,
-    });
-  };
-  hideRemoveAssetButton = (uniqueId: string) => {
-    const { showRemoveAssetButton } = this.state;
-    showRemoveAssetButton[uniqueId] = false;
-    this.setState({
-      showRemoveAssetButton,
-    });
-  };
   addAssetRow = (uniqueId: string) => {
     this.addAssetFields(uniqueId);
     this.updateFormFields(false, uniqueId);
@@ -582,36 +689,34 @@ class WalletSendForm extends Component<Props, State> {
   };
   removeAssetRow = (uniqueId: string) => {
     const { formFields, selectedAssetUniqueIds } = this.state;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'receiver' does not exist on type '{}'.
     const { receiver } = formFields;
     const assetFields = omit(receiver.assetFields, uniqueId);
     const assetsDropdown = omit(receiver.assetsDropdown, uniqueId);
-    this.setState({
-      selectedAssetUniqueIds: without(selectedAssetUniqueIds, uniqueId),
-      formFields: {
-        ...formFields,
-        receiver: { ...receiver, assetFields, assetsDropdown },
+    this.setState(
+      {
+        selectedAssetUniqueIds: without(selectedAssetUniqueIds, uniqueId),
+        formFields: {
+          ...formFields,
+          receiver: { ...receiver, assetFields, assetsDropdown },
+        },
       },
-    });
-    this.removeAssetFields(uniqueId);
-    setTimeout(() => {
-      this.calculateTransactionFee();
-    });
+      async () => {
+        this.removeAssetFields(uniqueId);
+        await this.calculateTransactionFee(true);
+      }
+    );
   };
   addAssetFields = (uniqueId: string) => {
     const newAsset = `asset_${uniqueId}`;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'add' does not exist on type 'ReactToolbo... Remove this comment to see the full error message
     this.form.add({
       name: newAsset,
       value: null,
       key: newAsset,
     });
     this.form
-      // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
       .$(newAsset)
       .set('label', this.context.intl.formatMessage(messages.assetLabel));
     this.form
-      // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
       .$(newAsset)
       .set(
         'placeholder',
@@ -619,7 +724,6 @@ class WalletSendForm extends Component<Props, State> {
           this.props.currencyMaxFractionalDigits
         )}`
       );
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     this.form.$(newAsset).set('validators', [
       async ({ field }) => {
         const { value } = field;
@@ -651,7 +755,7 @@ class WalletSendForm extends Component<Props, State> {
         const isValid = isValidAmount && isValidRange;
 
         if (isValid) {
-          this.calculateTransactionFee();
+          await this.calculateTransactionFee(true);
         } else {
           this.resetTransactionFee();
         }
@@ -663,21 +767,17 @@ class WalletSendForm extends Component<Props, State> {
       },
     ]);
     const assetsDropdown = `assetsDropdown_${uniqueId}`;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'add' does not exist on type 'ReactToolbo... Remove this comment to see the full error message
     this.form.add({
       name: assetsDropdown,
       value: null,
       key: assetsDropdown,
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     this.form.$(assetsDropdown).set('type', 'select');
   };
   removeAssetFields = (uniqueId: string) => {
     const assetFieldToDelete = `asset_${uniqueId}`;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'del' does not exist on type 'ReactToolbo... Remove this comment to see the full error message
     this.form.del(assetFieldToDelete);
     const assetsDropdownFieldToDelete = `assetsDropdown_${uniqueId}`;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'del' does not exist on type 'ReactToolbo... Remove this comment to see the full error message
     this.form.del(assetsDropdownFieldToDelete);
   };
   onChangeAsset = async (currentUniqueId: string, newUniqueId: string) => {
@@ -700,34 +800,39 @@ class WalletSendForm extends Component<Props, State> {
     this.removeAssetRow(currentUniqueId);
     this.resetTransactionFee();
   };
+  getMinimumAdaValue = () => {
+    const { minimumAda } = this.state;
+    return minimumAda.isZero()
+      ? TRANSACTION_MIN_ADA_VALUE
+      : minimumAda.toFormat();
+  };
   renderReceiverRow = (): Node => {
     const { intl } = this.context;
     const {
       formFields,
-      minimumAda,
       transactionFeeError,
       selectedAssetUniqueIds,
-      isReceiverAddressValid,
+      isReceiverAddressValidOnce,
     } = this.state;
-    const { currencyMaxFractionalDigits, walletAmount } = this.props;
+    const {
+      currencyMaxFractionalDigits,
+      walletAmount,
+      onTokenPickerDialogOpen,
+    } = this.props;
+
     const {
       adaAmount: adaAmountField,
       receiver: receiverField,
       assetFields,
-      assetsDropdown,
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'receiver' does not exist on type '{}'.
     } = formFields.receiver;
     const assetsSeparatorBasicHeight = 140;
     const assetsSeparatorCalculatedHeight = selectedAssetUniqueIds.length
       ? assetsSeparatorBasicHeight * (selectedAssetUniqueIds.length + 1) -
         40 * selectedAssetUniqueIds.length
       : assetsSeparatorBasicHeight;
-    const minimumAdaValue = minimumAda.isZero()
-      ? TRANSACTION_MIN_ADA_VALUE
-      : minimumAda.toFormat();
+    const minimumAdaValue = this.getMinimumAdaValue();
     const addAssetButtonClasses = classNames([
       styles.addAssetButton,
-      !this.hasAvailableAssets ? styles.disabled : null,
       'primary',
     ]);
     const receiverFieldClasses = classNames([
@@ -772,25 +877,14 @@ class WalletSendForm extends Component<Props, State> {
           />
           {this.hasReceiverValue() && (
             <div className={styles.clearReceiverContainer}>
-              <PopOver
-                content={intl.formatMessage(messages.clearLabel)}
-                placement="top"
-              >
-                <button
-                  onClick={() => this.handleOnReset()}
-                  className={styles.clearReceiverButton}
-                  tabIndex={-1}
-                >
-                  <SVGInline
-                    svg={closeIcon}
-                    className={styles.clearReceiverIcon}
-                  />
-                </button>
-              </PopOver>
+              <ClearButton
+                label={intl.formatMessage(messages.clearLabel)}
+                onClick={this.clearReceiverFieldValue}
+              />
             </div>
           )}
         </div>
-        {this.hasReceiverValue() && isReceiverAddressValid && (
+        {isReceiverAddressValidOnce && (
           <>
             <div
               className={styles.fieldsLine}
@@ -811,33 +905,67 @@ class WalletSendForm extends Component<Props, State> {
                 <div className={styles.adaAmountLabel}>
                   {intl.formatMessage(globalMessages.adaUnit)}
                 </div>
-                <NumericInput
-                  {...adaAmountField.bind()}
-                  ref={(field) => {
-                    this.addFocusableField(field);
-                  }}
-                  className="adaAmount"
-                  value={adaAmountField.value}
-                  bigNumberFormat={this.getCurrentNumberFormat()}
-                  decimalPlaces={currencyMaxFractionalDigits}
-                  numberLocaleOptions={{
-                    minimumFractionDigits: currencyMaxFractionalDigits,
-                  }}
-                  onChange={(value) => {
-                    adaAmountField.onChange(value);
-                  }}
-                  currency={globalMessages.adaUnit}
-                  error={adaAmountField.error || transactionFeeError}
-                  onKeyPress={this.handleSubmitOnEnter}
-                  allowSigns={false}
-                  autoFocus={this._isAutoFocusEnabled}
-                />
-                <div className={styles.minAdaRequired}>
-                  <span>
-                    {intl.formatMessage(messages.minAdaRequired, {
-                      minimumAda: minimumAdaValue,
-                    })}
-                  </span>
+                <div className={styles.adaInput}>
+                  <NumericInput
+                    {...adaAmountField.bind()}
+                    ref={(field) => {
+                      this.addFocusableField(field);
+                    }}
+                    className="adaAmount"
+                    bigNumberFormat={this.getCurrentNumberFormat()}
+                    decimalPlaces={currencyMaxFractionalDigits}
+                    numberLocaleOptions={{
+                      minimumFractionDigits: currencyMaxFractionalDigits,
+                    }}
+                    onChange={this.onAdaAmountFieldChange}
+                    currency={globalMessages.adaUnit}
+                    error={adaAmountField.error || transactionFeeError}
+                    onKeyPress={this.handleSubmitOnEnter}
+                    allowSigns={false}
+                    autoFocus={this._isAutoFocusEnabled}
+                  />
+                  {this.hasAdaAmountValue() && (
+                    <div className={styles.clearAdaContainer}>
+                      <ClearButton
+                        label={intl.formatMessage(messages.clearLabel)}
+                        onClick={this.clearAdaAmountFieldValue}
+                      />
+                      <div className={styles.dividerContainer}>
+                        <Divider />
+                      </div>
+                    </div>
+                  )}
+                </div>
+                <div
+                  className={styles.minAdaRequired}
+                  data-testid="minimumAdaRequiredMsg"
+                >
+                  {this.isAdaAmountLessThanMinimumRequired() ? (
+                    <>
+                      <Button
+                        className={addAssetButtonClasses}
+                        label={intl.formatMessage(
+                          messages.updateAdaAmountButton
+                        )}
+                        onClick={this.updateAdaAmount}
+                      />
+                      <span>
+                        {intl.formatMessage(
+                          messages.updateAdaAmountDescription,
+                          {
+                            minimumAda: minimumAdaValue,
+                          }
+                        )}
+                      </span>
+                    </>
+                  ) : (
+                    <span>
+                      {intl.formatMessage(messages.minAdaRequired, {
+                        minimumAda: minimumAdaValue,
+                      })}
+                    </span>
+                  )}
+
                   <PopOver
                     content={intl.formatMessage(minAdaRequiredTooltip, {
                       minimumAda: minimumAdaValue,
@@ -858,24 +986,15 @@ class WalletSendForm extends Component<Props, State> {
                     <AssetInput
                       key={uniqueId}
                       uniqueId={uniqueId}
+                      // @ts-ignore ts-migrate(2322) FIXME: Type '{ key: string; uniqueId: string; index: numb... Remove this comment to see the full error message
                       index={index}
                       getAssetByUniqueId={this.getAssetByUniqueId}
-                      availableAssets={this.availableAssets}
                       assetFields={assetFields}
-                      assetsDropdown={assetsDropdown}
                       addFocusableField={this.addFocusableField}
-                      removeAssetButtonVisible={
-                        this.state.showRemoveAssetButton
-                      }
-                      showRemoveAssetButton={this.showRemoveAssetButton}
-                      hideRemoveAssetButton={this.hideRemoveAssetButton}
                       currentNumberFormat={this.getCurrentNumberFormat()}
                       removeAssetRow={this.removeAssetRow}
                       handleSubmitOnEnter={this.handleSubmitOnEnter}
                       clearAssetFieldValue={this.clearAssetFieldValue}
-                      onChangeAsset={(newUniqueId) =>
-                        this.onChangeAsset(uniqueId, newUniqueId)
-                      }
                       autoFocus={this._isAutoFocusEnabled}
                     />
                   )
@@ -885,9 +1004,7 @@ class WalletSendForm extends Component<Props, State> {
                 className={addAssetButtonClasses}
                 label={intl.formatMessage(messages.addAssetButtonLabel)}
                 disabled={!this.hasAvailableAssets}
-                onClick={() => {
-                  this.addAssetRow(this.availableAssets[0].uniqueId);
-                }}
+                onClick={onTokenPickerDialogOpen}
               />
             </div>
           </>
@@ -895,6 +1012,16 @@ class WalletSendForm extends Component<Props, State> {
       </div>
     );
   };
+  renderMinimumAmountNotice = (message: ReactIntlMessage, values: {}) => {
+    return (
+      <div
+        className={styles.minimumAmountNotice}
+        data-testid={`WalletSendForm::minimumAmountNotice::${this.state.adaInputState}`}
+      >
+        <FormattedHTMLMessage {...message} values={values} />
+      </div>
+    );
+  };
 
   render() {
     const { form } = this;
@@ -905,19 +1032,22 @@ class WalletSendForm extends Component<Props, State> {
       transactionFeeError,
       isResetButtonDisabled,
       isTransactionFeeCalculated,
+      selectedAssetUniqueIds,
     } = this.state;
     const {
+      assets,
       currencyMaxFractionalDigits,
       hwDeviceStatus,
       isHardwareWallet,
       isDialogOpen,
       isRestoreActive,
       onExternalLinkClick,
+      tokenFavorites,
+      walletName,
+      onTokenPickerDialogClose,
     } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const receiverField = form.$('receiver');
     const receiver = receiverField.value;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const adaAmountField = form.$('adaAmount');
     const adaAmount = new BigNumber(adaAmountField.value || 0);
     let fees = '0';
@@ -932,6 +1062,13 @@ class WalletSendForm extends Component<Props, State> {
       styles.calculatingFeesSpinnerButton,
       styles.spinning,
     ]);
+    const estimatedFeeInputClasses = classNames({
+      [styles.estimatedFeeInput]: true,
+      [styles.withOffset]:
+        this.state.adaInputState === AdaInputStateType.Updated ||
+        this.state.adaInputState === AdaInputStateType.Restored,
+    });
+    const minimumAdaValue = this.getMinimumAdaValue();
     return (
       <div className={styles.component}>
         {isRestoreActive ? (
@@ -944,9 +1081,8 @@ class WalletSendForm extends Component<Props, State> {
         ) : (
           <BorderedBox>
             <div className={styles.walletSendForm}>
-              {/* @ts-ignore ts-migrate(2339) FIXME: Property 'receiver' does not exist on type '{}'. */}
               {formFields.receiver && this.renderReceiverRow()}
-              <div className={styles.estimatedFeeInput}>
+              <div className={estimatedFeeInputClasses}>
                 <ReadOnlyInput
                   label={intl.formatMessage(messages.estimatedFeeLabel)}
                   value={
@@ -960,7 +1096,7 @@ class WalletSendForm extends Component<Props, State> {
                   }
                   isSet
                 />
-                {this._isCalculatingTransactionFee && (
+                {this.state.isCalculatingTransactionFee && (
                   <div className={styles.calculatingFeesContainer}>
                     <PopOver
                       content={intl.formatMessage(
@@ -972,6 +1108,15 @@ class WalletSendForm extends Component<Props, State> {
                   </div>
                 )}
               </div>
+              {this.state.adaInputState === AdaInputStateType.Updated &&
+                this.renderMinimumAmountNotice(messages.minimumAmountNotice, {
+                  minimumAda: minimumAdaValue,
+                })}
+              {this.state.adaInputState === AdaInputStateType.Restored &&
+                this.renderMinimumAmountNotice(messages.restoredAdaAmount, {
+                  minimumAda: minimumAdaValue,
+                  adaAmount: adaAmountField.value,
+                })}
               <div className={styles.buttonsContainer}>
                 <Button
                   className="flat"
@@ -1005,6 +1150,20 @@ class WalletSendForm extends Component<Props, State> {
             formattedTotalAmount={total.toFormat(currencyMaxFractionalDigits)}
           />
         ) : null}
+
+        {isDialogOpen(WalletTokenPicker) && (
+          <WalletTokenPicker
+            assets={assets}
+            previouslyCheckedIds={selectedAssetUniqueIds}
+            tokenFavorites={tokenFavorites}
+            walletName={walletName}
+            onCancel={onTokenPickerDialogClose}
+            onAdd={(checked) => {
+              onTokenPickerDialogClose();
+              checked.forEach(this.addAssetRow);
+            }}
+          />
+        )}
       </div>
     );
   }
diff --git a/source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx b/source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx
index 87c3470a24..2ee5b83a93 100644
--- a/source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx
+++ b/source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx
@@ -9,7 +9,6 @@ import DialogCloseButton from '../../widgets/DialogCloseButton';
 import WalletRecoveryInstructions from './WalletRecoveryInstructions';
 import globalMessages from '../../../i18n/global-messages';
 import { WALLET_RECOVERY_PHRASE_WORD_COUNT } from '../../../config/cryptoConfig';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletBackupPrivacyWarningDi... Remove this comment to see the full error message
 import styles from './WalletBackupPrivacyWarningDialog.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseDisplayDialog.tsx b/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseDisplayDialog.tsx
index 4376b7735d..6479ce126e 100644
--- a/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseDisplayDialog.tsx
+++ b/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseDisplayDialog.tsx
@@ -7,7 +7,6 @@ import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
 import WalletRecoveryInstructions from './WalletRecoveryInstructions';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseDisplayD... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseDisplayDialog.scss';
 import { WALLET_RECOVERY_PHRASE_WORD_COUNT } from '../../../config/cryptoConfig';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
diff --git a/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx b/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx
index b77715c2f9..33b091bdb0 100644
--- a/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx
+++ b/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx
@@ -21,7 +21,6 @@ import DialogBackButton from '../../widgets/DialogBackButton';
 import Dialog from '../../widgets/Dialog';
 import WalletRecoveryInstructions from './WalletRecoveryInstructions';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseEntryDia... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseEntryDialog.scss';
 import LoadingSpinner from '../../widgets/LoadingSpinner';
 
@@ -95,13 +94,16 @@ type Props = {
   onFinishBackup: (...args: Array<any>) => any;
 };
 
+interface FormFields {
+  recoveryPhrase: string;
+}
+
 @observer
 class WalletRecoveryPhraseEntryDialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         recoveryPhrase: {
@@ -151,7 +153,6 @@ class WalletRecoveryPhraseEntryDialog extends Component<Props> {
       onCancelBackup,
       onFinishBackup,
     } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = form.$('recoveryPhrase');
     const dialogClasses = classnames([
       styles.component,
diff --git a/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseMnemonic.tsx b/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseMnemonic.tsx
index eb69ce6ede..6113699c5b 100644
--- a/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseMnemonic.tsx
+++ b/source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseMnemonic.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseMnemonic... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseMnemonic.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/file-import/WalletFileImportDialog.tsx b/source/renderer/app/components/wallet/file-import/WalletFileImportDialog.tsx
index caffc8b84f..57e1ee9131 100644
--- a/source/renderer/app/components/wallet/file-import/WalletFileImportDialog.tsx
+++ b/source/renderer/app/components/wallet/file-import/WalletFileImportDialog.tsx
@@ -15,7 +15,6 @@ import {
 } from '../../../utils/validations';
 import globalMessages from '../../../i18n/global-messages';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletFileImportDialog.scss'... Remove this comment to see the full error message
 import styles from './WalletFileImportDialog.scss';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 
@@ -80,13 +79,19 @@ type Props = {
   error: LocalizableError | null | undefined;
 };
 
+interface FormFields {
+  walletFilePath: string;
+  walletName: string;
+  spendingPassword: string;
+  repeatPassword: string;
+}
+
 @observer
 class WalletFileImportDialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         walletFilePath: {
@@ -122,7 +127,7 @@ class WalletFileImportDialog extends Component<Props> {
           ),
           value: '',
           validators: [
-            () =>
+            () => {
               // const repeatPasswordField = form.$('repeatPassword');
               // if (repeatPasswordField.value.length > 0) {
               //   repeatPasswordField.validate({ showErrors: true });
@@ -133,7 +138,8 @@ class WalletFileImportDialog extends Component<Props> {
               //     globalMessages.invalidSpendingPassword
               //   ),
               // ];
-              [true], // @API TODO - missing API v2 endpoint and password declaration
+              return [true]; // @API TODO - missing API v2 endpoint and password declaration
+            },
           ],
         },
         repeatPassword: {
@@ -144,7 +150,7 @@ class WalletFileImportDialog extends Component<Props> {
           ),
           value: '',
           validators: [
-            () =>
+            () => {
               // const spendingPassword = form.$('spendingPassword').value;
               // if (spendingPassword.length === 0) return [true];
               // return [
@@ -153,7 +159,8 @@ class WalletFileImportDialog extends Component<Props> {
               //     globalMessages.invalidRepeatPassword
               //   ),
               // ];
-              [true], // @API TODO - missing API v2 endpoint and password declaration
+              return [true]; // @API TODO - missing API v2 endpoint and password declaration
+            },
           ],
         },
       },
@@ -169,7 +176,6 @@ class WalletFileImportDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { walletFilePath, spendingPassword, walletName } = form.values();
@@ -188,7 +194,6 @@ class WalletFileImportDialog extends Component<Props> {
     const { intl } = this.context;
     const { form } = this;
     const { isSubmitting, error, onClose } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const walletFilePath = form.$('walletFilePath');
     const dialogClasses = classnames([
       styles.component,
diff --git a/source/renderer/app/components/wallet/layouts/WalletWithNavigation.tsx b/source/renderer/app/components/wallet/layouts/WalletWithNavigation.tsx
index fb3aaed931..47045c8016 100644
--- a/source/renderer/app/components/wallet/layouts/WalletWithNavigation.tsx
+++ b/source/renderer/app/components/wallet/layouts/WalletWithNavigation.tsx
@@ -4,7 +4,6 @@ import type { Node } from 'react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react';
 import WalletNavigation from '../navigation/WalletNavigation';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletWithNavigation.scss' o... Remove this comment to see the full error message
 import styles from './WalletWithNavigation.scss';
 import NotResponding from '../not-responding/NotResponding';
 import SetWalletPassword from '../settings/SetWalletPassword';
diff --git a/source/renderer/app/components/wallet/not-responding/NotResponding.tsx b/source/renderer/app/components/wallet/not-responding/NotResponding.tsx
index b0ae19f4a0..94422e95fe 100644
--- a/source/renderer/app/components/wallet/not-responding/NotResponding.tsx
+++ b/source/renderer/app/components/wallet/not-responding/NotResponding.tsx
@@ -7,7 +7,6 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/not-res... Remove this comment to see the full error message
 import icon from '../../../assets/images/not-responding.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NotResponding.scss' or its c... Remove this comment to see the full error message
 import styles from './NotResponding.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx b/source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx
index 4b703488d2..5d6d965f16 100644
--- a/source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx
+++ b/source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import QRCode from 'qrcode.react';
-import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import SVGInline from 'react-svg-inline';
@@ -9,7 +8,6 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import Dialog from '../../widgets/Dialog';
 import { getNetworkExplorerUrl } from '../../../utils/network';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CompletionDialog.scss' or it... Remove this comment to see the full error message
 import styles from './CompletionDialog.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
 import iconCopy from '../../../assets/images/clipboard-ic.inline.svg';
@@ -114,7 +112,6 @@ class CompletionDialog extends Component<Props, State> {
     const { onClose, walletCertificateAddress, onOpenExternalLink, network } =
       this.props;
     const { showCopyNotification } = this.state;
-    const dialogClasses = classnames([styles.component, 'completionDialog']);
     const actions = [
       {
         className: 'finishButton',
@@ -139,14 +136,12 @@ class CompletionDialog extends Component<Props, State> {
       : '#000';
     return (
       <Dialog
-        className={dialogClasses}
+        className="completionDialog"
         title={intl.formatMessage(messages.headline)}
         actions={actions}
       >
         <div className={styles.completionContentWrapper}>
-          <p className={styles.subtitle}>
-            {intl.formatMessage(messages.subtitle)}
-          </p>
+          <p>{intl.formatMessage(messages.subtitle)}</p>
 
           <div className={styles.linkInstructionsWrapper}>
             <p>{intl.formatMessage(messages.linkInstructions)}</p>
diff --git a/source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx b/source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx
index a5585c0037..4f45a54a75 100644
--- a/source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ConfirmationDialog.scss' or ... Remove this comment to see the full error message
 import styles from './ConfirmationDialog.scss';
 
 const messages = defineMessages({
@@ -55,11 +54,7 @@ class ConfirmationDialog extends Component<Props> {
     const { intl } = this.context;
     const { onConfirm, onCancel } = this.props;
     const dialogClasses = classnames([styles.component, 'ConfirmDialog']);
-    const confirmButtonClasses = classnames([
-      'confirmButton',
-      'attention',
-      styles.confirmButton,
-    ]);
+    const confirmButtonClasses = classnames(['confirmButton', 'attention']);
     const actions = [
       {
         className: 'cancelButton',
diff --git a/source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx b/source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx
index 4ee7b33d71..53f78259f0 100644
--- a/source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx
+++ b/source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx
@@ -8,7 +8,6 @@ import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import { getNetworkExplorerUrl } from '../../../utils/network';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InstructionsDialog.scss' or ... Remove this comment to see the full error message
 import styles from './InstructionsDialog.scss';
 import { handleFormErrors } from '../../../utils/ReactToolboxMobxForm';
 import {
@@ -129,7 +128,6 @@ class InstructionsDialog extends Component<Props> {
     const { intl } = this.context;
     const { onClose, onPrint, inProgress, onOpenExternalLink, network, error } =
       this.props;
-    const dialogClasses = classnames([styles.component, 'instructionsDialog']);
     const printButtonClasses = classnames([
       'printButton',
       inProgress ? styles.submitButtonSpinning : null,
@@ -156,7 +154,7 @@ class InstructionsDialog extends Component<Props> {
     );
     return (
       <Dialog
-        className={dialogClasses}
+        className="instructionsDialog"
         title={intl.formatMessage(messages.headline)}
         actions={actions}
         closeOnOverlayClick
diff --git a/source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx b/source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx
index 1cc84cdb0a..fd564a200f 100644
--- a/source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx
+++ b/source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx
@@ -7,7 +7,6 @@ import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PrintDialog.scss' or its cor... Remove this comment to see the full error message
 import styles from './PrintDialog.scss';
 import {
   PAPER_WALLET_PRINTED_WORDS_COUNT,
@@ -96,7 +95,6 @@ class PrintDialog extends Component<Props, State> {
     const { intl } = this.context;
     const { onContinue, onClose } = this.props;
     const { isPrintedCorrectly, isReadable, isScannable } = this.state;
-    const dialogClasses = classnames([styles.component, 'printDialog']);
     const certificatePrintedCheckboxClasses = classnames([
       'printedCheckbox',
       styles.checkbox,
@@ -121,7 +119,7 @@ class PrintDialog extends Component<Props, State> {
     ];
     return (
       <Dialog
-        className={dialogClasses}
+        className="printDialog"
         title={intl.formatMessage(messages.headline)}
         actions={actions}
         onClose={onClose}
diff --git a/source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx b/source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx
index b1d8ff9b6f..30ab2e7e35 100644
--- a/source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx
+++ b/source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx
@@ -9,7 +9,6 @@ import DialogCloseButton from '../../widgets/DialogCloseButton';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/paper-w... Remove this comment to see the full error message
 import paperWalletImage from '../../../assets/images/paper-wallet-certificate/certificate.png';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SecuringPasswordDialog.scss'... Remove this comment to see the full error message
 import styles from './SecuringPasswordDialog.scss';
 import { PAPER_WALLET_WRITTEN_WORDS_COUNT } from '../../../config/cryptoConfig';
 
@@ -69,10 +68,6 @@ class SecuringPasswordDialog extends Component<Props, State> {
     const { intl } = this.context;
     const { securePasswordConfirmed } = this.state;
     const { additionalMnemonics, onContinue, onClose } = this.props;
-    const dialogClasses = classnames([
-      styles.component,
-      'SecuringPasswordDialog',
-    ]);
     const actions = [
       {
         className: 'continueButton',
@@ -84,7 +79,7 @@ class SecuringPasswordDialog extends Component<Props, State> {
     ];
     return (
       <Dialog
-        className={dialogClasses}
+        className="SecuringPasswordDialog"
         title={intl.formatMessage(messages.headline)}
         actions={actions}
         onClose={onClose}
diff --git a/source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx b/source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx
index 747c786b23..7e23d0814c 100644
--- a/source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx
+++ b/source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx
@@ -13,7 +13,6 @@ import DialogCloseButton from '../../widgets/DialogCloseButton';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import { InvalidMnemonicError } from '../../../i18n/errors';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VerificationDialog.scss' or ... Remove this comment to see the full error message
 import styles from './VerificationDialog.scss';
 import {
   PAPER_WALLET_PRINTED_WORDS_COUNT,
@@ -95,6 +94,10 @@ type Props = {
   onClose: (...args: Array<any>) => any;
 };
 
+interface FormFields {
+  recoveryPhrase: string;
+}
+
 @observer
 class VerificationDialog extends Component<Props, State> {
   static contextTypes = {
@@ -116,8 +119,7 @@ class VerificationDialog extends Component<Props, State> {
     }));
   };
   recoveryPhraseAutocomplete: Autocomplete;
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         recoveryPhrase: {
@@ -183,7 +185,6 @@ class VerificationDialog extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { recoveryPhrase } = form.values();
@@ -198,13 +199,10 @@ class VerificationDialog extends Component<Props, State> {
     const { form } = this;
     const autocomplete = this.recoveryPhraseAutocomplete;
     // Cancel all debounced field validations
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'each' does not exist on type 'ReactToolb... Remove this comment to see the full error message
     form.each((field) => {
       field.debouncedValidation.cancel();
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'reset' does not exist on type 'ReactTool... Remove this comment to see the full error message
     form.reset();
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'showErrors' does not exist on type 'Reac... Remove this comment to see the full error message
     form.showErrors(false);
     // Autocomplete has to be reset manually
     autocomplete.clear();
@@ -225,7 +223,6 @@ class VerificationDialog extends Component<Props, State> {
     const { suggestedMnemonics, onClose } = this.props;
     const { storingConfirmed, recoveringConfirmed, isRecoveryPhraseValid } =
       this.state;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = form.$('recoveryPhrase');
     const dialogClasses = classnames([styles.dialog, 'verificationDialog']);
     const storingUnderstandanceCheckboxClasses = classnames([
diff --git a/source/renderer/app/components/wallet/receive/AddressActions.tsx b/source/renderer/app/components/wallet/receive/AddressActions.tsx
index b06b259b19..a402d9d1f2 100644
--- a/source/renderer/app/components/wallet/receive/AddressActions.tsx
+++ b/source/renderer/app/components/wallet/receive/AddressActions.tsx
@@ -4,11 +4,10 @@ import classnames from 'classnames';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import { defineMessages, intlShape } from 'react-intl';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AddressActions.scss' or its ... Remove this comment to see the full error message
 import styles from './AddressActions.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/qr-code... Remove this comment to see the full error message
 import iconQR from '../../../assets/images/qr-code.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboard... Remove this comment to see the full error message
 import iconCopy from '../../../assets/images/clipboard-ic.inline.svg';
 import WalletAddress from '../../../domains/WalletAddress';
 
diff --git a/source/renderer/app/components/wallet/receive/AddressRandom.tsx b/source/renderer/app/components/wallet/receive/AddressRandom.tsx
index 30a8bdcff2..7715bd070e 100644
--- a/source/renderer/app/components/wallet/receive/AddressRandom.tsx
+++ b/source/renderer/app/components/wallet/receive/AddressRandom.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import AddressActions from './AddressActions';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AddressRandom.scss' or its c... Remove this comment to see the full error message
 import styles from './AddressRandom.scss';
 import WalletAddress from '../../../domains/WalletAddress';
 
diff --git a/source/renderer/app/components/wallet/receive/AddressSequential.tsx b/source/renderer/app/components/wallet/receive/AddressSequential.tsx
index ed2dc3c04e..68db531500 100644
--- a/source/renderer/app/components/wallet/receive/AddressSequential.tsx
+++ b/source/renderer/app/components/wallet/receive/AddressSequential.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import AddressActions from './AddressActions';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AddressSequential.scss' or i... Remove this comment to see the full error message
 import styles from './AddressSequential.scss';
 import WalletAddress from '../../../domains/WalletAddress';
 
diff --git a/source/renderer/app/components/wallet/receive/VirtualAddressesList.tsx b/source/renderer/app/components/wallet/receive/VirtualAddressesList.tsx
index 266d010ec5..b7ccd7cff0 100644
--- a/source/renderer/app/components/wallet/receive/VirtualAddressesList.tsx
+++ b/source/renderer/app/components/wallet/receive/VirtualAddressesList.tsx
@@ -3,7 +3,6 @@ import { throttle } from 'lodash';
 import { observer } from 'mobx-react';
 import { AutoSizer, List } from 'react-virtualized';
 import WalletAddress from '../../../domains/WalletAddress';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VirtualAddressesList.scss' o... Remove this comment to see the full error message
 import styles from './VirtualAddressesList.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx b/source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx
index 03c662cac4..a0af533832 100644
--- a/source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx
+++ b/source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx
@@ -17,11 +17,9 @@ import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import WalletAddress from '../../../domains/WalletAddress';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletReceiveDialog.scss' or... Remove this comment to see the full error message
 import styles from './WalletReceiveDialog.scss';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import HardwareWalletStatus from '../../hardware-wallet/HardwareWalletStatus';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
 import iconCopy from '../../../assets/images/clipboard-ic.inline.svg';
 import { HW_SHELLEY_CONFIG } from '../../../config/hardwareWalletsConfig';
 import { hardenedPathToDerivationPath } from '../../../utils/hardwareWalletUtils';
@@ -158,6 +156,10 @@ type State = {
   isReverifying: boolean;
 };
 
+interface FormFields {
+  noteInput: string;
+}
+
 @observer
 class WalletReceiveDialog extends Component<Props, State> {
   static contextTypes = {
@@ -168,8 +170,7 @@ class WalletReceiveDialog extends Component<Props, State> {
     isInvalidAddressConfirmed: false,
     isReverifying: false,
   };
-  // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
-  form = new ReactToolboxMobxForm({
+  form = new ReactToolboxMobxForm<FormFields>({
     fields: {
       noteInput: {
         value: '',
@@ -179,7 +180,6 @@ class WalletReceiveDialog extends Component<Props, State> {
     },
   });
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { noteInput } = form.values();
@@ -187,6 +187,7 @@ class WalletReceiveDialog extends Component<Props, State> {
         onDownloadPDF(noteInput);
       },
       onError: (err) => {
+        // @ts-ignore Argument of type 'MobxReactForm<Fields>' is not assignable to parameter of type 'string'.
         throw new Error(err);
       },
     });
@@ -271,14 +272,9 @@ class WalletReceiveDialog extends Component<Props, State> {
       isReverifying,
     } = this.state;
     const { intl } = this.context;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const noteInputField = this.form.$('noteInput');
     const deviceType = isHardwareWallet && isTrezor ? 'Trezor' : 'Ledger';
     const isSubmitting = false;
-    const buttonClasses = classnames([
-      'attention',
-      isSubmitting ? styles.isSubmitting : null,
-    ]);
     const supportButtonLabel = !isSubmitting ? (
       intl.formatMessage(messages.supportRequestButtonLabel)
     ) : (
@@ -294,7 +290,7 @@ class WalletReceiveDialog extends Component<Props, State> {
       );
       actions = [
         {
-          className: buttonClasses,
+          className: 'attention',
           label: supportButtonLabel,
           onClick: onSupportRequestClick.bind(this, supportRequestLinkUrl),
           disabled: !isInvalidAddressConfirmed,
@@ -497,7 +493,7 @@ class WalletReceiveDialog extends Component<Props, State> {
                 <p className={styles.warningTitle}>
                   {intl.formatMessage(messages.invalidAddressWarningTitle)}
                 </p>
-                <p className={styles.warningDescription}>
+                <p>
                   {intl.formatMessage(
                     messages.invalidAddressWarningDescription,
                     {
diff --git a/source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx b/source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx
index 55a862bf8c..5dd35f968b 100644
--- a/source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx
+++ b/source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx
@@ -14,12 +14,10 @@ import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import { submitOnEnter } from '../../../utils/form';
 import BorderedBox from '../../widgets/BorderedBox';
 import TinySwitch from '../../widgets/forms/TinySwitch';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
 import iconCopy from '../../../assets/images/clipboard-ic.inline.svg';
 import globalMessages from '../../../i18n/global-messages';
 import LocalizableError from '../../../i18n/LocalizableError';
 import { VirtualAddressesList } from './VirtualAddressesList';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletReceiveRandom.scss' or... Remove this comment to see the full error message
 import styles from './WalletReceiveRandom.scss';
 import AddressRandom from './AddressRandom';
 import WalletAddress from '../../../domains/WalletAddress';
@@ -83,6 +81,10 @@ type Props = {
   onToggleUsedAddresses: (...args: Array<any>) => any;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class WalletReceiveRandom extends Component<Props> {
   static contextTypes = {
@@ -93,8 +95,7 @@ class WalletReceiveRandom extends Component<Props> {
     const { onToggleUsedAddresses } = this.props;
     onToggleUsedAddresses();
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -141,7 +142,6 @@ class WalletReceiveRandom extends Component<Props> {
     />
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { spendingPassword } = form.values();
@@ -189,7 +189,6 @@ class WalletReceiveRandom extends Component<Props> {
       walletHasPassword ? styles.submitWithPasswordButton : styles.submitButton,
       isSubmitting ? styles.spinning : null,
     ]);
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const passwordField = form.$('spendingPassword');
     const canSubmit = !isSubmitting && passwordField.value;
     const generateAddressForm = (
diff --git a/source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx b/source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx
index 2a5f0f559b..a0e52e846b 100644
--- a/source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx
+++ b/source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx
@@ -7,7 +7,6 @@ import TinySwitch from '../../widgets/forms/TinySwitch';
 import WalletAddress from '../../../domains/WalletAddress';
 import globalMessages from '../../../i18n/global-messages';
 import { VirtualAddressesList } from './VirtualAddressesList';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletReceiveSequential.scss... Remove this comment to see the full error message
 import styles from './WalletReceiveSequential.scss';
 import AddressSequential from './AddressSequential';
 
@@ -160,7 +159,7 @@ class WalletReceiveSequential extends Component<Props, State> {
       <div className={styles.component}>
         <BorderedBox fullHeight>
           <div className={styles.container}>
-            <div className={styles.instructions}>
+            <div>
               <h2 className={styles.instructionsTitle}>
                 {intl.formatMessage(messages.instructionsTitle)}
               </h2>
diff --git a/source/renderer/app/components/wallet/send-form/AssetInput.scss b/source/renderer/app/components/wallet/send-form/AssetInput.scss
index 14e2eaeac9..59c5c0be36 100644
--- a/source/renderer/app/components/wallet/send-form/AssetInput.scss
+++ b/source/renderer/app/components/wallet/send-form/AssetInput.scss
@@ -2,7 +2,7 @@
 @import '../../../themes/mixins/error-message';
 
 .component {
-  position: relative;
+  display: flex;
 
   .amountTokenTotal {
     color: var(--theme-input-right-floating-text-color);
@@ -14,147 +14,112 @@
     top: 2px;
   }
 
+  .amountValue {
+    &:before {
+      content: ' ';
+    }
+  }
+
   .assetItem {
     margin-bottom: 20px;
   }
 
   .removeAssetButton {
-    border-radius: 5px;
-    box-sizing: border-box;
+    align-items: center;
+    border-radius: 3px;
+    color: var(--theme-staking-stake-pools-search-clear-button-color);
     cursor: pointer;
-    display: inline-block;
-    font-family: var(--font-semibold);
-    font-size: 10px;
-    font-weight: 500;
-    height: 20px;
-    letter-spacing: 0.5px;
-    line-height: 20px;
-    margin: 1px 0 0 10px;
-    padding: 0 8px;
-    text-transform: uppercase;
-    vertical-align: top;
-    width: auto;
+    display: flex;
+    height: 28px;
+    justify-content: center;
+    width: 28px;
   }
 
   .rightContent {
+    align-items: center;
     bottom: 0;
     display: inline-flex;
     height: 48px;
     position: absolute;
-    right: 0;
+    right: 10px;
+    top: 34px;
   }
 
-  .clearAssetContainer {
-    bottom: 0.5px;
-    display: flex;
-    float: right;
-    height: 48px;
-    justify-content: flex-end;
-    line-height: 48px;
-    padding-left: 20px;
+  .inputBlock {
+    flex: 1 1 auto;
     position: relative;
-    right: 10px;
-    width: 50px;
+  }
+}
 
-    .clearAssetButton {
+.clearAssetContainer {
+  align-items: center;
+  display: flex;
+  height: 48px;
+
+  .clearAssetButton {
+    background-color: var(
+      --theme-staking-stake-pools-search-clear-button-background-color
+    );
+    border-radius: 3px;
+    cursor: pointer;
+    height: 28px;
+    width: 28px;
+
+    &:hover {
       background-color: var(
-        --theme-staking-stake-pools-search-clear-button-background-color
+        --theme-staking-stake-pools-search-clear-button-hover-background-color
       );
-      border-radius: 3px;
-      cursor: pointer;
-      height: 28px;
-      width: 28px;
-
-      &:hover {
-        background-color: var(
-          --theme-staking-stake-pools-search-clear-button-hover-background-color
-        );
-      }
+    }
 
-      .clearReceiverIcon {
-        > svg {
-          position: relative;
-          top: 0.5px;
-          width: 10px;
+    .clearReceiverIcon {
+      > svg {
+        position: relative;
+        top: 0.5px;
+        width: 10px;
 
-          > g > g {
-            fill: var(--theme-staking-stake-pools-search-clear-button-color);
-          }
+        > g > g {
+          fill: var(--theme-staking-stake-pools-search-clear-button-color);
         }
       }
     }
   }
 
-  .separator {
-    background: var(--rp-input-border-color);
-    height: 20px;
-    left: 15px;
-    position: relative;
-    top: 15px;
-    width: 1px;
+  & + .ticker {
+    margin-left: 10px;
   }
+}
 
-  .assetsDropdownWrapper {
-    display: flex;
-    position: relative;
-    width: auto;
-
-    > div {
-      width: 100%;
-    }
-
-    .assetsDropdown {
-      input {
-        border: none;
-        height: 48px;
-      }
-
-      :global {
-        .SimpleSelect_selectInput.SelectOverrides_selectInput
-          .WalletsDropdownOption_component {
-          max-width: 100%;
-        }
-
-        .SimpleSelect_selectInput.SelectOverrides_selectInput
-          .WalletsDropdownOption_selected
-          .WalletsDropdownOption_topRow {
-          justify-content: flex-end;
-        }
-
-        .SimpleSelect_selectInput.SelectOverrides_selectInput
-          .WalletsDropdownOption_label {
-          .Asset_content {
-            margin-right: 24.5px;
-          }
-        }
-
-        .ItemDropdownOption_selected {
-          .ItemDropdownOption_label {
-            margin-top: 5px;
-          }
-          .ItemDropdownOption_detail {
-            display: none !important;
-          }
-        }
+.divider {
+  background-color: var(--theme-input-placeholder-color);
+  height: 20px;
+  margin: 0 20px;
+  opacity: 0.2;
+  width: 1px;
+}
 
-        .SimpleOptions_option {
-          padding: 6px 15px;
-        }
+.ticker {
+  color: var(--theme-input-placeholder-color);
+  font-family: var(--font-regular);
+  font-size: 16px;
+  font-weight: 300;
+  margin-right: 10px;
+  text-transform: uppercase;
+  z-index: 1;
+}
 
-        .OptionsOverrides_options {
-          left: auto !important;
-          min-width: 289px;
-          right: 41px !important;
-        }
+.removeAssetBlock {
+  align-items: center;
+  display: flex;
+  height: 48px;
+  margin: 34px 11px 0 11px;
+}
 
-        .SimpleBubble_root:not(.SimpleBubble_openUpward) .SimpleBubble_bubble {
-          border-radius: 2px;
-        }
+.removeIcon {
+  align-items: center;
+  display: flex;
+  justify-content: center;
 
-        .SelectOverrides_selectInput .SimpleInput_customValueBlock {
-          background: transparent;
-        }
-      }
-    }
+  & > svg {
+    height: 2px;
   }
 }
diff --git a/source/renderer/app/components/wallet/send-form/AssetInput.tsx b/source/renderer/app/components/wallet/send-form/AssetInput.tsx
index 2fdefa6074..d6a4b8ee1d 100644
--- a/source/renderer/app/components/wallet/send-form/AssetInput.tsx
+++ b/source/renderer/app/components/wallet/send-form/AssetInput.tsx
@@ -2,38 +2,33 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import type { Field } from 'mobx-react-form';
 import { intlShape } from 'react-intl';
-import { get, orderBy } from 'lodash';
+import { get } from 'lodash';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
 import { NumericInput } from 'react-polymorph/lib/components/NumericInput';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import AmountInputSkin from '../skins/AmountInputSkin';
-import AssetsDropdown from '../../widgets/forms/AssetsDropdown';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message
 import closeIcon from '../../../assets/images/close-cross.inline.svg';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/remove.... Remove this comment to see the full error message
+import removeIcon from '../../../assets/images/remove.inline.svg';
 import type { NumberFormat } from '../../../../../common/types/number.types';
-import type { AssetToken } from '../../../api/assets/types';
 import { DiscreetTokenWalletAmount } from '../../../features/discreet-mode';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetInput.scss' or its corr... Remove this comment to see the full error message
+import Asset from '../../assets/Asset';
+import { Divider } from '../widgets/Divider';
+import { ClearButton } from '../widgets/ClearButton';
 import styles from './AssetInput.scss';
 import messages from './messages';
 
 type Props = {
   uniqueId: string;
-  index: number;
   getAssetByUniqueId: (...args: Array<any>) => any;
-  availableAssets: Array<AssetToken>;
   assetFields: Record<string, Field>;
-  assetsDropdown: Record<string, Field>;
   addFocusableField: (...args: Array<any>) => any;
-  removeAssetButtonVisible: Record<string, boolean>;
-  showRemoveAssetButton: (...args: Array<any>) => any;
-  hideRemoveAssetButton: (...args: Array<any>) => any;
   currentNumberFormat: NumberFormat;
   removeAssetRow: (...args: Array<any>) => any;
   handleSubmitOnEnter: (...args: Array<any>) => any;
   clearAssetFieldValue: (...args: Array<any>) => any;
-  onChangeAsset: (...args: Array<any>) => any;
   autoFocus: boolean;
 };
 const INPUT_FIELD_PADDING_DELTA = 10;
@@ -52,7 +47,9 @@ class AssetInput extends Component<Props> {
     this.rightContentRef = React.createRef();
   }
 
-  hasAssetValue = (asset: Field) => get(asset, 'value', false);
+  hasAssetValue = (asset: Field) => {
+    return get(asset, 'value', false);
+  };
   generateInputFieldStyle = () => {
     const { current: rightContentDom } = this.rightContentRef;
 
@@ -72,20 +69,13 @@ class AssetInput extends Component<Props> {
     const { intl } = this.context;
     const {
       uniqueId,
-      index,
       getAssetByUniqueId,
-      availableAssets,
       assetFields,
-      assetsDropdown,
       addFocusableField,
-      removeAssetButtonVisible,
-      showRemoveAssetButton,
-      hideRemoveAssetButton,
       currentNumberFormat,
       removeAssetRow,
       handleSubmitOnEnter,
       clearAssetFieldValue,
-      onChangeAsset,
       autoFocus,
     } = this.props;
     const asset = getAssetByUniqueId(uniqueId);
@@ -96,120 +86,91 @@ class AssetInput extends Component<Props> {
 
     const { quantity, metadata, decimals } = asset;
     const ticker = get(metadata, 'ticker', null);
-    const sortedAssets = orderBy(
-      [asset, ...availableAssets],
-      'uniqueId',
-      'asc'
-    );
     const assetField = assetFields[uniqueId];
-    const assetsDropdownField = assetsDropdown[uniqueId];
     const inputFieldStyle = this.generateInputFieldStyle();
     return (
-      <div
-        key={`receiver_asset_${uniqueId}`}
-        onMouseOver={() => showRemoveAssetButton(uniqueId)}
-        onMouseLeave={() => hideRemoveAssetButton(uniqueId)}
-        onMouseEnter={() => showRemoveAssetButton(uniqueId)}
-        onFocus={() => {
-          // jsx-a11y/mouse-events-have-key-events
-        }}
-        className={styles.component}
-      >
-        {quantity.isPositive() && (
-          <div className={styles.amountTokenTotal}>
-            {intl.formatMessage(messages.ofLabel)}
-            {` `}
-            <DiscreetTokenWalletAmount
-              amount={quantity}
-              metadata={metadata}
-              decimals={decimals}
-            />
-          </div>
-        )}
-        <NumericInput
-          {...assetField.bind()}
-          ref={(field) => addFocusableField(field)}
-          placeholder={
-            decimals
-              ? `0${currentNumberFormat.decimalSeparator}${'0'.repeat(
-                  decimals
-                )}`
-              : '0'
-          }
-          className={styles.assetItem}
-          label={
-            <>
-              {`${intl.formatMessage(messages.assetLabel)} #${index + 1}`}
-              {removeAssetButtonVisible[uniqueId] && (
-                <span
-                  className={classNames([styles.removeAssetButton, 'flat'])}
-                  onClick={() => removeAssetRow(uniqueId)}
-                >
-                  {intl.formatMessage(messages.removeLabel)}
-                </span>
-              )}
-            </>
-          }
-          bigNumberFormat={decimals ? currentNumberFormat : null}
-          decimalPlaces={decimals}
-          numberLocaleOptions={{
-            minimumFractionDigits: decimals,
-          }}
-          onChange={(value) => {
-            assetField.onChange(value);
-          }}
-          currency={ticker}
-          value={assetField.value}
-          error={assetField.error}
-          skin={AmountInputSkin}
-          style={inputFieldStyle}
-          onKeyPress={(evt: React.KeyboardEvent<EventTarget>) => {
-            if (decimals === 0) {
-              const { charCode } = evt;
+      <div key={`receiver_asset_${uniqueId}`} className={styles.component}>
+        <div className={styles.inputBlock}>
+          {quantity.isPositive() && (
+            <div className={styles.amountTokenTotal}>
+              {intl.formatMessage(messages.ofLabel)}
+              <span className={styles.amountValue}>
+                <DiscreetTokenWalletAmount
+                  amount={quantity}
+                  metadata={metadata}
+                  decimals={decimals}
+                />
+              </span>
+            </div>
+          )}
+          <NumericInput
+            {...assetField.bind()}
+            ref={(field) => addFocusableField(field)}
+            placeholder={
+              decimals
+                ? `0${currentNumberFormat.decimalSeparator}${'0'.repeat(
+                    decimals
+                  )}`
+                : '0'
+            }
+            className={styles.assetItem}
+            label={<Asset asset={asset} hidePopOver small />}
+            data-testid={`assetInput:${uniqueId}`}
+            bigNumberFormat={decimals ? currentNumberFormat : null}
+            decimalPlaces={decimals}
+            numberLocaleOptions={{
+              minimumFractionDigits: decimals,
+            }}
+            onChange={(value) => {
+              assetField.onChange(value);
+            }}
+            currency={ticker}
+            value={assetField.value}
+            error={assetField.error}
+            skin={AmountInputSkin}
+            style={inputFieldStyle}
+            onKeyPress={(evt: React.KeyboardEvent<EventTarget>) => {
+              if (decimals === 0) {
+                const { charCode } = evt;
 
-              if (charCode === 190 || charCode === 110 || charCode === 46) {
-                evt.persist();
-                evt.preventDefault();
-                evt.stopPropagation();
+                if (charCode === 190 || charCode === 110 || charCode === 46) {
+                  evt.persist();
+                  evt.preventDefault();
+                  evt.stopPropagation();
+                }
               }
-            }
 
-            handleSubmitOnEnter(evt);
-          }}
-          allowSigns={false}
-          autoFocus={autoFocus}
-        />
-        <div className={styles.rightContent} ref={this.rightContentRef}>
-          {this.hasAssetValue(assetField) && (
-            <div className={styles.clearAssetContainer}>
-              <PopOver
-                content={intl.formatMessage(messages.clearLabel)}
-                placement="top"
-              >
-                <button
+              handleSubmitOnEnter(evt);
+            }}
+            allowSigns={false}
+            autoFocus={autoFocus}
+          />
+          <div className={styles.rightContent} ref={this.rightContentRef}>
+            {this.hasAssetValue(assetField) && (
+              <div className={styles.clearAssetContainer}>
+                <ClearButton
+                  label={intl.formatMessage(messages.clearLabel)}
                   onClick={() => clearAssetFieldValue(assetField)}
-                  className={styles.clearAssetButton}
-                >
-                  <SVGInline
-                    svg={closeIcon}
-                    className={styles.clearReceiverIcon}
-                  />
-                </button>
-              </PopOver>
-              <div className={styles.separator} />
-            </div>
-          )}
-          <div className={styles.assetsDropdownWrapper}>
-            <AssetsDropdown
-              className={styles.assetsDropdown}
-              {...assetsDropdownField.bind()}
-              assets={sortedAssets}
-              onChange={onChangeAsset}
-              value={uniqueId}
-              hasSearch
-            />
+                />
+              </div>
+            )}
+            {ticker ? (
+              <>
+                <Divider />
+                <span className={styles.ticker}>{ticker}</span>
+              </>
+            ) : null}
           </div>
         </div>
+        <div className={styles.removeAssetBlock}>
+          <span
+            className={classNames([styles.removeAssetButton, 'flat'])}
+            onClick={() => removeAssetRow(uniqueId)}
+            data-testid={`removeAsset:${uniqueId}`}
+          >
+            <SVGInline svg={removeIcon} className={styles.removeIcon} />
+          </span>
+        </div>
       </div>
     );
   }
diff --git a/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts b/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts
index 319ace9ef8..3970c87590 100644
--- a/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts
+++ b/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts
@@ -90,19 +90,19 @@ export const getMessages = () => {
     unformattedAmountLabel: {
       id: 'wallet.send.confirmationDialog.unformattedAmountLabel',
       defaultMessage: '!!!unformatted amount',
-      description: 'Label for "unformated amount"',
+      description: 'Label for "unformatted amount"',
     },
     unformattedAmountMessageForSoftwareWallets: {
       id: 'wallet.send.confirmationDialog.unformattedAmountMessageForSoftwareWallets',
       defaultMessage:
         '!!!Native assets may specify a number of decimal places, as defined in the Cardano token registry. Daedalus uses this information to format the amount that is being sent in the transaction.<br /><br />The native token unformatted amount is the amount without these decimal places. Please ensure that you verify both amounts, as some wallet software may not yet use the Cardano token registry.',
-      description: 'Message for "unformated amount"',
+      description: 'Message for "unformatted amount"',
     },
     unformattedAmountMessageForHardwareWallets: {
       id: 'wallet.send.confirmationDialog.unformattedAmountMessageForHardwareWallets',
       defaultMessage:
         '!!!Native assets may specify a number of decimal places, as defined in the Cardano token registry. Daedalus uses this information to format the amount that is being sent in the transaction.<br /><br />The native token unformatted amount is the amount without these decimal places. Please ensure that you verify both amounts, as some wallet software may not yet use the Cardano token registry.<br /><br />The native token unformatted amount will be displayed on the hardware wallet device during transaction confirmation.',
-      description: 'Message for "unformated amount"',
+      description: 'Message for "unformatted amount"',
     },
     emptyingWarning: {
       id: 'wallet.send.confirmationDialog.emptyingWarning',
diff --git a/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.tsx b/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.tsx
index b9a0be98ca..c0aee20300 100644
--- a/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.tsx
@@ -14,9 +14,7 @@ import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSendAssetsConfirmation... Remove this comment to see the full error message
 import styles from './WalletSendAssetsConfirmationDialog.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/questio... Remove this comment to see the full error message
 import questionMarkIcon from '../../../assets/images/question-mark.inline.svg';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 import { submitOnEnter } from '../../../utils/form';
@@ -62,6 +60,12 @@ type State = {
   assetsAmounts: Array<string>;
   areTermsAccepted: boolean;
 };
+
+interface FormFields {
+  passphrase: string;
+  flightCandidateCheckbox: string;
+}
+
 const messages = getMessages();
 
 @observer
@@ -87,8 +91,7 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
     });
   }
 
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         passphrase: {
@@ -132,13 +135,15 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { selectedAssets, assetsAmounts } = this.state;
         const { receiver, amount, amountToNaturalUnits, isHardwareWallet } =
           this.props;
         const { passphrase } = form.values();
+        const hasAssetsRemainingAfterTransaction =
+          this.props.selectedAssets.length <
+          this.props.allAvailableTokens?.length;
         const transactionData = {
           receiver,
           amount: amountToNaturalUnits(amount),
@@ -146,6 +151,7 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
           isHardwareWallet,
           assets: selectedAssets,
           assetsAmounts,
+          hasAssetsRemainingAfterTransaction,
         };
         this.props.onSubmit(transactionData);
       },
@@ -153,13 +159,13 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
     });
   };
   handleSubmitOnEnter = (event: KeyboardEvent) =>
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     (this.props.isHardwareWallet || this.form.$('passphrase').isValid) &&
+    this.props.error?.id !==
+      'api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens' &&
     submitOnEnter(this.submit, event);
   renderConfirmationElement = (
     isHardwareWallet: boolean
   ): React.ReactElement<React.ComponentProps<any>, any> | null => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const passphraseField = this.form.$('passphrase');
     const { areTermsAccepted } = this.state;
     const { hwDeviceStatus, isFlight, onExternalLinkClick, wallet, isTrezor } =
@@ -222,9 +228,7 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
     const { form } = this;
     const { intl } = this.context;
     const { selectedAssets, areTermsAccepted, assetsAmounts } = this.state;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const passphraseField = form.$('passphrase');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const flightCandidateCheckboxField = form.$('flightCandidateCheckbox');
     const {
       onCancel,
@@ -259,6 +263,8 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
         primary: true,
         className: 'confirmButton',
         disabled:
+          error?.id ===
+            'api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens' ||
           (!isHardwareWallet && !passphraseField.isValid) ||
           (isHardwareWallet &&
             hwDeviceStatus !==
@@ -273,7 +279,6 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
     let errorElement = null;
 
     if (error) {
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'Localiza... Remove this comment to see the full error message
       const errorHasLink = !!error.values.linkLabel;
       errorElement = errorHasLink ? (
         <FormattedHTMLMessageWithLink
@@ -282,7 +287,7 @@ class WalletSendAssetsConfirmationDialog extends Component<Props, State> {
           onExternalLinkClick={onExternalLinkClick}
         />
       ) : (
-        intl.formatMessage(error)
+        <FormattedHTMLMessage {...error} />
       );
     }
 
diff --git a/source/renderer/app/components/wallet/send-form/WalletSendConfirmationDialog.tsx b/source/renderer/app/components/wallet/send-form/WalletSendConfirmationDialog.tsx
index 3525e88e5b..d73a08796e 100644
--- a/source/renderer/app/components/wallet/send-form/WalletSendConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/send-form/WalletSendConfirmationDialog.tsx
@@ -11,7 +11,6 @@ import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSendConfirmationDialog... Remove this comment to see the full error message
 import styles from './WalletSendConfirmationDialog.scss';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 import { submitOnEnter } from '../../../utils/form';
@@ -48,6 +47,12 @@ type Props = {
 type State = {
   areTermsAccepted: boolean;
 };
+
+interface FormFields {
+  flightCandidateCheckbox: string;
+  passphrase: string;
+}
+
 const messages = getMessages();
 
 @observer
@@ -58,8 +63,7 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
   state = {
     areTermsAccepted: false,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         passphrase: {
@@ -103,17 +107,19 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { receiver, amount, amountToNaturalUnits, isHardwareWallet } =
           this.props;
         const { passphrase } = form.values();
+        const hasAssetsRemainingAfterTransaction =
+          this.props.allAvailableTokens?.length > 0;
         const transactionData = {
           receiver,
           amount: amountToNaturalUnits(amount),
           passphrase,
           isHardwareWallet,
+          hasAssetsRemainingAfterTransaction,
         };
         this.props.onSubmit(transactionData);
       },
@@ -121,13 +127,13 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
     });
   };
   handleSubmitOnEnter = (event: KeyboardEvent) =>
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     (this.props.isHardwareWallet || this.form.$('passphrase').isValid) &&
+    this.props.error?.id !==
+      'api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens' &&
     submitOnEnter(this.submit, event);
   renderConfirmationElement = (
     isHardwareWallet: boolean
   ): React.ReactElement<React.ComponentProps<any>, any> | null | undefined => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const passphraseField = this.form.$('passphrase');
     const { areTermsAccepted } = this.state;
     const { hwDeviceStatus, isFlight, onExternalLinkClick, wallet, isTrezor } =
@@ -174,9 +180,7 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
     const { form } = this;
     const { intl } = this.context;
     const { areTermsAccepted } = this.state;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const passphraseField = form.$('passphrase');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const flightCandidateCheckboxField = form.$('flightCandidateCheckbox');
     const {
       onCancel,
@@ -210,6 +214,8 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
         primary: true,
         className: 'confirmButton',
         disabled:
+          error?.id ===
+            'api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens' ||
           (!isHardwareWallet && !passphraseField.isValid) ||
           (isHardwareWallet &&
             hwDeviceStatus !==
@@ -220,7 +226,6 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
     let errorElement = null;
 
     if (error) {
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'Localiza... Remove this comment to see the full error message
       const errorHasLink = !!error.values.linkLabel;
       errorElement = errorHasLink ? (
         <FormattedHTMLMessageWithLink
@@ -229,7 +234,7 @@ class WalletSendConfirmationDialog extends Component<Props, State> {
           onExternalLinkClick={onExternalLinkClick}
         />
       ) : (
-        intl.formatMessage(error)
+        <FormattedHTMLMessage {...error} />
       );
     }
 
diff --git a/source/renderer/app/components/wallet/send-form/messages.ts b/source/renderer/app/components/wallet/send-form/messages.ts
index 553dd422a4..b927aa0317 100644
--- a/source/renderer/app/components/wallet/send-form/messages.ts
+++ b/source/renderer/app/components/wallet/send-form/messages.ts
@@ -131,4 +131,28 @@ export default defineMessages({
     description:
       'Label for the "Calculating fees" message for amount input field.',
   },
+  updateAdaAmountButton: {
+    id: 'wallet.send.form.asset.updateAdaAmountButton',
+    defaultMessage: '!!!UPDATE',
+    description:
+      'Label for the "UPDATE" button responsible to set minimum amount required for transaction .',
+  },
+  updateAdaAmountDescription: {
+    id: 'wallet.send.form.updateAdaAmountDescription',
+    defaultMessage: '!!!to the minimum of {minimumAda} ADA required',
+    description:
+      'Description for the "UPDATE" button when ADA amount is less than required ',
+  },
+  minimumAmountNotice: {
+    id: 'wallet.send.form.minimumAmountNote',
+    defaultMessage:
+      '!!!<b>Note:</b> the ada field was automatically updated because this transaction requires a minimum of {minimumAda} ADA.',
+    description: 'Minimum amount update notice',
+  },
+  restoredAdaAmount: {
+    id: 'wallet.send.form.restoredAdaAmount',
+    defaultMessage:
+      '!!!<b>Note:</b> the ada field was automatically updated to {adaAmount} ADA because now it fulfills the minimum amount of {minimumAda} ADA for the transaction.',
+    description: 'Restored ada amount to original user input',
+  },
 });
diff --git a/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.scss b/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.scss
index 52d0de0afd..0456b3afba 100644
--- a/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.scss
+++ b/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.scss
@@ -75,6 +75,10 @@
     }
   }
 
+  .repeatedPassword {
+    width: 100%;
+  }
+
   .error {
     @include error-message;
     margin-top: 27px;
diff --git a/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx b/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx
index f0f3148224..3a6a8717c8 100644
--- a/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx
@@ -16,7 +16,6 @@ import {
 import globalMessages from '../../../i18n/global-messages';
 import LocalizableError from '../../../i18n/LocalizableError';
 import { PasswordInput } from '../../widgets/forms/PasswordInput';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ChangeSpendingPasswordDialog... Remove this comment to see the full error message
 import styles from './ChangeSpendingPasswordDialog.scss';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 import { submitOnEnter } from '../../../utils/form';
@@ -99,6 +98,12 @@ type Props = {
   currentLocale: string;
 };
 
+interface FormFields {
+  currentPassword: string;
+  spendingPassword: string;
+  repeatPassword: string;
+}
+
 @observer
 class ChangeSpendingPasswordDialog extends Component<Props> {
   static defaultProps = {
@@ -109,8 +114,7 @@ class ChangeSpendingPasswordDialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         currentPassword: {
@@ -199,7 +203,6 @@ class ChangeSpendingPasswordDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { currentPassword, spendingPassword } = form.values();
@@ -243,13 +246,9 @@ class ChangeSpendingPasswordDialog extends Component<Props> {
       currentLocale === 'ja-JP' ? styles.jpLangTooltipIcon : '',
     ]);
     const newPasswordClasses = classnames(['newPassword', styles.newPassword]);
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const currentPasswordField = form.$('currentPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const newPasswordField = form.$('spendingPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const repeatedPasswordField = form.$('repeatPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
     const canSubmit = !isSubmitting && form.isValid;
     const currentPasswordError =
       // @ts-ignore ts-migrate(2339) FIXME: Property 'code' does not exist on type 'Localizabl... Remove this comment to see the full error message
diff --git a/source/renderer/app/components/wallet/settings/DelegateWalletButton.tsx b/source/renderer/app/components/wallet/settings/DelegateWalletButton.tsx
index 5c44398d20..eff16106fa 100644
--- a/source/renderer/app/components/wallet/settings/DelegateWalletButton.tsx
+++ b/source/renderer/app/components/wallet/settings/DelegateWalletButton.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Button } from 'react-polymorph/lib/components/Button';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DelegateWalletButton.scss' o... Remove this comment to see the full error message
 import styles from './DelegateWalletButton.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/settings/DeleteWallet.tsx b/source/renderer/app/components/wallet/settings/DeleteWallet.tsx
index 52374a146c..5eb4816a74 100644
--- a/source/renderer/app/components/wallet/settings/DeleteWallet.tsx
+++ b/source/renderer/app/components/wallet/settings/DeleteWallet.tsx
@@ -3,7 +3,6 @@ import type { Node } from 'react';
 import React from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, injectIntl, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSettings.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletSettings.scss';
 import type { ReactIntlMessage } from '../../../types/i18nTypes';
 import BorderedBox from '../../widgets/BorderedBox';
diff --git a/source/renderer/app/components/wallet/settings/DeleteWalletConfirmation.tsx b/source/renderer/app/components/wallet/settings/DeleteWalletConfirmation.tsx
index 4a6b2b37d2..d5822f9f62 100644
--- a/source/renderer/app/components/wallet/settings/DeleteWalletConfirmation.tsx
+++ b/source/renderer/app/components/wallet/settings/DeleteWalletConfirmation.tsx
@@ -4,7 +4,6 @@ import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import { submitOnEnter } from '../../../utils/form';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DeleteWalletConfirmationDial... Remove this comment to see the full error message
 import styles from './DeleteWalletConfirmationDialog.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/settings/ExportWalletToFileDialog.tsx b/source/renderer/app/components/wallet/settings/ExportWalletToFileDialog.tsx
index d79b0e3ed2..675e6cd70e 100644
--- a/source/renderer/app/components/wallet/settings/ExportWalletToFileDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/ExportWalletToFileDialog.tsx
@@ -65,6 +65,10 @@ type State = {
   exportType: ExportType;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class ExportWalletToFileDialog extends Component<Props, State> {
   static contextTypes = {
@@ -82,8 +86,7 @@ class ExportWalletToFileDialog extends Component<Props, State> {
   // onChangeExportType(exportType: ExportType) {
   //   this.setState({ exportType });
   // }
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -96,7 +99,7 @@ class ExportWalletToFileDialog extends Component<Props, State> {
           ),
           value: '',
           validators: [
-            () =>
+            () => {
               // if (field.value === '') {
               //   return [
               //     false,
@@ -105,7 +108,8 @@ class ExportWalletToFileDialog extends Component<Props, State> {
               //     ),
               //   ];
               // }
-              [true],
+              return [true];
+            },
           ],
         },
       },
@@ -121,7 +125,6 @@ class ExportWalletToFileDialog extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: async (form) => {
         const { spendingPassword } = form.values();
diff --git a/source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx b/source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx
index ec2bec5458..88ea4169d6 100644
--- a/source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx
+++ b/source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { defineMessages, injectIntl, intlShape } from 'react-intl';
 import BorderedBox from '../../widgets/BorderedBox';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSettings.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletSettings.scss';
 import PublicKeyQRCodeDialog from './ICOPublicKeyQRCodeDialog';
 import ICOPublicKeyDialog from './ICOPublicKeyDialog';
diff --git a/source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx b/source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx
index 09769e3b3f..215f99c510 100644
--- a/source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Input } from 'react-polymorph/lib/components/Input';
 import vjf from 'mobx-react-form/lib/validators/VJF';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PublicKeyDialog.scss' or its... Remove this comment to see the full error message
 import styles from './PublicKeyDialog.scss';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import { submitOnEnter } from '../../../utils/form';
@@ -41,6 +40,10 @@ type Props = {
   walletName: string;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class ICOPublicKeyDialog extends Component<Props> {
   static contextTypes = {
@@ -55,8 +58,7 @@ class ICOPublicKeyDialog extends Component<Props> {
     }
   }
 
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -96,7 +98,6 @@ class ICOPublicKeyDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { spendingPassword } = form.values();
@@ -113,14 +114,12 @@ class ICOPublicKeyDialog extends Component<Props> {
     const { intl } = this.context;
     const { onClose, error, walletName } = this.props;
     const { form } = this;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
     const actions = [
       {
         label: intl.formatMessage(messages.buttonLabel),
         onClick: this.submit,
         primary: true,
-        // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
         disabled: !this.form.isValid,
       },
     ];
@@ -131,14 +130,12 @@ class ICOPublicKeyDialog extends Component<Props> {
         actions={actions}
         closeOnOverlayClick
         onClose={onClose}
-        className={styles.dialog}
         closeButton={<DialogCloseButton onClose={onClose} />}
       >
         <div className={styles.description}>
           {intl.formatMessage(messages.description)}
         </div>
         <Input
-          className={styles.spendingPassword}
           {...spendingPasswordField.bind()}
           error={spendingPasswordField.error}
           onKeyPress={this.handleSubmitOnEnter}
diff --git a/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts b/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts
index 083b67cc24..d275be310c 100644
--- a/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts
+++ b/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts
@@ -1,9 +1,7 @@
 import { defineMessages } from 'react-intl';
-import { ReactIntlMessage } from '../../../types/i18nTypes';
+import type { ReactIntlMessage } from '../../../types/i18nTypes';
 
-export const messages: {
-  [key: string]: ReactIntlMessage;
-} = defineMessages({
+export const messages: Record<string, ReactIntlMessage> = defineMessages({
   dialogTitle: {
     id: 'wallet.settings.icoPublicKey',
     defaultMessage: '!!!ICO Public Key',
diff --git a/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.tsx b/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.tsx
index c04a3dc3d2..6fa6b8db22 100644
--- a/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.tsx
@@ -9,7 +9,6 @@ import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
 import iconCopy from '../../../assets/images/clipboard-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PublicKeyQRCodeDialog.scss' ... Remove this comment to see the full error message
 import styles from './PublicKeyQRCodeDialog.scss';
 import globalMessages from '../../../i18n/global-messages';
 import { messages } from './ICOPublicKeyQRCodeDialog.messages';
@@ -58,7 +57,7 @@ const ICOPublicKeyQRCodeDialog = observer((props: Props) => {
       className={styles.dialog}
       closeButton={<DialogCloseButton onClose={onClose} />}
     >
-      <div className={styles.walletPublicKeyQRCode}>
+      <div className={styles.walletPublicKeyQrCode}>
         <QRCode
           value={walletPublicKey}
           bgColor={qrCodeBackgroundColor}
diff --git a/source/renderer/app/components/wallet/settings/PublicKeyField.tsx b/source/renderer/app/components/wallet/settings/PublicKeyField.tsx
index 45f26e9258..1a465202a7 100644
--- a/source/renderer/app/components/wallet/settings/PublicKeyField.tsx
+++ b/source/renderer/app/components/wallet/settings/PublicKeyField.tsx
@@ -15,7 +15,6 @@ import hideKeyImage from '../../../assets/images/hide-key.inline.svg';
 import globalMessages from '../../../i18n/global-messages';
 import type { Locale } from '../../../../../common/types/locales.types';
 import { LOCALES } from '../../../../../common/types/locales.types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PublicKeyField.scss' or its ... Remove this comment to see the full error message
 import styles from './PublicKeyField.scss';
 import type { ReactIntlMessage } from '../../../types/i18nTypes';
 
diff --git a/source/renderer/app/components/wallet/settings/PublicKeyFieldSkin.tsx b/source/renderer/app/components/wallet/settings/PublicKeyFieldSkin.tsx
index 9a793e4105..d4ebd01383 100644
--- a/source/renderer/app/components/wallet/settings/PublicKeyFieldSkin.tsx
+++ b/source/renderer/app/components/wallet/settings/PublicKeyFieldSkin.tsx
@@ -10,7 +10,6 @@ import type { InputProps } from 'react-polymorph/lib/components/Input';
 import { pickDOMProps } from 'react-polymorph/lib/utils/props';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/copy.in... Remove this comment to see the full error message
 import copyImage from '../../../assets/images/copy.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PublicKeyField.scss' or its ... Remove this comment to see the full error message
 import styles from './PublicKeyField.scss';
 
 type Props = InputProps & {
diff --git a/source/renderer/app/components/wallet/settings/PublicKeyQRCodeDialog.scss b/source/renderer/app/components/wallet/settings/PublicKeyQRCodeDialog.scss
index 898eb2f3b8..73b7ff3c53 100644
--- a/source/renderer/app/components/wallet/settings/PublicKeyQRCodeDialog.scss
+++ b/source/renderer/app/components/wallet/settings/PublicKeyQRCodeDialog.scss
@@ -1,5 +1,5 @@
 .dialog {
-  .walletPublicKeyQRCode {
+  .walletPublicKeyQrCode {
     align-items: center;
     display: flex;
     justify-content: center;
diff --git a/source/renderer/app/components/wallet/settings/SetWalletPassword.tsx b/source/renderer/app/components/wallet/settings/SetWalletPassword.tsx
index 3f3f11f1fc..ef53319565 100644
--- a/source/renderer/app/components/wallet/settings/SetWalletPassword.tsx
+++ b/source/renderer/app/components/wallet/settings/SetWalletPassword.tsx
@@ -4,7 +4,6 @@ import { defineMessages, intlShape } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/insecur... Remove this comment to see the full error message
 import insecureWalletIcon from '../../../assets/images/insecure-wallet.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SetWalletPassword.scss' or i... Remove this comment to see the full error message
 import styles from './SetWalletPassword.scss';
 import ChangeSpendingPasswordDialogContainer from '../../../containers/wallet/dialogs/settings/ChangeSpendingPasswordDialogContainer';
 
diff --git a/source/renderer/app/components/wallet/settings/UndelegateWalletButton.tsx b/source/renderer/app/components/wallet/settings/UndelegateWalletButton.tsx
index 5327b0f6f6..a5c53df866 100644
--- a/source/renderer/app/components/wallet/settings/UndelegateWalletButton.tsx
+++ b/source/renderer/app/components/wallet/settings/UndelegateWalletButton.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Button } from 'react-polymorph/lib/components/Button';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './UndelegateWalletButton.scss'... Remove this comment to see the full error message
 import styles from './UndelegateWalletButton.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx b/source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx
index 8e5c81cc9b..af85e86e2e 100644
--- a/source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx
@@ -17,7 +17,6 @@ import Wallet, { HwDeviceStatuses } from '../../../domains/Wallet';
 import HardwareWalletStatus from '../../hardware-wallet/HardwareWalletStatus';
 import type { DelegationCalculateFeeResponse } from '../../../api/staking/types';
 import type { HwDeviceStatus } from '../../../domains/Wallet';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './UndelegateWalletConfirmation... Remove this comment to see the full error message
 import styles from './UndelegateWalletConfirmationDialog.scss';
 import globalMessages from '../../../i18n/global-messages';
 import LocalizableError from '../../../i18n/LocalizableError';
@@ -116,13 +115,18 @@ type Props = {
   isTrezor: boolean;
 };
 
+interface FormFields {
+  confirmUnsupportChecked: string;
+  confirmIneligibleChecked: string;
+  passphrase: string;
+}
+
 @observer
 class UndelegateWalletConfirmationDialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         confirmUnsupportChecked: {
@@ -206,15 +210,12 @@ class UndelegateWalletConfirmationDialog extends Component<Props> {
   confirmationDisabled = () => {
     const { form } = this;
     const { fees, isSubmitting, hwDeviceStatus, selectedWallet } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const { isValid: unsupportCheckboxIsValid } = form.$(
       'confirmUnsupportChecked'
     );
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const { isValid: ineligibleCheckboxIsValid } = form.$(
       'confirmIneligibleChecked'
     );
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const { isValid: passphraseIsValid } = form.$('passphrase');
     const isHardwareWallet = get(selectedWallet, 'isHardwareWallet');
 
@@ -237,7 +238,6 @@ class UndelegateWalletConfirmationDialog extends Component<Props> {
       return false;
     }
 
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     return this.form.submit({
       onSuccess: (form) => {
         const { selectedWallet, onConfirm } = this.props;
@@ -273,11 +273,8 @@ class UndelegateWalletConfirmationDialog extends Component<Props> {
   render() {
     const { form } = this;
     const { intl } = this.context;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const unsupportCheckboxField = form.$('confirmUnsupportChecked');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const ineligibleCheckboxField = form.$('confirmIneligibleChecked');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const passphraseField = form.$('passphrase');
     const {
       selectedWallet,
diff --git a/source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx b/source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx
index e61562c68e..cb1005bec7 100644
--- a/source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx
@@ -4,7 +4,6 @@ import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './UndelegateWalletSuccessDialo... Remove this comment to see the full error message
 import styles from './UndelegateWalletSuccessDialog.scss';
 import globalMessages from '../../../i18n/global-messages';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/untada.... Remove this comment to see the full error message
diff --git a/source/renderer/app/components/wallet/settings/UnpairWallet.tsx b/source/renderer/app/components/wallet/settings/UnpairWallet.tsx
index 9be5fa70e6..7031cd1fa7 100644
--- a/source/renderer/app/components/wallet/settings/UnpairWallet.tsx
+++ b/source/renderer/app/components/wallet/settings/UnpairWallet.tsx
@@ -8,7 +8,6 @@ import {
   injectIntl,
   intlShape,
 } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSettings.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletSettings.scss';
 import type { ReactIntlMessage } from '../../../types/i18nTypes';
 import BorderedBox from '../../widgets/BorderedBox';
diff --git a/source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx b/source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx
index cfd58e8d15..f7a5383317 100644
--- a/source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import BorderedBox from '../../widgets/BorderedBox';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSettings.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletSettings.scss';
 import WalletPublicKeyQRCodeDialog from './WalletPublicKeyQRCodeDialog';
 import PublicKeyDialog from './WalletPublicKeyDialog';
diff --git a/source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx b/source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx
index 82de24086c..8a72c6f025 100644
--- a/source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Input } from 'react-polymorph/lib/components/Input';
 import vjf from 'mobx-react-form/lib/validators/VJF';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PublicKeyDialog.scss' or its... Remove this comment to see the full error message
 import styles from './PublicKeyDialog.scss';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import { submitOnEnter } from '../../../utils/form';
@@ -40,6 +39,10 @@ type Props = {
   walletName: string;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class WalletPublicKeyDialog extends Component<Props> {
   static contextTypes = {
@@ -54,8 +57,7 @@ class WalletPublicKeyDialog extends Component<Props> {
     }
   }
 
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -95,7 +97,6 @@ class WalletPublicKeyDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { spendingPassword } = form.values();
@@ -112,14 +113,12 @@ class WalletPublicKeyDialog extends Component<Props> {
     const { intl } = this.context;
     const { onClose, error, walletName } = this.props;
     const { form } = this;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
     const actions = [
       {
         label: intl.formatMessage(messages.buttonLabel),
         onClick: this.submit,
         primary: true,
-        // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
         disabled: !this.form.isValid,
       },
     ];
@@ -130,14 +129,12 @@ class WalletPublicKeyDialog extends Component<Props> {
         actions={actions}
         closeOnOverlayClick
         onClose={onClose}
-        className={styles.dialog}
         closeButton={<DialogCloseButton onClose={onClose} />}
       >
         <div className={styles.description}>
           {intl.formatMessage(messages.description)}
         </div>
         <Input
-          className={styles.spendingPassword}
           {...spendingPasswordField.bind()}
           error={spendingPasswordField.error}
           onKeyPress={this.handleSubmitOnEnter}
diff --git a/source/renderer/app/components/wallet/settings/WalletPublicKeyQRCodeDialog.tsx b/source/renderer/app/components/wallet/settings/WalletPublicKeyQRCodeDialog.tsx
index 9555fd870c..f3a2984cbf 100644
--- a/source/renderer/app/components/wallet/settings/WalletPublicKeyQRCodeDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletPublicKeyQRCodeDialog.tsx
@@ -9,7 +9,6 @@ import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/clipboa... Remove this comment to see the full error message
 import iconCopy from '../../../assets/images/clipboard-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PublicKeyQRCodeDialog.scss' ... Remove this comment to see the full error message
 import styles from './PublicKeyQRCodeDialog.scss';
 import globalMessages from '../../../i18n/global-messages';
 import type { ReactIntlMessage } from '../../../types/i18nTypes';
@@ -60,7 +59,7 @@ const WalletPublicKeyQRCodeDialog = observer((props: Props) => {
       className={styles.dialog}
       closeButton={<DialogCloseButton onClose={onClose} />}
     >
-      <div className={styles.walletPublicKeyQRCode}>
+      <div className={styles.walletPublicKeyQrCode}>
         <QRCode
           value={walletPublicKey}
           bgColor={qrCodeBackgroundColor}
diff --git a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx
index 92493a6afb..a975e13ab3 100644
--- a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx
@@ -5,7 +5,6 @@ import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseStepDial... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseStepDialogs.scss';
 
 export const messages = defineMessages({
@@ -61,10 +60,8 @@ class WalletRecoveryPhraseStep1Dialog extends Component<Props, State> {
     const { intl } = this.context;
     const { onContinue, onClose, walletName } = this.props;
     const { safetyAgreement } = this.state;
-    const isSubmitting = false;
     const actions = [
       {
-        className: isSubmitting ? styles.isSubmitting : null,
         label: intl.formatMessage(messages.recoveryPhraseStep1Button),
         primary: true,
         onClick: onContinue,
diff --git a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx
index a98be12c7f..90e7d5ec6c 100644
--- a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx
@@ -13,7 +13,6 @@ import {
 } from '../../../utils/validations';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseStepDial... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseStepDialogs.scss';
 import globalMessages from '../../../i18n/global-messages';
 
@@ -70,6 +69,10 @@ type State = {
   isVerifying: boolean;
 };
 
+interface FormFields {
+  recoveryPhrase: string;
+}
+
 @observer
 class WalletRecoveryPhraseStep2Dialog extends Component<Props, State> {
   static contextTypes = {
@@ -78,8 +81,7 @@ class WalletRecoveryPhraseStep2Dialog extends Component<Props, State> {
   state = {
     isVerifying: false,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         recoveryPhrase: {
@@ -113,7 +115,6 @@ class WalletRecoveryPhraseStep2Dialog extends Component<Props, State> {
     const { intl } = this.context;
     const { onClose, onContinue, expectedWordCount, walletName } = this.props;
     const { isVerifying } = this.state;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = form.$('recoveryPhrase');
     const { length: enteredWordCount } = recoveryPhraseField.value;
     const canSubmit =
diff --git a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx
index 308ef7ba26..9f1dade81f 100644
--- a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx
@@ -6,7 +6,6 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseStepDial... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseStepDialogs.scss';
 
 export const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx
index 623a021270..e1e3be6f1c 100644
--- a/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx
@@ -14,7 +14,6 @@ import iconOk from '../../../assets/images/recovery-phrase-verification-ok.inlin
 import iconWarning from '../../../assets/images/recovery-phrase-verification-warning.inline.svg';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/recover... Remove this comment to see the full error message
 import iconNotification from '../../../assets/images/recovery-phrase-verification-notification.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRecoveryPhraseVerifica... Remove this comment to see the full error message
 import styles from './WalletRecoveryPhraseVerificationWidget.scss';
 import {
   RECOVERY_PHRASE_VERIFICATION_STATUSES as statuses,
@@ -246,7 +245,7 @@ class WalletRecoveryPhraseVerificationWidget extends Component<Props> {
     return (
       <div className={styles.component}>
         <h2>{intl.formatMessage(messages.title)}</h2>
-        <div className={styles.description}>
+        <div>
           {intl.formatMessage(messages.description, {
             wordCount,
           })}
@@ -272,7 +271,6 @@ class WalletRecoveryPhraseVerificationWidget extends Component<Props> {
           <SVGInline svg={icon} className={styles.statusIcon} />
           <FormattedHTMLMessage
             {...message}
-            className={styles.statusMessage}
             values={{
               timeAgo,
               timeUntilWarning,
diff --git a/source/renderer/app/components/wallet/settings/WalletSettings.tsx b/source/renderer/app/components/wallet/settings/WalletSettings.tsx
index 665c14ef03..497f7306a2 100644
--- a/source/renderer/app/components/wallet/settings/WalletSettings.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletSettings.tsx
@@ -21,7 +21,6 @@ import UnpairWallet from './UnpairWallet';
 import DeleteWallet from './DeleteWallet';
 import ChangeSpendingPasswordDialog from './ChangeSpendingPasswordDialog';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSettings.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletSettings.scss';
 import WalletRecoveryPhraseVerificationWidget from './WalletRecoveryPhraseVerificationWidget';
 import type { Locale } from '../../../../../common/types/locales.types';
diff --git a/source/renderer/app/components/wallet/settings/WalletSettingsRemoveButton.tsx b/source/renderer/app/components/wallet/settings/WalletSettingsRemoveButton.tsx
index 426fe358e1..5a682d4feb 100644
--- a/source/renderer/app/components/wallet/settings/WalletSettingsRemoveButton.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletSettingsRemoveButton.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RemoveWalletButton.scss' or ... Remove this comment to see the full error message
 import styles from './RemoveWalletButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/settings/WalletSettingsRemoveConfirmationDialog.tsx b/source/renderer/app/components/wallet/settings/WalletSettingsRemoveConfirmationDialog.tsx
index d8e21b3d30..ace2331c1f 100644
--- a/source/renderer/app/components/wallet/settings/WalletSettingsRemoveConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/settings/WalletSettingsRemoveConfirmationDialog.tsx
@@ -4,7 +4,6 @@ import { FormattedHTMLMessage, injectIntl, intlShape } from 'react-intl';
 import { observer } from 'mobx-react';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DeleteWalletConfirmationDial... Remove this comment to see the full error message
 import styles from './DeleteWalletConfirmationDialog.scss';
 import globalMessages from '../../../i18n/global-messages';
 import { DELETE_WALLET_COUNTDOWN } from '../../../config/timingConfig';
@@ -68,10 +67,6 @@ const WalletSettingsRemoveConfirmationDialog = observer((props: Props) => {
       !isWalletNameConfirmationCorrect);
   // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
   const handleSubmit = React.useCallback(() => !isDisabled && onContinue());
-  const buttonClasses = classnames([
-    'attention',
-    isSubmitting ? styles.isSubmitting : null,
-  ]);
   const buttonLabel = !isSubmitting ? (
     `${intl.formatMessage(messages.confirmButtonLabel)} ${countdownDisplay}`
   ) : (
@@ -83,7 +78,7 @@ const WalletSettingsRemoveConfirmationDialog = observer((props: Props) => {
       onClick: onCancel,
     },
     {
-      className: buttonClasses,
+      className: 'attention',
       label: buttonLabel,
       onClick: onContinue,
       disabled: isDisabled,
diff --git a/source/renderer/app/components/wallet/skins/AmountInputSkin.tsx b/source/renderer/app/components/wallet/skins/AmountInputSkin.tsx
index c87763707a..1e8bdcfb16 100644
--- a/source/renderer/app/components/wallet/skins/AmountInputSkin.tsx
+++ b/source/renderer/app/components/wallet/skins/AmountInputSkin.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import BigNumber from 'bignumber.js';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AmountInputSkin.scss' or its... Remove this comment to see the full error message
 import styles from './AmountInputSkin.scss';
 
 export const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/summary/WalletSummary.tsx b/source/renderer/app/components/wallet/summary/WalletSummary.tsx
index ee658ba589..2f5fb3e439 100644
--- a/source/renderer/app/components/wallet/summary/WalletSummary.tsx
+++ b/source/renderer/app/components/wallet/summary/WalletSummary.tsx
@@ -1,12 +1,13 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
+import type { Reward } from '../../../api/staking/types';
 import Wallet from '../../../domains/Wallet';
 import type { Currency } from '../../../types/currencyTypes';
 import WalletSummaryHeader from './WalletSummaryHeader';
 import WalletSummaryCurrency from './WalletSummaryCurrency';
 import type { AssetToken } from '../../../api/assets/types';
-import WalletTokensList from '../tokens/WalletTokensList';
+import WalletTokensList from '../tokens/wallet-tokens-list/WalletTokensList';
 import { MAX_TOKENS_ON_SUMMARY_PAGE } from '../../../config/numbersConfig';
 
 const messages = defineMessages({
@@ -18,6 +19,7 @@ const messages = defineMessages({
 });
 type Props = {
   wallet: Wallet;
+  reward: Reward;
   numberOfRecentTransactions: number;
   numberOfTransactions?: number;
   numberOfPendingTransactions: number;
@@ -50,6 +52,7 @@ class WalletSummary extends Component<Props> {
   render() {
     const {
       wallet,
+      reward,
       numberOfPendingTransactions,
       numberOfRecentTransactions,
       numberOfTransactions,
@@ -78,6 +81,7 @@ class WalletSummary extends Component<Props> {
       <>
         <WalletSummaryHeader
           wallet={wallet}
+          reward={reward}
           numberOfRecentTransactions={numberOfRecentTransactions}
           numberOfTransactions={numberOfTransactions}
           numberOfPendingTransactions={numberOfPendingTransactions}
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryAsset.scss b/source/renderer/app/components/wallet/summary/WalletSummaryAsset.scss
deleted file mode 100644
index 9a96f56c93..0000000000
--- a/source/renderer/app/components/wallet/summary/WalletSummaryAsset.scss
+++ /dev/null
@@ -1,127 +0,0 @@
-.component {
-  &:not(:last-of-type) {
-    border-bottom: 1px solid rgba(94, 96, 102, 0.15);
-  }
-  &.isExpanded {
-    background-color: var(--theme-button-flat-background-color-hover);
-    padding-bottom: 20px;
-    .header {
-      background-color: var(--theme-button-flat-background-color-hover);
-    }
-    .content {
-      display: block;
-    }
-  }
-}
-.header {
-  cursor: pointer;
-  display: flex;
-  justify-content: space-between;
-  padding: 7px 42px 7px 12px;
-  position: relative;
-  .asset {
-    max-width: calc(100% - 90px);
-  }
-  .assetAmount {
-    color: var(--theme-widgets-asset-token-text-color);
-    font-family: var(--font-regular);
-    font-size: 12px;
-    letter-spacing: 0.4px;
-    line-height: 1.33;
-    margin: 3px 0;
-    max-width: 80px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-}
-.leftContent {
-  max-width: 75%;
-}
-.rightContent {
-  max-width: 25%;
-}
-.arrow {
-  bottom: 10px;
-  height: 22px;
-  opacity: 0.3;
-  position: absolute;
-  right: 12px;
-  text-align: center;
-  top: 7px;
-  width: 12px;
-  z-index: 1;
-
-  > svg {
-    height: 7px;
-    margin-top: 7px;
-    width: 12px;
-
-    path {
-      fill: var(--theme-widgets-asset-token-text-color);
-    }
-  }
-  .header:hover & {
-    opacity: 0.5;
-  }
-  &.isExpanded {
-    transform: rotate(180deg);
-  }
-}
-.content {
-  display: none;
-  margin: 13px 12px 0;
-}
-.footer {
-  border-top: 1px solid var(--theme-wallet-settings-section-separator-color);
-  color: var(--theme-widgets-asset-token-text-color);
-  display: flex;
-  justify-content: space-between;
-  margin-top: 20px;
-  padding-top: 20px;
-
-  dl {
-    line-height: 1;
-    padding: 9px 0 0 8px;
-    width: calc(100% - 264px);
-  }
-
-  dt {
-    display: inline-block;
-    font-family: var(--font-medium);
-    font-size: 12px;
-    line-height: 1.33;
-    text-align: right;
-    white-space: nowrap;
-    width: 67px;
-  }
-
-  dd {
-    display: inline-flex;
-    font-family: var(--font-light);
-    font-size: 12px;
-    line-height: 16px;
-    margin-left: 10px;
-    white-space: normal;
-    width: calc(100% - 100px);
-    word-break: break-all;
-    word-wrap: break-word;
-  }
-
-  .footerButtons {
-    margin: auto 0;
-    white-space: nowrap;
-    .button {
-      height: 36px;
-      margin-left: 12px;
-      width: 120px;
-    }
-    .settingsButton {
-      svg {
-        height: 9px;
-        margin-left: 6px;
-        width: 11px;
-      }
-    }
-  }
-}
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.scss b/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.scss
index 6098cf0be8..5aeec02f42 100644
--- a/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.scss
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.scss
@@ -32,7 +32,7 @@
   font-family: var(--font-bold);
   font-size: 16px;
   line-height: 1;
-  margin-bottom: 5.5px;
+  margin-bottom: 8.5px;
   user-select: text;
   word-break: break-all;
 
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx b/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx
index 0b4c8a6e30..63d9a61a6b 100644
--- a/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx
@@ -4,10 +4,9 @@ import moment from 'moment';
 import { defineMessages, intlShape } from 'react-intl';
 import SVGInline from 'react-svg-inline';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/currenc... Remove this comment to see the full error message
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/currency... Remove this comment to see the full error message
 import currencySettingsIcon from '../../../assets/images/currency-settings-ic.inline.svg';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSummaryCurrency.scss' ... Remove this comment to see the full error message
 import styles from './WalletSummaryCurrency.scss';
 import Wallet from '../../../domains/Wallet';
 import { formattedWalletCurrencyAmount } from '../../../utils/formatters';
@@ -92,10 +91,7 @@ class WalletSummaryCurrency extends Component<Props> {
         <div className={styles.currencyWalletAmount}>
           {/* @ts-ignore ts-migrate(2741) FIXME: Property 'replacer' is missing in type '{ children... Remove this comment to see the full error message */}
           <DiscreetValue>{currencyWalletAmount}</DiscreetValue>
-          <span className={styles.currencyCode}>
-            {' '}
-            {currencyWalletAmountSymbol}
-          </span>
+          <span> {currencyWalletAmountSymbol}</span>
         </div>
         <div className={styles.currencyRate}>
           1 {intl.formatMessage(globalMessages.adaUnit)} = {currencyRate || '–'}{' '}
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryHeader.scss b/source/renderer/app/components/wallet/summary/WalletSummaryHeader.scss
index d361922982..807e20d2c8 100644
--- a/source/renderer/app/components/wallet/summary/WalletSummaryHeader.scss
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryHeader.scss
@@ -14,12 +14,16 @@
 }
 
 .walletContent {
-  align-items: center;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
 }
 
+.currency {
+  min-width: 187px;
+  padding-top: 6px;
+}
+
 .walletName {
   color: var(--theme-bordered-box-text-color);
   font-family: var(--font-regular);
@@ -40,28 +44,28 @@
   word-break: break-all;
 
   .currencyCode {
-    font-size: 16px;
     font-size: 16px;
     margin-left: 6px;
     opacity: 0.7;
   }
 }
 
+.rewards {
+  @extend %smallText;
+  height: auto;
+}
+
+.rewardsAmount {
+  font-family: var(--font-medium);
+}
+
 .transactionsCountWrapper {
-  .numberOfTransactions,
-  .numberOfPendingTransactions {
+  .numberOfTransactions {
     @extend %smallText;
-
-    span:first-child {
+    font-family: var(--font-light);
+    span {
       font-family: var(--font-medium);
-      opacity: 0.7;
     }
-
-    span:last-child {
-      font-family: var(--font-light);
-      opacity: 1;
-    }
-
     &.isLoadingNumberOfTransactions {
       @include animated-ellipsis($width: 16px);
     }
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryHeader.tsx b/source/renderer/app/components/wallet/summary/WalletSummaryHeader.tsx
index b02c7a5bb9..b40ba89679 100644
--- a/source/renderer/app/components/wallet/summary/WalletSummaryHeader.tsx
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryHeader.tsx
@@ -2,31 +2,27 @@ import React, { Component } from 'react';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
-import { defineMessages, intlShape } from 'react-intl';
+import { defineMessages, FormattedHTMLMessage, intlShape } from 'react-intl';
 import classnames from 'classnames';
+import type { Reward } from '../../../api/staking/types';
 import globalMessages from '../../../i18n/global-messages';
 import BorderedBox from '../../widgets/BorderedBox';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSummaryHeader.scss' or... Remove this comment to see the full error message
 import styles from './WalletSummaryHeader.scss';
 import Wallet from '../../../domains/Wallet';
 import { formattedWalletAmount } from '../../../utils/formatters';
 import { DiscreetValue } from '../../../features/discreet-mode';
+import WalletSummaryHeaderRewards from './WalletSummaryHeaderRewards';
 
 const messages = defineMessages({
   transactionsLabel: {
     id: 'wallet.summary.header.transactionsLabel',
-    defaultMessage: '!!!Number of transactions',
+    defaultMessage: '!!!{total} transactions, {pending} pending',
     description: '"Number of transactions" label on Wallet summary header page',
   },
-  pendingTransactionsLabel: {
-    id: 'wallet.summary.header.pendingTransactionsLabel',
-    defaultMessage: '!!!Number of pending transactions',
-    description:
-      '"Number of pending transactions" label on Wallet summary header page',
-  },
 });
 type Props = {
   wallet: Wallet;
+  reward: Reward;
   numberOfRecentTransactions: number;
   numberOfTransactions?: number;
   numberOfPendingTransactions: number;
@@ -43,6 +39,7 @@ class WalletSummaryHeader extends Component<Props> {
   render() {
     const {
       wallet,
+      reward,
       numberOfPendingTransactions,
       numberOfRecentTransactions,
       numberOfTransactions,
@@ -56,15 +53,18 @@ class WalletSummaryHeader extends Component<Props> {
       styles.numberOfTransactions,
       isLoadingAllTransactions ? styles.isLoadingNumberOfTransactions : null,
     ]);
-    const numberOfPendingTransactionsStyles = classnames([
-      styles.numberOfPendingTransactions,
-    ]);
     const walletNameStyles = classnames([styles.walletName]);
     const walletAmountStyles = classnames([styles.walletAmount]);
     const isRestoreActive = wallet.isRestoring;
     const walletAmount = isRestoreActive
-      ? '-'
+      ? '–'
       : formattedWalletAmount(wallet.amount, false);
+    const totalTransactions = isRestoreActive
+      ? '–'
+      : numberOfTransactions ?? numberOfRecentTransactions;
+    const pendingTransactions = isRestoreActive
+      ? '–'
+      : numberOfPendingTransactions;
     return (
       <div className={styles.component}>
         <BorderedBox>
@@ -78,28 +78,32 @@ class WalletSummaryHeader extends Component<Props> {
                   {intl.formatMessage(globalMessages.adaUnit)}
                 </span>
               </div>
+              {!wallet.isLegacy && (
+                <div className={styles.rewards}>
+                  <WalletSummaryHeaderRewards
+                    isRestoring={isRestoreActive}
+                    total={reward.total}
+                    unspent={reward.unspent}
+                    walletAmount={wallet.amount}
+                  />
+                </div>
+              )}
               {!isLoadingTransactions && (
                 <div className={styles.transactionsCountWrapper}>
-                  <div className={numberOfPendingTransactionsStyles}>
-                    <span>
-                      {intl.formatMessage(messages.pendingTransactionsLabel)}
-                    </span>
-                    :&nbsp;
-                    <span>{numberOfPendingTransactions}</span>
-                  </div>
                   <div className={numberOfTransactionsStyles}>
-                    <span>
-                      {intl.formatMessage(messages.transactionsLabel)}
-                    </span>
-                    :&nbsp;
-                    <span>
-                      {numberOfTransactions || numberOfRecentTransactions}
-                    </span>
+                    <FormattedHTMLMessage
+                      {...messages.transactionsLabel}
+                      tagName="p"
+                      values={{
+                        total: totalTransactions,
+                        pending: pendingTransactions,
+                      }}
+                    />
                   </div>
                 </div>
               )}
             </div>
-            {currency}
+            <div className={styles.currency}>{currency}</div>
           </div>
         </BorderedBox>
       </div>
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.scss b/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.scss
new file mode 100644
index 0000000000..a46295ef8a
--- /dev/null
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.scss
@@ -0,0 +1,35 @@
+.component {
+  font-family: var(--font-light);
+  :global(.amount) {
+    font-family: var(--font-medium);
+  }
+}
+
+.questionMark {
+  height: 19px;
+  margin-left: 4px;
+  width: 10px;
+
+  :global {
+    .SVGInline {
+      svg {
+        height: 10px;
+        width: 10px;
+        path {
+          fill: var(--theme-bordered-box-text-color);
+          opacity: 0.3;
+        }
+      }
+    }
+  }
+
+  &:hover :global {
+    .SVGInline {
+      svg {
+        path {
+          opacity: 0.5;
+        }
+      }
+    }
+  }
+}
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.spec.ts b/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.spec.ts
new file mode 100644
index 0000000000..511833b26d
--- /dev/null
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.spec.ts
@@ -0,0 +1,32 @@
+import BigNumber from 'bignumber.js';
+import {
+  discreetRewardsAmount,
+  getFormattedRewardAmount,
+} from './WalletSummaryHeaderRewards';
+
+describe('getFormattedRewardAmount', () => {
+  it('should render integer amounts without decimal places', () => {
+    expect(getFormattedRewardAmount(new BigNumber(1))).toEqual('1 ADA');
+  });
+  it('should render fraction amounts with a single decimal place', () => {
+    expect(getFormattedRewardAmount(new BigNumber(0.512))).toEqual('0.5 ADA');
+  });
+  it('should indicate values below 0.1', () => {
+    expect(getFormattedRewardAmount(new BigNumber(0.05))).toEqual('< 0.1 ADA');
+  });
+});
+describe('discreetRewardsAmount', () => {
+  const symbol = '***';
+  it('should replace the amount with a dash while restoring', () => {
+    const replacer = discreetRewardsAmount(true);
+    expect(replacer(true, symbol, new BigNumber(0))).toEqual('–');
+  });
+  it('should replace the amount with a discreet value', () => {
+    const replacer = discreetRewardsAmount();
+    expect(replacer(true, symbol, new BigNumber(0))).toEqual('*** ADA');
+  });
+  it('should return the formatted ADA value', () => {
+    const replacer = discreetRewardsAmount();
+    expect(replacer(false, symbol, new BigNumber(0.5))).toEqual('0.5 ADA');
+  });
+});
diff --git a/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.tsx b/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.tsx
new file mode 100644
index 0000000000..214d2ffed9
--- /dev/null
+++ b/source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.tsx
@@ -0,0 +1,91 @@
+import BigNumber from 'bignumber.js';
+import React from 'react';
+import { observer } from 'mobx-react';
+import {
+  defineMessages,
+  FormattedHTMLMessage,
+  FormattedMessage,
+} from 'react-intl';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import SVGInline from 'react-svg-inline';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/question... Remove this comment to see the full error message
+import questionMarkIcon from '../../../assets/images/question-mark.inline.svg';
+import { useDiscreetModeFeature } from '../../../features';
+import type { ReplacerFn } from '../../../features/discreet-mode/types';
+import { formattedWalletAmount } from '../../../utils/formatters';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSummaryHeaderRewards.s... Remove this comment to see the full error message
+import styles from './WalletSummaryHeaderRewards.scss';
+
+const messages = defineMessages({
+  rewards: {
+    id: 'wallet.summary.header.rewardsSummary',
+    defaultMessage: '!!!{total} rewards earned, {unspent} unspent rewards',
+    description: 'Headline for the Decentralisation notification.',
+  },
+  unspendableTooltip: {
+    id: 'wallet.summary.header.unspendableTooltip',
+    defaultMessage: `!!!All the ada in this wallet is in the rewards account.
+      Since transaction fees cannot be paid with rewards, please send 2 or
+      more ada to this wallet to cover transaction fees.`,
+    description:
+      'Tooltip describing that rewards are unspendable on the Wallet summary header',
+  },
+});
+export function getFormattedRewardAmount(amount: BigNumber): string {
+  return amount.isGreaterThan(0) && amount.isLessThan(0.1)
+    ? '< 0.1 ADA'
+    : formattedWalletAmount(amount, true, false, 'ADA', 1);
+}
+export function discreetRewardsAmount(isRestoring = false): ReplacerFn {
+  return (isDiscreetMode, symbol, value) => {
+    if (isRestoring) {
+      return '–';
+    }
+
+    if (!isDiscreetMode) {
+      return getFormattedRewardAmount(value);
+    }
+
+    return `${symbol} ADA`;
+  };
+}
+export type WalletSummaryHeaderRewardsProps = {
+  total: BigNumber;
+  unspent: BigNumber;
+  walletAmount: BigNumber;
+  isRestoring: boolean;
+};
+
+function WalletSummaryHeaderRewards(props: WalletSummaryHeaderRewardsProps) {
+  const discreetModeFeature = useDiscreetModeFeature();
+  const { isRestoring, total, unspent, walletAmount } = props;
+  return (
+    <div className={styles.component}>
+      <FormattedHTMLMessage
+        {...messages.rewards}
+        values={{
+          total: discreetModeFeature.discreetValue({
+            replacer: discreetRewardsAmount(isRestoring),
+            value: total,
+          }),
+          unspent: discreetModeFeature.discreetValue({
+            replacer: discreetRewardsAmount(isRestoring),
+            value: unspent,
+          }),
+        }}
+      />
+      {walletAmount.isGreaterThan(0) && walletAmount.isEqualTo(unspent) && (
+        <PopOver
+          offset={[0, 10]}
+          content={<FormattedMessage {...messages.unspendableTooltip} />}
+        >
+          <span className={styles.questionMark}>
+            <SVGInline svg={questionMarkIcon} />
+          </span>
+        </PopOver>
+      )}
+    </div>
+  );
+}
+
+export default observer(WalletSummaryHeaderRewards);
diff --git a/source/renderer/app/components/wallet/tokens/WalletToken.scss b/source/renderer/app/components/wallet/tokens/WalletToken.scss
deleted file mode 100644
index 057d93a8a8..0000000000
--- a/source/renderer/app/components/wallet/tokens/WalletToken.scss
+++ /dev/null
@@ -1,197 +0,0 @@
-.component {
-  overflow: hidden;
-  &:not(:last-of-type) {
-    border-bottom: 1px solid rgba(94, 96, 102, 0.15);
-  }
-  &.isExpanded:not(.removing) {
-    background-color: var(--theme-tokens-list-header-expanded-background-color);
-    padding-bottom: 20px;
-    .header {
-      background-color: var(
-        --theme-tokens-list-header-expanded-background-color
-      );
-      &:hover {
-        background-color: var(
-          --theme-tokens-list-header-expanded-background-color-hover
-        );
-      }
-    }
-    .content {
-      display: block;
-    }
-  }
-  &.inserting {
-    animation: insertAnimation 0.3s;
-  }
-  &.removing {
-    animation: removingAnimation 0.3s;
-    border-bottom: 0 none;
-    height: 0;
-  }
-}
-@keyframes insertAnimation {
-  0% {
-    height: 0;
-  }
-  100% {
-    height: 36px;
-  }
-}
-@keyframes removingAnimation {
-  0% {
-    height: 36px;
-  }
-  100% {
-    height: 0;
-  }
-}
-
-.header {
-  cursor: pointer;
-  display: flex;
-  justify-content: space-between;
-  padding: 7px 42px 7px 39px;
-  position: relative;
-  .favoriteIcon {
-    border-radius: 3px;
-    cursor: pointer;
-    height: 22px;
-    left: 8px;
-    opacity: 0.3;
-    padding-top: 2px;
-    position: absolute;
-    top: 7px;
-    transition: opacity 0.25s;
-    width: 23px;
-    z-index: 1;
-    svg {
-      height: 14px;
-      width: 15px;
-    }
-    &.isFavorite {
-      opacity: 0.7;
-    }
-    &:not(.isFavorite) {
-      path {
-        stroke: var(--theme-button-flat-text-color-disabled);
-      }
-    }
-    &:hover {
-      opacity: 0.7;
-      &.isFavorite {
-        opacity: 1;
-      }
-    }
-  }
-  .asset {
-    max-width: calc(100% - 90px);
-  }
-  .assetAmount {
-    color: var(--theme-widgets-asset-token-text-color);
-    font-family: var(--font-regular);
-    font-size: 12px;
-    letter-spacing: 0.4px;
-    line-height: 1.33;
-    margin: 3px 0;
-    max-width: 80px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-  &:hover {
-    background: var(--theme-button-flat-background-color-hover);
-  }
-}
-.leftContent {
-  max-width: 75%;
-}
-.rightContent {
-  max-width: 25%;
-}
-.arrow {
-  bottom: 10px;
-  height: 22px;
-  opacity: 0.3;
-  position: absolute;
-  right: 12px;
-  text-align: center;
-  top: 7px;
-  width: 12px;
-  z-index: 1;
-
-  > svg {
-    height: 12px;
-    margin-top: 5px;
-    width: 12px;
-
-    path {
-      fill: var(--theme-widgets-asset-token-text-color);
-    }
-  }
-  .header:hover & {
-    opacity: 0.5;
-  }
-  &.isExpanded {
-    transform: rotate(180deg);
-  }
-}
-.content {
-  display: none;
-  margin: 13px 12px 0;
-}
-.footer {
-  border-top: 1px solid var(--theme-wallet-settings-section-separator-color);
-  color: var(--theme-widgets-asset-token-text-color);
-  display: flex;
-  justify-content: space-between;
-  margin-top: 20px;
-  padding-top: 20px;
-
-  dl {
-    line-height: 1;
-    padding: 9px 0 0 8px;
-    width: calc(100% - 264px);
-  }
-
-  dt {
-    display: inline-block;
-    font-family: var(--font-medium);
-    font-size: 12px;
-    line-height: 1.33;
-    text-align: right;
-    white-space: nowrap;
-    width: 70px;
-  }
-
-  dd {
-    display: inline-flex;
-    font-family: var(--font-light);
-    font-size: 12px;
-    line-height: 16px;
-    margin-left: 10px;
-    white-space: normal;
-    width: calc(100% - 100px);
-    word-break: break-all;
-    word-wrap: break-word;
-  }
-
-  .footerButtons {
-    margin: auto 0;
-    white-space: nowrap;
-    .button {
-      height: 36px;
-      margin-left: 12px;
-      width: 120px;
-      &.disabled {
-        opacity: 0.4;
-      }
-    }
-    .settingsButton {
-      svg {
-        height: 9px;
-        margin-left: 6px;
-        width: 11px;
-      }
-    }
-  }
-}
diff --git a/source/renderer/app/components/wallet/tokens/WalletNoTokens.scss b/source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.scss
similarity index 91%
rename from source/renderer/app/components/wallet/tokens/WalletNoTokens.scss
rename to source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.scss
index 5fa8ece952..3682724ca6 100644
--- a/source/renderer/app/components/wallet/tokens/WalletNoTokens.scss
+++ b/source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.scss
@@ -1,4 +1,4 @@
-@import '../../../themes/mixins/animations';
+@import '../../../../themes/mixins/animations';
 
 .numberOfAssets {
   color: var(--theme-transactions-list-group-date-color);
diff --git a/source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx b/source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx
new file mode 100644
index 0000000000..e1802c69ea
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx
@@ -0,0 +1,83 @@
+import React, { Component } from 'react';
+import { observer } from 'mobx-react';
+import { defineMessages, intlShape } from 'react-intl';
+import BorderedBox from '../../../widgets/BorderedBox';
+import styles from './WalletNoTokens.scss';
+import { ExternalLinkButton } from '../../../widgets/ExternalLinkButton';
+
+const messages = defineMessages({
+  tokensTitle: {
+    id: 'wallet.summary.assets.tokensTitle',
+    defaultMessage: '!!!Tokens',
+    description: 'Number of tokens title on Wallet summary assets page',
+  },
+  learnMoreTextTop: {
+    id: 'wallet.summary.noTokens.learnMore.textTop',
+    defaultMessage: '!!!Want to find out more about native tokens?',
+    description: '"Learn more" text in the Wallets Summary No Tokens component',
+  },
+  learnMoreTextBottom: {
+    id: 'wallet.summary.noTokens.learnMore.textBottom',
+    defaultMessage: '!!!Start by visiting the IOHK blog for a useful primer.',
+    description: '"Learn more" text in the Wallets Summary No Tokens component',
+  },
+  learnMoreLinkLabel: {
+    id: 'wallet.summary.noTokens.learnMore.linkLabel',
+    defaultMessage: '!!!Learn more',
+    description:
+      '"Learn more" label or button in the Wallets Summary No Tokens component',
+  },
+  learnMoreLinkUrl: {
+    id: 'wallet.summary.noTokens.learnMore.linkUrl',
+    defaultMessage:
+      '!!!https://iohk.io/en/blog/posts/2021/02/04/native-tokens-to-bring-new-utility-to-life-on-cardano/',
+    description:
+      '"Learn more" link URL in the Wallets Summary No Tokens component',
+  },
+});
+type Props = {
+  isLoadingAssets: boolean;
+  onExternalLinkClick: (...args: Array<any>) => any;
+  numberOfAssets: number;
+};
+
+@observer
+class WalletSummaryNoTokens extends Component<Props> {
+  static contextTypes = {
+    intl: intlShape.isRequired,
+  };
+
+  render() {
+    const { isLoadingAssets, onExternalLinkClick, numberOfAssets } = this.props;
+    const { intl } = this.context;
+    return (
+      <>
+        {!isLoadingAssets && (
+          <div className={styles.numberOfAssets}>
+            {intl.formatMessage(messages.tokensTitle)} ({numberOfAssets})
+          </div>
+        )}
+        <div className={styles.component}>
+          <BorderedBox>
+            <div className={styles.noTokensContainer}>
+              <div className={styles.noTokensLeftContainer}>
+                <p>{intl.formatMessage(messages.learnMoreTextTop)}</p>
+                <p>{intl.formatMessage(messages.learnMoreTextBottom)}</p>
+              </div>
+              <ExternalLinkButton
+                label={intl.formatMessage(messages.learnMoreLinkLabel)}
+                onClick={() =>
+                  onExternalLinkClick(
+                    intl.formatMessage(messages.learnMoreLinkUrl)
+                  )
+                }
+              />
+            </div>
+          </BorderedBox>
+        </div>
+      </>
+    );
+  }
+}
+
+export default WalletSummaryNoTokens;
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts
new file mode 100644
index 0000000000..50a6ef638a
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts
@@ -0,0 +1,55 @@
+import { defineMessages } from 'react-intl';
+
+export const messages = defineMessages({
+  title: {
+    id: 'wallet.token.picker.title',
+    defaultMessage: '!!!Add tokens',
+    description: 'Token picker title',
+  },
+  allTokensLabel: {
+    id: 'wallet.token.picker.allTokensLabel',
+    defaultMessage: '!!!All tokens',
+    description: 'Label for all tokens option',
+  },
+  favoriteTokensLabel: {
+    id: 'wallet.token.picker.favoriteTokensLabel',
+    defaultMessage: '!!!Favorites',
+    description: 'Label for favorite tokens option',
+  },
+  checkAllLabel: {
+    id: 'wallet.token.picker.checkAllLabel',
+    defaultMessage: '!!!Select all',
+    description: 'Label for select all button label',
+  },
+  checkedCountLabel: {
+    id: 'wallet.token.picker.checkedCountLabel',
+    defaultMessage: '!!!{checkedCount} out of {maxTokens} tokens.',
+    description: 'Label of selected tokens count',
+  },
+  cancelButtonLabel: {
+    id: 'wallet.token.picker.cancelButtonLabel',
+    defaultMessage: '!!!Cancel',
+    description: 'Label of cancel button',
+  },
+  addButtonLabel: {
+    id: 'wallet.token.picker.addButtonLabel',
+    defaultMessage: '!!!Add',
+    description: 'Label of add button',
+  },
+  clearAll: {
+    id: 'wallet.token.picker.clearAll',
+    defaultMessage: '!!!Clear selection',
+    description: 'Label of clear selection button',
+  },
+  noResults: {
+    id: 'wallet.token.picker.noResults',
+    defaultMessage: '!!!Results do not match search query',
+    description: 'Text for no results',
+  },
+  maxTokensWarning: {
+    id: 'wallet.token.picker.maxTokensWarning',
+    defaultMessage:
+      '!!!You have already reached a maximum of {maxTokens} tokens for your transaction. To add another token you need to remove one from a list.',
+    description: 'Max tokens warning',
+  },
+});
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.scss b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.scss
new file mode 100644
index 0000000000..2f25f60902
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.scss
@@ -0,0 +1,226 @@
+.root {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+
+  .toolbar {
+    border-bottom: 1px solid
+      var(--theme-tokens-picker-toolbar-border-bottom-color);
+    display: flex;
+    margin: 0 15px;
+    padding: 20px 0;
+    transition-duration: 0.2s;
+    transition-property: box-shadow border-color;
+    transition-timing-function: ease-in-out;
+  }
+
+  .search {
+    padding: 0 15px 0px 15px;
+  }
+
+  .scrollNotTop {
+    border-bottom-color: transparent;
+  }
+
+  .toolbarContainer {
+    box-shadow: 0 10px 10px -10px var(--theme-tokens-picker-toolbar-box-shadow);
+  }
+
+  .filterSelect {
+    font-family: var(--font-medium);
+    font-size: 16px;
+    line-height: 1.38;
+
+    :global {
+      .SimpleOptions_selectedOption:after {
+        border: none;
+      }
+
+      .SimpleOptions_option {
+        padding: 6px 12px;
+      }
+
+      .SimpleInput_customValueWrapper .SimpleInput_input {
+        border: none;
+        height: auto;
+        padding: 0;
+        width: 110%;
+      }
+
+      .SimpleInput_customValueBlock {
+        height: auto;
+        padding-right: 10px;
+      }
+
+      .SelectOverrides_selectInput {
+        align-items: center;
+        display: flex;
+        position: relative;
+
+        &:after {
+          bottom: 0;
+          left: 0;
+          margin-top: 1px;
+          position: relative;
+        }
+
+        &:hover:after {
+          background-color: var(--rp-select-arrow-bg-color-open);
+        }
+      }
+
+      .SimpleBubble_bubble {
+        border: none;
+        left: -12px;
+        min-width: initial;
+      }
+
+      .ScrollbarsCustom-Content {
+        padding: 0 !important;
+      }
+
+      .ScrollbarsCustom,
+      .ScrollbarsCustom-Wrapper,
+      .ScrollbarsCustom-Scroller {
+        position: relative !important;
+      }
+    }
+  }
+
+  .filterCounter {
+    opacity: 0.5;
+  }
+
+  .filterOption {
+    font-family: var(--font-regular);
+    font-size: 14px;
+    line-height: 1.43;
+    white-space: nowrap;
+  }
+
+  .count {
+    font-family: var(--font-light);
+    font-size: 14px;
+    line-height: 1.43;
+    margin-left: auto;
+  }
+
+  .toggleAllButton {
+    background: var(--theme-widgets-asset-token-fingerprint-background-color);
+    border-radius: 3px;
+    color: var(--theme-widgets-asset-token-text-color);
+    cursor: pointer;
+    font-family: var(--font-regular);
+    font-size: 14px;
+    line-height: 1.43;
+    margin-left: 6px;
+    padding: 0 6px;
+    white-space: nowrap;
+
+    &:disabled {
+      cursor: initial;
+      opacity: 0.3;
+    }
+  }
+
+  .noResults {
+    display: inline-block;
+    font-family: var(--font-regular);
+    font-size: 16px;
+    line-height: 1.38;
+    margin-left: 30px;
+    margin-top: 30px;
+  }
+
+  .list {
+    margin-right: -2px;
+    max-height: 450px;
+    overflow-y: scroll;
+    padding-left: 15px;
+    padding-right: 12px;
+
+    &::-webkit-scrollbar {
+      width: 5px;
+    }
+
+    &::-webkit-scrollbar-button {
+      display: inline;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      border: none;
+    }
+  }
+
+  .listItem {
+    display: flex;
+
+    &:first-of-type {
+      padding-top: 6px;
+    }
+
+    &:not(:last-of-type) {
+      .token {
+        border-bottom: 1px solid var(--theme-tokens-picker-token-separator);
+      }
+    }
+  }
+
+  .checkbox {
+    align-self: flex-start;
+    margin-right: 20px;
+    margin-top: 14px;
+  }
+
+  :global(.SimpleCheckbox_disabled) {
+    opacity: 0.3;
+  }
+
+  .token {
+    flex: 1;
+
+    &:global(.WalletToken_isExpanded) {
+      padding-bottom: 14px;
+    }
+  }
+
+  .tokenHeader {
+    padding-bottom: 14px;
+    padding-top: 14px;
+
+    :global(.WalletTokenHeader_asset) {
+      margin-left: 12px;
+    }
+  }
+
+  .tokenFooter {
+    margin-top: 14px;
+    padding-top: 5px;
+  }
+}
+
+.dialog {
+  margin-left: -15px;
+  margin-right: -15px;
+
+  :global {
+    .Dialog_content {
+      display: flex;
+      width: 100%;
+    }
+
+    .DialogCloseButton_component {
+      right: 15px;
+    }
+
+    .Dialog_contentWrapper {
+      display: flex;
+      overflow-y: hidden;
+    }
+
+    .Dialog_actions {
+      padding-left: 15px;
+      padding-right: 15px;
+    }
+  }
+}
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.stories.tsx b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.stories.tsx
new file mode 100644
index 0000000000..61b3a7b423
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.stories.tsx
@@ -0,0 +1,76 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { withKnobs } from '@storybook/addon-knobs';
+import BigNumber from 'bignumber.js';
+import StoryDecorator from '../../../../../../../storybook/stories/_support/StoryDecorator';
+import StoryProvider from '../../../../../../../storybook/stories/_support/StoryProvider';
+import { generateHash } from '../../../../../../../storybook/stories/_support/utils';
+import WalletTokenPicker from './WalletTokenPicker';
+
+const assets = [
+  {
+    policyId: generateHash(),
+    assetName: '546f6b656e31',
+    assetNameASCII: 'Token1',
+    quantity: new BigNumber(10),
+    fingerprint: generateHash(),
+    recommendedDecimals: null,
+    uniqueId: generateHash(),
+    metadata: {
+      name: 'MakerDAO',
+      ticker: 'DAI',
+      description: 'Test description',
+      unit: {
+        name: 'DAI',
+        decimals: 6,
+      },
+      url: 'http://example.com',
+      logo: '',
+    },
+  },
+  {
+    policyId: generateHash(),
+    assetName: '546f6b656e32',
+    assetNameASCII: 'Token2',
+    quantity: new BigNumber(20),
+    fingerprint: generateHash(),
+    recommendedDecimals: null,
+    uniqueId: generateHash(),
+  },
+  {
+    policyId: generateHash(),
+    assetName: '546f6b656e33',
+    assetNameASCII: 'Token3',
+    quantity: new BigNumber(30),
+    fingerprint: generateHash(),
+    recommendedDecimals: null,
+    uniqueId: generateHash(),
+  },
+  {
+    policyId: generateHash(),
+    assetName: '546f6b656e34',
+    assetNameASCII: 'Token4',
+    quantity: new BigNumber(30),
+    fingerprint: generateHash(),
+    recommendedDecimals: null,
+    uniqueId: generateHash(),
+  },
+];
+storiesOf('Wallets|Tokens', module)
+  .addDecorator((story) => (
+    <StoryProvider>
+      <StoryDecorator>{story()}</StoryDecorator>
+    </StoryProvider>
+  ))
+  .addDecorator(withKnobs)
+  .add('WalletTokenPicker', () => (
+    <WalletTokenPicker
+      assets={assets}
+      walletName="My Wallet"
+      tokenFavorites={{
+        [assets[0].uniqueId]: true,
+      }}
+      onAdd={() => {}}
+      onCancel={() => {}}
+    />
+  ));
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.tsx b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.tsx
new file mode 100644
index 0000000000..eed8ec4a2a
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.tsx
@@ -0,0 +1,174 @@
+import React, { useMemo } from 'react';
+import { observer } from 'mobx-react';
+import { injectIntl } from 'react-intl';
+import classNames from 'classnames';
+import { Select } from 'react-polymorph/lib/components/Select';
+import Dialog from '../../../widgets/Dialog';
+import WalletToken from '../wallet-token/WalletToken';
+import WalletTokensSearch from '../wallet-tokens-search/WalletTokensSearch';
+import WalletTokenPickerCheckbox from './WalletTokenPickerCheckbox';
+import DialogCloseButton from '../../../widgets/DialogCloseButton';
+import styles from './WalletTokenPicker.scss';
+import { messages } from './WalletTokenPicker.messages';
+import {
+  filterSelectOptions,
+  getToggleAllLabel,
+  getTokenCounterText,
+} from './helpers';
+import { useFilters, useCheckboxes, useScrollPosition } from './hooks';
+import { MAX_TOKENS, ScrollPositionEnum } from './const';
+import type { Props } from './types';
+
+const WalletTokenPicker = ({
+  intl,
+  assets,
+  walletName,
+  tokenFavorites,
+  previouslyCheckedIds = [],
+  onAdd,
+  onCancel,
+}: Props) => {
+  const { onScroll, scrollPosition } = useScrollPosition();
+  const {
+    searchValue,
+    setSearchValue,
+    currentAssets,
+    filterOption,
+    setFilterOption,
+  } = useFilters({
+    assets,
+    tokenFavorites,
+  });
+  const {
+    checkboxes,
+    totalCheckedCount,
+    checkedIds,
+    previouslyCheckedIdsSet,
+    isMaxTotalCount,
+    isToggleAllDisabled,
+    isClearAllMode,
+    toggleAllFn,
+    toggleCheckbox,
+  } = useCheckboxes({
+    assets,
+    currentAssets,
+    previouslyCheckedIds,
+  });
+  const scrollNotTop = scrollPosition !== ScrollPositionEnum.TOP;
+  const toolbarStyles = classNames(
+    styles.toolbar,
+    scrollNotTop && styles.scrollNotTop
+  );
+  const toolbarContainerStyles = classNames(
+    scrollNotTop && styles.toolbarContainer
+  );
+  const actions = useMemo(
+    () => [
+      {
+        label: intl.formatMessage(messages.cancelButtonLabel),
+        onClick: onCancel,
+      },
+      {
+        label: intl.formatMessage(messages.addButtonLabel),
+        primary: true,
+        disabled: !checkedIds.length,
+        onClick: () => onAdd(checkedIds),
+      },
+    ],
+    [intl, checkedIds, onAdd]
+  );
+  return (
+    <Dialog
+      className={styles.dialog}
+      title={intl.formatMessage(messages.title)}
+      subtitle={walletName}
+      closeOnOverlayClick
+      actions={actions}
+      onClose={onCancel}
+      closeButton={<DialogCloseButton />}
+    >
+      <div className={styles.root} data-testid="WalletTokenPicker">
+        <div className={styles.search}>
+          <WalletTokensSearch
+            searchValue={searchValue}
+            onSearch={setSearchValue}
+          />
+        </div>
+
+        <div className={toolbarContainerStyles}>
+          <div className={toolbarStyles}>
+            <Select
+              value={filterOption}
+              onChange={setFilterOption}
+              className={styles.filterSelect}
+              options={filterSelectOptions(intl)}
+              selectionRenderer={(option) => (
+                <span>
+                  {option.label}
+                  <span className={styles.filterCounter}>
+                    {getTokenCounterText({
+                      assets,
+                      currentAssets,
+                    })}
+                  </span>
+                </span>
+              )}
+              optionRenderer={(option) => (
+                <span className={styles.filterOption}>{option.label}</span>
+              )}
+              optionHeight={33}
+            />
+            <span className={styles.count}>
+              {intl.formatMessage(messages.checkedCountLabel, {
+                checkedCount: totalCheckedCount,
+                maxTokens: Math.min(MAX_TOKENS, assets.length),
+              })}
+            </span>
+            <button
+              className={styles.toggleAllButton}
+              onClick={toggleAllFn}
+              disabled={isToggleAllDisabled}
+            >
+              {intl.formatMessage(messages[getToggleAllLabel(isClearAllMode)], {
+                maxTokens: MAX_TOKENS,
+              })}
+            </button>
+          </div>
+        </div>
+        {/* @ts-ignore ts-migrate(2322) FIXME: Type '(evt: React.MouseEvent<HTMLElement>) => void... Remove this comment to see the full error message */}
+        <div className={styles.list} onScroll={onScroll}>
+          {currentAssets?.length === 0 && (
+            <span className={styles.noResults}>
+              {intl.formatMessage(messages.noResults)}
+            </span>
+          )}
+          {currentAssets?.map((asset) => (
+            <div key={asset.uniqueId} className={styles.listItem}>
+              <WalletTokenPickerCheckbox
+                className={styles.checkbox}
+                isChecked={checkboxes[asset.uniqueId]}
+                isMaxCount={isMaxTotalCount}
+                isPreviouslyChecked={previouslyCheckedIdsSet.has(
+                  asset.uniqueId
+                )}
+                uniqueId={asset.uniqueId}
+                toggleCheckbox={toggleCheckbox}
+              />
+              {/* @ts-ignore ts-migrate(2739) FIXME: Type '{ asset: AssetToken; className: any; headerC... Remove this comment to see the full error message */}
+              <WalletToken
+                asset={asset}
+                className={styles.token}
+                headerClassName={styles.tokenHeader}
+                footerClassName={styles.tokenFooter}
+                fullFingerprint={false}
+                isFavorite={tokenFavorites[asset.uniqueId]}
+              />
+            </div>
+          ))}
+        </div>
+      </div>
+    </Dialog>
+  );
+};
+
+export default injectIntl(observer(WalletTokenPicker));
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPickerCheckbox.tsx b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPickerCheckbox.tsx
new file mode 100644
index 0000000000..a9aa9998af
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPickerCheckbox.tsx
@@ -0,0 +1,43 @@
+import React, { useCallback } from 'react';
+import { injectIntl } from 'react-intl';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
+import { messages } from './WalletTokenPicker.messages';
+import { MAX_TOKENS } from './const';
+import type { ItemProps as Props } from './types';
+
+const WalletTokenPickerCheckbox = ({
+  intl,
+  className,
+  isChecked,
+  isMaxCount,
+  isPreviouslyChecked,
+  uniqueId,
+  toggleCheckbox,
+}: Props) => {
+  const checked = isChecked || isPreviouslyChecked;
+  const toolTipDisabled = !isMaxCount || checked;
+  const onChange = useCallback(
+    () => toggleCheckbox(uniqueId),
+    [toggleCheckbox, uniqueId]
+  );
+  return (
+    <div className={className}>
+      <PopOver
+        maxWidth={315}
+        disabled={toolTipDisabled}
+        content={intl.formatMessage(messages.maxTokensWarning, {
+          maxTokens: MAX_TOKENS,
+        })}
+      >
+        <Checkbox
+          checked={checked}
+          onChange={onChange}
+          disabled={isPreviouslyChecked}
+        />
+      </PopOver>
+    </div>
+  );
+};
+
+export default injectIntl(WalletTokenPickerCheckbox);
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/const.ts b/source/renderer/app/components/wallet/tokens/wallet-token-picker/const.ts
new file mode 100644
index 0000000000..809a6f6a00
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/const.ts
@@ -0,0 +1,25 @@
+import type {
+  ScrollPosition,
+  FilterSelectOptions,
+  ToggleAllMode,
+} from './types';
+
+export const MAX_TOKENS = 30;
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
+export const ScrollPositionEnum: EnumMap<string, ScrollPosition> = {
+  TOP: 'top',
+  MIDDLE: 'middle',
+  BOTTOM: 'bottom',
+};
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
+export const FilterSelectOptionsEnum: EnumMap<string, FilterSelectOptions> = {
+  ALL: 'all',
+  FAVORITES: 'favorites',
+};
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
+export const ToggleModeEnum: EnumMap<string, ToggleAllMode> = {
+  CLEAR_ALL: 'clearAll',
+  CLEAR_ALL_DISABLED: 'clearAllDisabled',
+  SELECT_ALL: 'selectAll',
+  SELECT_ALL_DISABLED: 'selectAllDisabled',
+};
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/helpers.ts b/source/renderer/app/components/wallet/tokens/wallet-token-picker/helpers.ts
new file mode 100644
index 0000000000..48696924d9
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/helpers.ts
@@ -0,0 +1,147 @@
+import { messages } from './WalletTokenPicker.messages';
+import {
+  MAX_TOKENS,
+  ScrollPositionEnum,
+  FilterSelectOptionsEnum,
+  ToggleModeEnum,
+} from './const';
+import type { Intl } from '../../../../types/i18nTypes';
+import type {
+  Assets,
+  BooleanMap,
+  ClearSelection,
+  FilterAssets,
+  ScrollPosition,
+  GetMaxTokensIdMap,
+  GetTokenCounterText,
+  GetCurrentCheckedIds,
+  GetToggleAllMode,
+  GetEnabledAssetIds,
+} from './types';
+
+const isScrollAtTop = (element: HTMLElement) => element.scrollTop === 0;
+
+const isScrollAtBottom = (element: HTMLElement) =>
+  element.scrollHeight - element.scrollTop === element.clientHeight;
+
+export const getScrollPosition = (element: EventTarget): ScrollPosition => {
+  if (!(element instanceof HTMLElement)) {
+    return ScrollPositionEnum.TOP;
+  }
+
+  if (isScrollAtTop(element)) {
+    return ScrollPositionEnum.TOP;
+  }
+
+  if (isScrollAtBottom(element)) {
+    return ScrollPositionEnum.BOTTOM;
+  }
+
+  return ScrollPositionEnum.MIDDLE;
+};
+export const getMaxTokensIdMap = ({
+  checkedIds,
+  currentAssetIds,
+  previouslyCheckedIds,
+}: GetMaxTokensIdMap) => {
+  return [...new Set([...checkedIds, ...currentAssetIds])]
+    .slice(0, MAX_TOKENS - previouslyCheckedIds.length)
+    .reduce((acc: BooleanMap, element) => ({ ...acc, [element]: true }), {});
+};
+export const clearSelection = ({
+  checkboxes,
+  currentAssetIds,
+}: ClearSelection) => {
+  return {
+    ...checkboxes,
+    ...currentAssetIds.reduce(
+      (acc, assestId) => ({ ...acc, [assestId]: false }),
+      {} as BooleanMap
+    ),
+  };
+};
+export const getEnabledAssetIds = ({
+  assets,
+  previouslyCheckedIdsSet,
+}: GetEnabledAssetIds) =>
+  assets.reduce(
+    (acc, { uniqueId }) =>
+      previouslyCheckedIdsSet.has(uniqueId) ? acc : [...acc, uniqueId],
+    []
+  );
+export const getCheckedIds = (checkBoxes: BooleanMap) =>
+  Object.entries(checkBoxes).reduce(
+    (acc, [id, checked]) => (checked ? [...acc, id] : acc),
+    []
+  );
+export const getCurrentCheckedIds = ({
+  checkboxes,
+  currentAssetIds,
+}: GetCurrentCheckedIds): Array<string> =>
+  currentAssetIds.filter((assetId) => checkboxes[assetId]);
+export const filterSelectOptions = (intl: Intl) => [
+  {
+    label: intl.formatMessage(messages.allTokensLabel),
+    value: FilterSelectOptionsEnum.ALL,
+  },
+  {
+    label: intl.formatMessage(messages.favoriteTokensLabel),
+    value: FilterSelectOptionsEnum.FAVORITES,
+  },
+];
+export const filterAssets = ({
+  assets,
+  filter,
+  tokenFavorites,
+}: FilterAssets): Assets => {
+  return assets.filter((asset) => {
+    return filter === FilterSelectOptionsEnum.FAVORITES
+      ? tokenFavorites[asset.uniqueId]
+      : true;
+  });
+};
+export const getToggleAllLabel = (isClearAllMode: boolean) =>
+  isClearAllMode ? 'clearAll' : 'checkAllLabel';
+export const getTokenCounterText = ({
+  assets,
+  currentAssets,
+}: GetTokenCounterText) => {
+  if (assets.length === currentAssets.length) {
+    return ` (${assets.length})`;
+  }
+
+  return ` (${currentAssets.length} / ${assets.length})`;
+};
+
+const isAllCurrentDisabled = ({
+  isMaxCurrentCount,
+  currentCheckedCount,
+}: GetToggleAllMode) => currentCheckedCount === 0 && isMaxCurrentCount;
+
+const isMaxedAndCurrentCleared = ({
+  isMaxTotalCount,
+  currentCheckedCount,
+}: GetToggleAllMode) => isMaxTotalCount && currentCheckedCount === 0;
+
+const isMaxedAndSomeSelected = ({
+  isMaxCurrentCount,
+  isMaxTotalCount,
+  currentCheckedCount,
+}: GetToggleAllMode) =>
+  (isMaxTotalCount || isMaxCurrentCount) && currentCheckedCount;
+
+export const getToggleAllMode = (args: GetToggleAllMode) => {
+  if (isMaxedAndSomeSelected(args)) {
+    return ToggleModeEnum.CLEAR_ALL;
+  }
+
+  if (isAllCurrentDisabled(args)) {
+    return ToggleModeEnum.CLEAR_ALL_DISABLED;
+  }
+
+  if (isMaxedAndCurrentCleared(args)) {
+    return ToggleModeEnum.SELECT_ALL_DISABLED;
+  }
+
+  return ToggleModeEnum.SELECT_ALL;
+};
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/hooks.spec.tsx b/source/renderer/app/components/wallet/tokens/wallet-token-picker/hooks.spec.tsx
new file mode 100644
index 0000000000..b58cae7a28
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/hooks.spec.tsx
@@ -0,0 +1,175 @@
+import React from 'react';
+import { render, act } from '@testing-library/react';
+import { useCheckboxes } from './hooks';
+
+const generateAssets = (n) => [...Array(n).keys()].map(tokenGenerator);
+
+const setup = (useHook, args) => {
+  const returnVal = {};
+
+  function TestComponent() {
+    Object.assign(returnVal, useHook(args));
+    return null;
+  }
+
+  render(<TestComponent />);
+  return returnVal;
+};
+
+const tokenGenerator = (id) => ({
+  uniqueId: id,
+});
+
+describe('WalletTokenPicker hooks', () => {
+  test('useCheckboxes initial state', () => {
+    const assets = generateAssets(10);
+    const hook = setup(useCheckboxes, {
+      assets,
+      currentAssets: assets,
+      previouslyCheckedIds: [],
+    });
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'checkboxes' does not exist on type '{}'.
+    expect(hook.checkboxes).toMatchObject({});
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'checkedIds' does not exist on type '{}'.
+    expect(hook.checkedIds.length).toEqual(0);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'totalCheckedCount' does not exist on typ... Remove this comment to see the full error message
+    expect(hook.totalCheckedCount).toBe(0);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'previouslyCheckedIdsSet' does not exist ... Remove this comment to see the full error message
+    expect(hook.previouslyCheckedIdsSet.size).toEqual(0);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'isMaxTotalCount' does not exist on type ... Remove this comment to see the full error message
+    expect(hook.isMaxTotalCount).toBe(false);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'isToggleAllDisabled' does not exist on t... Remove this comment to see the full error message
+    expect(hook.isToggleAllDisabled).toEqual(false);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'isClearAllMode' does not exist on type '... Remove this comment to see the full error message
+    expect(hook.isClearAllMode).toEqual(false);
+  });
+  const toggleCases = [
+    // testId, assets, sequence, expected [checkedCount, checkedIds]
+    [
+      'toggle sequence [1]',
+      generateAssets(10),
+      ['1'],
+      [
+        {
+          1: true,
+        },
+        ['1'],
+      ],
+    ],
+    [
+      'toggle sequence [1, 2]',
+      generateAssets(10),
+      ['1', '2'],
+      [
+        {
+          1: true,
+          2: true,
+        },
+        ['1', '2'],
+      ],
+    ],
+    [
+      'toggle sequence [1, 1, 2, 3]',
+      generateAssets(10),
+      ['1', '1', '2', '3'],
+      [
+        {
+          1: false,
+          2: true,
+          3: true,
+        },
+        ['2', '3'],
+      ],
+    ],
+  ];
+  test.each(toggleCases)(
+    'useCheckboxes toggle checkbox for %s',
+    (testId, assets, sequence, expected) => {
+      const hook = setup(useCheckboxes, {
+        assets,
+        currentAssets: assets,
+        previouslyCheckedIds: [],
+      });
+
+      for (let i = 0; i < sequence.length; i++) {
+        act(() => {
+          // @ts-ignore ts-migrate(2339) FIXME: Property 'toggleCheckbox' does not exist on type '... Remove this comment to see the full error message
+          hook.toggleCheckbox(sequence[i]);
+        });
+      }
+
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'checkboxes' does not exist on type '{}'.
+      expect(hook.checkboxes).toMatchObject(expected[0]);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'checkedIds' does not exist on type '{}'.
+      expect(hook.checkedIds).toEqual(expected[1]);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'totalCheckedCount' does not exist on typ... Remove this comment to see the full error message
+      expect(hook.totalCheckedCount).toBe(expected[1].length);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'isMaxTotalCount' does not exist on type ... Remove this comment to see the full error message
+      expect(hook.isMaxTotalCount).toBe(false);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'isToggleAllDisabled' does not exist on t... Remove this comment to see the full error message
+      expect(hook.isToggleAllDisabled).toEqual(false);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'isClearAllMode' does not exist on type '... Remove this comment to see the full error message
+      expect(hook.isClearAllMode).toEqual(false);
+    }
+  );
+  const toggleAllFnCases = [
+    // testId, [assets, previouslyCheckedIds], alreadyChecked, expected [checkedCount, checkedIds]
+    [
+      'less than 30 assets',
+      [generateAssets(10), []],
+      [],
+      [10, [...Array(10).keys()].map(String)],
+    ],
+    [
+      'more than 30 assets',
+      [generateAssets(35), []],
+      [],
+      [30, [...Array(30).keys()].map(String)],
+    ],
+    [
+      'more than 30 assets with some already checked',
+      [generateAssets(35), []],
+      ['32', '33'],
+      [30, [...Array(28).keys(), '32', '33'].map(String)],
+    ],
+    [
+      'more than 30 assets with some previously checked',
+      [generateAssets(35), ['32', '33']],
+      [],
+      [30, [...Array(28).keys()].map(String)],
+    ],
+  ];
+  test.each(toggleAllFnCases)(
+    'useCheckboxes toggle toggleAllFn for %s',
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(testId: string | string[] | (nu... Remove this comment to see the full error message
+    (testId, [assets, previouslyCheckedIds], alreadyChecked, expected) => {
+      const hook = setup(useCheckboxes, {
+        assets,
+        currentAssets: assets,
+        previouslyCheckedIds,
+      });
+
+      for (let i = 0; i < alreadyChecked.length; i++) {
+        act(() => {
+          // @ts-ignore ts-migrate(2339) FIXME: Property 'toggleCheckbox' does not exist on type '... Remove this comment to see the full error message
+          hook.toggleCheckbox(alreadyChecked[i]);
+        });
+      }
+
+      act(() => {
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'toggleAllFn' does not exist on type '{}'... Remove this comment to see the full error message
+        hook.toggleAllFn();
+      });
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'totalCheckedCount' does not exist on typ... Remove this comment to see the full error message
+      expect(hook.totalCheckedCount).toBe(expected[0]);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'checkedIds' does not exist on type '{}'.
+      expect(hook.checkedIds).toEqual(expected[1]);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'isMaxTotalCount' does not exist on type ... Remove this comment to see the full error message
+      expect(hook.isMaxTotalCount).toBe(true);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'isToggleAllDisabled' does not exist on t... Remove this comment to see the full error message
+      expect(hook.isToggleAllDisabled).toEqual(false);
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'isClearAllMode' does not exist on type '... Remove this comment to see the full error message
+      expect(hook.isClearAllMode).toEqual(true);
+    }
+  );
+});
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/hooks.ts b/source/renderer/app/components/wallet/tokens/wallet-token-picker/hooks.ts
new file mode 100644
index 0000000000..cc8aa90e39
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/hooks.ts
@@ -0,0 +1,164 @@
+import { useState, useEffect, useCallback, useMemo } from 'react';
+import { debounce } from 'lodash';
+import { searchAssets } from '../../../../utils/assets';
+import {
+  MAX_TOKENS,
+  ScrollPositionEnum,
+  FilterSelectOptionsEnum,
+  ToggleModeEnum,
+} from './const';
+import {
+  getEnabledAssetIds,
+  getCheckedIds,
+  filterAssets,
+  getScrollPosition,
+  getMaxTokensIdMap,
+  getCurrentCheckedIds,
+  clearSelection,
+  getToggleAllMode,
+} from './helpers';
+import type {
+  Assets,
+  FilterSelectOptions,
+  ScrollPosition,
+  UseCheckboxes,
+  UseFilters,
+  BooleanMap,
+} from './types';
+
+export const useCheckboxes = ({
+  assets,
+  currentAssets,
+  previouslyCheckedIds,
+}: UseCheckboxes) => {
+  const [checkboxes, setCheckboxes] = useState<BooleanMap>({});
+  const checkedIds = useMemo(() => getCheckedIds(checkboxes), [checkboxes]);
+  const previouslyCheckedIdsSet = useMemo(
+    () => new Set<string>(previouslyCheckedIds),
+    [previouslyCheckedIds]
+  );
+  const currentAssetIds = useMemo(
+    () =>
+      getEnabledAssetIds({
+        assets: currentAssets,
+        previouslyCheckedIdsSet,
+      }),
+    [currentAssets, previouslyCheckedIdsSet]
+  );
+  const currentCheckedIds = useMemo(
+    () =>
+      getCurrentCheckedIds({
+        checkboxes,
+        currentAssetIds,
+      }),
+    [checkboxes, currentAssetIds]
+  );
+  const currentCheckedCount = currentCheckedIds.length;
+  const totalCheckedCount = checkedIds.length + previouslyCheckedIdsSet.size;
+  const isMaxTotalCount =
+    totalCheckedCount === Math.min(MAX_TOKENS, assets.length);
+  const isMaxCurrentCount =
+    currentCheckedCount === Math.min(MAX_TOKENS, currentAssetIds.length);
+  const clearAll = useCallback(
+    () =>
+      setCheckboxes(
+        clearSelection({
+          checkboxes,
+          currentAssetIds,
+        })
+      ),
+    [setCheckboxes, checkboxes, currentAssetIds]
+  );
+  const checkMax = useCallback(() => {
+    setCheckboxes(
+      getMaxTokensIdMap({
+        checkedIds,
+        currentAssetIds,
+        previouslyCheckedIds,
+      })
+    );
+  }, [currentAssetIds, setCheckboxes, previouslyCheckedIds, checkedIds]);
+  const toggleAllMode = getToggleAllMode({
+    isMaxCurrentCount,
+    isMaxTotalCount,
+    currentCheckedCount,
+  });
+  const isClearAllMode = [
+    ToggleModeEnum.CLEAR_ALL,
+    ToggleModeEnum.CLEAR_ALL_DISABLED,
+  ].includes(toggleAllMode);
+  const isToggleAllDisabled = [
+    ToggleModeEnum.SELECT_ALL_DISABLED,
+    ToggleModeEnum.CLEAR_ALL_DISABLED,
+  ].includes(toggleAllMode);
+  const toggleAllFn = isClearAllMode ? clearAll : checkMax;
+  const toggleCheckbox = useCallback(
+    (assetId: string) => {
+      const newValue = !checkboxes[assetId];
+
+      if (totalCheckedCount < MAX_TOKENS || !newValue) {
+        setCheckboxes({ ...checkboxes, [assetId]: newValue });
+      }
+    },
+    [checkboxes]
+  );
+  return {
+    checkboxes,
+    totalCheckedCount,
+    checkedIds,
+    isMaxTotalCount,
+    isToggleAllDisabled,
+    previouslyCheckedIdsSet,
+    toggleAllFn,
+    toggleCheckbox,
+    isClearAllMode,
+  };
+};
+export const useFilters = ({ assets, tokenFavorites }: UseFilters) => {
+  const [searchValue, setSearchValue] = useState<string>('');
+  const [currentAssets, setCurrentAssets] = useState<Assets>(assets);
+  const [filterOption, setFilterOption] = useState<FilterSelectOptions>(
+    FilterSelectOptionsEnum.ALL
+  );
+  useEffect(() => {
+    const searchedAssets = searchAssets(searchValue, assets);
+    const filterdAssets = filterAssets({
+      assets: searchedAssets,
+      filter: filterOption,
+      tokenFavorites,
+    });
+    setCurrentAssets(filterdAssets);
+  }, [assets, searchValue, filterOption, tokenFavorites]);
+  return {
+    searchValue,
+    setSearchValue,
+    currentAssets,
+    filterOption,
+    setFilterOption,
+  };
+};
+export const useScrollPosition = () => {
+  const [scrollPosition, setScrollPosition] = useState<ScrollPosition>(
+    ScrollPositionEnum.TOP
+  );
+
+  const setPosition = (target: EventTarget) =>
+    setScrollPosition(getScrollPosition(target));
+
+  const debouncedSetPosition = useCallback(
+    debounce(setPosition, 100, {
+      leading: true,
+    }),
+    [setPosition]
+  );
+
+  const onScroll = (evt: React.MouseEvent<HTMLElement>) => {
+    evt.persist();
+    debouncedSetPosition(evt.target);
+  };
+
+  return {
+    scrollPosition,
+    onScroll,
+  };
+};
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token-picker/types.ts b/source/renderer/app/components/wallet/tokens/wallet-token-picker/types.ts
new file mode 100644
index 0000000000..0dd55a606c
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token-picker/types.ts
@@ -0,0 +1,67 @@
+import type { Intl } from '../../../../types/i18nTypes';
+import type { AssetToken } from '../../../../api/assets/types';
+
+export type Props = {
+  intl: Intl;
+  assets: Array<AssetToken>;
+  walletName: string;
+  tokenFavorites: Record<string, any>;
+  previouslyCheckedIds?: Array<string>;
+  onAdd: (...args: Array<any>) => any;
+  onCancel: (...args: Array<any>) => any;
+};
+export type ItemProps = {
+  intl: Intl;
+  className: string;
+  isChecked: boolean;
+  isMaxCount: boolean;
+  isPreviouslyChecked: boolean;
+  uniqueId: string;
+  toggleCheckbox: (...args: Array<any>) => any;
+};
+export type ScrollPosition = 'top' | 'middle' | 'bottom';
+export type FilterSelectOptions = 'all' | 'favorites';
+export type ToggleAllMode =
+  | 'clearAll'
+  | 'clearAllDisabled'
+  | 'selectAll'
+  | 'selectAllDisabled';
+export type Assets = Array<AssetToken>;
+export type BooleanMap = Record<string, boolean>;
+export type FilterAssets = {
+  assets: Assets;
+  filter: FilterSelectOptions;
+  tokenFavorites: BooleanMap;
+};
+export type UseCheckboxes = {
+  assets: Assets;
+  currentAssets: Assets;
+  previouslyCheckedIds: Array<string>;
+};
+export type UseFilters = {
+  assets: Assets;
+  tokenFavorites: BooleanMap;
+};
+export type GetMaxTokensIdMap = {
+  checkedIds: Array<string>;
+  currentAssetIds: Array<string>;
+  previouslyCheckedIds: Array<string>;
+};
+export type GetTokenCounterText = {
+  assets: Assets;
+  currentAssets: Assets;
+};
+export type ClearSelection = {
+  checkboxes: BooleanMap;
+  currentAssetIds: Array<string>;
+};
+export type GetToggleAllMode = {
+  isMaxTotalCount: boolean;
+  isMaxCurrentCount: boolean;
+  currentCheckedCount: number;
+};
+export type GetEnabledAssetIds = {
+  assets: Assets;
+  previouslyCheckedIdsSet: Set<string>;
+};
+export type GetCurrentCheckedIds = ClearSelection;
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts
new file mode 100644
index 0000000000..7e712df361
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts
@@ -0,0 +1,31 @@
+import { defineMessages } from 'react-intl';
+
+export const messages = defineMessages({
+  tokenSendButton: {
+    id: 'wallet.summary.asset.tokenSendButton',
+    defaultMessage: '!!!Send',
+    description: 'Send button on Wallet summary assets page',
+  },
+  amountLabel: {
+    id: 'wallet.summary.asset.amountLabel',
+    defaultMessage: '!!!Amount',
+    description: 'Amount label on Wallet summary assets page',
+  },
+  settingsButtonLabel: {
+    id: 'wallet.summary.asset.settings.button.label',
+    defaultMessage: '!!!Settings',
+    description: 'Settings label on Wallet summary assets page',
+  },
+  settingsWarningPopOverAvailable: {
+    id: 'assets.warning.available',
+    defaultMessage:
+      '!!!Recommended configuration for decimal places for this native token is available.',
+    description: 'Asset settings recommended pop over content',
+  },
+  settingsWarningPopOverNotUsing: {
+    id: 'assets.warning.notUsing',
+    defaultMessage:
+      '!!!You are not using the recommended decimal place configuration for this native token.',
+    description: 'Asset settings recommended pop over content',
+  },
+});
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.scss b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.scss
new file mode 100644
index 0000000000..cc0399627f
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.scss
@@ -0,0 +1,47 @@
+.component {
+  overflow: hidden;
+
+  &:not(:last-of-type) {
+    border-bottom: 1px solid rgba(94, 96, 102, 0.15);
+  }
+
+  &.isExpanded:not(.removing) {
+    background-color: var(--theme-tokens-list-header-expanded-background-color);
+    padding-bottom: 20px;
+
+    .content {
+      display: block;
+    }
+  }
+
+  &.inserting {
+    animation: insertAnimation 0.3s;
+  }
+
+  &.removing {
+    animation: removingAnimation 0.3s;
+    border-bottom: 0 none;
+    height: 0;
+  }
+}
+@keyframes insertAnimation {
+  0% {
+    height: 0;
+  }
+  100% {
+    height: 36px;
+  }
+}
+@keyframes removingAnimation {
+  0% {
+    height: 36px;
+  }
+  100% {
+    height: 0;
+  }
+}
+
+.content {
+  display: none;
+  margin: 13px 12px 0;
+}
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.spec.tsx b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.spec.tsx
new file mode 100644
index 0000000000..e432d10600
--- /dev/null
+++ b/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);
+  });
+});
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.tsx b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.tsx
new file mode 100644
index 0000000000..5b75b82848
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.tsx
@@ -0,0 +1,102 @@
+import React, { useState, useCallback, useMemo } from 'react';
+import { observer } from 'mobx-react';
+import classNames from 'classnames';
+import styles from './WalletToken.scss';
+import AssetContent from '../../../assets/AssetContent';
+import type { AssetToken } from '../../../../api/assets/types';
+import WalletTokenFooter from './WalletTokenFooter';
+import WalletTokenHeader from './WalletTokenHeader';
+import { isRecommendedDecimal } from './helpers';
+
+type Props = {
+  anyAssetWasHovered: boolean;
+  asset: AssetToken;
+  assetSettingsDialogWasOpened: boolean;
+  className?: string;
+  headerClassName?: string;
+  footerClassName?: string;
+  fullFingerprint?: boolean;
+  isFavorite: boolean;
+  isInsertingAsset: boolean;
+  isLoading: boolean;
+  isRemovingAsset: boolean;
+  onAssetSettings?: (...args: Array<any>) => any;
+  onCopyAssetParam?: (...args: Array<any>) => any;
+  onOpenAssetSend?: (...args: Array<any>) => any;
+  onToggleFavorite?: (...args: Array<any>) => any;
+};
+const WalletToken = observer((props: Props) => {
+  const {
+    anyAssetWasHovered,
+    asset,
+    assetSettingsDialogWasOpened,
+    className,
+    headerClassName,
+    footerClassName,
+    fullFingerprint = true,
+    isFavorite,
+    isLoading,
+    onAssetSettings,
+    onCopyAssetParam,
+    onOpenAssetSend,
+    onToggleFavorite,
+    isInsertingAsset,
+    isRemovingAsset,
+  } = props;
+  const [isExpanded, setIsExpanded] = useState<boolean>(false);
+
+  const toggleIsExpanded = useCallback(() => {
+    setIsExpanded(!isExpanded);
+  }, [setIsExpanded, isExpanded]);
+
+  const hasWarning = isRecommendedDecimal({
+    decimals: asset.decimals,
+    recommendedDecimals: asset.recommendedDecimals,
+  });
+
+  const componentStyles = useMemo(
+    () =>
+      classNames(
+        styles.component,
+        isExpanded && styles.isExpanded,
+        isInsertingAsset && styles.inserting,
+        isRemovingAsset && styles.removing,
+        className
+      ),
+    [className, styles, isExpanded, isInsertingAsset, isRemovingAsset]
+  );
+  return (
+    <div className={componentStyles}>
+      <WalletTokenHeader
+        asset={asset}
+        className={headerClassName}
+        isFavorite={isFavorite}
+        isExpanded={isExpanded}
+        isLoading={isLoading}
+        fullFingerprint={fullFingerprint}
+        anyAssetWasHovered={anyAssetWasHovered}
+        onClick={toggleIsExpanded}
+        onCopyAssetParam={onCopyAssetParam}
+        onToggleFavorite={onToggleFavorite}
+        assetSettingsDialogWasOpened={assetSettingsDialogWasOpened}
+        hasWarning={hasWarning}
+      />
+      <div className={styles.content}>
+        <AssetContent
+          asset={asset}
+          onCopyAssetParam={onCopyAssetParam}
+          highlightFingerprint={false}
+        />
+        <WalletTokenFooter
+          asset={asset}
+          className={footerClassName}
+          isLoading={isLoading}
+          onAssetSettings={onAssetSettings}
+          onOpenAssetSend={onOpenAssetSend}
+          hasWarning={hasWarning}
+        />
+      </div>
+    </div>
+  );
+});
+export default WalletToken;
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenFooter.scss b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenFooter.scss
new file mode 100644
index 0000000000..b418cf08f0
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenFooter.scss
@@ -0,0 +1,56 @@
+.root {
+  border-top: 1px solid var(--theme-wallet-settings-section-separator-color);
+  color: var(--theme-widgets-asset-token-text-color);
+  display: flex;
+  justify-content: space-between;
+  margin-top: 20px;
+  padding-top: 20px;
+
+  .amount {
+    display: flex;
+    line-height: 1;
+    padding: 9px 0 0 8px;
+
+    .amountLabel {
+      font-family: var(--font-medium);
+      font-size: 12px;
+      line-height: 1.33;
+      text-align: right;
+      white-space: nowrap;
+      width: 70px;
+    }
+
+    .amountValue {
+      font-family: var(--font-light);
+      font-size: 12px;
+      line-height: 16px;
+      margin-left: 10px;
+      white-space: normal;
+      word-break: break-all;
+      word-wrap: break-word;
+    }
+  }
+
+  .buttons {
+    margin: auto 0;
+    white-space: nowrap;
+
+    .button {
+      height: 36px;
+      margin-left: 12px;
+      width: 120px;
+
+      &.disabled {
+        opacity: 0.4;
+      }
+    }
+
+    .settingsButton {
+      svg {
+        height: 9px;
+        margin-left: 6px;
+        width: 11px;
+      }
+    }
+  }
+}
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenFooter.tsx b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenFooter.tsx
new file mode 100644
index 0000000000..e61838a757
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenFooter.tsx
@@ -0,0 +1,107 @@
+import React from 'react';
+import classNames from 'classnames';
+import { observer } from 'mobx-react';
+import { intlShape, injectIntl } from 'react-intl';
+import { Button } from 'react-polymorph/lib/components/Button';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import SVGInline from 'react-svg-inline';
+import styles from './WalletTokenFooter.scss';
+import AssetAmount from '../../../assets/AssetAmount';
+import type { AssetToken } from '../../../../api/assets/types';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/asse... Remove this comment to see the full error message
+import warningIcon from '../../../../assets/images/asset-token-warning-ic.inline.svg';
+import { messages } from './WalletToken.messages';
+
+type Props = {
+  asset: AssetToken;
+  className?: string;
+  intl: intlShape.isRequired;
+  isLoading: boolean;
+  hasWarning: boolean;
+  onAssetSettings?: (...args: Array<any>) => any;
+  onOpenAssetSend?: (...args: Array<any>) => any;
+};
+
+const WalletTokenFooter = (props: Props) => {
+  const {
+    asset,
+    className,
+    intl,
+    isLoading,
+    hasWarning,
+    onAssetSettings,
+    onOpenAssetSend,
+  } = props;
+  const { recommendedDecimals, decimals } = asset;
+
+  const warningPopOverMessage =
+    typeof decimals === 'number'
+      ? messages.settingsWarningPopOverNotUsing
+      : messages.settingsWarningPopOverAvailable;
+  return (
+    <div className={classNames(styles.root, className)}>
+      <div className={styles.amount}>
+        <span className={styles.amountLabel}>
+          {intl.formatMessage(messages.amountLabel)}
+        </span>
+        <div className={styles.amountValue}>
+          <AssetAmount
+            amount={asset.quantity}
+            metadata={asset.metadata}
+            decimals={asset.decimals}
+            isLoading={isLoading}
+          />
+        </div>
+      </div>
+      <div className={styles.buttons}>
+        {onAssetSettings && (
+          <PopOver
+            content={
+              hasWarning &&
+              intl.formatMessage(warningPopOverMessage, {
+                recommendedDecimals,
+              })
+            }
+          >
+            <Button
+              className={classNames([
+                'flat',
+                styles.button,
+                styles.settingsButton,
+              ])}
+              label={
+                <>
+                  {intl.formatMessage(messages.settingsButtonLabel)}
+                  {hasWarning && (
+                    <span data-testid="warning-icon">
+                      <SVGInline svg={warningIcon} />
+                    </span>
+                  )}
+                </>
+              }
+              onClick={() =>
+                onAssetSettings({
+                  asset,
+                })
+              }
+            />
+          </PopOver>
+        )}
+        {onOpenAssetSend && (
+          <Button
+            className={classNames([
+              'primary',
+              styles.button,
+              asset.quantity.isZero() && styles.disabled,
+            ])}
+            onClick={() => onOpenAssetSend(asset)}
+            label={intl.formatMessage(messages.tokenSendButton)}
+            disabled={asset.quantity.isZero()}
+          />
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default injectIntl(observer(WalletTokenFooter));
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss
new file mode 100644
index 0000000000..72de9658f0
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss
@@ -0,0 +1,102 @@
+.root {
+  cursor: pointer;
+  display: flex;
+  padding-bottom: 7px;
+  padding-top: 7px;
+
+  &.isExpanded {
+    background-color: var(--theme-tokens-list-header-expanded-background-color);
+
+    &:hover {
+      background-color: var(
+        --theme-tokens-list-header-expanded-background-color-hover
+      );
+    }
+  }
+
+  .favoriteIcon {
+    border-radius: 3px;
+    cursor: pointer;
+    flex-shrink: 0;
+    height: 22px;
+    margin-left: 10px;
+    opacity: 0.3;
+    transition: opacity 0.25s;
+    width: 23px;
+    z-index: 1;
+
+    svg {
+      height: 14px;
+      width: 15px;
+    }
+
+    &.isFavorite {
+      opacity: 0.7;
+    }
+
+    &:not(.isFavorite) {
+      path {
+        stroke: var(--theme-button-flat-text-color-disabled);
+      }
+    }
+
+    &:hover {
+      opacity: 0.7;
+      &.isFavorite {
+        opacity: 1;
+      }
+    }
+  }
+
+  .asset {
+    margin-left: 10px;
+    margin-right: auto;
+    overflow: hidden;
+    width: auto;
+  }
+
+  .assetAmount {
+    color: var(--theme-widgets-asset-token-text-color);
+    font-family: var(--font-regular);
+    font-size: 12px;
+    letter-spacing: 0.4px;
+    line-height: 1.33;
+    margin: 3px 10px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &:hover {
+    background: var(--theme-button-flat-background-color-hover);
+  }
+}
+
+.arrow {
+  height: 22px;
+  margin-left: 10px;
+  margin-right: 15px;
+  opacity: 0.3;
+  right: 12px;
+  text-align: center;
+  width: 12px;
+  z-index: 1;
+
+  > svg {
+    height: 12px;
+    margin-top: 5px;
+    width: 12px;
+
+    path {
+      fill: var(--theme-widgets-asset-token-text-color);
+    }
+  }
+
+  &:hover {
+    opacity: 0.5;
+  }
+
+  .isExpanded & {
+    transform: rotate(180deg);
+  }
+}
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.tsx b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.tsx
new file mode 100644
index 0000000000..5ac41bb5cb
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.tsx
@@ -0,0 +1,104 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import classNames from 'classnames';
+import { get } from 'lodash';
+import SVGInline from 'react-svg-inline';
+import styles from './WalletTokenHeader.scss';
+import Asset from '../../../assets/Asset';
+import AssetAmount from '../../../assets/AssetAmount';
+import type { AssetToken } from '../../../../api/assets/types';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/coll... Remove this comment to see the full error message
+import arrow from '../../../../assets/images/collapse-arrow-small.inline.svg';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/star... Remove this comment to see the full error message
+import starNotFilledIcon from '../../../../assets/images/star-not-filled.inline.svg';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/star... Remove this comment to see the full error message
+import starFilledIcon from '../../../../assets/images/star-filled.inline.svg';
+
+type Props = {
+  anyAssetWasHovered: boolean;
+  asset: AssetToken;
+  assetSettingsDialogWasOpened: boolean;
+  className?: string;
+  fullFingerprint?: boolean;
+  isExpanded: boolean;
+  isFavorite: boolean;
+  isLoading: boolean;
+  hasWarning: boolean;
+  onClick: (...args: Array<any>) => any;
+  onCopyAssetParam: (...args: Array<any>) => any;
+  onToggleFavorite?: (...args: Array<any>) => any;
+};
+
+const WalletTokenHeader = (props: Props) => {
+  const {
+    anyAssetWasHovered,
+    asset,
+    assetSettingsDialogWasOpened,
+    className,
+    fullFingerprint = true,
+    isExpanded,
+    isFavorite,
+    isLoading,
+    hasWarning,
+    onClick,
+    onCopyAssetParam,
+    onToggleFavorite,
+  } = props;
+  const { uniqueId } = asset;
+  const starIcon = isFavorite ? starFilledIcon : starNotFilledIcon;
+
+  const rootStyles = classNames(
+    styles.root,
+    isExpanded && styles.isExpanded,
+    className
+  );
+  const favoriteIconStyles = classNames(
+    styles.favoriteIcon,
+    isFavorite && styles.isFavorite
+  );
+
+  return (
+    <div className={rootStyles} onClick={onClick}>
+      {onToggleFavorite && (
+        <button
+          className={favoriteIconStyles}
+          onClick={(event) => {
+            event.persist();
+            event.stopPropagation();
+            onToggleFavorite({
+              uniqueId,
+              isFavorite,
+            });
+          }}
+        >
+          <SVGInline svg={starIcon} />
+        </button>
+      )}
+
+      <Asset
+        asset={asset}
+        small={false}
+        onCopyAssetParam={onCopyAssetParam}
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+        metadataNameChars={get('name', asset.metadata, 0)}
+        assetSettingsDialogWasOpened={assetSettingsDialogWasOpened}
+        anyAssetWasHovered={anyAssetWasHovered}
+        className={styles.asset}
+        hidePopOver
+        fullFingerprint={fullFingerprint}
+        hasWarning={hasWarning}
+      />
+      <AssetAmount
+        amount={asset.quantity}
+        metadata={asset.metadata}
+        decimals={asset.decimals}
+        isLoading={isLoading}
+        className={styles.assetAmount}
+        isShort
+      />
+      <SVGInline svg={arrow} className={styles.arrow} />
+    </div>
+  );
+};
+
+export default observer(WalletTokenHeader);
diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/helpers.ts b/source/renderer/app/components/wallet/tokens/wallet-token/helpers.ts
new file mode 100644
index 0000000000..1a93bd77fc
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-token/helpers.ts
@@ -0,0 +1,15 @@
+type IsRecommendedDecimal = {
+  decimals: number | null | undefined;
+  recommendedDecimals: number | null | undefined;
+};
+
+export const isRecommendedDecimal = ({
+  recommendedDecimals,
+  decimals,
+}: IsRecommendedDecimal) => {
+  return (
+    typeof recommendedDecimals === 'number' &&
+    typeof decimals === 'number' &&
+    decimals !== recommendedDecimals
+  );
+};
diff --git a/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts b/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts
new file mode 100644
index 0000000000..169bf3e69b
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts
@@ -0,0 +1,29 @@
+import { defineMessages } from 'react-intl';
+
+export const messages = defineMessages({
+  noResults: {
+    id: 'wallet.tokens.list.search.noResults',
+    defaultMessage: '!!!No results matching your query',
+    description: 'No results on the WalletTokensList',
+  },
+  searchResults: {
+    id: 'wallet.tokens.list.search.searchResults',
+    defaultMessage: '!!!Search Results',
+    description: 'Search Results on the WalletTokensList',
+  },
+  columnAmount: {
+    id: 'wallet.tokens.list.column.amount',
+    defaultMessage: '!!!Amount',
+    description: 'Amount header on the WalletTokensList',
+  },
+  columnToken: {
+    id: 'wallet.tokens.list.column.token',
+    defaultMessage: '!!!Token',
+    description: 'Token header on the WalletTokensList',
+  },
+  viewAllButtonLabel: {
+    id: 'wallet.tokens.list.viewAllButton.label',
+    defaultMessage: '!!!View all tokens',
+    description: 'View all button label on the WalletTokensList',
+  },
+});
diff --git a/source/renderer/app/components/wallet/tokens/WalletTokensList.scss b/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.scss
similarity index 100%
rename from source/renderer/app/components/wallet/tokens/WalletTokensList.scss
rename to source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.scss
diff --git a/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.tsx b/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.tsx
new file mode 100644
index 0000000000..4cbe420691
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.tsx
@@ -0,0 +1,204 @@
+import React, { useState, useMemo, useCallback } from 'react';
+import { intlShape, injectIntl } from 'react-intl';
+import { Button } from 'react-polymorph/lib/components/Button';
+import classnames from 'classnames';
+import { observer } from 'mobx-react';
+import SVGInline from 'react-svg-inline';
+import { searchAssets, sortAssets } from '../../../../utils/assets';
+import styles from './WalletTokensList.scss';
+import Wallet from '../../../../domains/Wallet';
+import BorderedBox from '../../../widgets/BorderedBox';
+import LoadingSpinner from '../../../widgets/LoadingSpinner';
+import WalletToken from '../wallet-token/WalletToken';
+import WalletNoTokens from '../wallet-no-tokens/WalletNoTokens';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/ascending... Remove this comment to see the full error message
+import sortIcon from '../../../../assets/images/ascending.inline.svg';
+import { messages } from './WalletTokensList.messages';
+import type { AssetToken } from '../../../../api/assets/types';
+import type { SortBy, SortDirection } from '../../../../utils/assets';
+
+type Props = {
+  assets: Array<AssetToken>;
+  assetSettingsDialogWasOpened: boolean;
+  currentLocale: string;
+  insertingAssetUniqueId: string | null | undefined;
+  intl: intlShape.isRequired;
+  isLoadingAssets: boolean;
+  onAssetSettings: (...args: Array<any>) => any;
+  onCopyAssetParam: (...args: Array<any>) => any;
+  onExternalLinkClick: (...args: Array<any>) => any;
+  onOpenAssetSend: (...args: Array<any>) => any;
+  onToggleFavorite: (...args: Array<any>) => any;
+  onViewAllButtonClick?: (...args: Array<any>) => any;
+  removingAssetUniqueId: string | null | undefined;
+  searchValue?: string;
+  title: string;
+  tokenFavorites: Record<string, any>;
+  wallet: Wallet;
+};
+
+const getSortIconClasses = (
+  item: SortBy,
+  sortBy: SortBy,
+  sortDirection: SortDirection
+) => {
+  const isSorted = item === sortBy;
+  return classnames([
+    styles.sortIcon,
+    isSorted ? styles.sorted : null,
+    isSorted ? styles[`${sortDirection}Sorting`] : styles.ascSorting,
+  ]);
+};
+
+const WalletTokensList = observer((props: Props) => {
+  const [sortDirection, setSortDirection] = useState<SortDirection>('asc');
+  const [sortBy, setSortBy] = useState<SortBy>('token');
+  const {
+    assets,
+    assetSettingsDialogWasOpened,
+    insertingAssetUniqueId,
+    intl,
+    isLoadingAssets,
+    onAssetSettings,
+    onCopyAssetParam,
+    onExternalLinkClick,
+    onOpenAssetSend,
+    onToggleFavorite,
+    onViewAllButtonClick,
+    removingAssetUniqueId,
+    searchValue = '',
+    title,
+    tokenFavorites,
+    wallet,
+  } = props;
+  const isRestoreActive = wallet.isRestoring;
+  const sortedAssets = useMemo(() => {
+    return [...assets].sort(sortAssets(sortBy, sortDirection));
+  }, [assets, sortBy, sortDirection]);
+  const filteredAssets = searchAssets(searchValue, sortedAssets) || [];
+  const hasSearch =
+    !isLoadingAssets && !!searchValue && searchValue.trim().length >= 3;
+  const noResults = hasSearch && !filteredAssets.length;
+  const viewAllButtonStyles = classnames(['flat', styles.viewAllButton]);
+  const hasSorting = filteredAssets.length && filteredAssets.length > 1;
+  const columnsStyles = classnames([
+    styles.columns,
+    hasSorting ? styles.hasSorting : null,
+  ]);
+  const sortIconClassesToken = useMemo(
+    () => getSortIconClasses('token', sortBy, sortDirection),
+    [sortBy, sortDirection]
+  );
+  const sortIconClassesAmount = useMemo(
+    () => getSortIconClasses('quantity', sortBy, sortDirection),
+    [sortBy, sortDirection]
+  );
+  const toggleSortDirection = useCallback(() => {
+    if (sortDirection === 'asc') {
+      setSortDirection('desc');
+    } else {
+      setSortDirection('asc');
+    }
+  }, [sortDirection]);
+  const onSortBy = useCallback(
+    (newSortBy: SortBy) => {
+      if (!hasSorting) return;
+
+      if (newSortBy === sortBy) {
+        toggleSortDirection();
+      } else {
+        setSortDirection('asc');
+        setSortBy(newSortBy);
+      }
+    },
+    [sortDirection, hasSorting, sortBy]
+  );
+  const onSortByToken = useCallback(
+    () => onSortBy('token'),
+    [sortDirection, sortBy, hasSorting]
+  );
+  const onSortByAmount = useCallback(
+    () => onSortBy('quantity'),
+    [sortDirection, sortBy, hasSorting]
+  );
+  const hasTokens = assets.length || isLoadingAssets;
+  if (!hasTokens)
+    return (
+      <WalletNoTokens
+        numberOfAssets={assets.length}
+        isLoadingAssets={isLoadingAssets}
+        onExternalLinkClick={onExternalLinkClick}
+      />
+    );
+  let content;
+
+  if (isLoadingAssets) {
+    content = (
+      <div>
+        <LoadingSpinner big />
+      </div>
+    );
+  } else if (noResults) {
+    content = (
+      <p className={styles.noResults}>
+        {intl.formatMessage(messages.noResults)}
+      </p>
+    );
+  } else {
+    content = filteredAssets.map((asset) => {
+      return (
+        <WalletToken
+          key={asset.uniqueId}
+          asset={asset}
+          onOpenAssetSend={onOpenAssetSend}
+          onCopyAssetParam={onCopyAssetParam}
+          onAssetSettings={onAssetSettings}
+          anyAssetWasHovered
+          isLoading={isRestoreActive}
+          assetSettingsDialogWasOpened={assetSettingsDialogWasOpened}
+          onToggleFavorite={onToggleFavorite}
+          isFavorite={tokenFavorites[asset.uniqueId]}
+          isInsertingAsset={insertingAssetUniqueId === asset.uniqueId}
+          isRemovingAsset={removingAssetUniqueId === asset.uniqueId}
+        />
+      );
+    });
+  }
+
+  return (
+    <div className={styles.component}>
+      <div className={styles.outerHeader}>
+        <div className={styles.title}>
+          {title}
+          {hasSearch && !noResults && (
+            <>
+              {intl.formatMessage(messages.searchResults)} (
+              {filteredAssets.length})
+            </>
+          )}
+        </div>
+      </div>
+      <BorderedBox>
+        <div className={columnsStyles}>
+          <div className={styles.column} onClick={onSortByToken}>
+            {intl.formatMessage(messages.columnToken)}
+            <SVGInline svg={sortIcon} className={sortIconClassesToken} />
+          </div>
+          <div className={styles.column} onClick={onSortByAmount}>
+            {intl.formatMessage(messages.columnAmount)}
+            <SVGInline svg={sortIcon} className={sortIconClassesAmount} />
+          </div>
+        </div>
+        {content}
+        {onViewAllButtonClick && (
+          <Button
+            className={viewAllButtonStyles}
+            onClick={onViewAllButtonClick}
+            label={intl.formatMessage(messages.viewAllButtonLabel)}
+          />
+        )}
+      </BorderedBox>
+    </div>
+  );
+});
+export default injectIntl(WalletTokensList);
diff --git a/source/renderer/app/components/wallet/tokens/WalletTokensSearch.scss b/source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.scss
similarity index 71%
rename from source/renderer/app/components/wallet/tokens/WalletTokensSearch.scss
rename to source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.scss
index e6f74aa291..37ecb52512 100644
--- a/source/renderer/app/components/wallet/tokens/WalletTokensSearch.scss
+++ b/source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.scss
@@ -1,35 +1,49 @@
 .component {
-  margin: 0 20px 20px;
   position: relative;
+
   .searchIcon {
+    color: var(--theme-staking-stake-pools-search-icon-color);
     left: 20px;
     position: absolute;
-    top: 17px;
+    top: 19px;
     z-index: 1;
+
     svg {
       height: 15px;
+      opacity: 0.3;
       width: 15px;
     }
   }
+
+  .searchIconFocus {
+    svg {
+      opacity: 0.7;
+    }
+  }
+
   input {
     border-radius: 4px;
-    padding: 13px 58px 13px 54px;
+    padding: 14px 58px 14px 45px;
   }
+
   .clearButton {
     border-radius: 3px;
     cursor: pointer;
     height: 28px;
     position: absolute;
     right: 12px;
-    top: 11px;
+    top: 12px;
     width: 28px;
     z-index: 1;
+
     &:hover {
       opacity: 0.8;
     }
+
     svg {
       height: 10px;
       width: 10px;
+
       polygon {
         fill: var(--theme-bordered-box-text-color);
       }
diff --git a/source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.tsx b/source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.tsx
new file mode 100644
index 0000000000..55204752a6
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.tsx
@@ -0,0 +1,58 @@
+import React, { useState } from 'react';
+import { intlShape, injectIntl, defineMessages } from 'react-intl';
+import classNames from 'classnames';
+import { Input } from 'react-polymorph/lib/components/Input';
+import SVGInline from 'react-svg-inline';
+import { observer } from 'mobx-react';
+import styles from './WalletTokensSearch.scss';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/sear... Remove this comment to see the full error message
+import searchIcon from '../../../../assets/images/search.inline.svg';
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/clos... Remove this comment to see the full error message
+import crossIcon from '../../../../assets/images/close-cross.inline.svg';
+
+const messages = defineMessages({
+  placeholder: {
+    id: 'wallet.tokens.search.placeholder',
+    defaultMessage: '!!!Search tokens',
+    description: 'Search placeholder for the Wallet Tokens search',
+  },
+});
+type Props = {
+  intl: intlShape.isRequired;
+  onSearch: (term: string) => string;
+  searchValue: string;
+};
+
+const WalletTokensSearch = (props: Props) => {
+  const { searchValue, onSearch, intl } = props;
+  const [isSearchInputFocused, setSearchInputFocused] = useState(false);
+
+  return (
+    <div className={styles.component}>
+      <SVGInline
+        svg={searchIcon}
+        className={classNames(
+          styles.searchIcon,
+          isSearchInputFocused && styles.searchIconFocus
+        )}
+      />
+      <Input
+        onFocus={() => setSearchInputFocused(true)}
+        onBlur={() => setSearchInputFocused(false)}
+        onChange={onSearch}
+        value={searchValue}
+        placeholder={intl.formatMessage(messages.placeholder)}
+      />
+      {!!searchValue.length && (
+        <button
+          className={classNames([styles.clearButton, 'flat'])}
+          onClick={() => onSearch('')}
+        >
+          <SVGInline svg={crossIcon} />
+        </button>
+      )}
+    </div>
+  );
+};
+
+export default injectIntl(observer(WalletTokensSearch));
diff --git a/source/renderer/app/components/wallet/tokens/WalletTokens.scss b/source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.scss
similarity index 84%
rename from source/renderer/app/components/wallet/tokens/WalletTokens.scss
rename to source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.scss
index 44c23718b3..7c1bb29b5a 100644
--- a/source/renderer/app/components/wallet/tokens/WalletTokens.scss
+++ b/source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.scss
@@ -1,6 +1,11 @@
 .component {
   padding: 20px 0;
+
+  .searchContainer {
+    margin: 0 20px 20px;
+  }
 }
+
 .syncing {
   padding: 10px 20px;
   .syncingText {
diff --git a/source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.tsx b/source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.tsx
new file mode 100644
index 0000000000..26344814b0
--- /dev/null
+++ b/source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.tsx
@@ -0,0 +1,158 @@
+import React, { useState, useCallback, useMemo } from 'react';
+import { intlShape, injectIntl, defineMessages } from 'react-intl';
+import { observer } from 'mobx-react';
+import styles from './WalletTokens.scss';
+import Wallet from '../../../../domains/Wallet';
+import WalletTokensList from '../wallet-tokens-list/WalletTokensList';
+import WalletTokensSearch from '../wallet-tokens-search/WalletTokensSearch';
+import LoadingSpinner from '../../../widgets/LoadingSpinner';
+import type { AssetToken } from '../../../../api/assets/types';
+import { TOGGLE_TOKEN_FAVORITE_TIMEOUT } from '../../../../config/timingConfig';
+
+const messages = defineMessages({
+  favoritesListTitle: {
+    id: 'wallet.tokens.list.favorites.title',
+    defaultMessage: '!!!Favorites',
+    description: 'Favorites list title label',
+  },
+  tokensListTitle: {
+    id: 'wallet.tokens.list.tokens.title',
+    defaultMessage: '!!!Tokens',
+    description: 'Favorites list title label',
+  },
+  syncingMessage: {
+    id: 'wallet.send.form.syncingTransactionsMessage',
+    defaultMessage:
+      '!!!The balance and transaction history of this wallet is being synced with the blockchain.',
+    description:
+      'Syncing transactions message shown during async wallet restore in the wallet send form.',
+  },
+});
+type Props = {
+  assets: Array<AssetToken>;
+  currentLocale: string;
+  intl: intlShape.isRequired;
+  isLoadingAssets: boolean;
+  onAssetSettings: (...args: Array<any>) => any;
+  onCopyAssetParam: (...args: Array<any>) => any;
+  onExternalLinkClick: (...args: Array<any>) => any;
+  onOpenAssetSend: (...args: Array<any>) => any;
+  onToggleFavorite: (...args: Array<any>) => any;
+  tokenFavorites: Record<string, any>;
+  wallet: Wallet;
+};
+const WalletTokens = observer((props: Props) => {
+  const [searchValue, setSearchValue] = useState<string>('');
+  const [insertingAssetUniqueId, setInsertingAssetUniqueId] = useState<
+    string | null | undefined
+  >(null);
+  const [removingAssetUniqueId, setRemovingAssetUniqueId] = useState<
+    string | null | undefined
+  >(null);
+  const {
+    assets,
+    intl,
+    tokenFavorites,
+    onToggleFavorite,
+    isLoadingAssets,
+    ...listProps
+  } = props;
+  const { isRestoring } = props.wallet;
+  const hasTokens = assets.length || isLoadingAssets;
+  const favoriteTokensList = useMemo(
+    () => assets.filter(({ uniqueId }) => tokenFavorites[uniqueId]),
+    [assets, tokenFavorites, searchValue]
+  );
+
+  /**
+   *
+   * This function adds a `inserting` or `removing`
+   * state before actually proceeding with these actions
+   * so the UI element insertion/removal can be animated,
+   * preventing undesirable jumps in the tokens list
+   *
+   */
+  const handleToggleFavorite = useCallback(
+    async ({
+      uniqueId,
+      isFavorite,
+    }: {
+      uniqueId: string;
+      isFavorite: boolean;
+    }) => {
+      if (insertingAssetUniqueId || removingAssetUniqueId) {
+        return;
+      }
+
+      if (isFavorite) {
+        // It's removing favorite
+        // We need to wait for the element to be removed, before updating the favorites list
+        setRemovingAssetUniqueId(uniqueId);
+        setTimeout(async () => {
+          await onToggleFavorite({
+            uniqueId,
+            isFavorite,
+          });
+          setTimeout(() => setRemovingAssetUniqueId(null), 500);
+        }, TOGGLE_TOKEN_FAVORITE_TIMEOUT);
+      } else {
+        // It's inserting favorite
+        // We update the favorites list straight away
+        setInsertingAssetUniqueId(uniqueId);
+        await onToggleFavorite({
+          uniqueId,
+          isFavorite,
+        });
+        setTimeout(() => {
+          setInsertingAssetUniqueId(null);
+        }, TOGGLE_TOKEN_FAVORITE_TIMEOUT);
+      }
+    },
+    [insertingAssetUniqueId, removingAssetUniqueId]
+  );
+
+  if (isRestoring) {
+    return (
+      <div className={styles.syncing}>
+        <LoadingSpinner big />
+        <p className={styles.syncingText}>
+          {intl.formatMessage(messages.syncingMessage)}
+        </p>
+      </div>
+    );
+  }
+
+  return (
+    <div className={styles.component}>
+      {hasTokens && (
+        <div className={styles.searchContainer}>
+          <WalletTokensSearch
+            searchValue={searchValue}
+            onSearch={setSearchValue}
+          />
+        </div>
+      )}
+      {!!favoriteTokensList.length && (
+        <WalletTokensList
+          {...listProps}
+          assets={favoriteTokensList}
+          insertingAssetUniqueId={insertingAssetUniqueId}
+          onToggleFavorite={handleToggleFavorite}
+          removingAssetUniqueId={removingAssetUniqueId}
+          searchValue={searchValue}
+          title={intl.formatMessage(messages.favoritesListTitle)}
+          tokenFavorites={tokenFavorites}
+        />
+      )}
+      <WalletTokensList
+        {...listProps}
+        assets={assets}
+        onToggleFavorite={handleToggleFavorite}
+        searchValue={searchValue}
+        title={intl.formatMessage(messages.tokensListTitle)}
+        tokenFavorites={tokenFavorites}
+      />
+    </div>
+  );
+});
+export default injectIntl(WalletTokens);
diff --git a/source/renderer/app/components/wallet/transactions/CancelTransactionButton.tsx b/source/renderer/app/components/wallet/transactions/CancelTransactionButton.tsx
index bc952fb856..0ffc389120 100644
--- a/source/renderer/app/components/wallet/transactions/CancelTransactionButton.tsx
+++ b/source/renderer/app/components/wallet/transactions/CancelTransactionButton.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CancelTransactionButton.scss... Remove this comment to see the full error message
 import styles from './CancelTransactionButton.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx b/source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx
index 904c8248bc..bb729b04f1 100644
--- a/source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CancelTransactionConfirmatio... Remove this comment to see the full error message
 import styles from './CancelTransactionConfirmationDialog.scss';
 
 const messages = defineMessages({
@@ -16,7 +15,7 @@ const messages = defineMessages({
   content1: {
     id: 'cancel.transaction.confirmation.dialog.content1',
     defaultMessage:
-      '!!!This transaction was submitted to the Cardano network some time ago, but hasn’t been finalized yet. You can try to cancel the transaction now to release the pending funds, but there is a chance that the transaction will be finalized regardless. In this case, the transaction will reappear in your wallet as a completed transaction.',
+      '!!!This transaction was submitted to the Cardano network some time ago, but has not been finalized yet. You can try to cancel the transaction now to release the pending funds, but there is a chance that the transaction will be finalized regardless. In this case, the transaction will reappear in your wallet as a completed transaction.',
     description:
       'Content for the pending transaction cancellation confirmation dialog.',
   },
@@ -59,7 +58,6 @@ class CancelTransactionConfirmationDialog extends Component<Props> {
     const confirmButtonClasses = classnames([
       'confirmButton',
       'attention',
-      styles.confirmButton,
       isSubmitting ? styles.isSubmitting : null,
     ]);
     const actions = [
diff --git a/source/renderer/app/components/wallet/transactions/FilterButton.tsx b/source/renderer/app/components/wallet/transactions/FilterButton.tsx
index 97b7f25d44..4dc66489fc 100644
--- a/source/renderer/app/components/wallet/transactions/FilterButton.tsx
+++ b/source/renderer/app/components/wallet/transactions/FilterButton.tsx
@@ -7,7 +7,6 @@ import TinyButton from '../../widgets/forms/TinyButton';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/filter-... Remove this comment to see the full error message
 import filterIcon from '../../../assets/images/filter-dis-ic.inline.svg';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './FilterButton.scss' or its co... Remove this comment to see the full error message
 import styles from './FilterButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/transactions/FilterDialog.tsx b/source/renderer/app/components/wallet/transactions/FilterDialog.tsx
index 3fab3b79ff..6b133e9f93 100644
--- a/source/renderer/app/components/wallet/transactions/FilterDialog.tsx
+++ b/source/renderer/app/components/wallet/transactions/FilterDialog.tsx
@@ -32,7 +32,6 @@ import TinyInput from '../../widgets/forms/TinyInput';
 import TinyDatePicker from '../../widgets/forms/TinyDatePicker';
 import TinyButton from '../../widgets/forms/TinyButton';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './FilterDialog.scss' or its co... Remove this comment to see the full error message
 import styles from './FilterDialog.scss';
 
 const messages = defineMessages({
@@ -117,6 +116,16 @@ export type FilterDialogProps = {
 };
 type Props = FilterDialogProps & InjectedProps;
 
+interface FormFields {
+  incomingChecked: boolean;
+  outgoingChecked: boolean;
+  dateRange: string;
+  fromDate: string;
+  toDate: string;
+  fromAmount: string;
+  toAmount: string;
+}
+
 @observer
 class FilterDialog extends Component<Props> {
   static contextTypes = {
@@ -126,7 +135,7 @@ class FilterDialog extends Component<Props> {
     label: string;
     value: string;
   }>;
-  form: ReactToolboxMobxForm;
+  form: ReactToolboxMobxForm<FormFields>;
   popoverTippyInstance: ElementRef<any> = createRef();
 
   constructor(props: Props, context: Record<string, any>) {
@@ -165,8 +174,7 @@ class FilterDialog extends Component<Props> {
         value: DateRangeTypes.CUSTOM,
       },
     ];
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
-    this.form = new ReactToolboxMobxForm({
+    this.form = new ReactToolboxMobxForm<FormFields>({
       fields: {
         incomingChecked: {
           type: 'checkbox',
@@ -208,13 +216,11 @@ class FilterDialog extends Component<Props> {
     field: 'incomingChecked' | 'outgoingChecked',
     value: boolean
   ) => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.select(field).set(value);
 
     if (value === false) {
       const otherFieldName =
         field === 'incomingChecked' ? 'outgoingChecked' : 'incomingChecked';
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
       const otherField = this.form.select(otherFieldName);
 
       if (otherField.value === false) {
@@ -235,23 +241,16 @@ class FilterDialog extends Component<Props> {
       incomingChecked,
       outgoingChecked,
     } = filterOptions;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.select('dateRange').set(dateRange);
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.select('fromDate').set(fromDate);
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.select('toDate').set(toDate);
     this.form
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
       .select('fromAmount')
       .set(reset ? fromAmount : this.getFromAmountValue(fromAmount));
     this.form
-      // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
       .select('toAmount')
       .set(reset ? toAmount : this.getToAmountValue(toAmount));
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.select('incomingChecked').set(incomingChecked);
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.select('outgoingChecked').set(outgoingChecked);
   };
   getFromAmountValue = (fromAmount?: string) => {
@@ -281,7 +280,6 @@ class FilterDialog extends Component<Props> {
   isFormValuesEqualTo = (
     comparedFilterOptions: TransactionFilterOptionsType
   ) => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'fields' does not exist on type 'ReactToo... Remove this comment to see the full error message
     const formFieldNames = Object.keys(this.form.fields.toJSON());
     return isEqual(
       this.getComposedFormValues(),
@@ -289,7 +287,6 @@ class FilterDialog extends Component<Props> {
     );
   };
   getComposedFormValues = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'ReactToo... Remove this comment to see the full error message
     const formValues = this.form.values();
     return {
       ...formValues,
@@ -298,7 +295,6 @@ class FilterDialog extends Component<Props> {
     };
   };
   handleSubmit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: () => {
         const { onFilter } = this.props;
@@ -317,10 +313,10 @@ class FilterDialog extends Component<Props> {
       this.popoverTippyInstance.current.hide();
     }
   };
-  isValidFromDate = (date: Record<string, any>) =>
-    date.isSameOrBefore(moment().endOf('day'));
+  isValidFromDate = (date: Record<string, any>) => {
+    return date.isSameOrBefore(moment().endOf('day'));
+  };
   isValidToDate = (date: Record<string, any>) => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'ReactToo... Remove this comment to see the full error message
     const { fromDate } = this.form.values();
     return (
       date.isSameOrBefore(moment().endOf('day')) &&
@@ -329,9 +325,7 @@ class FilterDialog extends Component<Props> {
   };
   renderTypeField = () => {
     const { form } = this;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const incomingCheckboxField = form.$('incomingChecked');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const outgoingCheckboxField = form.$('outgoingChecked');
     return (
       <div className={styles.type}>
@@ -358,9 +352,7 @@ class FilterDialog extends Component<Props> {
   };
   renderDateRangeField = () => {
     const { intl } = this.context;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const dateRangeFieldBindProps = this.form.$('dateRange').bind();
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'ReactToo... Remove this comment to see the full error message
     const { fromDate, toDate } = this.form.values();
     return (
       <div className={styles.dateRange}>
@@ -372,9 +364,7 @@ class FilterDialog extends Component<Props> {
               fromDate,
               toDate,
             });
-            // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
             this.form.select('fromDate').set(calculatedDateRange.fromDate);
-            // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
             this.form.select('toDate').set(calculatedDateRange.toDate);
           }}
           placeholder={intl.formatMessage(messages.selectTimeRange)}
@@ -388,21 +378,17 @@ class FilterDialog extends Component<Props> {
     const { intl } = this.context;
     const { locale, dateFormat } = this.props;
     const { invalidFields } = validateFilterForm(this.getComposedFormValues());
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const fromDateFieldBindProps = form.$('fromDate').bind();
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const toDateFieldBindProps = form.$('toDate').bind();
     const fromDateLocaleClassName =
       locale === 'ja-JP' ? styles.japaneseFromDateInput : null;
     const toDateLocaleClassName =
       locale === 'ja-JP' ? styles.japaneseToDateInput : null;
     const fromDateClassNames = classNames([
-      styles.dateRangeInput,
       styles.fromDateInput,
       fromDateLocaleClassName,
     ]);
     const toDateClassNames = classNames([
-      styles.dateRangeInput,
       styles.toDateInput,
       toDateLocaleClassName,
     ]);
@@ -414,13 +400,11 @@ class FilterDialog extends Component<Props> {
               {...fromDateFieldBindProps}
               onChange={(...args) => {
                 fromDateFieldBindProps.onChange(...args);
-                // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
                 this.form.select('dateRange').set(DateRangeTypes.CUSTOM);
               }}
               label={intl.formatMessage(globalMessages.rangeFrom)}
               pickerPanelPosition="left"
               closeOnSelect
-              // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
               onReset={() => form.select('fromDate').set('')}
               isValidDate={this.isValidFromDate}
               locale={locale}
@@ -432,13 +416,11 @@ class FilterDialog extends Component<Props> {
               {...toDateFieldBindProps}
               onChange={(...args) => {
                 toDateFieldBindProps.onChange(...args);
-                // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
                 this.form.select('dateRange').set(DateRangeTypes.CUSTOM);
               }}
               label={intl.formatMessage(globalMessages.rangeTo)}
               pickerPanelPosition="right"
               closeOnSelect
-              // @ts-ignore ts-migrate(2339) FIXME: Property 'select' does not exist on type 'ReactToo... Remove this comment to see the full error message
               onReset={() => form.select('toDate').set('')}
               isValidDate={this.isValidToDate}
               locale={locale}
@@ -455,9 +437,7 @@ class FilterDialog extends Component<Props> {
     const { intl } = this.context;
     const { locale, numberFormat } = this.props;
     const { invalidFields } = validateFilterForm(this.getComposedFormValues());
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const fromAmountField = form.$('fromAmount');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const toAmountField = form.$('toAmount');
     const fromAmountLocaleClassName =
       locale === 'ja-JP' ? styles.japaneseFromAmountInput : null;
diff --git a/source/renderer/app/components/wallet/transactions/FilterResultInfo.tsx b/source/renderer/app/components/wallet/transactions/FilterResultInfo.tsx
index 9c43399109..8b2e154ef6 100644
--- a/source/renderer/app/components/wallet/transactions/FilterResultInfo.tsx
+++ b/source/renderer/app/components/wallet/transactions/FilterResultInfo.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, FormattedHTMLMessage } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './FilterResultInfo.scss' or it... Remove this comment to see the full error message
 import styles from './FilterResultInfo.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/transactions/Transaction.tsx b/source/renderer/app/components/wallet/transactions/Transaction.tsx
index fe26205f94..4a8dc093f9 100644
--- a/source/renderer/app/components/wallet/transactions/Transaction.tsx
+++ b/source/renderer/app/components/wallet/transactions/Transaction.tsx
@@ -8,7 +8,6 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import CancelTransactionButton from './CancelTransactionButton';
 import { TransactionMetadataView } from './metadata/TransactionMetadataView';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Transaction.scss' or its cor... Remove this comment to see the full error message
 import styles from './Transaction.scss';
 import TransactionTypeIcon from './TransactionTypeIcon';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/collaps... Remove this comment to see the full error message
@@ -617,7 +616,7 @@ export default class Transaction extends Component<Props, State> {
                 {data.type === TransactionTypes.EXPEND && !data.fee.isZero() && (
                   <>
                     <h2>{intl.formatMessage(messages.transactionFee)}</h2>
-                    <div className={styles.transactionFeeRow}>
+                    <div>
                       <div className={styles.transactionFeeValue}>
                         {formattedWalletAmount(data.fee, false)}&nbsp;
                         <span>
@@ -631,7 +630,7 @@ export default class Transaction extends Component<Props, State> {
                 {!data.deposit.isZero() && (
                   <>
                     <h2>{intl.formatMessage(messages.deposit)}</h2>
-                    <div className={styles.depositRow}>
+                    <div>
                       <div className={styles.depositValue}>
                         <DiscreetWalletAmount
                           amount={data.deposit}
diff --git a/source/renderer/app/components/wallet/transactions/TransactionTypeIcon.tsx b/source/renderer/app/components/wallet/transactions/TransactionTypeIcon.tsx
index 7d74493335..ed9543ffe7 100644
--- a/source/renderer/app/components/wallet/transactions/TransactionTypeIcon.tsx
+++ b/source/renderer/app/components/wallet/transactions/TransactionTypeIcon.tsx
@@ -3,9 +3,7 @@ import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
 import { LoadingSpinner } from 'react-polymorph/lib/components/LoadingSpinner';
 import { LoadingSpinnerSkin } from 'react-polymorph/lib/skins/simple/LoadingSpinnerSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TransactionTypeIcon.scss' or... Remove this comment to see the full error message
 import styles from './TransactionTypeIcon.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SpinnerOverrides.scss' or it... Remove this comment to see the full error message
 import spinnerOverrides from './SpinnerOverrides.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/wallet-... Remove this comment to see the full error message
 import expendIcon from '../../../assets/images/wallet-nav/send-ic.inline.svg';
@@ -60,9 +58,11 @@ export default class TransactionTypeIcon extends Component<Props> {
       <SVGInline svg={pendingIcon} className={styles.pendingTxnIcon} />
     </div>
   );
-  renderFailedIcon = () => (
-    <SVGInline svg={pendingIcon} className={styles.transactionTypeIcon} />
-  );
+  renderFailedIcon = () => {
+    return (
+      <SVGInline svg={pendingIcon} className={styles.transactionTypeIcon} />
+    );
+  };
   renderIcon = (icon: string) => {
     let iconType;
 
diff --git a/source/renderer/app/components/wallet/transactions/WalletNoTransactions.tsx b/source/renderer/app/components/wallet/transactions/WalletNoTransactions.tsx
index 495e8b8b0d..a50f6ed8af 100644
--- a/source/renderer/app/components/wallet/transactions/WalletNoTransactions.tsx
+++ b/source/renderer/app/components/wallet/transactions/WalletNoTransactions.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletNoTransactions.scss' o... Remove this comment to see the full error message
 import styles from './WalletNoTransactions.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/transactions/WalletTransactions.tsx b/source/renderer/app/components/wallet/transactions/WalletTransactions.tsx
index 415815d446..98ceb01980 100644
--- a/source/renderer/app/components/wallet/transactions/WalletTransactions.tsx
+++ b/source/renderer/app/components/wallet/transactions/WalletTransactions.tsx
@@ -11,7 +11,6 @@ import { formattedWalletAmount } from '../../../utils/formatters';
 import { getNumberOfFilterDimensionsApplied } from '../../../utils/transaction';
 import { WalletTransaction } from '../../../domains/WalletTransaction';
 import Wallet from '../../../domains/Wallet';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletTransactions.scss' or ... Remove this comment to see the full error message
 import styles from './WalletTransactions.scss';
 import type { TransactionFilterOptionsType } from '../../../stores/TransactionsStore';
 
diff --git a/source/renderer/app/components/wallet/transactions/WalletTransactionsHeader.tsx b/source/renderer/app/components/wallet/transactions/WalletTransactionsHeader.tsx
index 83e32aea69..0cfdbb4935 100644
--- a/source/renderer/app/components/wallet/transactions/WalletTransactionsHeader.tsx
+++ b/source/renderer/app/components/wallet/transactions/WalletTransactionsHeader.tsx
@@ -6,10 +6,9 @@ import SVGInline from 'react-svg-inline';
 import FilterButton from './FilterButton';
 import FilterDialog from './FilterDialog';
 import type { FilterDialogProps } from './FilterDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletTransactionsHeader.scs... Remove this comment to see the full error message
 import styles from './WalletTransactionsHeader.scss';
 import TinyButton from '../../widgets/forms/TinyButton';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/downloa... Remove this comment to see the full error message
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/download... Remove this comment to see the full error message
 import downloadIcon from '../../../assets/images/download-icon.inline.svg';
 
 export const messages = defineMessages({
diff --git a/source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx b/source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx
index f0a17bb0f4..8df7a1fc3b 100644
--- a/source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx
+++ b/source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx
@@ -7,7 +7,6 @@ import { Button } from 'react-polymorph/lib/components/Button';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { defineMessages, intlShape } from 'react-intl';
 import moment from 'moment';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletTransactionsList.scss'... Remove this comment to see the full error message
 import styles from './WalletTransactionsList.scss';
 import Transaction from './Transaction';
 import { WalletTransaction } from '../../../domains/WalletTransaction';
diff --git a/source/renderer/app/components/wallet/transactions/WalletTransactionsSearch.tsx b/source/renderer/app/components/wallet/transactions/WalletTransactionsSearch.tsx
index a261a0c44c..6be7f1b23f 100644
--- a/source/renderer/app/components/wallet/transactions/WalletTransactionsSearch.tsx
+++ b/source/renderer/app/components/wallet/transactions/WalletTransactionsSearch.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletTransactionsSearch.scs... Remove this comment to see the full error message
 import styles from './WalletTransactionsSearch.scss';
 
 const messages = defineMessages({
@@ -30,7 +29,6 @@ class WalletTransactionsSearch extends Component<Props> {
     return (
       <div className={styles.component}>
         <Input
-          className={styles.input}
           type="text"
           placeholder={intl.formatMessage(messages.searchHint)}
           value={searchTerm}
diff --git a/source/renderer/app/components/wallet/transactions/metadata/MetadataValueView.tsx b/source/renderer/app/components/wallet/transactions/metadata/MetadataValueView.tsx
index 2d87be1e69..05551e2b4b 100644
--- a/source/renderer/app/components/wallet/transactions/metadata/MetadataValueView.tsx
+++ b/source/renderer/app/components/wallet/transactions/metadata/MetadataValueView.tsx
@@ -7,8 +7,7 @@ import type {
   MetadataString,
   MetadataValue,
 } from '../../../../types/TransactionMetadata';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TransactionMetadataView.scss... Remove this comment to see the full error message
-import styles from './TransactionMetadataView.scss';
+import './TransactionMetadataView.scss';
 
 /**
  * NOTE: These components are currently not used because we simply
@@ -30,7 +29,7 @@ function BytesView({ value }: { value: MetadataBytes }) {
 
 function ListView({ value }: { value: MetadataList }) {
   return (
-    <ol className={styles.list}>
+    <ol>
       {value.list.map(
         (
           v,
@@ -47,7 +46,7 @@ function ListView({ value }: { value: MetadataList }) {
 
 function MapView({ value }: { value: MetadataMap }) {
   return (
-    <ol className={styles.map}>
+    <ol>
       {value.map.map(
         (
           v,
diff --git a/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.scss b/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.scss
index 499195c6c3..bdf7e06209 100644
--- a/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.scss
+++ b/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.scss
@@ -7,59 +7,3 @@
     }
   }
 }
-
-/**
- * NOTE: These styles are currently not used because we simply
- * JSON.stringify the metadata for transactions. This can be
- * used as the basis for a more sophisticated implementation
- * later on:
- */
-
-//.list {
-//  &::before {
-//    content: '[';
-//    display: inline;
-//  }
-//  &::after {
-//    content: ']';
-//    display: inline;
-//  }
-//  li::after {
-//    content: ',';
-//    display: inline;
-//  }
-//  li:last-child::after {
-//    content: '';
-//  }
-//  li {
-//    padding-left: 10px;
-//  }
-//  li > * {
-//    display: inline-block;
-//  }
-//}
-//
-//.map {
-//  vertical-align: top;
-//  &::before {
-//    content: '{';
-//    display: inline;
-//  }
-//  &::after {
-//    content: '}';
-//    display: inline;
-//  }
-//  li::after {
-//    content: ',';
-//    display: inline;
-//  }
-//  li:last-child::after {
-//    content: '';
-//  }
-//  li {
-//    padding-left: 10px;
-//  }
-//  li > * {
-//    display: inline-block;
-//  }
-//}
diff --git a/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.tsx b/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.tsx
index eed024f15c..b307fac0d9 100644
--- a/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.tsx
+++ b/source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView.tsx
@@ -5,7 +5,6 @@ import type {
   MetadataValue,
   TransactionMetadata,
 } from '../../../../types/TransactionMetadata';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TransactionMetadataView.scss... Remove this comment to see the full error message
 import styles from './TransactionMetadataView.scss';
 
 function flattenMetadata(data: MetadataValue) {
diff --git a/source/renderer/app/components/wallet/transactions/render-strategies/SimpleTransactionList.tsx b/source/renderer/app/components/wallet/transactions/render-strategies/SimpleTransactionList.tsx
index 20f064db9d..a9b37c9b9f 100644
--- a/source/renderer/app/components/wallet/transactions/render-strategies/SimpleTransactionList.tsx
+++ b/source/renderer/app/components/wallet/transactions/render-strategies/SimpleTransactionList.tsx
@@ -5,7 +5,6 @@ import { observer } from 'mobx-react';
 import type { Row } from '../types';
 import type { ScrollContextType } from '../WalletTransactionsList';
 import { WalletTransactionsListScrollContext } from '../WalletTransactionsList';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SimpleTransactionList.scss' ... Remove this comment to see the full error message
 import styles from './SimpleTransactionList.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/transactions/render-strategies/VirtualTransactionList.tsx b/source/renderer/app/components/wallet/transactions/render-strategies/VirtualTransactionList.tsx
index 1b0326b06d..55b0d0c242 100644
--- a/source/renderer/app/components/wallet/transactions/render-strategies/VirtualTransactionList.tsx
+++ b/source/renderer/app/components/wallet/transactions/render-strategies/VirtualTransactionList.tsx
@@ -10,7 +10,6 @@ import type { ScrollContextType } from '../WalletTransactionsList';
 import { WalletTransactionsListScrollContext } from '../WalletTransactionsList';
 import type { Row } from '../types';
 import { TransactionInfo, TransactionsGroup } from '../types';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './VirtualTransactionList.scss'... Remove this comment to see the full error message
 import styles from './VirtualTransactionList.scss';
 
 type Props = {
@@ -231,7 +230,7 @@ class VirtualTransactionList extends Component<Props> {
   };
   updateVisibleExpandedTxRowHeights = () => {
     const expandedTxMap = this.props.getExpandedTransactions();
-    // This is needed because a spreaded Map results in an array of [key, value]
+    // This is needed because a spread Map results in an array of [key, value]
     const expandedTxArray = [...expandedTxMap].map((mapValue) => mapValue[1]);
     const visibleExpandedTx = expandedTxArray.filter((tx) => {
       const index = this.findIndexForTx(tx);
diff --git a/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx b/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx
index 5a66573ed2..d904694f01 100644
--- a/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx
+++ b/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TransferFundsStep1Dialog.scs... Remove this comment to see the full error message
 import styles from './TransferFundsStep1Dialog.scss';
 import Wallet from '../../../domains/Wallet';
 import WalletsDropdown from '../../widgets/forms/WalletsDropdown';
diff --git a/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx b/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx
index fa08de6d46..cf3428f7d1 100644
--- a/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx
+++ b/source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx
@@ -11,7 +11,6 @@ import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import DialogBackButton from '../../widgets/DialogBackButton';
 import Dialog from '../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TransferFundsStep2Dialog.scs... Remove this comment to see the full error message
 import styles from './TransferFundsStep2Dialog.scss';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
@@ -94,13 +93,16 @@ type Props = {
   error?: LocalizableError | null | undefined;
 };
 
+interface FormFields {
+  spendingPassword: string;
+}
+
 @observer
 class TransferFundsStep2Dialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         spendingPassword: {
@@ -136,7 +138,6 @@ class TransferFundsStep2Dialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { spendingPassword } = form.values();
@@ -146,7 +147,6 @@ class TransferFundsStep2Dialog extends Component<Props> {
     });
   };
   handleSubmitOnEnter = (event: KeyboardEvent) =>
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     this.form.$('spendingPassword').isValid &&
     submitOnEnter(this.submit, event);
 
@@ -177,7 +177,6 @@ class TransferFundsStep2Dialog extends Component<Props> {
       sourceWalletAmount,
       false
     );
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = this.form.$('spendingPassword');
     const buttonClasses = classnames([
       'confirmButton',
@@ -254,7 +253,6 @@ class TransferFundsStep2Dialog extends Component<Props> {
         </div>
         <Input
           type="password"
-          className={styles.currentPassword}
           {...spendingPasswordField.bind()}
           error={spendingPasswordField.error}
           skin={InputSkin}
diff --git a/source/renderer/app/components/wallet/utxo/WalletUtxo.tsx b/source/renderer/app/components/wallet/utxo/WalletUtxo.tsx
index b66a743e59..f4da83bf68 100644
--- a/source/renderer/app/components/wallet/utxo/WalletUtxo.tsx
+++ b/source/renderer/app/components/wallet/utxo/WalletUtxo.tsx
@@ -20,7 +20,6 @@ import Tick from './WalletUtxoTick';
 import CustomTooltip from './WalletUtxoTooltip';
 import Cursor from './WalletUtxoCursor';
 import { DECIMAL_PLACES_IN_ADA } from '../../../config/numbersConfig';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletUtxo.scss' or its corr... Remove this comment to see the full error message
 import styles from './WalletUtxo.scss';
 import type { TickProps } from './WalletUtxoTick';
 import { WalletUtxoDescription } from './WalletUtxoDescription';
@@ -180,7 +179,6 @@ export default class WalletUtxo extends Component<Props, State> {
                   >
                     <BarChart data={chartData} barSize={23}>
                       <CartesianGrid
-                        className={styles.cartesianGrid}
                         horizontal={false}
                         vertical={false}
                         y={-10}
@@ -195,7 +193,6 @@ export default class WalletUtxo extends Component<Props, State> {
                         tick={(props: TickProps) => (
                           <Tick {...props} textAnchor="start" vertical />
                         )}
-                        className={styles.xAxis}
                         y={0}
                       >
                         <Label
diff --git a/source/renderer/app/components/wallet/utxo/WalletUtxoCursor.tsx b/source/renderer/app/components/wallet/utxo/WalletUtxoCursor.tsx
index c7f75d3c61..12ee7e6556 100644
--- a/source/renderer/app/components/wallet/utxo/WalletUtxoCursor.tsx
+++ b/source/renderer/app/components/wallet/utxo/WalletUtxoCursor.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletUtxoCursor.scss' or it... Remove this comment to see the full error message
 import styles from './WalletUtxoCursor.scss';
 
 type CursorProps = {
diff --git a/source/renderer/app/components/wallet/utxo/WalletUtxoTick.tsx b/source/renderer/app/components/wallet/utxo/WalletUtxoTick.tsx
index fa2764e422..bdb7345626 100644
--- a/source/renderer/app/components/wallet/utxo/WalletUtxoTick.tsx
+++ b/source/renderer/app/components/wallet/utxo/WalletUtxoTick.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletUtxoTick.scss' or its ... Remove this comment to see the full error message
 import styles from './WalletUtxoTick.scss';
 
 export type TickProps = {
diff --git a/source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx b/source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx
index a48f3d06f2..a254d8aeb8 100644
--- a/source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx
+++ b/source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import { get } from 'lodash';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletUtxoTooltip.scss' or i... Remove this comment to see the full error message
 import styles from './WalletUtxoTooltip.scss';
 import { PRETTY_WALLET_AMOUNTS } from '../../../config/utxoConfig';
 
diff --git a/source/renderer/app/components/wallet/wallet-create/ConfigDialog.tsx b/source/renderer/app/components/wallet/wallet-create/ConfigDialog.tsx
index e8eacb620e..695eb385ea 100644
--- a/source/renderer/app/components/wallet/wallet-create/ConfigDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/ConfigDialog.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import WalletCreateDialog from './WalletCreateDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateStyles.scss' or ... Remove this comment to see the full error message
 import commonStyles from './WalletCreateStyles.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-create/HashDialog.tsx b/source/renderer/app/components/wallet/wallet-create/HashDialog.tsx
index 5a5123fe90..d44e6aac76 100644
--- a/source/renderer/app/components/wallet/wallet-create/HashDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/HashDialog.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import WalletCreateDialog from './WalletCreateDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateStyles.scss' or ... Remove this comment to see the full error message
 import commonStyles from './WalletCreateStyles.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-create/InstructionsDialog.tsx b/source/renderer/app/components/wallet/wallet-create/InstructionsDialog.tsx
index 61f46de09c..796ab94d54 100644
--- a/source/renderer/app/components/wallet/wallet-create/InstructionsDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/InstructionsDialog.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import WalletCreateDialog from './WalletCreateDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateStyles.scss' or ... Remove this comment to see the full error message
 import commonStyles from './WalletCreateStyles.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-create/MnemonicsDialog.tsx b/source/renderer/app/components/wallet/wallet-create/MnemonicsDialog.tsx
index 8100ddc398..07f01c5ef4 100644
--- a/source/renderer/app/components/wallet/wallet-create/MnemonicsDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/MnemonicsDialog.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import WalletCreateDialog from './WalletCreateDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateStyles.scss' or ... Remove this comment to see the full error message
 import commonStyles from './WalletCreateStyles.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-create/TemplateDialog.tsx b/source/renderer/app/components/wallet/wallet-create/TemplateDialog.tsx
index 156fde6e6a..6eaa95eae5 100644
--- a/source/renderer/app/components/wallet/wallet-create/TemplateDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/TemplateDialog.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import WalletCreateDialog from './WalletCreateDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateStyles.scss' or ... Remove this comment to see the full error message
 import commonStyles from './WalletCreateStyles.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-create/ValidateDialog.tsx b/source/renderer/app/components/wallet/wallet-create/ValidateDialog.tsx
index 284162121c..c393319790 100644
--- a/source/renderer/app/components/wallet/wallet-create/ValidateDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/ValidateDialog.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import WalletCreateDialog from './WalletCreateDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateStyles.scss' or ... Remove this comment to see the full error message
 import commonStyles from './WalletCreateStyles.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-create/WalletCreateDialog.tsx b/source/renderer/app/components/wallet/wallet-create/WalletCreateDialog.tsx
index 0772cb04bc..0c0c65c5ea 100644
--- a/source/renderer/app/components/wallet/wallet-create/WalletCreateDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/WalletCreateDialog.tsx
@@ -5,7 +5,6 @@ import { defineMessages, intlShape } from 'react-intl';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';
 import WalletCreateSteps from './WalletCreateSteps';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateDialog.scss' or ... Remove this comment to see the full error message
 import styles from './WalletCreateDialog.scss';
 import type { DialogActionItems } from '../../widgets/Dialog';
 
@@ -32,7 +31,6 @@ export default class WalletCreateDialog extends Component<Props> {
     const { actions, children, stepNumber, onClose } = this.props;
     return (
       <Dialog
-        className={styles.component}
         title={intl.formatMessage(messages.dialogTitle)}
         actions={actions}
         closeOnOverlayClick
diff --git a/source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx b/source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx
index 997bd26cb7..63e025e992 100644
--- a/source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx
+++ b/source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import { Stepper } from 'react-polymorph/lib/components/Stepper';
 import { StepperSkin } from 'react-polymorph/lib/skins/simple/StepperSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletCreateSteps.scss' or i... Remove this comment to see the full error message
 import styles from './WalletCreateSteps.scss';
 import { CREATE_WALLET_STEPS } from '../../../config/walletsConfig';
 import type { RestoreWalletStep } from '../../../types/walletRestoreTypes';
@@ -19,7 +18,7 @@ const messages = defineMessages({
   stepsCounter: {
     id: 'wallet.create.dialog.stepsCounter',
     defaultMessage: '!!!Step {currentStep} of {totalSteps}',
-    description: 'Step couters in the wallet create dialog.',
+    description: 'Step counters in the wallet create dialog.',
   },
   instructionsStep: {
     id: 'wallet.create.dialog.instructionsStep',
diff --git a/source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx b/source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx
index 396615a523..2e3ca46a73 100644
--- a/source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx
@@ -10,7 +10,6 @@ import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import SVGInline from 'react-svg-inline';
 import classNames from 'classnames';
 import { get } from 'lodash';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletImportFileDialog.scss'... Remove this comment to see the full error message
 import styles from './WalletImportFileDialog.scss';
 import RadioSet from '../../widgets/RadioSet';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
diff --git a/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.scss b/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.scss
index 027f7174eb..ef86d40055 100644
--- a/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.scss
+++ b/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.scss
@@ -120,7 +120,7 @@
       margin-bottom: 15px;
     }
 
-    .unamedWalletsTitle {
+    .unnamedWalletsTitle {
       @extend .description;
       margin-bottom: 15px;
       opacity: 1;
diff --git a/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx b/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx
index 7e05699a11..24c629a73b 100644
--- a/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx
@@ -15,7 +15,6 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletSelectImportDialog.scs... Remove this comment to see the full error message
 import styles from './WalletSelectImportDialog.scss';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message
@@ -43,10 +42,10 @@ const messages = defineMessages({
     description:
       'These wallets were found in your Daedalus state directory. Please select the wallets you want to import.',
   },
-  unamedWalletsTitle: {
-    id: 'wallet.select.import.dialog.unamedWalletsTitle',
+  unnamedWalletsTitle: {
+    id: 'wallet.select.import.dialog.unnamedWalletsTitle',
     defaultMessage: '!!!Unnamed wallets',
-    description: 'unamedWalletsTitle',
+    description: 'unnamedWalletsTitle',
   },
   passwordProtected: {
     id: 'wallet.select.import.dialog.passwordProtected',
@@ -259,29 +258,31 @@ class WalletSelectImportDialog extends Component<Props> {
     placeholderMessage: string,
     nameValidator: (...args: Array<any>) => any,
     onWalletNameChange: (...args: Array<any>) => any
-  ) => (
-    <InlineEditingSmallInput
-      isActive={false}
-      className={styles.walletsInputFieldInner}
-      isDisabled={
-        wallet.import.status === WalletImportStatuses.COMPLETED ||
-        wallet.import.status === WalletImportStatuses.EXISTS ||
-        wallet.import.status === WalletImportStatuses.RUNNING
-      }
-      inputFieldValue={wallet.name || ''}
-      placeholder={placeholderMessage}
-      isValid={nameValidator}
-      validationErrorMessage={validationMessage}
-      onSubmit={(name: string) =>
-        onWalletNameChange({
-          index: wallet.index,
-          name,
-        })
-      }
-      maxLength={40}
-      successfullyUpdated
-    />
-  );
+  ) => {
+    return (
+      <InlineEditingSmallInput
+        isActive={false}
+        className={styles.walletsInputFieldInner}
+        isDisabled={
+          wallet.import.status === WalletImportStatuses.COMPLETED ||
+          wallet.import.status === WalletImportStatuses.EXISTS ||
+          wallet.import.status === WalletImportStatuses.RUNNING
+        }
+        inputFieldValue={wallet.name || ''}
+        placeholder={placeholderMessage}
+        isValid={nameValidator}
+        validationErrorMessage={validationMessage}
+        onSubmit={(name: string) =>
+          onWalletNameChange({
+            index: wallet.index,
+            name,
+          })
+        }
+        maxLength={40}
+        successfullyUpdated
+      />
+    );
+  };
 
   render() {
     const { intl } = this.context;
@@ -391,11 +392,11 @@ class WalletSelectImportDialog extends Component<Props> {
               })}
 
               {!!walletsWithoutNames.length && (
-                <div className={styles.unamedWalletsTitle}>
+                <div className={styles.unnamedWalletsTitle}>
                   {!!walletsWithNames.length && (
                     <hr className={styles.separatorMiddle} />
                   )}
-                  <p>{intl.formatMessage(messages.unamedWalletsTitle)}</p>
+                  <p>{intl.formatMessage(messages.unnamedWalletsTitle)}</p>
                 </div>
               )}
 
diff --git a/source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx b/source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx
index 2dfbe41fd2..001143226f 100644
--- a/source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx
@@ -8,7 +8,6 @@ import SVGInline from 'react-svg-inline';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { PasswordInput } from '../../widgets/forms/PasswordInput';
 import WalletRestoreDialog from './widgets/WalletRestoreDialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ConfigurationDialog.scss' or... Remove this comment to see the full error message
 import styles from './ConfigurationDialog.scss';
 import ReactToolboxMobxForm, {
   handleFormErrors,
@@ -92,6 +91,12 @@ type Props = {
   currentLocale: string;
 };
 
+interface FormFields {
+  walletName: string;
+  spendingPassword: string;
+  repeatPassword: string;
+}
+
 @observer
 class ConfigurationDialog extends Component<Props> {
   static contextTypes = {
@@ -107,8 +112,7 @@ class ConfigurationDialog extends Component<Props> {
     }
   }
 
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         walletName: {
@@ -191,7 +195,6 @@ class ConfigurationDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: (form) => {
         const { onContinue } = this.props;
@@ -208,13 +211,10 @@ class ConfigurationDialog extends Component<Props> {
   resetForm = () => {
     const { form } = this;
     // Cancel all debounced field validations
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'each' does not exist on type 'ReactToolb... Remove this comment to see the full error message
     form.each((field) => {
       field.debouncedValidation.cancel();
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'reset' does not exist on type 'ReactTool... Remove this comment to see the full error message
     form.reset();
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'showErrors' does not exist on type 'Reac... Remove this comment to see the full error message
     form.showErrors(false);
   };
 
@@ -222,11 +222,8 @@ class ConfigurationDialog extends Component<Props> {
     const { intl } = this.context;
     const { onClose, onBack, error, isSubmitting, currentLocale } = this.props;
     const { form } = this;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const walletNameField = form.$('walletName');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const spendingPasswordField = form.$('spendingPassword');
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const repeatPasswordField = form.$('repeatPassword');
     const walletNameFieldClasses = classnames([
       styles.walletName,
@@ -241,7 +238,6 @@ class ConfigurationDialog extends Component<Props> {
     ) : (
       <LoadingSpinner />
     );
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'isValid' does not exist on type 'ReactTo... Remove this comment to see the full error message
     const canSubmit = !isSubmitting && form.isValid;
     return (
       <WalletRestoreDialog
@@ -250,7 +246,6 @@ class ConfigurationDialog extends Component<Props> {
         stepNumber={2}
         actions={[
           {
-            className: isSubmitting ? styles.isSubmitting : null,
             disabled: !canSubmit,
             primary: true,
             label: buttonLabel,
@@ -272,7 +267,7 @@ class ConfigurationDialog extends Component<Props> {
             error={walletNameField.error}
           />
 
-          <div className={styles.spendingPasswordWrapper}>
+          <div>
             <div className={styles.spendingPasswordFields}>
               <div className={spendingPasswordClasses}>
                 <PasswordInput
diff --git a/source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx b/source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx
index 89d3e44516..6b25a34bb2 100644
--- a/source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx
@@ -62,13 +62,16 @@ type Props = {
   maxWordCount: number;
 };
 
+interface FormFields {
+  recoveryPhrase: string;
+}
+
 @observer
 class MnemonicsDialog extends Component<Props> {
   static contextTypes = {
     intl: intlShape.isRequired,
   };
-  form = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  form = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         recoveryPhrase: {
@@ -95,7 +98,6 @@ class MnemonicsDialog extends Component<Props> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.form.submit({
       onSuccess: this.props.onContinue,
       onError: () => {},
@@ -112,7 +114,6 @@ class MnemonicsDialog extends Component<Props> {
       maxWordCount,
       expectedWordCount,
     } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const recoveryPhraseField = this.form.$('recoveryPhrase');
     const canSubmit = recoveryPhraseField.isValid && !recoveryPhraseField.error;
     return (
diff --git a/source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx b/source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx
index 337ec8682f..c14e05f8e2 100644
--- a/source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx
@@ -4,7 +4,6 @@ import SVGInline from 'react-svg-inline';
 import WalletRestoreDialog from './widgets/WalletRestoreDialog';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/tada-ic... Remove this comment to see the full error message
 import tadaImage from '../../../assets/images/tada-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SuccessDialog.scss' or its c... Remove this comment to see the full error message
 import styles from './SuccessDialog.scss';
 import type {
   WalletDaedalusKind,
diff --git a/source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx b/source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx
index c60e57d430..470f389df1 100644
--- a/source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx
@@ -6,7 +6,6 @@ import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import RadioSet from '../../widgets/RadioSet';
 import WalletRestoreDialog from './widgets/WalletRestoreDialog';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletTypeDialog.scss' or it... Remove this comment to see the full error message
 import styles from './WalletTypeDialog.scss';
 import {
   WALLET_KINDS,
@@ -245,7 +244,7 @@ export default class WalletTypeDialog extends Component<Props, State> {
         ]}
         onClose={onClose}
       >
-        <div className={styles.component}>
+        <div>
           {this.getWalletKind(
             WALLET_KINDS,
             messages.labelWalletKind,
diff --git a/source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx b/source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx
index 2972262747..4aa50a7413 100644
--- a/source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import Dialog from '../../../widgets/Dialog';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ConfirmationDialog.scss' or ... Remove this comment to see the full error message
 import styles from './ConfirmationDialog.scss';
 
 const messages = defineMessages({
@@ -48,10 +47,6 @@ class ConfirmationDialog extends Component<Props> {
     const { intl } = this.context;
     const { onConfirm, onCancel } = this.props;
     const dialogClasses = classnames([styles.component, 'ConfirmDialog']);
-    const confirmButtonClasses = classnames([
-      'confirmButton', // 'attention',
-      styles.confirmButton,
-    ]);
     const actions = [
       {
         className: 'cancelButton',
@@ -59,7 +54,7 @@ class ConfirmationDialog extends Component<Props> {
         onClick: onCancel,
       },
       {
-        className: confirmButtonClasses,
+        className: 'confirmButton',
         label: intl.formatMessage(messages.confirmButtonLabel),
         primary: true,
         onClick: onConfirm,
diff --git a/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx b/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx
index 31438c459e..9ff8a46a3b 100644
--- a/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx
@@ -6,7 +6,6 @@ import DialogCloseButton from '../../../widgets/DialogCloseButton';
 import Dialog from '../../../widgets/Dialog';
 import DialogBackButton from '../../../widgets/DialogBackButton';
 import WalletRestoreSteps from './WalletRestoreSteps';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRestoreDialog.scss' or... Remove this comment to see the full error message
 import styles from './WalletRestoreDialog.scss';
 import { RESTORE_WALLET_STEPS } from '../../../../config/walletRestoreConfig';
 import type { DialogActionItems } from '../../../widgets/Dialog';
@@ -26,7 +25,7 @@ const messages = defineMessages({
   stepsCounter: {
     id: 'wallet.restore.dialog.stepsCounter',
     defaultMessage: '!!!Step {currentStep} of {totalSteps}',
-    description: 'Step couters in the wallet restore dialog.',
+    description: 'Step counters in the wallet restore dialog.',
   },
 });
 type Props = {
diff --git a/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx b/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx
index 5f4e84c67e..f639c3c953 100644
--- a/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx
+++ b/source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Stepper } from 'react-polymorph/lib/components/Stepper';
 import { StepperSkin } from 'react-polymorph/lib/skins/simple/StepperSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletRestoreSteps.scss' or ... Remove this comment to see the full error message
 import styles from './WalletRestoreSteps.scss';
 import { RESTORE_WALLET_STEPS } from '../../../../config/walletRestoreConfig';
 import type { RestoreWalletStep } from '../../../../types/walletRestoreTypes';
diff --git a/source/renderer/app/components/wallet/widgets/ClearButton.scss b/source/renderer/app/components/wallet/widgets/ClearButton.scss
new file mode 100644
index 0000000000..5f7738cf61
--- /dev/null
+++ b/source/renderer/app/components/wallet/widgets/ClearButton.scss
@@ -0,0 +1,27 @@
+.component {
+  background-color: var(
+    --theme-staking-stake-pools-search-clear-button-background-color
+  );
+  border-radius: 3px;
+  cursor: pointer;
+  height: 28px;
+  width: 28px;
+
+  &:hover {
+    background-color: var(
+      --theme-staking-stake-pools-search-clear-button-hover-background-color
+    );
+  }
+
+  .clearIcon {
+    > svg {
+      position: relative;
+      top: 0.5px;
+      width: 10px;
+
+      > g > g {
+        fill: var(--theme-staking-stake-pools-search-clear-button-color);
+      }
+    }
+  }
+}
diff --git a/source/renderer/app/components/wallet/widgets/ClearButton.tsx b/source/renderer/app/components/wallet/widgets/ClearButton.tsx
new file mode 100644
index 0000000000..5a9f0d706b
--- /dev/null
+++ b/source/renderer/app/components/wallet/widgets/ClearButton.tsx
@@ -0,0 +1,20 @@
+import React from 'react';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+import SVGInline from 'react-svg-inline';
+import closeIcon from '../../../assets/images/close-cross.inline.svg';
+import styles from './ClearButton.scss';
+
+interface Props {
+  label: string;
+  onClick: () => void;
+}
+
+export function ClearButton({ label, onClick }: Props) {
+  return (
+    <PopOver content={label} placement="top">
+      <button onClick={onClick} className={styles.component} tabIndex={-1}>
+        <SVGInline svg={closeIcon} className={styles.clearIcon} />
+      </button>
+    </PopOver>
+  );
+}
diff --git a/source/renderer/app/components/wallet/widgets/Divider.scss b/source/renderer/app/components/wallet/widgets/Divider.scss
new file mode 100644
index 0000000000..e7906fb339
--- /dev/null
+++ b/source/renderer/app/components/wallet/widgets/Divider.scss
@@ -0,0 +1,8 @@
+.component {
+  background-color: var(--theme-input-placeholder-color);
+  display: inline-block;
+  height: 20px;
+  margin: 0 20px;
+  opacity: 0.2;
+  width: 1px;
+}
diff --git a/source/renderer/app/components/wallet/widgets/Divider.tsx b/source/renderer/app/components/wallet/widgets/Divider.tsx
new file mode 100644
index 0000000000..dee00283b9
--- /dev/null
+++ b/source/renderer/app/components/wallet/widgets/Divider.tsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+import styles from './Divider.scss';
+
+export function Divider() {
+  return <span className={styles.component} />;
+}
diff --git a/source/renderer/app/components/widgets/BackToTopButton.scss b/source/renderer/app/components/widgets/BackToTopButton.scss
index dc5d6b6641..83bd666900 100644
--- a/source/renderer/app/components/widgets/BackToTopButton.scss
+++ b/source/renderer/app/components/widgets/BackToTopButton.scss
@@ -1,3 +1,5 @@
+@import '../../themes/mixins/layers.scss';
+
 .component {
   background-color: var(--theme-back-to-top-button-background-color);
   border-radius: 5px;
@@ -15,7 +17,7 @@
   top: 144px;
   transform: translateX(-50%);
   transition: opacity 0.25s ease-out, top 0.25s ease-out;
-  z-index: 1001;
+  z-index: $back-to-top-z-index;
 
   &.isActive {
     opacity: 1;
diff --git a/source/renderer/app/components/widgets/BackToTopButton.tsx b/source/renderer/app/components/widgets/BackToTopButton.tsx
index 4801bd09cb..0b89570c9b 100644
--- a/source/renderer/app/components/widgets/BackToTopButton.tsx
+++ b/source/renderer/app/components/widgets/BackToTopButton.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import { throttle } from 'lodash';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './BackToTopButton.scss' or its... Remove this comment to see the full error message
 import styles from './BackToTopButton.scss';
 
 const messages = defineMessages({
diff --git a/source/renderer/app/components/widgets/BigButtonForDialogs.tsx b/source/renderer/app/components/widgets/BigButtonForDialogs.tsx
index 271a5134b0..1ad87dc22f 100644
--- a/source/renderer/app/components/widgets/BigButtonForDialogs.tsx
+++ b/source/renderer/app/components/widgets/BigButtonForDialogs.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './BigButtonForDialogs.scss' or... Remove this comment to see the full error message
 import styles from './BigButtonForDialogs.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/BorderedBox.tsx b/source/renderer/app/components/widgets/BorderedBox.tsx
index 5b600865d0..a51c8809d5 100644
--- a/source/renderer/app/components/widgets/BorderedBox.tsx
+++ b/source/renderer/app/components/widgets/BorderedBox.tsx
@@ -3,7 +3,6 @@ import React, { Component } from 'react';
 import type { Node } from 'react';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './BorderedBox.scss' or its cor... Remove this comment to see the full error message
 import styles from './BorderedBox.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/ButtonLink.tsx b/source/renderer/app/components/widgets/ButtonLink.tsx
index 41fd360f86..856080fc54 100644
--- a/source/renderer/app/components/widgets/ButtonLink.tsx
+++ b/source/renderer/app/components/widgets/ButtonLink.tsx
@@ -1,10 +1,8 @@
 import React, { Component } from 'react';
 import { get } from 'lodash';
-import classNames from 'classnames';
 import { Button } from 'react-polymorph/lib/components/Button';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ButtonLink.scss' or its corr... Remove this comment to see the full error message
 import styles from './ButtonLink.scss';
 
 type LinkPropsTypes = {
@@ -21,10 +19,7 @@ type Props = {
 export default class ButtonLink extends Component<Props> {
   render() {
     const { label, linkProps } = this.props;
-    const linkLabelClasses = classNames([
-      styles.linkLabel,
-      get(linkProps, 'className', null),
-    ]);
+    const linkLabelClasses = get(linkProps, 'className', null);
     const linkLabel = (
       <Link
         label={label}
diff --git a/source/renderer/app/components/widgets/CountdownWidget.tsx b/source/renderer/app/components/widgets/CountdownWidget.tsx
index 5ea4c106eb..ec1d914b16 100644
--- a/source/renderer/app/components/widgets/CountdownWidget.tsx
+++ b/source/renderer/app/components/widgets/CountdownWidget.tsx
@@ -3,11 +3,8 @@ import { observer } from 'mobx-react';
 import { intlShape } from 'react-intl';
 import moment from 'moment';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CountdownWidget.scss' or its... Remove this comment to see the full error message
 import styles from './CountdownWidget.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/delimeter.... Remove this comment to see the full error message
 import delimeterIcon from '../../assets/images/delimeter.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/spinner.in... Remove this comment to see the full error message
 import spinnerIcon from '../../assets/images/spinner.inline.svg';
 import globalMessages from '../../i18n/global-messages';
 
diff --git a/source/renderer/app/components/widgets/Dialog.tsx b/source/renderer/app/components/widgets/Dialog.tsx
index d348221f44..83975aa567 100644
--- a/source/renderer/app/components/widgets/Dialog.tsx
+++ b/source/renderer/app/components/widgets/Dialog.tsx
@@ -9,11 +9,8 @@ import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import { ModalSkin } from 'react-polymorph/lib/skins/simple/ModalSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Dialog.scss' or its correspo... Remove this comment to see the full error message
 import styles from './Dialog.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DialogOverride.scss' or its ... Remove this comment to see the full error message
 import dialogOverrides from './DialogOverride.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DialogFullSizeOverride.scss'... Remove this comment to see the full error message
 import dialogFullSizeOverride from './DialogFullSizeOverride.scss';
 
 export type DialogActionItems = Array<DialogActionItem>;
@@ -114,7 +111,7 @@ export default class Dialog extends Component<Props> {
               <div className={styles.content}>{children}</div>
             </div>
           )}
-          {footer && <div className={styles.footer}>{footer}</div>}
+          {footer && <div>{footer}</div>}
 
           {items && (
             <div className={classActionsClasses}>
diff --git a/source/renderer/app/components/widgets/DialogBackButton.tsx b/source/renderer/app/components/widgets/DialogBackButton.tsx
index f68f437480..f088afbbbf 100644
--- a/source/renderer/app/components/widgets/DialogBackButton.tsx
+++ b/source/renderer/app/components/widgets/DialogBackButton.tsx
@@ -1,8 +1,6 @@
 import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/back-arrow... Remove this comment to see the full error message
 import backArrow from '../../assets/images/back-arrow-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DialogBackButton.scss' or it... Remove this comment to see the full error message
 import styles from './DialogBackButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/DialogCloseButton.tsx b/source/renderer/app/components/widgets/DialogCloseButton.tsx
index c0694dda37..c0ba4a34a7 100644
--- a/source/renderer/app/components/widgets/DialogCloseButton.tsx
+++ b/source/renderer/app/components/widgets/DialogCloseButton.tsx
@@ -1,8 +1,6 @@
 import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/close-cros... Remove this comment to see the full error message
 import closeCross from '../../assets/images/close-cross.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DialogCloseButton.scss' or i... Remove this comment to see the full error message
 import styles from './DialogCloseButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/DialogFullSizeOverride.scss b/source/renderer/app/components/widgets/DialogFullSizeOverride.scss
index 158ba8f940..b503a0f3eb 100644
--- a/source/renderer/app/components/widgets/DialogFullSizeOverride.scss
+++ b/source/renderer/app/components/widgets/DialogFullSizeOverride.scss
@@ -19,9 +19,9 @@
     .AutocompleteOverrides_autocompleteContent,
     .SimpleInput_customValueBlock,
     .SimpleInput_customValueWrapper,
-    .SimpleInput_input,
-    .SimpleInput_input:focus,
-    .SimpleInput_input:hover,
+    .SimpleInput_input:not(.SimpleInput_disabled),
+    .SimpleInput_input:focus:not(.SimpleInput_disabled),
+    .SimpleInput_input:hover:not(.SimpleInput_disabled),
     .SimpleLink_root {
       background-color: transparent !important;
     }
@@ -94,43 +94,49 @@
     .SimpleInput_input,
     .SimpleInput_input::placeholder,
     .SimpleInput_input:focus,
-    .SimpleInput_input:hover,
-    .SimpleLink_root {
+    .SimpleInput_input:hover {
       color: var(--theme-dialog-fullsize-text-color);
     }
 
     // Text color highlight
     .SimpleAutocomplete_autocompleteContent input,
-    .SimpleOptions_option,
-    .SimpleLink_root {
+    .SimpleOptions_option {
       color: var(--theme-dialog-fullsize-text-highlight-color);
     }
 
     // Border Color
     .AutocompleteOverrides_autocompleteContent:not(.SimpleAutocomplete_errored),
-    .SelectOverrides_selectInput input,
+    .SelectOverrides_selectInput input:not(.SimpleInput_disabled),
     .SimpleInput_customValueBlock,
-    .SimpleInput_customValueWrapper .SimpleInput_input,
+    .SimpleInput_customValueWrapper
+      .SimpleInput_input:not(.SimpleInput_disabled),
     .SimpleInput_input:focus:not(.SimpleInput_errored),
     .SimpleInput_input:hover:not(.SimpleInput_errored),
-    .SimpleLink_root,
     .SimpleOptions_option:after {
       background-color: transparent !important;
       border-color: var(--theme-dialog-fullsize-text-color) !important;
     }
 
     .SimpleLink_root {
-      color: var(--theme-dialog-fullsize-text-highlight-color);
-      opacity: 0.8;
+      --opacity: 0.8;
+      --main-color: rgba(
+        var(--theme-dialog-fullsize-secondary-text-action-color),
+        1
+      );
+
+      border-color: rgba(
+        var(--theme-dialog-fullsize-secondary-text-action-color),
+        0.75
+      );
+      color: var(--main-color);
+      opacity: var(--opacity);
 
       &:hover {
-        opacity: 1;
+        --opacity: 1;
       }
 
       &:after {
-        background-color: var(
-          --theme-dialog-fullsize-text-highlight-color
-        ) !important;
+        background-color: var(--main-color);
       }
     }
 
diff --git a/source/renderer/app/components/widgets/ExternalLinkButton.tsx b/source/renderer/app/components/widgets/ExternalLinkButton.tsx
index a0505ed093..297288409e 100644
--- a/source/renderer/app/components/widgets/ExternalLinkButton.tsx
+++ b/source/renderer/app/components/widgets/ExternalLinkButton.tsx
@@ -2,9 +2,7 @@ import React from 'react';
 import classnames from 'classnames';
 import { Button } from 'react-polymorph/lib/components/Button';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/external-l... Remove this comment to see the full error message
 import externalLinkIcon from '../../assets/images/external-link-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ExternalLinkButton.scss' or ... Remove this comment to see the full error message
 import styles from './ExternalLinkButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/FullyDecentralizedEffect.tsx b/source/renderer/app/components/widgets/FullyDecentralizedEffect.tsx
index 4273110949..118fae6e1c 100644
--- a/source/renderer/app/components/widgets/FullyDecentralizedEffect.tsx
+++ b/source/renderer/app/components/widgets/FullyDecentralizedEffect.tsx
@@ -3,7 +3,6 @@ import { get } from 'lodash';
 import classnames from 'classnames';
 import { observer } from 'mobx-react';
 import { Fireworks } from 'fireworks-js';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './FullyDecentralizedEffect.scs... Remove this comment to see the full error message
 import styles from './FullyDecentralizedEffect.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/LoadingSpinner.tsx b/source/renderer/app/components/widgets/LoadingSpinner.tsx
index 5e8c9faf33..3eb9ec7892 100644
--- a/source/renderer/app/components/widgets/LoadingSpinner.tsx
+++ b/source/renderer/app/components/widgets/LoadingSpinner.tsx
@@ -1,11 +1,8 @@
 import React, { Component } from 'react';
 import classnames from 'classnames';
 import SVGInline from 'react-svg-inline';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/spinner-da... Remove this comment to see the full error message
 import spinnerIconBig from '../../assets/images/spinner-dark-big.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/spinner-da... Remove this comment to see the full error message
 import spinnerIconSmall from '../../assets/images/spinner-dark.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './LoadingSpinner.scss' or its ... Remove this comment to see the full error message
 import styles from './LoadingSpinner.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/NewsFeedIcon.tsx b/source/renderer/app/components/widgets/NewsFeedIcon.tsx
index df92d0493b..70f9f971ee 100644
--- a/source/renderer/app/components/widgets/NewsFeedIcon.tsx
+++ b/source/renderer/app/components/widgets/NewsFeedIcon.tsx
@@ -1,9 +1,7 @@
 import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/top-bar/ne... Remove this comment to see the full error message
 import newsFeedIcon from '../../assets/images/top-bar/news-feed-icon.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NewsFeedIcon.scss' or its co... Remove this comment to see the full error message
 import styles from './NewsFeedIcon.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/NodeSyncStatusIcon.tsx b/source/renderer/app/components/widgets/NodeSyncStatusIcon.tsx
index 988a24d44b..f60a313d46 100644
--- a/source/renderer/app/components/widgets/NodeSyncStatusIcon.tsx
+++ b/source/renderer/app/components/widgets/NodeSyncStatusIcon.tsx
@@ -4,11 +4,8 @@ import { defineMessages, intlShape } from 'react-intl';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import classNames from 'classnames';
 import { formattedNumber } from '../../utils/formatters';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/top-bar/no... Remove this comment to see the full error message
 import spinnerIcon from '../../assets/images/top-bar/node-sync-spinner.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/top-bar/no... Remove this comment to see the full error message
 import syncedIcon from '../../assets/images/top-bar/node-sync-synced.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NodeSyncStatusIcon.scss' or ... Remove this comment to see the full error message
 import styles from './NodeSyncStatusIcon.scss';
 
 const messages = defineMessages({
@@ -35,7 +32,7 @@ export default class NodeSyncStatusIcon extends Component<Props> {
     const statusIcon = isSynced ? syncedIcon : spinnerIcon;
     const componentClasses = classNames([
       styles.component,
-      isSynced ? styles.synced : styles.syncing,
+      isSynced ? null : styles.syncing,
       hasTadaIcon ? styles.hasTadaIcon : null,
     ]);
     const percentage = syncPercentage.toFixed(syncPercentage === 100 ? 0 : 2);
@@ -46,7 +43,7 @@ export default class NodeSyncStatusIcon extends Component<Props> {
             percentage: formattedNumber(percentage),
           })}
         >
-          <div className={styles.questionMark}>
+          <div>
             <SVGInline className={styles.icon} svg={statusIcon} />
           </div>
         </PopOver>
diff --git a/source/renderer/app/components/widgets/ProgressBar.tsx b/source/renderer/app/components/widgets/ProgressBar.tsx
index 9e2c1b39a6..a9c1d7649a 100644
--- a/source/renderer/app/components/widgets/ProgressBar.tsx
+++ b/source/renderer/app/components/widgets/ProgressBar.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ProgressBar.scss' or its cor... Remove this comment to see the full error message
 import styles from './ProgressBar.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/ProgressBarLarge.tsx b/source/renderer/app/components/widgets/ProgressBarLarge.tsx
index 3bd336986e..1e5bcc9e42 100644
--- a/source/renderer/app/components/widgets/ProgressBarLarge.tsx
+++ b/source/renderer/app/components/widgets/ProgressBarLarge.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ProgressBarLarge.scss' or it... Remove this comment to see the full error message
 import styles from './ProgressBarLarge.scss';
 
 type Props = {
@@ -44,7 +43,7 @@ class ProgressBarLarge extends Component<Props> {
     return (
       <div className={styles.component}>
         <div className={styles.content}>
-          <p className={styles.leftLabel}>{leftLabel}</p>
+          <p>{leftLabel}</p>
           <p className={styles.rightLabel}>
             <b>{rightLabel1}</b> {rightLabel2}
           </p>
diff --git a/source/renderer/app/components/widgets/RadioSet.tsx b/source/renderer/app/components/widgets/RadioSet.tsx
index 8a5692c158..fe97ead72d 100644
--- a/source/renderer/app/components/widgets/RadioSet.tsx
+++ b/source/renderer/app/components/widgets/RadioSet.tsx
@@ -5,9 +5,7 @@ import type { Node } from 'react';
 import { Radio } from 'react-polymorph/lib/components/Radio';
 import { RadioSkin } from 'react-polymorph/lib/skins/simple/RadioSkin';
 import { observer } from 'mobx-react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RadioSet.scss' or its corres... Remove this comment to see the full error message
 import styles from './RadioSet.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RadioOverride.scss' or its c... Remove this comment to see the full error message
 import stylesOverride from './RadioOverride.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/Slider.tsx b/source/renderer/app/components/widgets/Slider.tsx
index bb48335908..02c9ccb49e 100644
--- a/source/renderer/app/components/widgets/Slider.tsx
+++ b/source/renderer/app/components/widgets/Slider.tsx
@@ -4,7 +4,6 @@ import BigNumber from 'bignumber.js';
 import RcSlider from 'rc-slider';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { shortNumber } from '../../utils/formatters';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Slider.scss' or its correspo... Remove this comment to see the full error message
 import styles from './Slider.scss';
 
 type Props = {
@@ -42,6 +41,7 @@ type Props = {
   tabIndex?: number;
   ariaLabelForHandle?: string;
   ariaLabelledByForHandle?: string;
+  tooltipAppendTo?: string | (() => void) | 'parent';
   ariaValueTextFormatterForHandle?: (...args: Array<any>) => any;
 };
 export const Slider = observer((props: Props) => {
@@ -54,6 +54,7 @@ export const Slider = observer((props: Props) => {
     maxDisplayValue,
     displayValue,
     showRawValue,
+    tooltipAppendTo,
     ...rest
   } = props;
   const { min, max, value } = rest;
@@ -70,7 +71,21 @@ export const Slider = observer((props: Props) => {
       <div className={styles.upperMarks}>
         <div className={styles.minMark}>
           {showTooltip ? (
-            <PopOver content={minTooltip}>
+            <PopOver
+              content={minTooltip}
+              appendTo={tooltipAppendTo}
+              popperOptions={{
+                placement: 'top',
+                modifiers: [
+                  {
+                    name: 'flip',
+                    options: {
+                      fallbackPlacements: ['bottom'],
+                    },
+                  },
+                ],
+              }}
+            >
               {shortNumber(minDisplayValue || min)}
             </PopOver>
           ) : (
@@ -79,7 +94,21 @@ export const Slider = observer((props: Props) => {
         </div>
         <div className={styles.maxMark}>
           {showTooltip ? (
-            <PopOver content={maxTooltip}>
+            <PopOver
+              content={maxTooltip}
+              appendTo={tooltipAppendTo}
+              popperOptions={{
+                placement: 'top',
+                modifiers: [
+                  {
+                    name: 'flip',
+                    options: {
+                      fallbackPlacements: ['bottom', 'left'],
+                    },
+                  },
+                ],
+              }}
+            >
               {shortNumber(maxDisplayValue || max)}
             </PopOver>
           ) : (
diff --git a/source/renderer/app/components/widgets/TadaButton.tsx b/source/renderer/app/components/widgets/TadaButton.tsx
index 6aee6b4245..2df41577cc 100644
--- a/source/renderer/app/components/widgets/TadaButton.tsx
+++ b/source/renderer/app/components/widgets/TadaButton.tsx
@@ -1,9 +1,7 @@
 import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TadaButton.scss' or its corr... Remove this comment to see the full error message
 import styles from './TadaButton.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/tada-green... Remove this comment to see the full error message
 import tadaIcon from '../../assets/images/tada-green-ic.inline.svg';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx b/source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx
index cbe8b64655..2cddfd8a5a 100644
--- a/source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx
+++ b/source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletTestEnvironmentLabel.s... Remove this comment to see the full error message
 import styles from './WalletTestEnvironmentLabel.scss';
 import type { networkType } from '../../types/networkTypes';
 
diff --git a/source/renderer/app/components/widgets/forms/AssetsDropdown.tsx b/source/renderer/app/components/widgets/forms/AssetsDropdown.tsx
index 32ec59ab71..e2e08be258 100644
--- a/source/renderer/app/components/widgets/forms/AssetsDropdown.tsx
+++ b/source/renderer/app/components/widgets/forms/AssetsDropdown.tsx
@@ -5,7 +5,6 @@ import ItemsDropdown from './ItemsDropdown';
 import type { AssetToken } from '../../../api/assets/types';
 import { useDiscreetModeFeature } from '../../../features/discreet-mode';
 import Asset from '../../assets/Asset';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AssetsDropdown.scss' or its ... Remove this comment to see the full error message
 import styles from './AssetsDropdown.scss';
 
 /**
@@ -24,8 +23,8 @@ type Props = {
 export const onSearchAssetsDropdown = (
   searchValue: string,
   options: Array<any>
-) =>
-  filter(options, ({ asset }) => {
+) => {
+  return filter(options, ({ asset }) => {
     if (searchValue.length < 3) {
       return true;
     }
@@ -44,6 +43,7 @@ export const onSearchAssetsDropdown = (
     const regex = new RegExp(escapeRegExp(searchValue), 'i');
     return checkList.some((item) => regex.test(item));
   });
+};
 export default function AssetsDropdown({
   assets = [],
   onSearch = onSearchAssetsDropdown,
diff --git a/source/renderer/app/components/widgets/forms/FileUploadWidget.tsx b/source/renderer/app/components/widgets/forms/FileUploadWidget.tsx
index 3ffd46270a..7190591d72 100644
--- a/source/renderer/app/components/widgets/forms/FileUploadWidget.tsx
+++ b/source/renderer/app/components/widgets/forms/FileUploadWidget.tsx
@@ -5,7 +5,6 @@ import path from 'path';
 import { showOpenDialogChannel } from '../../../ipc/show-file-dialog-channels';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/attach-... Remove this comment to see the full error message
 import attachIcon from '../../../assets/images/attach-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './FileUploadWidget.scss' or it... Remove this comment to see the full error message
 import styles from './FileUploadWidget.scss';
 import type { FileDialogRequestParams } from '../../../../../common/types/file-dialog.types';
 
diff --git a/source/renderer/app/components/widgets/forms/FormFieldSkinTooltip.tsx b/source/renderer/app/components/widgets/forms/FormFieldSkinTooltip.tsx
index 90b5bbc976..8d1da3d919 100644
--- a/source/renderer/app/components/widgets/forms/FormFieldSkinTooltip.tsx
+++ b/source/renderer/app/components/widgets/forms/FormFieldSkinTooltip.tsx
@@ -8,7 +8,6 @@ import SVGInline from 'react-svg-inline';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/exclama... Remove this comment to see the full error message
 import exclamationPointIcon from '../../../assets/images/exclamation-point.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './FormFieldSkinTooltip.scss' o... Remove this comment to see the full error message
 import styles from './FormFieldSkinTooltip.scss';
 type Props = {
   className: string;
diff --git a/source/renderer/app/components/widgets/forms/ImageUploadWidget.tsx b/source/renderer/app/components/widgets/forms/ImageUploadWidget.tsx
index 84e9a11f47..be04d116b5 100644
--- a/source/renderer/app/components/widgets/forms/ImageUploadWidget.tsx
+++ b/source/renderer/app/components/widgets/forms/ImageUploadWidget.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ImageUploadWidget.scss' or i... Remove this comment to see the full error message
 import styles from './ImageUploadWidget.scss';
 
 export const messages = defineMessages({
diff --git a/source/renderer/app/components/widgets/forms/InlineEditingDropdown.tsx b/source/renderer/app/components/widgets/forms/InlineEditingDropdown.tsx
index ead134e91d..4de9b114f9 100644
--- a/source/renderer/app/components/widgets/forms/InlineEditingDropdown.tsx
+++ b/source/renderer/app/components/widgets/forms/InlineEditingDropdown.tsx
@@ -8,7 +8,6 @@ import SVGInline from 'react-svg-inline';
 import classnames from 'classnames';
 import { Select } from 'react-polymorph/lib/components/Select';
 import { SelectSkin } from 'react-polymorph/lib/skins/simple/SelectSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InlineEditingDropdown.scss' ... Remove this comment to see the full error message
 import styles from './InlineEditingDropdown.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/questio... Remove this comment to see the full error message
 import questionMarkIcon from '../../../assets/images/question-mark.inline.svg';
diff --git a/source/renderer/app/components/widgets/forms/InlineEditingInput.tsx b/source/renderer/app/components/widgets/forms/InlineEditingInput.tsx
index b7d702dfcc..dc66590368 100644
--- a/source/renderer/app/components/widgets/forms/InlineEditingInput.tsx
+++ b/source/renderer/app/components/widgets/forms/InlineEditingInput.tsx
@@ -9,7 +9,6 @@ import SVGInline from 'react-svg-inline';
 import classnames from 'classnames';
 import { Input } from 'react-polymorph/lib/components/Input';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InlineEditingInput.scss' or ... Remove this comment to see the full error message
 import styles from './InlineEditingInput.scss';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/pen.inl... Remove this comment to see the full error message
@@ -65,6 +64,10 @@ type State = {
   successfullyUpdated: boolean;
 };
 
+interface FormFields {
+  inputField: string;
+}
+
 @observer
 class InlineEditingInput extends Component<Props, State> {
   static defaultProps = {
@@ -79,8 +82,7 @@ class InlineEditingInput extends Component<Props, State> {
     hasChanged: false,
     successfullyUpdated: false,
   };
-  validator = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  validator = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         inputField: {
@@ -110,7 +112,6 @@ class InlineEditingInput extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.validator.submit({
       onSuccess: async (form) => {
         this.setInputBlur();
@@ -170,7 +171,6 @@ class InlineEditingInput extends Component<Props, State> {
   };
   onCancel = () => {
     const { value, onCancel, errorMessage } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const inputField = this.validator.$('inputField');
     const newValue = !errorMessage ? value : '';
     inputField.set(newValue);
@@ -193,7 +193,6 @@ class InlineEditingInput extends Component<Props, State> {
     this.setState({
       hasChanged: true,
     });
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const inputField = this.validator.$('inputField');
     // @ts-ignore ts-migrate(2488) FIXME: Type 'KeyboardEvent' must have a '[Symbol.iterator... Remove this comment to see the full error message
     inputField.onChange(...props);
@@ -201,7 +200,6 @@ class InlineEditingInput extends Component<Props, State> {
 
   componentDidUpdate({ value: prevValue, errorMessage: prevError }: Props) {
     const { value: nextValue, errorMessage: nextError } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const inputField = this.validator.$('inputField');
 
     // If there's an error, we focus the input again
@@ -262,7 +260,6 @@ class InlineEditingInput extends Component<Props, State> {
     }
 
     const { intl } = this.context;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const inputField = validator.$('inputField');
     let error;
     if (inputField.error) error = inputField.error;
@@ -277,7 +274,6 @@ class InlineEditingInput extends Component<Props, State> {
       styles.component,
       isActive ? null : styles.inactive,
       readOnly ? styles.readOnly : null,
-      isLoading ? styles.isLoading : null,
       showEditButton || showLoadingButton ? styles.twoButtons : null,
       showFocusButtons ? styles.twoButtons : null,
     ]);
diff --git a/source/renderer/app/components/widgets/forms/InlineEditingSmallInput.tsx b/source/renderer/app/components/widgets/forms/InlineEditingSmallInput.tsx
index 931525f91a..eb5f2a3441 100644
--- a/source/renderer/app/components/widgets/forms/InlineEditingSmallInput.tsx
+++ b/source/renderer/app/components/widgets/forms/InlineEditingSmallInput.tsx
@@ -9,7 +9,6 @@ import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { Button } from 'react-polymorph/lib/components/Button';
 import classnames from 'classnames';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InlineEditingSmallInput.scss... Remove this comment to see the full error message
 import styles from './InlineEditingSmallInput.scss';
 import { FORM_VALIDATION_DEBOUNCE_WAIT } from '../../../config/timingConfig';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/pen.inl... Remove this comment to see the full error message
@@ -40,6 +39,10 @@ type State = {
   isActive: boolean;
 };
 
+interface FormFields {
+  inputField: string;
+}
+
 @observer
 class InlineEditingSmallInput extends Component<Props, State> {
   state = {
@@ -50,8 +53,7 @@ class InlineEditingSmallInput extends Component<Props, State> {
     onStopEditing: () => {},
     onCancelEditing: () => {},
   };
-  validator = new ReactToolboxMobxForm(
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 0 arguments, but got 2.
+  validator = new ReactToolboxMobxForm<FormFields>(
     {
       fields: {
         inputField: {
@@ -76,7 +78,6 @@ class InlineEditingSmallInput extends Component<Props, State> {
     }
   );
   submit = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'submit' does not exist on type 'ReactToo... Remove this comment to see the full error message
     this.validator.submit({
       onSuccess: (form) => {
         const { inputField } = form.values();
@@ -131,7 +132,6 @@ class InlineEditingSmallInput extends Component<Props, State> {
     }
   };
   onCancel = () => {
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const inputField = this.validator.$('inputField');
     inputField.value = this.props.inputFieldValue;
     this.setState({
@@ -171,7 +171,6 @@ class InlineEditingSmallInput extends Component<Props, State> {
     } = this.props;
     const { isActive } = this.state;
     let { successfullyUpdated } = this.props;
-    // @ts-ignore ts-migrate(2339) FIXME: Property '$' does not exist on type 'ReactToolboxM... Remove this comment to see the full error message
     const inputField = validator.$('inputField');
     const arrowIconIsVisible = inputField.value !== this.props.inputFieldValue;
     const componentStyles = classnames([
diff --git a/source/renderer/app/components/widgets/forms/ItemDropdownOption.tsx b/source/renderer/app/components/widgets/forms/ItemDropdownOption.tsx
index 20d33a8226..5f4d19ee94 100644
--- a/source/renderer/app/components/widgets/forms/ItemDropdownOption.tsx
+++ b/source/renderer/app/components/widgets/forms/ItemDropdownOption.tsx
@@ -5,7 +5,6 @@ import SVGInline from 'react-svg-inline';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { intlShape, defineMessages } from 'react-intl';
 import classnames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ItemDropdownOption.scss' or ... Remove this comment to see the full error message
 import styles from './ItemDropdownOption.scss';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/spinner... Remove this comment to see the full error message
 import tinySpinnerIcon from '../../../assets/images/spinner-tiny.inline.svg';
@@ -52,8 +51,8 @@ export default class ItemDropdownOption extends Component<ItemDropdown> {
     if (!isSyncing) return null;
     return (
       <div className={styles.syncingSpinner}>
-        <PopOver content={syncingLabel} className={styles.syncingLabel}>
-          <SVGInline svg={tinySpinnerIcon} className={styles.tinySpinner} />
+        <PopOver content={syncingLabel}>
+          <SVGInline svg={tinySpinnerIcon} />
         </PopOver>
       </div>
     );
diff --git a/source/renderer/app/components/widgets/forms/ItemsDropdown.tsx b/source/renderer/app/components/widgets/forms/ItemsDropdown.tsx
index dbb01308e5..7599f0d4a0 100644
--- a/source/renderer/app/components/widgets/forms/ItemsDropdown.tsx
+++ b/source/renderer/app/components/widgets/forms/ItemsDropdown.tsx
@@ -6,7 +6,6 @@ import { Select } from 'react-polymorph/lib/components/Select';
 import { SelectSkin } from 'react-polymorph/lib/skins/simple/SelectSkin';
 import ItemDropdownOption from './ItemDropdownOption';
 import type { ItemDropdown } from './ItemDropdownOption';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ItemsDropdown.scss' or its c... Remove this comment to see the full error message
 import styles from './ItemsDropdown.scss';
 import globalMessages from '../../../i18n/global-messages';
 
@@ -31,16 +30,18 @@ import globalMessages from '../../../i18n/global-messages';
 export type ItemDropdownProps = {
   options: Array<ItemDropdown>;
   className?: string;
+  disabled?: boolean;
 };
 export const onSearchItemsDropdown = (
   searchValue: string,
   options: Array<any>
-) =>
-  filter(options, (option) => {
+) => {
+  return filter(options, (option) => {
     const { label, detail, value } = option;
     const regex = new RegExp(escapeRegExp(searchValue), 'i');
     return regex.test(label) || regex.test(detail) || regex.test(value);
   });
+};
 export default class ItemsDropdown extends Component<ItemDropdownProps> {
   static contextTypes = {
     intl: intlShape.isRequired,
diff --git a/source/renderer/app/components/widgets/forms/MnemonicInputWidget.tsx b/source/renderer/app/components/widgets/forms/MnemonicInputWidget.tsx
index 7ad395549b..b66e07f2eb 100644
--- a/source/renderer/app/components/widgets/forms/MnemonicInputWidget.tsx
+++ b/source/renderer/app/components/widgets/forms/MnemonicInputWidget.tsx
@@ -4,7 +4,6 @@ import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './MnemonicInputWidget.scss' or... Remove this comment to see the full error message
 import styles from './MnemonicInputWidget.scss';
 
 const messages = defineMessages({
@@ -33,7 +32,7 @@ class MnemonicInputWidget extends Component<Props> {
     return (
       <div className={styles.component}>
         <div className={styles.label}>{label}</div>
-        {error && <div className={styles.error}>{error}</div>}
+        {error && <div>{error}</div>}
         <div className={styles.tokens}>
           {tokens.map((token, index) => (
             <Input
diff --git a/source/renderer/app/components/widgets/forms/NormalSwitch.tsx b/source/renderer/app/components/widgets/forms/NormalSwitch.tsx
index 33e468a435..5bb12ca56e 100644
--- a/source/renderer/app/components/widgets/forms/NormalSwitch.tsx
+++ b/source/renderer/app/components/widgets/forms/NormalSwitch.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { SwitchSkin } from 'react-polymorph/lib/skins/simple/SwitchSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NormalSwitch.scss' or its co... Remove this comment to see the full error message
 import styles from './NormalSwitch.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/forms/PasswordInput.tsx b/source/renderer/app/components/widgets/forms/PasswordInput.tsx
index fb503a87c6..4fcdae73c2 100644
--- a/source/renderer/app/components/widgets/forms/PasswordInput.tsx
+++ b/source/renderer/app/components/widgets/forms/PasswordInput.tsx
@@ -4,7 +4,6 @@ import { intlShape } from 'react-intl';
 import { PasswordInput as RPPasswordInput } from 'react-polymorph/lib/components/PasswordInput';
 import type { PasswordInputProps } from 'react-polymorph/lib/components/PasswordInput';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PasswordInput.scss' or its c... Remove this comment to see the full error message
 import styles from './PasswordInput.scss';
 
 export type Props = PasswordInputProps;
diff --git a/source/renderer/app/components/widgets/forms/PinCode.tsx b/source/renderer/app/components/widgets/forms/PinCode.tsx
index d6f5bda92c..d4b430a12e 100644
--- a/source/renderer/app/components/widgets/forms/PinCode.tsx
+++ b/source/renderer/app/components/widgets/forms/PinCode.tsx
@@ -5,17 +5,16 @@ import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import classNames from 'classnames';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PinCode.scss' or its corresp... Remove this comment to see the full error message
 import styles from './PinCode.scss';
 
 type Props = {
-  id: string;
+  id?: string;
   name: string;
   type: string;
   autoFocus: boolean;
   onChange?: (...args: Array<any>) => any;
   label: string;
-  length: number;
+  length?: number;
   disabled: boolean;
   value: Array<string>;
   error: string | null;
@@ -77,34 +76,36 @@ export default class PinCode extends Component<Props> {
     return (
       <div className={styles.pinCodeInput}>
         {/* @ts-ignore ts-migrate(2554) FIXME: Expected 1-3 arguments, but got 0. */}
-        {map(Array(length).fill(), (action, key) => (
-          <NumericInput
-            ref={(input) => {
-              if (
-                !Object.prototype.hasOwnProperty.call(this.inputsRef, key) ||
-                this.inputsRef[key] !== input
-              )
-                this.inputsRef[key] = input;
-            }}
-            id={id}
-            name={name}
-            type={type}
-            className={pinCodeClasses}
-            label={null}
-            key={key}
-            themeId={IDENTIFIERS.INPUT}
-            skin={InputSkin}
-            onChange={(number) => this.onChange(number, key)}
-            value={value ? value[key] : undefined}
-            autoFocus={autoFocus && key === 0}
-            disabled={
-              disabled ||
-              (key !== 0 &&
-                (!value ||
-                  !Object.prototype.hasOwnProperty.call(value, key - 1)))
-            }
-          />
-        ))}
+        {map(Array(length).fill(), (action, key) => {
+          return (
+            <NumericInput
+              ref={(input) => {
+                if (
+                  !Object.prototype.hasOwnProperty.call(this.inputsRef, key) ||
+                  this.inputsRef[key] !== input
+                )
+                  this.inputsRef[key] = input;
+              }}
+              id={id}
+              name={name}
+              type={type}
+              className={pinCodeClasses}
+              label={null}
+              key={key}
+              themeId={IDENTIFIERS.INPUT}
+              skin={InputSkin}
+              onChange={(number) => this.onChange(number, key)}
+              value={value ? value[key] : undefined}
+              autoFocus={autoFocus && key === 0}
+              disabled={
+                disabled ||
+                (key !== 0 &&
+                  (!value ||
+                    !Object.prototype.hasOwnProperty.call(value, key - 1)))
+              }
+            />
+          );
+        })}
       </div>
     );
   };
diff --git a/source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx b/source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx
index 0045fcbdfc..1648c632c1 100644
--- a/source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx
+++ b/source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx
@@ -7,7 +7,6 @@ import { ButtonSpinnerSkin } from 'react-polymorph/lib/skins/simple/ButtonSpinne
 import { SelectSkin } from 'react-polymorph/lib/skins/simple/SelectSkin';
 import { defineMessages, intlShape } from 'react-intl';
 import LocalizableError from '../../../i18n/LocalizableError';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ProfileSettingsForm.scss' or... Remove this comment to see the full error message
 import styles from './ProfileSettingsForm.scss';
 import {
   LANGUAGE_OPTIONS,
diff --git a/source/renderer/app/components/widgets/forms/ReadOnlyInput.tsx b/source/renderer/app/components/widgets/forms/ReadOnlyInput.tsx
index fd6591649a..c82ac06551 100644
--- a/source/renderer/app/components/widgets/forms/ReadOnlyInput.tsx
+++ b/source/renderer/app/components/widgets/forms/ReadOnlyInput.tsx
@@ -5,7 +5,6 @@ import { intlShape } from 'react-intl';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import globalMessages from '../../../i18n/global-messages';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ReadOnlyInput.scss' or its c... Remove this comment to see the full error message
 import styles from './ReadOnlyInput.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/forms/TinyButton.tsx b/source/renderer/app/components/widgets/forms/TinyButton.tsx
index 27578c4981..ceb807b91f 100644
--- a/source/renderer/app/components/widgets/forms/TinyButton.tsx
+++ b/source/renderer/app/components/widgets/forms/TinyButton.tsx
@@ -5,7 +5,6 @@ import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
 // @ts-ignore ts-migrate(2724) FIXME: '"react"' has no exported member named 'Element'. ... Remove this comment to see the full error message
 import type { Element } from 'react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TinyButton.scss' or its corr... Remove this comment to see the full error message
 import styles from './TinyButton.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/forms/TinyCheckbox.tsx b/source/renderer/app/components/widgets/forms/TinyCheckbox.tsx
index 063434909e..12431e1d97 100644
--- a/source/renderer/app/components/widgets/forms/TinyCheckbox.tsx
+++ b/source/renderer/app/components/widgets/forms/TinyCheckbox.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TinyCheckbox.scss' or its co... Remove this comment to see the full error message
 import styles from './TinyCheckbox.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/forms/TinyDatePicker.tsx b/source/renderer/app/components/widgets/forms/TinyDatePicker.tsx
index 834131f9c5..8890db52cf 100644
--- a/source/renderer/app/components/widgets/forms/TinyDatePicker.tsx
+++ b/source/renderer/app/components/widgets/forms/TinyDatePicker.tsx
@@ -8,7 +8,6 @@ import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import globalMessages from '../../../i18n/global-messages';
 import TinyButton from './TinyButton';
 import TinyInput from './TinyInput';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TinyDatePicker.scss' or its ... Remove this comment to see the full error message
 import styles from './TinyDatePicker.scss';
 
 type PickerPanelPosition = 'left' | 'right';
@@ -20,14 +19,15 @@ type Props = {
   onFocus?: (...args: Array<any>) => any;
   onKeyDown?: (...args: Array<any>) => any;
   isValidDate?: (...args: Array<any>) => any;
+  closeOnSelect?: boolean;
   locale?: string;
   dateFormat: string;
   disablePaste?: boolean;
   value: string;
   label?: string | Element<any>;
   placeholder?: string;
-  innerLabelPrefix: string;
-  innerValue: string | Element<any>;
+  innerLabelPrefix?: string;
+  innerValue?: string | Element<any>;
   pickerPanelPosition: PickerPanelPosition;
   useReadMode?: boolean;
   error?: string | Element<any>;
diff --git a/source/renderer/app/components/widgets/forms/TinyInput.tsx b/source/renderer/app/components/widgets/forms/TinyInput.tsx
index 9d82c37b9d..94d3dfe564 100644
--- a/source/renderer/app/components/widgets/forms/TinyInput.tsx
+++ b/source/renderer/app/components/widgets/forms/TinyInput.tsx
@@ -5,8 +5,8 @@ import { NumericInput } from 'react-polymorph/lib/components/NumericInput';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TinyInput.scss' or its corre... Remove this comment to see the full error message
 import styles from './TinyInput.scss';
+import { NumberFormat } from '../../../../../common/types/number.types';
 // TODO: Extend react-polymorph Input component props when they are available
 type Props = {
   autoFocus?: boolean;
@@ -41,6 +41,9 @@ type Props = {
   themeOverrides?: Record<string, any>;
   themeVariables?: Record<string, any>;
   value: string;
+  bigNumberFormat?: NumberFormat;
+  decimalPlaces?: number;
+  allowSigns?: boolean;
 };
 type State = {
   isEditMode: boolean;
diff --git a/source/renderer/app/components/widgets/forms/TinySelect.tsx b/source/renderer/app/components/widgets/forms/TinySelect.tsx
index 14d6411e10..2527484666 100644
--- a/source/renderer/app/components/widgets/forms/TinySelect.tsx
+++ b/source/renderer/app/components/widgets/forms/TinySelect.tsx
@@ -2,11 +2,16 @@ import React, { Component } from 'react';
 import { Select } from 'react-polymorph/lib/components/Select';
 import { SelectSkin } from 'react-polymorph/lib/skins/simple/SelectSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TinySelect.scss' or its corr... Remove this comment to see the full error message
 import styles from './TinySelect.scss';
 
 type Props = {
   value: string;
+  onChange: (...args: any) => void;
+  placeholder?: string;
+  options: Array<{
+    label: string;
+    value: string;
+  }>;
 };
 export default class TinySelect extends Component<Props> {
   render() {
diff --git a/source/renderer/app/components/widgets/forms/TinySwitch.tsx b/source/renderer/app/components/widgets/forms/TinySwitch.tsx
index a4444325af..5390947316 100644
--- a/source/renderer/app/components/widgets/forms/TinySwitch.tsx
+++ b/source/renderer/app/components/widgets/forms/TinySwitch.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { SwitchSkin } from 'react-polymorph/lib/skins/simple/SwitchSkin';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './TinySwitch.scss' or its corr... Remove this comment to see the full error message
 import styles from './TinySwitch.scss';
 
 type Props = {
diff --git a/source/renderer/app/components/widgets/forms/WalletsDropdown.tsx b/source/renderer/app/components/widgets/forms/WalletsDropdown.tsx
index 238e8df06a..7549532f65 100644
--- a/source/renderer/app/components/widgets/forms/WalletsDropdown.tsx
+++ b/source/renderer/app/components/widgets/forms/WalletsDropdown.tsx
@@ -21,17 +21,24 @@ type Props = {
   getStakePoolById: (...args: Array<any>) => any;
   numberOfStakePools: number;
   onSearch?: (...args: Array<any>) => any;
+  onChange?: (...args: Array<any>) => any;
+  selectionRenderer?: (...args: Array<any>) => any;
+  placeholder?: string;
+  value?: string;
+  errorPosition?: string;
+  disabled?: boolean;
   wallets?: Array<Partial<Wallet>>;
 };
 export const onSearchWalletsDropdown = (
   searchValue: string,
   options: Array<any>
-) =>
-  filter(options, (option) => {
+) => {
+  return filter(options, (option) => {
     const { walletName, detail } = option;
     const regex = new RegExp(escapeRegExp(searchValue), 'i');
     return [walletName, detail].some((item) => regex.test(item));
   });
+};
 
 function WalletsDropdown({
   className,
diff --git a/source/renderer/app/components/widgets/forms/WalletsDropdownLabel.tsx b/source/renderer/app/components/widgets/forms/WalletsDropdownLabel.tsx
index e5029da095..61c228284c 100644
--- a/source/renderer/app/components/widgets/forms/WalletsDropdownLabel.tsx
+++ b/source/renderer/app/components/widgets/forms/WalletsDropdownLabel.tsx
@@ -1,9 +1,8 @@
 import React, { Component } from 'react';
 import SVGInline from 'react-svg-inline';
 import { getColorFromRange } from '../../../utils/colors';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './WalletsDropdownLabel.scss' o... Remove this comment to see the full error message
 import styles from './WalletsDropdownLabel.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/hardwar... Remove this comment to see the full error message
+// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/hardware... Remove this comment to see the full error message
 import hardwareWalletsIcon from '../../../assets/images/hardware-wallet/connect-ic.inline.svg';
 import Wallet from '../../../domains/Wallet';
 
diff --git a/source/renderer/app/components/widgets/notification-dot/NotificationDot.tsx b/source/renderer/app/components/widgets/notification-dot/NotificationDot.tsx
index 0500334ba7..f35d3c21dd 100644
--- a/source/renderer/app/components/widgets/notification-dot/NotificationDot.tsx
+++ b/source/renderer/app/components/widgets/notification-dot/NotificationDot.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 import classNames from 'classnames';
 // @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
 import type { Node } from 'react';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './NotificationDot.scss' or its... Remove this comment to see the full error message
 import styles from './NotificationDot.scss';
 
 type Props = {
@@ -17,11 +16,13 @@ const NotificationDot = ({
   className,
   dotClassName,
   enabled = false,
-}: Props) => (
-  <div className={classNames(styles.root, className)}>
-    {enabled && <span className={classNames(styles.dot, dotClassName)} />}
-    {children}
-  </div>
-);
+}: Props) => {
+  return (
+    <div className={classNames(styles.root, className)}>
+      {enabled && <span className={classNames(styles.dot, dotClassName)} />}
+      {children}
+    </div>
+  );
+};
 
 export default NotificationDot;
diff --git a/source/renderer/app/components/widgets/splash/Splash.tsx b/source/renderer/app/components/widgets/splash/Splash.tsx
index 3ab1d99d7f..f8c692c933 100644
--- a/source/renderer/app/components/widgets/splash/Splash.tsx
+++ b/source/renderer/app/components/widgets/splash/Splash.tsx
@@ -8,7 +8,6 @@ import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/daedalu... Remove this comment to see the full error message
 import daedalusIcon from '../../../assets/images/daedalus-logo-loading-grey.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './Splash.scss' or its correspo... Remove this comment to see the full error message
 import styles from './Splash.scss';
 
 type Props = {
diff --git a/source/renderer/app/config/currencyConfig.ts b/source/renderer/app/config/currencyConfig.ts
index 8d42f78b15..efcfc8857a 100644
--- a/source/renderer/app/config/currencyConfig.ts
+++ b/source/renderer/app/config/currencyConfig.ts
@@ -28,8 +28,10 @@ export const CURRENCY_REQUEST_RATE_INTERVAL = 60 * 1000; // 1 minute | unit: mil
 
 // Generic function for all the Currency requests
 export const genericCurrencyRequest =
-  (requestName: RequestName): ((...args: Array<any>) => any) =>
-  // @ts-ignore ts-migrate(1064) FIXME: The return type of an async function or method mus... Remove this comment to see the full error message
+  (
+    requestName: RequestName
+    // @ts-ignore ts-migrate(1064) FIXME: The return type of an async function or method mus... Remove this comment to see the full error message
+  ): ((...args: Array<any>) => any) =>
   async (payload?: any): any => {
     const request = currencyConfig.requests[requestName];
     let response;
diff --git a/source/renderer/app/config/generateStakePoolFakeData.ts b/source/renderer/app/config/generateStakePoolFakeData.ts
index 81b78d3b38..bdf13d96be 100644
--- a/source/renderer/app/config/generateStakePoolFakeData.ts
+++ b/source/renderer/app/config/generateStakePoolFakeData.ts
@@ -5,7 +5,6 @@
 const faker = require('faker');
 
 // const fs = require('fs');
-// @ts-ignore ts-migrate(2451) FIXME: Cannot redeclare block-scoped variable 'path'.
 const path = require('path');
 
 const BigNumber = require('bignumber.js');
diff --git a/source/renderer/app/config/sidebarConfig.ts b/source/renderer/app/config/sidebarConfig.ts
index eaa37a71e0..cd856e97a9 100644
--- a/source/renderer/app/config/sidebarConfig.ts
+++ b/source/renderer/app/config/sidebarConfig.ts
@@ -80,3 +80,4 @@ export const sidebarConfig = {
   CATEGORIES_BY_NAME,
   CATEGORIES_LIST,
 };
+export const FUZZY_SEARCH_THRESHOLD = 0.5;
diff --git a/source/renderer/app/config/stakingRewards.dummy.json b/source/renderer/app/config/stakingRewards.dummy.json
index e2b0ab5c7a..0289ca7c57 100644
--- a/source/renderer/app/config/stakingRewards.dummy.json
+++ b/source/renderer/app/config/stakingRewards.dummy.json
@@ -1,8 +1,9 @@
 [
   {
     "date": "15.01.2019",
-    "wallet": "Main Wallet",
-    "reward": 0.2,
+    "wallet": "Wallet with no rewards",
+    "total": 0,
+    "unspent": 0,
     "rewardsAddress": "stake1u8v3renevakp4w3rgfd7629qz8ynzpd96chfh2eddytsvwg069gh4",
     "pool": {
       "id": "a476343dd1dd57d680656224886ad9c11b5c44f6331bf029e9008a702713eda4",
@@ -20,7 +21,8 @@
   {
     "date": "15.01.2019",
     "wallet": "Spending Money",
-    "reward": 1.003,
+    "total": 1.003,
+    "unspent": 0,
     "rewardsAddress": "stake1u8v3renevakp4w3rgfd7629qz8ynzpd96chfh2eddytsvwg123kg9",
     "pool": {
       "id": "afd042672ed0212d074c5814771dc0f9d696b0fe3ca00c6bf613c1843f70419d",
@@ -38,7 +40,8 @@
   {
     "date": "10.01.2019",
     "wallet": "Spending Money",
-    "reward": 2,
+    "total": 2,
+    "unspent": 1,
     "rewardsAddress": "stake1u8v3renevakp4w3rgfd7629qz8ynzpd96chfh2eddytsvwgpt83k9",
     "pool": {
       "id": "4484e2076b4604250f63032644acf37f0630e208b5d03378d546f747f9b7d3ff",
@@ -56,7 +59,8 @@
   {
     "date": "10.01.2019",
     "wallet": "Saving",
-    "reward": 0.9,
+    "total": 0.9,
+    "unspent": 0,
     "rewardsAddress": "stake1u8v3renevakp4w3rgfd7629qz8ynzpd96chfh2eddytsvwgklo341",
     "pool": {
       "id": "b537af120298162372fc393d87e35803a8573a654786838e7a34b8d2354ec2fb",
@@ -74,7 +78,8 @@
   {
     "date": "10.01.2019",
     "wallet": "Main Wallet",
-    "reward": 0.2,
+    "total": 0.2,
+    "unspent": 0,
     "rewardsAddress": "stake1u8v3renevakp4w3rgfd7629qz8ynzpd96chfh2eddytsvwgbhs6f8",
     "pool": {
       "id": "9438c572026bf8a7019ae1733e4c6a1b4208fc12291e4788a7db70891d6bdb97",
@@ -92,7 +97,8 @@
   {
     "date": "05.01.2019",
     "wallet": "Main Wallet",
-    "reward": 1.6,
+    "total": 1.6,
+    "unspent": 0,
     "rewardsAddress": "stake1u8v3renevakp4w3rgfd7629qz8ynzpd96chfh2eddytsvwgkf873g",
     "pool": {
       "id": "9eebf901e2ab6ee31eddd54b9725df5b59f23a531f5cb6d547b69f3fa880df89",
diff --git a/source/renderer/app/config/stakingStakePools.dummy.json b/source/renderer/app/config/stakingStakePools.dummy.json
index e57b7bd394..01d4f43ca1 100644
--- a/source/renderer/app/config/stakingStakePools.dummy.json
+++ b/source/renderer/app/config/stakingStakePools.dummy.json
@@ -16,7 +16,7 @@
     "ranking": 1,
     "retiring": null,
     "saturation": 110.25,
-    "ticker": "CXGN",
+    "ticker": "cxgn",
     "potentialRewards": 1
   },
   {
@@ -36,7 +36,7 @@
     "ranking": 2,
     "retiring": null,
     "saturation": 8.34,
-    "ticker": "BKNQ",
+    "ticker": "bknq",
     "potentialRewards": 1
   },
   {
diff --git a/source/renderer/app/config/urlsConfig.ts b/source/renderer/app/config/urlsConfig.ts
index 0344d70c5b..47834dbec7 100644
--- a/source/renderer/app/config/urlsConfig.ts
+++ b/source/renderer/app/config/urlsConfig.ts
@@ -11,6 +11,7 @@ export const DEVELOPMENT_NEWS_HASH_URL = 'newsfeed.daedaluswallet.io';
 export const MAINNET_NEWS_HASH_URL = 'newsfeed.daedaluswallet.io';
 export const TESTNET_NEWS_HASH_URL = 'newsfeed.daedaluswallet.io';
 export const STAGING_NEWS_HASH_URL = 'newsfeed.daedaluswallet.io';
+export const MAINNET_SERVICING_STATION_URL = 'servicing-station.vit.iohk.io';
 export const ALLOWED_EXTERNAL_HOSTNAMES = [
   MAINNET_EXPLORER_URL,
   STAGING_EXPLORER_URL,
@@ -24,4 +25,5 @@ export const ALLOWED_EXTERNAL_HOSTNAMES = [
   TESTNET_NEWS_HASH_URL,
   STAGING_NEWS_HASH_URL,
   coingeckoConfig.hostname,
+  MAINNET_SERVICING_STATION_URL,
 ];
diff --git a/source/renderer/app/config/votingConfig.ts b/source/renderer/app/config/votingConfig.ts
index b7c0c59ce9..44d3dea8ba 100644
--- a/source/renderer/app/config/votingConfig.ts
+++ b/source/renderer/app/config/votingConfig.ts
@@ -1,19 +1,8 @@
 const { isDev } = global.environment;
-export const CURRENT_VOTING_FUND_NUMBER = 7;
-export const NEXT_VOTING_FUND_NUMBER = CURRENT_VOTING_FUND_NUMBER + 1;
 export const VOTING_REGISTRATION_MIN_WALLET_FUNDS = 500; // 500 ADA | unit: ADA
-
 export const VOTING_REGISTRATION_FEE_CALCULATION_AMOUNT = 1; // 1 ADA | unit: ADA
-
 export const VOTING_REGISTRATION_PIN_CODE_LENGTH = 4;
 export const VOTING_REGISTRATION_MIN_TRANSACTION_CONFIRMATIONS = isDev ? 2 : 10;
 export const VOTING_REGISTRATION_TRANSACTION_POLLING_INTERVAL = 1000; // 1 second | unit: milliseconds
-
 export const VOTING_PHASE_CHECK_INTERVAL = 60000; // 60 seconds | unit: milliseconds
-
-export const VOTING_SNAPSHOT_DATE = new Date('Jan 6, 2022, 11:00 UTC');
-export const VOTING_CAST_START_DATE = new Date('Jan 13, 2022, 11:00 UTC');
-export const VOTING_CAST_END_DATE = new Date('Jan 27, 2022, 11:00 UTC');
-export const VOTING_RESULTS_DATE = new Date('Feb 3, 2022');
-export const VOTING_NEW_SNAPSHOT_DATE = new Date('Apr 7, 2022, 11:00 UTC');
 export const VOTING_REWARD = 1040000; // 1,040,000 USD | Unit: dollar
diff --git a/source/renderer/app/config/walletRestoreConfig.ts b/source/renderer/app/config/walletRestoreConfig.ts
index e8b3621ca4..87f48eec24 100644
--- a/source/renderer/app/config/walletRestoreConfig.ts
+++ b/source/renderer/app/config/walletRestoreConfig.ts
@@ -1,4 +1,3 @@
-import { EnumMap } from '../types/enumTypes';
 import type {
   RestoreWalletStep,
   WalletKind,
@@ -16,17 +15,17 @@ export const RESTORE_WALLET_STEPS: Array<RestoreWalletStep> = [
   'configuration',
   'success',
 ];
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const IMPORT_WALLET_STEPS: EnumMap<string, ImportWalletStep> = {
   WALLET_IMPORT_FILE: 'WalletImportFile',
   WALLET_SELECT_IMPORT: 'WalletSelectImport',
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_KINDS: EnumMap<string, WalletKind> = {
   DAEDALUS: 'Daedalus',
   YOROI: 'Yoroi', // HARDWARE: 'Hardware',
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_DAEDALUS_KINDS: EnumMap<string, WalletDaedalusKind> =
   isMainnet
     ? {
@@ -40,24 +39,24 @@ export const WALLET_DAEDALUS_KINDS: EnumMap<string, WalletDaedalusKind> =
         SHELLEY_24_WORD: '24WordShelley',
         BYRON_27_WORD: '27WordPaper',
       };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_YOROI_KINDS: EnumMap<string, WalletYoroiKind> = {
   BYRON_15_WORD: '15WordByron',
   SHELLEY_15_WORD: '15WordShelley',
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_HARDWARE_KINDS: EnumMap<string, WalletHardwareKind> = {
   LEDGER: 'Ledger',
   TREZOR: 'Trezor',
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_DAEDALUS_WORD_COUNT: EnumMap<WalletDaedalusKind, number> = {
   [WALLET_DAEDALUS_KINDS.BYRON_12_WORD]: 12,
   [WALLET_DAEDALUS_KINDS.SHELLEY_15_WORD]: 15,
   [WALLET_DAEDALUS_KINDS.SHELLEY_24_WORD]: 24,
   [WALLET_DAEDALUS_KINDS.BYRON_27_WORD]: 27,
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_YOROI_WORD_COUNT: EnumMap<WalletYoroiKind, number> = {
   [WALLET_YOROI_KINDS.BYRON_15_WORD]: 15,
   [WALLET_YOROI_KINDS.SHELLEY_15_WORD]: 15,
@@ -70,7 +69,7 @@ export const WALLET_HARDWARE_WORD_COUNT: Record<
   [WALLET_HARDWARE_KINDS.LEDGER]: [12, 18, 24],
   [WALLET_HARDWARE_KINDS.TREZOR]: [12, 18, 24],
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const WALLET_BYRON_KINDS: EnumMap<string, WalletByronKind> = {
   ICARUS: 'icarus',
   LEDGER: 'ledger',
diff --git a/source/renderer/app/containers/MainLayout.tsx b/source/renderer/app/containers/MainLayout.tsx
index e6c231ea20..42cc0222fe 100644
--- a/source/renderer/app/containers/MainLayout.tsx
+++ b/source/renderer/app/containers/MainLayout.tsx
@@ -9,6 +9,7 @@ import TransferFundsPage from './wallet/TransferFundsPage';
 import AssetSettingsDialogContainer from './assets/AssetSettingsDialogContainer';
 import type { InjectedContainerProps } from '../types/injectedPropsType';
 import { ROUTES } from '../routes-config';
+import type { WalletSortConfig } from '../types/sidebarTypes';
 
 @inject('stores', 'actions')
 @observer
@@ -62,7 +63,16 @@ class MainLayout extends Component<InjectedContainerProps> {
                   walletId,
                 });
               },
+              onWalletSortBy: ({ sortBy }: WalletSortConfig) => {
+                sidebar.onChangeWalletSortType(sortBy);
+              },
+              onSearch: sidebar.onSearchValueUpdated,
+            },
+            walletSortConfig: {
+              sortBy: sidebar.walletSortConfig.sortBy,
+              sortOrder: sidebar.walletSortConfig.sortOrder,
             },
+            searchValue: sidebar.searchValue,
           }
         : null;
     const sidebarMenus = {
diff --git a/source/renderer/app/containers/MenuUpdater/MenuUpdater.ts b/source/renderer/app/containers/MenuUpdater/MenuUpdater.ts
new file mode 100644
index 0000000000..9941e5f5ca
--- /dev/null
+++ b/source/renderer/app/containers/MenuUpdater/MenuUpdater.ts
@@ -0,0 +1,25 @@
+import { inject, observer } from 'mobx-react';
+import { FC } from 'react';
+import { rebuildApplicationMenu } from '../../ipc/rebuild-application-menu';
+import type { MenuUpdaterProps } from './types';
+import useMenuUpdater from './useMenuUpdater';
+
+const MenuUpdaterComponent: FC<MenuUpdaterProps> = ({
+  stores: { app, profile, router, staking, uiDialogs },
+}) => {
+  useMenuUpdater({
+    stores: {
+      app,
+      profile,
+      router,
+      staking,
+      uiDialogs,
+    },
+    rebuildApplicationMenu,
+  });
+  return null;
+};
+
+const MenuUpdater: FC = inject('stores')(observer(MenuUpdaterComponent));
+
+export default MenuUpdater;
diff --git a/source/renderer/app/containers/MenuUpdater/index.ts b/source/renderer/app/containers/MenuUpdater/index.ts
new file mode 100644
index 0000000000..7668f1bd81
--- /dev/null
+++ b/source/renderer/app/containers/MenuUpdater/index.ts
@@ -0,0 +1 @@
+export { default as MenuUpdater } from './MenuUpdater';
diff --git a/source/renderer/app/containers/MenuUpdater/types.ts b/source/renderer/app/containers/MenuUpdater/types.ts
new file mode 100644
index 0000000000..4ad4ffcbbf
--- /dev/null
+++ b/source/renderer/app/containers/MenuUpdater/types.ts
@@ -0,0 +1,17 @@
+import type { RebuildApplicationMenu } from '../../ipc/rebuild-application-menu';
+import type { StoresMap } from '../../stores';
+
+export type StoresOfInterest = {
+  app: StoresMap['app'];
+  profile: StoresMap['profile'];
+  router: StoresMap['router'];
+  staking: StoresMap['staking'];
+  uiDialogs: StoresMap['uiDialogs'];
+};
+export type UseMenuUpdaterArgs = {
+  stores: StoresOfInterest;
+  rebuildApplicationMenu: RebuildApplicationMenu;
+};
+export type MenuUpdaterProps = {
+  stores: StoresMap;
+};
diff --git a/source/renderer/app/containers/MenuUpdater/useMenuUpdater.spec.tsx b/source/renderer/app/containers/MenuUpdater/useMenuUpdater.spec.tsx
new file mode 100644
index 0000000000..14ee169f2a
--- /dev/null
+++ b/source/renderer/app/containers/MenuUpdater/useMenuUpdater.spec.tsx
@@ -0,0 +1,250 @@
+import { render } from '@testing-library/react';
+import { RouterStore } from 'mobx-react-router';
+import React from 'react';
+import { WalletSettingsStateEnum } from '../../../../common/ipc/api';
+import { REDEEM_ITN_REWARDS_STEPS } from '../../config/stakingConfig';
+import type { RebuildApplicationMenu } from '../../ipc/rebuild-application-menu';
+import AppStore from '../../stores/AppStore';
+import ProfileStore from '../../stores/ProfileStore';
+import UiDialogsStore from '../../stores/UiDialogsStore';
+import useMenuUpdater from './useMenuUpdater';
+import { ROUTES } from '../../routes-config';
+import type { UseMenuUpdaterArgs } from './types';
+import StakingStore from '../../stores/StakingStore';
+
+const makeApp = ({ activeDialog = false } = {}): AppStore =>
+  ({
+    activeDialog: activeDialog ? 'SOME_DIALOG' : null,
+  } as any);
+
+const makeProfile = ({
+  currentLocale = 'en',
+  areTermsOfUseAccepted = false,
+} = {}): ProfileStore =>
+  ({
+    currentLocale,
+    areTermsOfUseAccepted,
+  } as any);
+
+const makeRouter = ({ pathname = ROUTES.WALLETS.ROOT } = {}): RouterStore =>
+  ({
+    location: {
+      pathname,
+    },
+  } as any);
+
+const makeStaking = ({ redeemOpen = false } = {}): StakingStore =>
+  ({
+    redeemStep: redeemOpen ? REDEEM_ITN_REWARDS_STEPS.CONFIGURATION : null,
+  } as any);
+
+const makeUiDialogs = ({ activeDialog = false } = {}): UiDialogsStore =>
+  ({
+    activeDialog: activeDialog ? () => {} : null,
+  } as any);
+
+const makeRebuildApplicationMenu = ({
+  send = () => {},
+} = {}): RebuildApplicationMenu =>
+  ({
+    send,
+  } as any);
+
+const Component = (props) => {
+  useMenuUpdater(props);
+  return null;
+};
+
+const renderComponent = (props) => {
+  const { rerender } = render(<Component {...props} />);
+  return {
+    rerender: (nextProps) => rerender(<Component {...nextProps} />),
+  };
+};
+
+const defaultArgs: UseMenuUpdaterArgs = {
+  stores: {
+    app: makeApp(),
+    profile: makeProfile(),
+    router: makeRouter(),
+    staking: makeStaking(),
+    uiDialogs: makeUiDialogs(),
+  },
+  rebuildApplicationMenu: makeRebuildApplicationMenu(),
+};
+describe('useMenuUpdater', () => {
+  it('sends rebuildApplicationMenu IPC channel message', () => {
+    const send = jest.fn();
+    renderComponent({
+      ...defaultArgs,
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+    expect(send).toHaveBeenCalledTimes(1);
+    expect(send).toHaveBeenNthCalledWith(1, {
+      isNavigationEnabled: expect.any(Boolean),
+      walletSettingsState: expect.any(String),
+    });
+  });
+  it('sends isNavigationEnabled value according to termsOfUseAcceptance', () => {
+    const send = jest.fn();
+    renderComponent({
+      ...defaultArgs,
+      stores: {
+        ...defaultArgs.stores,
+        profile: makeProfile({
+          areTermsOfUseAccepted: true,
+        }),
+      },
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+    expect(send.mock.calls[0][0]).toHaveProperty('isNavigationEnabled', true);
+  });
+  it('watches on the profile.currentLocale property changes', () => {
+    const send = jest.fn();
+    const makeArgs = (profile) => ({
+      ...defaultArgs,
+      stores: {
+        ...defaultArgs.stores,
+        profile,
+      },
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+
+    const { rerender } = renderComponent(makeArgs(makeProfile()));
+    rerender(makeArgs(makeProfile({ currentLocale: 'jp' })));
+
+    expect(send).toHaveBeenCalledTimes(2);
+  });
+  it('sends walletSettingsState hidden when it is not a wallet page', () => {
+    const send = jest.fn();
+    renderComponent({
+      ...defaultArgs,
+      stores: {
+        ...defaultArgs.stores,
+        router: makeRouter({
+          pathname: '/not-a-wallet-page',
+        }),
+      },
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+    expect(send.mock.calls[0][0]).toHaveProperty(
+      'walletSettingsState',
+      WalletSettingsStateEnum.hidden
+    );
+  });
+  it('sends walletSettingsState enabled when it is one of a wallet pages', () => {
+    const send = jest.fn();
+    renderComponent({
+      ...defaultArgs,
+      stores: {
+        ...defaultArgs.stores,
+        router: makeRouter({
+          pathname: ROUTES.WALLETS.ADD,
+        }),
+      },
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+    expect(send.mock.calls[0][0]).toHaveProperty(
+      'walletSettingsState',
+      WalletSettingsStateEnum.enabled
+    );
+  });
+  it('sends walletSettingsState disabled when it is one of a wallet pages but a dialog is open', () => {
+    const send = jest.fn();
+    renderComponent({
+      ...defaultArgs,
+      stores: {
+        ...defaultArgs.stores,
+        router: makeRouter({
+          pathname: ROUTES.WALLETS.ADD,
+        }),
+        uiDialogs: makeUiDialogs({
+          activeDialog: true,
+        }),
+      },
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+    expect(send.mock.calls[0][0]).toHaveProperty(
+      'walletSettingsState',
+      WalletSettingsStateEnum.disabled
+    );
+  });
+  [
+    {
+      name: 'app',
+      storesOverride: {
+        app: makeApp({
+          activeDialog: true,
+        }),
+      },
+    },
+    {
+      name: 'Redeem Rewards',
+      storesOverride: {
+        staking: makeStaking({
+          redeemOpen: true,
+        }),
+      },
+    },
+    {
+      name: 'other',
+      storesOverride: {
+        uiDialogs: makeUiDialogs({
+          activeDialog: true,
+        }),
+      },
+    },
+  ].forEach(({ name, storesOverride }) => {
+    it(`sends walletSettingsState disabled when it is one of a wallet pages but ${name} dialog is open`, () => {
+      const send = jest.fn();
+      renderComponent({
+        ...defaultArgs,
+        stores: {
+          ...defaultArgs.stores,
+          router: makeRouter({
+            pathname: ROUTES.WALLETS.ADD,
+          }),
+          ...storesOverride,
+        },
+        rebuildApplicationMenu: makeRebuildApplicationMenu({
+          send,
+        }),
+      });
+      expect(send.mock.calls[0][0]).toHaveProperty(
+        'walletSettingsState',
+        WalletSettingsStateEnum.disabled
+      );
+    });
+  });
+  it('sends walletSettingsState disabled when wallet settings route is already active', () => {
+    const send = jest.fn();
+    renderComponent({
+      ...defaultArgs,
+      stores: {
+        ...defaultArgs.stores,
+        router: makeRouter({
+          pathname: ROUTES.WALLETS.SETTINGS,
+        }),
+      },
+      rebuildApplicationMenu: makeRebuildApplicationMenu({
+        send,
+      }),
+    });
+    expect(send.mock.calls[0][0]).toHaveProperty(
+      'walletSettingsState',
+      WalletSettingsStateEnum.disabled
+    );
+  });
+});
diff --git a/source/renderer/app/containers/MenuUpdater/useMenuUpdater.ts b/source/renderer/app/containers/MenuUpdater/useMenuUpdater.ts
new file mode 100644
index 0000000000..ef6957e23e
--- /dev/null
+++ b/source/renderer/app/containers/MenuUpdater/useMenuUpdater.ts
@@ -0,0 +1,48 @@
+import { useEffect } from 'react';
+import { matchPath } from 'react-router-dom';
+import { WalletSettingsStateEnum } from '../../../../common/ipc/api';
+import { ROUTES } from '../../routes-config';
+import type { UseMenuUpdaterArgs } from './types';
+
+const walletRoutes = Object.values(ROUTES.WALLETS);
+
+const useMenuUpdater = ({
+  stores: { app, profile, router, staking, uiDialogs },
+  rebuildApplicationMenu,
+}: UseMenuUpdaterArgs) => {
+  useEffect(() => {
+    let walletSettingsState = WalletSettingsStateEnum.hidden;
+    const walletSettingsOptionVisible = walletRoutes.some(
+      (path) =>
+        matchPath(router.location?.pathname, {
+          path,
+        })?.isExact
+    );
+
+    if (walletSettingsOptionVisible) {
+      const itIsTheWalletSettingsPage = matchPath(router.location?.pathname, {
+        path: ROUTES.WALLETS.SETTINGS,
+      })?.isExact;
+      const anyDialogOpen =
+        uiDialogs.activeDialog || app.activeDialog || staking.redeemStep;
+      walletSettingsState =
+        anyDialogOpen || itIsTheWalletSettingsPage
+          ? WalletSettingsStateEnum.disabled
+          : WalletSettingsStateEnum.enabled;
+    }
+
+    rebuildApplicationMenu.send({
+      isNavigationEnabled: profile.areTermsOfUseAccepted,
+      walletSettingsState,
+    });
+  }, [
+    app.activeDialog,
+    profile.areTermsOfUseAccepted,
+    profile.currentLocale,
+    router.location?.pathname,
+    staking.redeemStep,
+    uiDialogs.activeDialog,
+  ]);
+};
+
+export default useMenuUpdater;
diff --git a/source/renderer/app/containers/assets/AssetSettingsDialogContainer.tsx b/source/renderer/app/containers/assets/AssetSettingsDialogContainer.tsx
index cc900fa0ba..46b7f86eb2 100644
--- a/source/renderer/app/containers/assets/AssetSettingsDialogContainer.tsx
+++ b/source/renderer/app/containers/assets/AssetSettingsDialogContainer.tsx
@@ -13,25 +13,30 @@ class AssetSettingsDialogContainer extends Component<Props> {
     actions: null,
     stores: null,
   };
+
   handleSubmit = (asset: AssetToken, decimals: number) => {
-    const { onAssetSettingsSubmit } = this.props.actions.assets;
-    onAssetSettingsSubmit.trigger({
-      asset,
-      decimals,
-    });
+    const { assets, dialogs } = this.props.actions;
+    assets.onAssetSettingsSubmit.trigger({ asset, decimals });
+    dialogs.closeActiveDialog.trigger();
+  };
+
+  handleCancel = () => {
+    const { assets, dialogs } = this.props.actions;
+    assets.unsetEditedAsset.trigger();
+    dialogs.closeActiveDialog.trigger();
   };
 
   render() {
-    const { actions, stores } = this.props;
-    const { assets } = stores;
-    const { assets: assetsActions } = actions;
-    const { editingsAsset } = assets;
-    if (!editingsAsset) return null;
+    const { stores } = this.props;
+    const { assets, uiDialogs } = stores;
+    const { editedAsset } = assets;
+    if (!uiDialogs.isOpen(AssetSettingsDialog) || !editedAsset) return null;
+
     return (
       <AssetSettingsDialog
-        asset={editingsAsset}
+        asset={editedAsset}
         onSubmit={this.handleSubmit}
-        onCancel={assetsActions.onAssetSettingsCancel.trigger}
+        onCancel={this.handleCancel}
       />
     );
   }
diff --git a/source/renderer/app/containers/knownIssues/RTSFlagsRecommendationOverlayContainer.tsx b/source/renderer/app/containers/knownIssues/RTSFlagsRecommendationOverlayContainer.tsx
new file mode 100644
index 0000000000..57261cd13b
--- /dev/null
+++ b/source/renderer/app/containers/knownIssues/RTSFlagsRecommendationOverlayContainer.tsx
@@ -0,0 +1,54 @@
+import React, { Component } from 'react';
+import { observer, inject } from 'mobx-react';
+import type { InjectedDialogContainerProps } from '../../types/injectedPropsType';
+import RTSFlagsRecommendationOverlay from '../../components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay';
+
+type Props = InjectedDialogContainerProps;
+
+@inject('stores', 'actions')
+@observer
+class RTSFlagsRecommendationOverlayContainer extends Component<Props> {
+  static defaultProps = {
+    actions: null,
+    stores: null,
+    children: null,
+    onClose: () => null,
+  };
+  onConfirm = () => {
+    this.props.actions.networkStatus.toggleRTSFlagsMode.trigger();
+    this.props.actions.profile.acknowledgeRTSModeRecommendation.trigger();
+  };
+  onClose = () => {
+    this.props.actions.profile.acknowledgeRTSModeRecommendation.trigger();
+  };
+  shouldRender = () => {
+    if (
+      this.props.stores.networkStatus.environment.hasMetHardwareRequirements ||
+      !this.props.stores.profile.areTermsOfUseAccepted ||
+      this.props.stores.networkStatus.isRTSFlagsModeEnabled
+    ) {
+      return false;
+    }
+
+    return !this.props.stores.profile.isRTSModeRecommendationAcknowledged;
+  };
+
+  render() {
+    if (!this.shouldRender()) {
+      return null;
+    }
+
+    return (
+      <RTSFlagsRecommendationOverlay
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+        isRTSFlagsModeEnabled={
+          this.props.stores.networkStatus.isRTSFlagsModeEnabled
+        }
+        onClose={this.onClose}
+        onConfirm={this.onConfirm}
+      />
+    );
+  }
+}
+
+export default RTSFlagsRecommendationOverlayContainer;
diff --git a/source/renderer/app/containers/knownIssues/ToggleRTSFlagsDialogContainer.tsx b/source/renderer/app/containers/knownIssues/ToggleRTSFlagsDialogContainer.tsx
new file mode 100644
index 0000000000..0b0114efde
--- /dev/null
+++ b/source/renderer/app/containers/knownIssues/ToggleRTSFlagsDialogContainer.tsx
@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+import { observer, inject } from 'mobx-react';
+import type { InjectedDialogContainerProps } from '../../types/injectedPropsType';
+import ToggleRTSFlagsDialog from '../../components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog';
+
+type Props = InjectedDialogContainerProps;
+
+@inject('stores', 'actions')
+@observer
+class ToggleRTSFlagsDialogContainer extends Component<Props> {
+  static defaultProps = {
+    actions: null,
+    stores: null,
+    children: null,
+    onClose: () => null,
+  };
+  onConfirm = () => {
+    this.props.actions.networkStatus.toggleRTSFlagsMode.trigger();
+  };
+  onClose = () => {
+    this.props.actions.app.closeToggleRTSFlagsModeDialog.trigger();
+  };
+
+  render() {
+    return (
+      <ToggleRTSFlagsDialog
+        isRTSFlagsModeEnabled={
+          this.props.stores.networkStatus.isRTSFlagsModeEnabled
+        }
+        onClose={this.onClose}
+        onConfirm={this.onConfirm}
+      />
+    );
+  }
+}
+
+export default ToggleRTSFlagsDialogContainer;
diff --git a/source/renderer/app/containers/loading/SyncingConnectingPage.tsx b/source/renderer/app/containers/loading/SyncingConnectingPage.tsx
index dae8cf6f35..5dd28aba88 100644
--- a/source/renderer/app/containers/loading/SyncingConnectingPage.tsx
+++ b/source/renderer/app/containers/loading/SyncingConnectingPage.tsx
@@ -32,7 +32,7 @@ class LoadingSyncingConnectingPage extends Component<Props> {
       isNotEnoughDiskSpace,
       isTlsCertInvalid,
       isVerifyingBlockchain,
-      verificationProgress,
+      blockSyncProgress,
     } = networkStatus;
     const { displayAppUpdateNewsItem } = appUpdate;
     const { hasLoadedCurrentLocale, hasLoadedCurrentTheme } = profile;
@@ -71,7 +71,7 @@ class LoadingSyncingConnectingPage extends Component<Props> {
         disableDownloadLogs={app.isDownloadNotificationVisible}
         showNewsFeedIcon={!isNodeStopping && !isNodeStopped}
         isVerifyingBlockchain={isVerifyingBlockchain}
-        verificationProgress={verificationProgress}
+        blockSyncProgress={blockSyncProgress}
       />
     );
   }
diff --git a/source/renderer/app/containers/notifications/NotificationsContainer.tsx b/source/renderer/app/containers/notifications/NotificationsContainer.tsx
index 75219a0537..4ea09bfc7b 100644
--- a/source/renderer/app/containers/notifications/NotificationsContainer.tsx
+++ b/source/renderer/app/containers/notifications/NotificationsContainer.tsx
@@ -3,9 +3,7 @@ import { observer, inject } from 'mobx-react';
 import { defineMessages, FormattedHTMLMessage } from 'react-intl';
 import type { InjectedProps } from '../../types/injectedPropsType';
 import Notification from '../../components/notifications/Notification';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/success-sm... Remove this comment to see the full error message
 import successIcon from '../../assets/images/success-small.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../assets/images/spinner-da... Remove this comment to see the full error message
 import spinnerIcon from '../../assets/images/spinner-dark.inline.svg';
 import type {
   NotificationConfig,
diff --git a/source/renderer/app/containers/profile/InitialSettingsPage.tsx b/source/renderer/app/containers/profile/InitialSettingsPage.tsx
index e6da46c335..9f8e962ff2 100644
--- a/source/renderer/app/containers/profile/InitialSettingsPage.tsx
+++ b/source/renderer/app/containers/profile/InitialSettingsPage.tsx
@@ -3,7 +3,6 @@ import { inject, observer } from 'mobx-react';
 import TopBar from '../../components/layout/TopBar';
 import TopBarLayout from '../../components/layout/TopBarLayout';
 import InitialSettings from '../../components/profile/initial-settings/InitialSettings';
-import { rebuildApplicationMenu } from '../../ipc/rebuild-application-menu';
 import type { InjectedProps } from '../../types/injectedPropsType';
 
 @inject('stores', 'actions')
@@ -19,19 +18,12 @@ class InitialSettingsPage extends Component<InjectedProps> {
     finishInitialScreenSettings.trigger();
   };
   handleSelectItem = async (param: string, value: string) => {
-    const { actions, stores } = this.props;
+    const { actions } = this.props;
     const { updateUserLocalSetting } = actions.profile;
     updateUserLocalSetting.trigger({
       param,
       value,
     });
-    const { areTermsOfUseAccepted: isNavigationEnabled } = stores.profile;
-
-    if (param === 'locale') {
-      await rebuildApplicationMenu.send({
-        isNavigationEnabled,
-      });
-    }
   };
 
   render() {
diff --git a/source/renderer/app/containers/settings/categories/GeneralSettingsPage.tsx b/source/renderer/app/containers/settings/categories/GeneralSettingsPage.tsx
index f717826381..b601513620 100644
--- a/source/renderer/app/containers/settings/categories/GeneralSettingsPage.tsx
+++ b/source/renderer/app/containers/settings/categories/GeneralSettingsPage.tsx
@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { observer, inject } from 'mobx-react';
 import GeneralSettings from '../../../components/settings/categories/GeneralSettings';
-import { rebuildApplicationMenu } from '../../../ipc/rebuild-application-menu';
 import type { InjectedProps } from '../../../types/injectedPropsType';
 
 @inject('stores', 'actions')
@@ -12,19 +11,12 @@ class GeneralSettingsPage extends Component<InjectedProps> {
     stores: null,
   };
   handleSelectItem = async (param: string, value: string) => {
-    const { actions, stores } = this.props;
-    const { areTermsOfUseAccepted: isNavigationEnabled } = stores.profile;
+    const { actions } = this.props;
     const { updateUserLocalSetting } = actions.profile;
     updateUserLocalSetting.trigger({
       param,
       value,
     });
-
-    if (param === 'locale') {
-      await rebuildApplicationMenu.send({
-        isNavigationEnabled,
-      });
-    }
   };
 
   render() {
diff --git a/source/renderer/app/containers/staking/RedeemItnRewardsContainer.tsx b/source/renderer/app/containers/staking/RedeemItnRewardsContainer.tsx
index 95097c1409..bd35021362 100644
--- a/source/renderer/app/containers/staking/RedeemItnRewardsContainer.tsx
+++ b/source/renderer/app/containers/staking/RedeemItnRewardsContainer.tsx
@@ -27,6 +27,15 @@ class RedeemItnRewardsContainer extends Component<Props> {
     };
   }
 
+  componentDidMount() {
+    const { app } = this.props.stores;
+    const { closeNewsFeed } = this.props.actions.app;
+
+    if (app.newsFeedIsOpen) {
+      closeNewsFeed.trigger();
+    }
+  }
+
   render() {
     const { stores, actions } = this.props;
     const { allWallets } = stores.wallets;
diff --git a/source/renderer/app/containers/staking/StakePoolsListPage.tsx b/source/renderer/app/containers/staking/StakePoolsListPage.tsx
index cf627057c1..c2035238eb 100644
--- a/source/renderer/app/containers/staking/StakePoolsListPage.tsx
+++ b/source/renderer/app/containers/staking/StakePoolsListPage.tsx
@@ -83,6 +83,8 @@ class StakePoolsListPage extends Component<Props> {
           stake={stake}
           onDelegate={this.handleDelegate}
           isLoading={isLoading}
+          isListViewTooltipVisible={staking.stakePoolsListViewTooltipVisible}
+          onListViewVisited={staking.hideStakePoolsListViewTooltip}
           isFetching={isFetchingStakePools}
           isRanking={isRanking}
           getStakePoolById={getStakePoolById}
diff --git a/source/renderer/app/containers/staking/StakingRewardsPage.tsx b/source/renderer/app/containers/staking/StakingRewardsPage.tsx
index b8c6d02cd3..0ea2ce5511 100644
--- a/source/renderer/app/containers/staking/StakingRewardsPage.tsx
+++ b/source/renderer/app/containers/staking/StakingRewardsPage.tsx
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { observer, inject } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
-import StakingRewards from '../../components/staking/rewards/StakingRewards';
+import { StakingRewards } from '../../components/staking/rewards/StakingRewards';
 import type { InjectedProps } from '../../types/injectedPropsType';
 import { ellipsis } from '../../utils/strings';
 import { getNetworkExplorerUrl } from '../../utils/network';
diff --git a/source/renderer/app/containers/static/AboutDialog.scss b/source/renderer/app/containers/static/AboutDialog.scss
index cb6e4e5a92..718573194d 100644
--- a/source/renderer/app/containers/static/AboutDialog.scss
+++ b/source/renderer/app/containers/static/AboutDialog.scss
@@ -1,4 +1,5 @@
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers';
 
 .overlay {
   background-color: var(--theme-about-window-background-color);
@@ -9,7 +10,7 @@
   position: fixed;
   right: 0;
   top: 0;
-  z-index: 9999;
+  z-index: $dialog-z-index;
 
   &::-webkit-scrollbar-button {
     height: 21px;
diff --git a/source/renderer/app/containers/static/AboutDialog.tsx b/source/renderer/app/containers/static/AboutDialog.tsx
index d40b31cfbd..3b7eb36ab2 100644
--- a/source/renderer/app/containers/static/AboutDialog.tsx
+++ b/source/renderer/app/containers/static/AboutDialog.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { inject, observer } from 'mobx-react';
 import ReactModal from 'react-modal';
 import About from '../../components/static/About';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AboutDialog.scss' or its cor... Remove this comment to see the full error message
 import styles from './AboutDialog.scss';
 import type { InjectedDialogContainerProps } from '../../types/injectedPropsType';
 
diff --git a/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss b/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss
index f9ac6c6875..492d9e757f 100644
--- a/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss
+++ b/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.scss
@@ -1,4 +1,5 @@
 @import '../../themes/mixins/overlay-backdrop';
+@import '../../themes/mixins/layers';
 
 .overlay {
   bottom: 0;
@@ -7,7 +8,7 @@
   position: fixed;
   right: 0;
   top: 0;
-  z-index: 9999;
+  z-index: $dialog-z-index;
   @include overlay-backrop;
 
   *::-webkit-scrollbar-button {
diff --git a/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.tsx b/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.tsx
index 2e02e60fa0..acd57096cc 100644
--- a/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.tsx
+++ b/source/renderer/app/containers/status/DaedalusDiagnosticsDialog.tsx
@@ -2,10 +2,9 @@ import React, { Component } from 'react';
 import { inject, observer } from 'mobx-react';
 import ReactModal from 'react-modal';
 import DaedalusDiagnostics from '../../components/status/DaedalusDiagnostics';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DaedalusDiagnosticsDialog.sc... Remove this comment to see the full error message
 import styles from './DaedalusDiagnosticsDialog.scss';
-import { formattedBytesToSize } from '../../utils/formatters';
 import type { InjectedDialogContainerProps } from '../../types/injectedPropsType';
+import { buildSystemInfo } from '../../utils/buildSystemInfo';
 
 type Props = InjectedDialogContainerProps;
 
@@ -49,20 +48,13 @@ class DaedalusDiagnosticsDialog extends Component<Props> {
       networkTip,
       localTip,
       environment,
-      diskSpaceAvailable,
       tlsConfig,
       cardanoNodePID,
       cardanoWalletPID,
       stateDirectoryPath,
       getNetworkClockRequest,
     } = networkStatus;
-    const systemInfo = {
-      platform: environment.os,
-      platformVersion: environment.platformVersion,
-      cpu: Array.isArray(environment.cpu) ? environment.cpu[0].model : '',
-      ram: formattedBytesToSize(environment.ram),
-      availableDiskSpace: diskSpaceAvailable,
-    };
+    const systemInfo = buildSystemInfo(environment, networkStatus);
     const {
       network,
       version,
@@ -100,7 +92,7 @@ class DaedalusDiagnosticsDialog extends Component<Props> {
           systemInfo={systemInfo}
           coreInfo={coreInfo}
           cardanoNodeState={cardanoNodeState}
-          // @ts-ignore ts-migrate(2322) FIXME: Type '{ systemInfo: { platform: any; platformVersi... Remove this comment to see the full error message
+          // @ts-ignore ts-migrate(2322) FIXME: Type '{ systemInfo: SystemInfo; coreInfo: { daedal... Remove this comment to see the full error message
           isDev={environment.isDev}
           isMainnet={environment.isMainnet}
           isStaging={environment.isStaging}
diff --git a/source/renderer/app/containers/voting/VotingRegistrationPage.tsx b/source/renderer/app/containers/voting/VotingRegistrationPage.tsx
index a01b675fed..cdd9997235 100644
--- a/source/renderer/app/containers/voting/VotingRegistrationPage.tsx
+++ b/source/renderer/app/containers/voting/VotingRegistrationPage.tsx
@@ -44,6 +44,7 @@ class VotingRegistrationPage extends Component<Props> {
     if (!wallets.allWallets.length) {
       return (
         <VotingNoWallets
+          nextFundNumber={voting.fundInfo?.next?.number}
           onGoToCreateWalletClick={this.handleGoToCreateWalletClick}
           minVotingFunds={VOTING_REGISTRATION_MIN_WALLET_FUNDS}
         />
@@ -53,6 +54,7 @@ class VotingRegistrationPage extends Component<Props> {
     const { currentTimeFormat, currentDateFormat, currentLocale } = profile;
     return (
       <VotingInfo
+        fundInfo={voting.catalystFund}
         fundPhase={voting.fundPhase}
         currentLocale={currentLocale}
         currentDateFormat={currentDateFormat}
diff --git a/source/renderer/app/containers/voting/dialogs/VotingRegistrationDialogContainer.tsx b/source/renderer/app/containers/voting/dialogs/VotingRegistrationDialogContainer.tsx
index 233f9be29d..2cd3efe14d 100644
--- a/source/renderer/app/containers/voting/dialogs/VotingRegistrationDialogContainer.tsx
+++ b/source/renderer/app/containers/voting/dialogs/VotingRegistrationDialogContainer.tsx
@@ -162,6 +162,7 @@ class VotingRegistrationDialogContainer extends Component<Props, State> {
       isTransactionConfirmed,
       transactionConfirmations,
       qrCode,
+      catalystFund,
     } = voting;
     const { openExternalLink } = app;
     const {
@@ -219,9 +220,11 @@ class VotingRegistrationDialogContainer extends Component<Props, State> {
           onExternalLinkClick={openExternalLink}
           isTrezor={isTrezor}
           isHardwareWallet={isHardwareWallet}
+          nextFundNumber={catalystFund?.next?.number}
         />
         {isConfirmationDialogOpen && (
           <ConfirmationDialog
+            nextFundNumber={catalystFund?.next?.number}
             onConfirm={closeConfirmationDialog.trigger}
             onCancel={() => {
               this.props.actions.dialogs.closeActiveDialog.trigger();
diff --git a/source/renderer/app/containers/wallet/WalletSendPage.tsx b/source/renderer/app/containers/wallet/WalletSendPage.tsx
index 1d6b0470bb..f445397d52 100755
--- a/source/renderer/app/containers/wallet/WalletSendPage.tsx
+++ b/source/renderer/app/containers/wallet/WalletSendPage.tsx
@@ -6,6 +6,8 @@ import {
   MAX_INTEGER_PLACES_IN_ADA,
 } from '../../config/numbersConfig';
 import WalletSendForm from '../../components/wallet/WalletSendForm';
+import WalletSendAssetsConfirmationDialog from '../../components/wallet/send-form/WalletSendAssetsConfirmationDialog';
+import WalletTokenPicker from '../../components/wallet/tokens/wallet-token-picker/WalletTokenPicker';
 import { WALLET_ASSETS_ENABLED } from '../../config/walletsConfig';
 import Asset from '../../domains/Asset';
 import type { ApiTokens } from '../../api/assets/types';
@@ -56,15 +58,12 @@ class WalletSendPage extends Component<Props> {
       minimumAda,
     };
   };
-  openDialog = (
-    dialog: (...args: Array<any>) => any,
-    isHardwareWallet: boolean,
-    walletId: string
-  ) => {
+
+  submit = (isHardwareWallet: boolean, walletId: string) => {
     // @ts-ignore ts-migrate(2339) FIXME: Property 'isFlight' does not exist on type 'typeof... Remove this comment to see the full error message
     const { isFlight } = global;
     this.props.actions.dialogs.open.trigger({
-      dialog,
+      dialog: WalletSendAssetsConfirmationDialog,
     });
 
     if (isHardwareWallet && !isFlight) {
@@ -73,8 +72,22 @@ class WalletSendPage extends Component<Props> {
       });
     }
   };
-  getAssetByUniqueId = (uniqueId: string, allAssets: Array<Asset>) =>
-    allAssets.find((asset) => asset.uniqueId === uniqueId);
+
+  openTokenPickerDialog = () => {
+    this.props.actions.dialogs.open.trigger({
+      dialog: WalletTokenPicker,
+    });
+  };
+
+  closeTokenPickerDialog = () => {
+    const { actions, stores } = this.props;
+    if (!stores.uiDialogs.isOpen(WalletTokenPicker)) return;
+    actions.dialogs.closeActiveDialog.trigger();
+  };
+
+  getAssetByUniqueId = (uniqueId: string, allAssets: Array<Asset>) => {
+    return allAssets.find((asset) => asset.uniqueId === uniqueId);
+  };
 
   render() {
     const { stores, actions } = this.props;
@@ -91,7 +104,7 @@ class WalletSendPage extends Component<Props> {
     const { validateAmount, validateAssetAmount } = transactions;
     const { hwDeviceStatus } = hardwareWallets;
     const hasAssetsEnabled = WALLET_ASSETS_ENABLED;
-    const { all: allAssets, activeAsset, getAsset } = assetsStore;
+    const { all: allAssets, activeAsset, getAsset, favorites } = assetsStore;
     const { unsetActiveAsset } = actions.wallets;
     const selectedAsset = activeAsset
       ? this.getAssetByUniqueId(activeAsset, allAssets)
@@ -99,7 +112,7 @@ class WalletSendPage extends Component<Props> {
     // Guard against potential null values
     const wallet = wallets.active;
     if (!wallet) throw new Error('Active wallet required for WalletSendPage.');
-    const { isHardwareWallet } = wallet;
+    const { isHardwareWallet, name: walletName } = wallet;
     const walletTokens = wallet.assets.total;
     const assetTokens = getNonZeroAssetTokens(walletTokens, getAsset);
     const totalRawAssets = wallet.assets.total.length;
@@ -136,12 +149,14 @@ class WalletSendPage extends Component<Props> {
         isRestoreActive={wallet.isRestoring}
         isHardwareWallet={isHardwareWallet}
         hwDeviceStatus={hwDeviceStatus}
-        onOpenDialogAction={(params) =>
-          this.openDialog(params.dialog, isHardwareWallet, wallet.id)
-        }
+        onSubmit={() => this.submit(isHardwareWallet, wallet.id)}
         onUnsetActiveAsset={unsetActiveAsset.trigger}
         onExternalLinkClick={app.openExternalLink}
         isAddressFromSameWallet={isAddressFromSameWallet}
+        tokenFavorites={favorites}
+        walletName={walletName}
+        onTokenPickerDialogOpen={this.openTokenPickerDialog}
+        onTokenPickerDialogClose={this.closeTokenPickerDialog}
       />
     );
   }
diff --git a/source/renderer/app/containers/wallet/WalletSummaryPage.tsx b/source/renderer/app/containers/wallet/WalletSummaryPage.tsx
index f6b01a9d6f..59ce6366ce 100755
--- a/source/renderer/app/containers/wallet/WalletSummaryPage.tsx
+++ b/source/renderer/app/containers/wallet/WalletSummaryPage.tsx
@@ -2,7 +2,9 @@ import React, { Component } from 'react';
 import { take } from 'lodash';
 import { observer, inject } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
+import type { AssetToken } from '../../api/assets/types';
 import { MAX_TRANSACTIONS_ON_SUMMARY_PAGE } from '../../config/numbersConfig';
+import AssetSettingsDialog from '../../components/assets/AssetSettingsDialog';
 import WalletTransactionsList from '../../components/wallet/transactions/WalletTransactionsList';
 import WalletSummary from '../../components/wallet/summary/WalletSummary';
 import WalletNoTransactions from '../../components/wallet/transactions/WalletNoTransactions';
@@ -23,6 +25,9 @@ export const messages = defineMessages({
   },
 });
 type Props = InjectedProps;
+type OpenAssetSettingsDialogArgs = {
+  asset: AssetToken;
+};
 
 @inject('stores', 'actions')
 @observer
@@ -57,20 +62,37 @@ class WalletSummaryPage extends Component<Props> {
       },
     });
   };
+  openAssetSettingsDialog = ({ asset }: OpenAssetSettingsDialogArgs) => {
+    const { assets, dialogs } = this.props.actions;
+    assets.setEditedAsset.trigger({
+      asset,
+    });
+    dialogs.open.trigger({
+      dialog: AssetSettingsDialog,
+    });
+  };
+
+  get assetSettingsDialogWasOpened() {
+    return this.props.stores.uiDialogs.isOpen(AssetSettingsDialog);
+  }
 
   render() {
     const { intl } = this.context;
     const { stores, actions } = this.props;
-    const { app, wallets, addresses, transactions, profile, assets, currency } =
-      stores;
-    const { all, getAsset, assetSettingsDialogWasOpened, favorites } = assets;
-    const { isInternalAddress } = addresses;
     const {
-      onAssetSettingsOpen,
-      onOpenAssetSend,
-      onCopyAssetParam,
-      onToggleFavorite,
-    } = actions.assets;
+      app,
+      wallets,
+      addresses,
+      transactions,
+      profile,
+      assets,
+      currency,
+      staking,
+    } = stores;
+    const { all, getAsset, favorites } = assets;
+    const { isInternalAddress } = addresses;
+    const { onOpenAssetSend, onCopyAssetParam, onToggleFavorite } =
+      actions.assets;
     const {
       openExternalLink,
       environment: { network },
@@ -147,6 +169,7 @@ class WalletSummaryPage extends Component<Props> {
       <VerticalFlexContainer>
         <WalletSummary
           wallet={wallet}
+          reward={staking.getRewardForWallet(wallet)}
           numberOfRecentTransactions={recent.length}
           numberOfTransactions={totalAvailable}
           numberOfPendingTransactions={pendingTransactionsCount}
@@ -162,10 +185,10 @@ class WalletSummaryPage extends Component<Props> {
           currencySelected={selected}
           onCurrencySettingClick={this.handleCurrencySettingsClick}
           assets={assetTokens}
-          assetSettingsDialogWasOpened={assetSettingsDialogWasOpened}
+          assetSettingsDialogWasOpened={this.assetSettingsDialogWasOpened}
           onOpenAssetSend={onOpenAssetSend.trigger}
           onCopyAssetParam={onCopyAssetParam.trigger}
-          onAssetSettings={onAssetSettingsOpen.trigger}
+          onAssetSettings={this.openAssetSettingsDialog}
           onExternalLinkClick={app.openExternalLink}
           onViewAllButtonClick={onViewAllButtonClick}
           tokenFavorites={favorites}
diff --git a/source/renderer/app/containers/wallet/WalletTokensPage.tsx b/source/renderer/app/containers/wallet/WalletTokensPage.tsx
index 70cd4dc64e..35e94f2345 100644
--- a/source/renderer/app/containers/wallet/WalletTokensPage.tsx
+++ b/source/renderer/app/containers/wallet/WalletTokensPage.tsx
@@ -1,10 +1,15 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import { observer, inject } from 'mobx-react';
-import WalletTokens from '../../components/wallet/tokens/WalletTokens';
+import type { AssetToken } from '../../api/assets/types';
+import AssetSettingsDialog from '../../components/assets/AssetSettingsDialog';
+import WalletTokens from '../../components/wallet/tokens/wallet-tokens/WalletTokens';
 import type { InjectedProps } from '../../types/injectedPropsType';
 import { getAssetTokens } from '../../utils/assets';
 
 type Props = InjectedProps;
+type OpenAssetSettingsDialogArgs = {
+  asset: AssetToken;
+};
 const WalletTokensPage = inject(
   'stores',
   'actions'
@@ -12,17 +17,24 @@ const WalletTokensPage = inject(
   observer((props: Props) => {
     const { actions, stores } = props;
     const { assets, profile, wallets, app } = stores;
-    const {
-      all,
-      assetSettingsDialogWasOpened,
-      favorites,
-      insertingAssetUniqueId,
-      removingAssetUniqueId,
-    } = assets;
-    const { onAssetSettingsOpen, onOpenAssetSend, onToggleFavorite } =
+    const { all, favorites, insertingAssetUniqueId, removingAssetUniqueId } =
+      assets;
+    const { setEditedAsset, onOpenAssetSend, onToggleFavorite } =
       actions.assets;
+    const { open } = actions.dialogs;
     const { active: activeWallet } = wallets;
     const { currentLocale } = profile;
+    const openAssetSettingsDialog = useCallback(
+      ({ asset }: OpenAssetSettingsDialogArgs) => {
+        setEditedAsset.trigger({
+          asset,
+        });
+        open.trigger({
+          dialog: AssetSettingsDialog,
+        });
+      },
+      [open, setEditedAsset]
+    );
     // Guard against potential null values
     if (!activeWallet)
       throw new Error('Active wallet required for WalletSummaryPage.');
@@ -35,11 +47,10 @@ const WalletTokensPage = inject(
     return (
       <WalletTokens
         assets={assetTokens}
-        assetSettingsDialogWasOpened={assetSettingsDialogWasOpened}
         currentLocale={currentLocale}
         insertingAssetUniqueId={insertingAssetUniqueId}
         isLoadingAssets={isLoadingAssets}
-        onAssetSettings={onAssetSettingsOpen.trigger}
+        onAssetSettings={openAssetSettingsDialog}
         onCopyAssetParam={() => {}}
         onOpenAssetSend={onOpenAssetSend.trigger}
         onToggleFavorite={onToggleFavorite.trigger}
diff --git a/source/renderer/app/domains/ApiError.ts b/source/renderer/app/domains/ApiError.ts
index 1f393d7204..13ee1deadc 100644
--- a/source/renderer/app/domains/ApiError.ts
+++ b/source/renderer/app/domains/ApiError.ts
@@ -46,12 +46,14 @@ type KnownErrorType =
   | 'wallet_not_responding'
   | 'address_already_exists'
   | 'utxo_too_small'
-  | 'invalid_smash_server';
+  | 'invalid_smash_server'
+  | 'cannot_cover_fee';
+
 type LoggingType = {
   msg?: string;
   logError?: Record<string, any>;
 };
-type ErrorType = {
+export type ErrorType = {
   code?: KnownErrorType;
   message?: string;
 };
diff --git a/source/renderer/app/domains/Asset.ts b/source/renderer/app/domains/Asset.ts
index 77f51a74c1..d65bb55046 100644
--- a/source/renderer/app/domains/Asset.ts
+++ b/source/renderer/app/domains/Asset.ts
@@ -1,6 +1,7 @@
 import { pick } from 'lodash';
-import { observable, action } from 'mobx';
+import { observable, action, computed } from 'mobx';
 import type { Asset as AssetProps, AssetMetadata } from '../api/assets/types';
+import { hexToString } from '../utils/strings';
 
 export default class Asset {
   @observable
@@ -18,6 +19,11 @@ export default class Asset {
   @observable
   recommendedDecimals: number | null | undefined;
 
+  @computed
+  get assetNameASCII() {
+    return hexToString(this.assetName || '');
+  }
+
   constructor(props: AssetProps) {
     const { uniqueId } = props;
     Object.assign(this, props, {
diff --git a/source/renderer/app/domains/WalletTransaction.ts b/source/renderer/app/domains/WalletTransaction.ts
index 95f43bd8b4..219bd37d5a 100644
--- a/source/renderer/app/domains/WalletTransaction.ts
+++ b/source/renderer/app/domains/WalletTransaction.ts
@@ -8,14 +8,14 @@ import type {
 } from '../api/transactions/types';
 import type { Tokens } from '../api/assets/types';
 import type { TransactionMetadata } from '../types/TransactionMetadata';
-import { EnumMap } from '../types/enumTypes';
 
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const TransactionStates: EnumMap<string, TransactionState> = {
   PENDING: 'pending',
   OK: 'in_ledger',
   FAILED: 'expired',
 };
-
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
 export const TransactionTypes: EnumMap<string, TransactionType> = {
   CARD: 'card',
   EXPEND: 'expend',
diff --git a/source/renderer/app/features/discreet-mode/api/index.ts b/source/renderer/app/features/discreet-mode/api/index.ts
index 9ded49adfd..8ca6b3d258 100644
--- a/source/renderer/app/features/discreet-mode/api/index.ts
+++ b/source/renderer/app/features/discreet-mode/api/index.ts
@@ -14,16 +14,4 @@ export class DiscreetModeApi {
     this.localStorage.set(storageKeys.DISCREET_MODE_ENABLED, enabled);
   unsetDiscreetModeSettings = async () =>
     this.localStorage.unset(storageKeys.DISCREET_MODE_ENABLED);
-  getDiscreetModeSettingsTooltip = (): Promise<boolean> =>
-    this.localStorage.get(storageKeys.DISCREET_MODE_SETTINGS_TOOLTIP, true);
-  setDiscreetModeSettingsTooltip = (enabled: boolean): Promise<void> =>
-    this.localStorage.set(storageKeys.DISCREET_MODE_SETTINGS_TOOLTIP, enabled);
-  unsetDiscreetModeSettingsTooltip = (): Promise<void> =>
-    this.localStorage.unset(storageKeys.DISCREET_MODE_SETTINGS_TOOLTIP);
-  getDiscreetModeNotification = (): Promise<boolean> =>
-    this.localStorage.get(storageKeys.DISCREET_MODE_NOTIFICATION, true);
-  setDiscreetModeNotification = (enabled: boolean): Promise<void> =>
-    this.localStorage.set(storageKeys.DISCREET_MODE_NOTIFICATION, enabled);
-  unsetDiscreetModeNotification = (): Promise<void> =>
-    this.localStorage.unset(storageKeys.DISCREET_MODE_NOTIFICATION);
 }
diff --git a/source/renderer/app/features/discreet-mode/feature.ts b/source/renderer/app/features/discreet-mode/feature.ts
index b5a47357c9..f80be1f789 100644
--- a/source/renderer/app/features/discreet-mode/feature.ts
+++ b/source/renderer/app/features/discreet-mode/feature.ts
@@ -13,10 +13,6 @@ export class DiscreetMode extends Feature {
   @observable
   openInDiscreetMode = false;
   @observable
-  isSettingsTooltipEnabled = false;
-  @observable
-  isNotificationEnabled = false;
-  @observable
   getDiscreetModeSettingsRequest: Request<Promise<boolean>> = new Request(
     // @ts-ignore ts-migrate(2729) FIXME: Property 'api' is used before its initialization.
     this.api.getDiscreetModeSettings
@@ -26,24 +22,6 @@ export class DiscreetMode extends Feature {
     // @ts-ignore ts-migrate(2729) FIXME: Property 'api' is used before its initialization.
     this.api.setDiscreetModeSettings
   );
-  @observable
-  getDiscreetModeSettingsTooltipRequest: Request<Promise<boolean>> =
-    // @ts-ignore ts-migrate(2729) FIXME: Property 'api' is used before its initialization.
-    new Request(this.api.getDiscreetModeSettingsTooltip);
-  @observable
-  setDiscreetModeSettingsTooltipRequest: Request<Promise<boolean>> =
-    // @ts-ignore ts-migrate(2729) FIXME: Property 'api' is used before its initialization.
-    new Request(this.api.setDiscreetModeSettingsTooltip);
-  @observable
-  getDiscreetModeNotificationRequest: Request<Promise<boolean>> = new Request(
-    // @ts-ignore ts-migrate(2729) FIXME: Property 'api' is used before its initialization.
-    this.api.getDiscreetModeNotification
-  );
-  @observable
-  setDiscreetModeNotificationRequest: Request<Promise<boolean>> = new Request(
-    // @ts-ignore ts-migrate(2729) FIXME: Property 'api' is used before its initialization.
-    this.api.setDiscreetModeNotification
-  );
 
   constructor(api: DiscreetModeApi) {
     super();
@@ -58,24 +36,12 @@ export class DiscreetMode extends Feature {
   _setupDiscreetMode = async () => {
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.getDiscreetModeSettingsRequest.execute();
-    // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
-    await this.getDiscreetModeSettingsTooltipRequest.execute();
-    // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
-    await this.getDiscreetModeNotificationRequest.execute();
     const isDiscreetModeEnabled = this.getDiscreetModeSettingsRequest.result;
-    const isSettingsTooltipEnabled =
-      this.getDiscreetModeSettingsTooltipRequest.result;
-    const isNotificationEnabled =
-      this.getDiscreetModeNotificationRequest.result;
     runInAction('Initialize discreet mode variables', () => {
       // @ts-ignore ts-migrate(2322) FIXME: Type 'Promise<boolean>' is not assignable to type ... Remove this comment to see the full error message
       this.openInDiscreetMode = isDiscreetModeEnabled;
       // @ts-ignore ts-migrate(2322) FIXME: Type 'Promise<boolean>' is not assignable to type ... Remove this comment to see the full error message
       this.isDiscreetMode = isDiscreetModeEnabled;
-      // @ts-ignore ts-migrate(2322) FIXME: Type 'Promise<boolean>' is not assignable to type ... Remove this comment to see the full error message
-      this.isSettingsTooltipEnabled = isSettingsTooltipEnabled;
-      // @ts-ignore ts-migrate(2322) FIXME: Type 'Promise<boolean>' is not assignable to type ... Remove this comment to see the full error message
-      this.isNotificationEnabled = isNotificationEnabled;
     });
   };
   @action
@@ -91,29 +57,13 @@ export class DiscreetMode extends Feature {
       this.openInDiscreetMode = nextSetting;
     });
   };
-  @action
-  setDiscreetModeSettingsTooltip = async (enabled: boolean) => {
-    // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
-    await this.setDiscreetModeSettingsTooltipRequest.execute(enabled);
-    runInAction('Update discreet mode settings tooltip', () => {
-      this.isSettingsTooltipEnabled = enabled;
-    });
-  };
-  @action
-  setDiscreetModeNotification = async (enabled: boolean) => {
-    // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
-    await this.setDiscreetModeNotificationRequest.execute(enabled);
-    runInAction('Update discreet mode notification', () => {
-      this.isNotificationEnabled = enabled;
-    });
-  };
 
   discreetValue({
     replacer = defaultReplacer(),
     value,
   }: {
     replacer?: ReplacerFn;
-    value?: number | string;
+    value?: any;
   }) {
     return replacer(this.isDiscreetMode, SENSITIVE_DATA_SYMBOL, value);
   }
diff --git a/source/renderer/app/features/discreet-mode/replacers/defaultReplacer.ts b/source/renderer/app/features/discreet-mode/replacers/defaultReplacer.ts
index 9b863829ac..07b1b3df97 100644
--- a/source/renderer/app/features/discreet-mode/replacers/defaultReplacer.ts
+++ b/source/renderer/app/features/discreet-mode/replacers/defaultReplacer.ts
@@ -1,6 +1,8 @@
 import type { ReplacerFn } from '../types';
 
 export type DefaultReplacer = () => ReplacerFn;
-export const defaultReplacer: DefaultReplacer =
-  () => (isDiscreetMode, symbol, value) =>
-    isDiscreetMode ? symbol : value;
+export const defaultReplacer: DefaultReplacer = () => {
+  return (isDiscreetMode, symbol, value) => {
+    return isDiscreetMode ? symbol : value;
+  };
+};
diff --git a/source/renderer/app/features/discreet-mode/replacers/discreetWalletAmount.ts b/source/renderer/app/features/discreet-mode/replacers/discreetWalletAmount.ts
index 59fe21811c..544a5229bd 100644
--- a/source/renderer/app/features/discreet-mode/replacers/discreetWalletAmount.ts
+++ b/source/renderer/app/features/discreet-mode/replacers/discreetWalletAmount.ts
@@ -8,14 +8,13 @@ export type DiscreetWalletAmountProps = {
   withCurrency?: boolean;
   long?: boolean;
 };
-export const discreetWalletAmount: DiscreetValueReplacer =
-  ({
-    amount,
-    withCurrency = true,
-    long = true,
-    currency = 'ADA',
-  }: DiscreetWalletAmountProps) =>
-  (isDiscreetMode, replacement) => {
+export const discreetWalletAmount: DiscreetValueReplacer = ({
+  amount,
+  withCurrency = true,
+  long = true,
+  currency = 'ADA',
+}: DiscreetWalletAmountProps) => {
+  return (isDiscreetMode, replacement) => {
     if (!isDiscreetMode) {
       return formattedWalletAmount(amount, withCurrency, long, currency);
     }
@@ -26,3 +25,4 @@ export const discreetWalletAmount: DiscreetValueReplacer =
 
     return `${replacement} ${currency}`;
   };
+};
diff --git a/source/renderer/app/features/discreet-mode/replacers/discreetWalletTokenAmount.ts b/source/renderer/app/features/discreet-mode/replacers/discreetWalletTokenAmount.ts
index 106dd0dc2b..741227b5c2 100644
--- a/source/renderer/app/features/discreet-mode/replacers/discreetWalletTokenAmount.ts
+++ b/source/renderer/app/features/discreet-mode/replacers/discreetWalletTokenAmount.ts
@@ -9,9 +9,13 @@ export type DiscreetWalletTokenAmountProps = {
   decimals: number | null | undefined;
   isShort?: boolean;
 };
-export const discreetWalletTokenAmount: DiscreetValueReplacer =
-  ({ amount, metadata, decimals, isShort }: DiscreetWalletTokenAmountProps) =>
-  (isDiscreetMode, replacement) => {
+export const discreetWalletTokenAmount: DiscreetValueReplacer = ({
+  amount,
+  metadata,
+  decimals,
+  isShort,
+}: DiscreetWalletTokenAmountProps) => {
+  return (isDiscreetMode, replacement) => {
     if (!isDiscreetMode) {
       return formattedTokenWalletAmount(amount, metadata, decimals, isShort);
     }
@@ -24,3 +28,4 @@ export const discreetWalletTokenAmount: DiscreetValueReplacer =
 
     return `${replacement} ${ticker}`;
   };
+};
diff --git a/source/renderer/app/features/discreet-mode/ui/DiscreetValue.story.tsx b/source/renderer/app/features/discreet-mode/ui/DiscreetValue.story.tsx
index ce8b8539e8..9f07072f8e 100644
--- a/source/renderer/app/features/discreet-mode/ui/DiscreetValue.story.tsx
+++ b/source/renderer/app/features/discreet-mode/ui/DiscreetValue.story.tsx
@@ -19,7 +19,7 @@ const Toggle = observer(({ knob }: { knob: boolean }) => {
   }, [knob, feature.isDiscreetMode]);
   return null;
 });
-storiesOf('Discreet Mode/Discreet Asset Amount', module)
+storiesOf('Discreet Mode|Discreet Asset Amount', module)
   .addDecorator(withKnobs)
   .addDecorator((story) => (
     <StoryDecorator>
@@ -32,13 +32,13 @@ storiesOf('Discreet Mode/Discreet Asset Amount', module)
     <>
       {/* @ts-ignore ts-migrate(2741) FIXME: Property 'replacer' is missing in type '{ children... Remove this comment to see the full error message */}
       <DiscreetValue>123</DiscreetValue>
-      <Toggle knob={boolean('Toogle discreet mode', false)} />
+      <Toggle knob={boolean('Toggle discreet mode', false)} />
     </>
   ))
   .add('Discreet mode enabled', () => (
     <>
       {/* @ts-ignore ts-migrate(2741) FIXME: Property 'replacer' is missing in type '{ children... Remove this comment to see the full error message */}
       <DiscreetValue>123</DiscreetValue>
-      <Toggle knob={boolean('Toogle discreet mode', true)} />
+      <Toggle knob={boolean('Toggle discreet mode', true)} />
     </>
   ));
diff --git a/source/renderer/app/features/discreet-mode/ui/discreet-toggle-top-bar/DiscreetToggleTopBar.tsx b/source/renderer/app/features/discreet-mode/ui/discreet-toggle-top-bar/DiscreetToggleTopBar.tsx
index 5eaa220178..838e8aacec 100644
--- a/source/renderer/app/features/discreet-mode/ui/discreet-toggle-top-bar/DiscreetToggleTopBar.tsx
+++ b/source/renderer/app/features/discreet-mode/ui/discreet-toggle-top-bar/DiscreetToggleTopBar.tsx
@@ -3,7 +3,6 @@ import classnames from 'classnames';
 import { observer } from 'mobx-react';
 import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { injectIntl, FormattedHTMLMessage } from 'react-intl';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DiscreetToggleTopBar.scss' o... Remove this comment to see the full error message
 import styles from './DiscreetToggleTopBar.scss';
 import { messages } from './DiscreetToggleTopBar.messages';
 import { useDiscreetModeFeature } from '../../context';
@@ -16,14 +15,8 @@ type Props = {
 };
 
 const DiscreetToggleTopBar = ({ intl, hasTadaIcon }: Props) => {
-  const {
-    isDiscreetMode,
-    isSettingsTooltipEnabled,
-    toggleDiscreetMode,
-    setDiscreetModeSettingsTooltip,
-  } = useDiscreetModeFeature();
+  const { isDiscreetMode, toggleDiscreetMode } = useDiscreetModeFeature();
   const [visible, setVisible] = useState(false);
-  const isPopOverVisible = visible || isSettingsTooltipEnabled;
   return (
     <div
       className={classnames(styles.root, hasTadaIcon && styles.hasTadaIcon)}
@@ -32,7 +25,7 @@ const DiscreetToggleTopBar = ({ intl, hasTadaIcon }: Props) => {
     >
       <PopOver
         appendTo="parent"
-        visible={isPopOverVisible}
+        visible={visible}
         className={styles.popOverRoot}
         content={
           <span className={styles.content}>
@@ -45,13 +38,7 @@ const DiscreetToggleTopBar = ({ intl, hasTadaIcon }: Props) => {
         <DiscreetModeToggleComponent
           className={styles.discreetToggle}
           isDiscreetMode={isDiscreetMode}
-          onToggle={() => {
-            toggleDiscreetMode();
-
-            if (isSettingsTooltipEnabled) {
-              setDiscreetModeSettingsTooltip(false);
-            }
-          }}
+          onToggle={toggleDiscreetMode}
         />
       </PopOver>
     </div>
diff --git a/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.story.tsx b/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.story.tsx
index 7b8cafbd7c..2a7dd3930d 100644
--- a/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.story.tsx
+++ b/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.story.tsx
@@ -4,7 +4,7 @@ import { withKnobs } from '@storybook/addon-knobs';
 import { action } from '@storybook/addon-actions';
 import { DiscreetModeToggleComponent } from './DiscreetModeToggle';
 
-storiesOf('Discreet Mode/Discreet Mode Toggle', module)
+storiesOf('Discreet Mode|Discreet Mode Toggle', module)
   .addDecorator(withKnobs)
   .add('Main', () => (
     <div
diff --git a/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.tsx b/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.tsx
index b860637b4f..c01767afc6 100644
--- a/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.tsx
+++ b/source/renderer/app/features/discreet-mode/ui/discreet-toggle/DiscreetModeToggle.tsx
@@ -8,7 +8,6 @@ import revealIcon from '../../../../assets/images/reveal-key.inline.svg';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../assets/images/hide... Remove this comment to see the full error message
 import hideIcon from '../../../../assets/images/hide-key.inline.svg';
 import { useDiscreetModeFeature } from '../../context';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './DiscreetModeToggle.scss' or ... Remove this comment to see the full error message
 import styles from './DiscreetModeToggle.scss';
 
 export const DiscreetModeToggleComponent = ({
@@ -19,18 +18,20 @@ export const DiscreetModeToggleComponent = ({
   className?: string;
   isDiscreetMode: boolean;
   onToggle: () => void;
-}) => (
-  <button
-    className={classNames(styles.root, className)}
-    onClick={onToggle}
-    aria-label="discreetModeToggle"
-  >
-    <SVGInline
-      svg={isDiscreetMode ? hideIcon : revealIcon}
-      className={classNames(styles.icon, isDiscreetMode && styles.hideIcon)}
-    />
-  </button>
-);
+}) => {
+  return (
+    <button
+      className={classNames(styles.root, className)}
+      onClick={onToggle}
+      aria-label="discreetModeToggle"
+    >
+      <SVGInline
+        svg={isDiscreetMode ? hideIcon : revealIcon}
+        className={classNames(styles.icon, isDiscreetMode && styles.hideIcon)}
+      />
+    </button>
+  );
+};
 type Props = {
   className: string;
 };
diff --git a/source/renderer/app/i18n/LocalizableError.ts b/source/renderer/app/i18n/LocalizableError.ts
index 9b809da060..3077816138 100644
--- a/source/renderer/app/i18n/LocalizableError.ts
+++ b/source/renderer/app/i18n/LocalizableError.ts
@@ -1,16 +1,19 @@
 import ExtendableError from 'es6-error';
 import type { ReactIntlMessageShape } from './types';
 
+type KnownErrorType =
+  'api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens';
+
 export default class LocalizableError extends ExtendableError {
+  id: KnownErrorType | string;
+  defaultMessage: string;
+  values?: Record<string, any>;
   constructor({ id, defaultMessage, values = {} }: ReactIntlMessageShape) {
     if (!id) throw new Error('id:string is required.');
     if (!defaultMessage) throw new Error('defaultMessage:string is required.');
     super(`${id}: ${JSON.stringify(values)}`);
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'id' does not exist on type 'LocalizableE... Remove this comment to see the full error message
     this.id = id;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'defaultMessage' does not exist on type '... Remove this comment to see the full error message
     this.defaultMessage = defaultMessage;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'values' does not exist on type 'Localiza... Remove this comment to see the full error message
     this.values = values;
   }
 }
diff --git a/source/renderer/app/i18n/locales/babeledit-project.babel b/source/renderer/app/i18n/locales/babeledit-project.babel
index b695196bc2..126f20a139 100755
--- a/source/renderer/app/i18n/locales/babeledit-project.babel
+++ b/source/renderer/app/i18n/locales/babeledit-project.babel
@@ -20404,7 +20404,7 @@
                                                 </translations>
                                             </concept_node>
                                             <concept_node>
-                                                <name>unamedWalletsTitle</name>
+                                                <name>unnamedWalletsTitle</name>
                                                 <definition_loaded>false</definition_loaded>
                                                 <description></description>
                                                 <comment></comment>
@@ -26448,7 +26448,7 @@
                 </translations>
             </concept_node>
             <concept_node>
-                <name>wallet.select.import.dialog.unamedWalletsTitle</name>
+                <name>wallet.select.import.dialog.unnamedWalletsTitle</name>
                 <definition_loaded>false</definition_loaded>
                 <description></description>
                 <comment></comment>
diff --git a/source/renderer/app/i18n/locales/defaultMessages.json b/source/renderer/app/i18n/locales/defaultMessages.json
index f98618327c..ca037a45b1 100644
--- a/source/renderer/app/i18n/locales/defaultMessages.json
+++ b/source/renderer/app/i18n/locales/defaultMessages.json
@@ -285,6 +285,20 @@
           "column": 22,
           "line": 109
         }
+      },
+      {
+        "defaultMessage": "!!!Insufficient funds to support tokens. A minimum of {adaToRemain} ADA must remain in the wallet after this transaction.",
+        "description": "\"Balance after transaction would not leave enough ada in the wallet to support tokens remaining in wallet",
+        "end": {
+          "column": 3,
+          "line": 120
+        },
+        "file": "source/renderer/app/api/errors.ts",
+        "id": "api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens",
+        "start": {
+          "column": 26,
+          "line": 114
+        }
       }
     ],
     "path": "source/renderer/app/api/errors.json"
@@ -296,13 +310,13 @@
         "description": "\"title\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 27
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.title",
         "start": {
           "column": 9,
-          "line": 26
+          "line": 23
         }
       },
       {
@@ -310,13 +324,13 @@
         "description": "\"subtitle\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 33
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.subtitle",
         "start": {
           "column": 12,
-          "line": 31
+          "line": 28
         }
       },
       {
@@ -324,13 +338,13 @@
         "description": "\"checkboxLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 39
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.checkboxLabel",
         "start": {
           "column": 17,
-          "line": 37
+          "line": 34
         }
       },
       {
@@ -338,13 +352,13 @@
         "description": "\"buttonLaunchInstallerLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 44
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.button.launchInstaller.label",
         "start": {
           "column": 30,
-          "line": 43
+          "line": 40
         }
       },
       {
@@ -352,13 +366,13 @@
         "description": "\"buttonInstallUpdateLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 49
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.button.installUpdate.label",
         "start": {
           "column": 28,
-          "line": 48
+          "line": 45
         }
       },
       {
@@ -366,13 +380,13 @@
         "description": "\"manualUpdateLinkLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 54
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.postponeInstall.link.label",
         "start": {
           "column": 28,
-          "line": 53
+          "line": 50
         }
       },
       {
@@ -380,13 +394,13 @@
         "description": "\"installingUpdateLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 62
+          "line": 59
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.installingUpdate.link.label",
         "start": {
           "column": 25,
-          "line": 58
+          "line": 55
         }
       },
       {
@@ -394,13 +408,13 @@
         "description": "\"downloadProgressLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 64
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.downloadProgressLabel",
         "start": {
           "column": 25,
-          "line": 63
+          "line": 60
         }
       },
       {
@@ -408,13 +422,13 @@
         "description": "\"downloadTimeLeft\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 72
+          "line": 69
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.downloadTimeLeft",
         "start": {
           "column": 20,
-          "line": 68
+          "line": 65
         }
       },
       {
@@ -422,13 +436,13 @@
         "description": "\"downloadProgressData\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 77
+          "line": 74
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.downloadProgressData",
         "start": {
           "column": 24,
-          "line": 73
+          "line": 70
         }
       },
       {
@@ -436,13 +450,13 @@
         "description": "\"manualUpdateDescriptionError\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 80
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.description.error",
         "start": {
           "column": 32,
-          "line": 78
+          "line": 75
         }
       },
       {
@@ -450,13 +464,13 @@
         "description": "\"manualUpdateDescriptionErrorLinux\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 89
+          "line": 86
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.description.errorLinux",
         "start": {
           "column": 37,
-          "line": 84
+          "line": 81
         }
       },
       {
@@ -464,13 +478,13 @@
         "description": "\"manualUpdateDescriptionAction\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 94
+          "line": 91
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.description.action",
         "start": {
           "column": 33,
-          "line": 90
+          "line": 87
         }
       },
       {
@@ -478,13 +492,13 @@
         "description": "\"manualUpdateButtonLabel\" for the App Update Overlay",
         "end": {
           "column": 3,
-          "line": 99
+          "line": 96
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.button.label",
         "start": {
           "column": 27,
-          "line": 95
+          "line": 92
         }
       },
       {
@@ -492,13 +506,13 @@
         "description": "\"manualUpdateButtonUrl\" for the App Update Overlay on Mainnet",
         "end": {
           "column": 3,
-          "line": 105
+          "line": 102
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.button.url.mainnet",
         "start": {
           "column": 35,
-          "line": 100
+          "line": 97
         }
       },
       {
@@ -506,13 +520,13 @@
         "description": "\"manualUpdateButtonUrl\" for the App Update Overlay on Flight",
         "end": {
           "column": 3,
-          "line": 110
+          "line": 107
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.button.url.flight",
         "start": {
           "column": 34,
-          "line": 106
+          "line": 103
         }
       },
       {
@@ -520,13 +534,13 @@
         "description": "\"manualUpdateButtonUrl\" for the App Update Overlay on Testnet",
         "end": {
           "column": 3,
-          "line": 117
+          "line": 114
         },
         "file": "source/renderer/app/components/appUpdate/AppUpdateOverlay.tsx",
         "id": "appUpdate.overlay.manualUpdate.button.url.testnet",
         "start": {
           "column": 35,
-          "line": 111
+          "line": 108
         }
       }
     ],
@@ -539,13 +553,13 @@
         "description": "\"fingerprint\" item.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 20
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.fingerprint",
         "start": {
           "column": 19,
-          "line": 19
+          "line": 16
         }
       },
       {
@@ -553,13 +567,13 @@
         "description": "\"policyId\" item.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 25
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.policyId",
         "start": {
           "column": 16,
-          "line": 24
+          "line": 21
         }
       },
       {
@@ -567,13 +581,13 @@
         "description": "\"assetName\" item.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 30
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.assetName",
         "start": {
           "column": 17,
-          "line": 29
+          "line": 26
         }
       },
       {
@@ -581,13 +595,13 @@
         "description": "\"name\" item.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 35
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.name",
         "start": {
           "column": 12,
-          "line": 34
+          "line": 31
         }
       },
       {
@@ -595,13 +609,13 @@
         "description": "\"ticker\" item.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 40
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.ticker",
         "start": {
           "column": 14,
-          "line": 39
+          "line": 36
         }
       },
       {
@@ -609,13 +623,13 @@
         "description": "\"description\" item.",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 45
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.description",
         "start": {
           "column": 19,
-          "line": 44
+          "line": 41
         }
       },
       {
@@ -623,13 +637,13 @@
         "description": "\"Blank\" item value.",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 50
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.param.blank",
         "start": {
           "column": 9,
-          "line": 49
+          "line": 46
         }
       },
       {
@@ -637,13 +651,13 @@
         "description": "Asset settings pop over content",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 56
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.assetToken.settings.cogPopOver",
         "start": {
           "column": 22,
-          "line": 54
+          "line": 51
         }
       },
       {
@@ -651,13 +665,13 @@
         "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 62
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.warning.available",
         "start": {
           "column": 35,
-          "line": 60
+          "line": 57
         }
       },
       {
@@ -665,13 +679,13 @@
         "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 71
+          "line": 68
         },
         "file": "source/renderer/app/components/assets/Asset.tsx",
         "id": "assets.warning.notUsing",
         "start": {
           "column": 34,
-          "line": 66
+          "line": 63
         }
       }
     ],
@@ -684,13 +698,13 @@
         "description": "Unformatted amount",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/assets/AssetAmount.tsx",
         "id": "assets.assetAmount.unformattedAmount",
         "start": {
           "column": 21,
-          "line": 14
+          "line": 13
         }
       }
     ],
@@ -703,13 +717,13 @@
         "description": "\"fingerprint\" param.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 19
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.fingerprint",
         "start": {
           "column": 25,
-          "line": 18
+          "line": 15
         }
       },
       {
@@ -717,13 +731,13 @@
         "description": "\"policyId\" param.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 24
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.policyId",
         "start": {
           "column": 22,
-          "line": 23
+          "line": 20
         }
       },
       {
@@ -731,13 +745,13 @@
         "description": "\"assetName\" param.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 29
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.assetName",
         "start": {
           "column": 23,
-          "line": 28
+          "line": 25
         }
       },
       {
@@ -745,13 +759,13 @@
         "description": "\"name\" param.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 34
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.name",
         "start": {
           "column": 18,
-          "line": 33
+          "line": 30
         }
       },
       {
@@ -759,13 +773,13 @@
         "description": "\"ticker\" param.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 39
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.ticker",
         "start": {
           "column": 20,
-          "line": 38
+          "line": 35
         }
       },
       {
@@ -773,13 +787,13 @@
         "description": "\"description\" param.",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 44
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.description",
         "start": {
           "column": 25,
-          "line": 43
+          "line": 40
         }
       },
       {
@@ -787,13 +801,13 @@
         "description": "\"Blank\" param value.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 49
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.param.blank",
         "start": {
           "column": 9,
-          "line": 48
+          "line": 45
         }
       },
       {
@@ -801,13 +815,13 @@
         "description": "Asset settings pop over content",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 55
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.assetToken.settings.cogPopOver",
         "start": {
           "column": 22,
-          "line": 53
+          "line": 50
         }
       },
       {
@@ -815,13 +829,13 @@
         "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 61
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.warning.available",
         "start": {
           "column": 35,
-          "line": 59
+          "line": 56
         }
       },
       {
@@ -829,13 +843,13 @@
         "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 67
         },
         "file": "source/renderer/app/components/assets/AssetContent.tsx",
         "id": "assets.warning.notUsing",
         "start": {
           "column": 34,
-          "line": 65
+          "line": 62
         }
       }
     ],
@@ -848,13 +862,13 @@
         "description": "\"title\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.title",
         "start": {
           "column": 9,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -862,41 +876,41 @@
         "description": "\"description\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.description",
         "start": {
           "column": 15,
-          "line": 29
+          "line": 28
         }
       },
       {
-        "defaultMessage": "!!!Unformated amount",
+        "defaultMessage": "!!!Unformatted amount",
         "description": "\"formattedBalanceLabel\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.formattedAmount.label",
         "start": {
           "column": 25,
-          "line": 35
+          "line": 34
         }
       },
       {
-        "defaultMessage": "!!!Formated amount",
+        "defaultMessage": "!!!Formatted amount",
         "description": "\"unformattedBalanceLabel\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.unformattedAmount.label",
         "start": {
           "column": 27,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -904,13 +918,13 @@
         "description": "\"decimalPrecisionLabel\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.decimalPrecision.label",
         "start": {
           "column": 25,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -918,13 +932,13 @@
         "description": "\"recommended\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.recommended",
         "start": {
           "column": 15,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -932,13 +946,13 @@
         "description": "\"default\" for the Asset settings dialog",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 58
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.settings.dialog.default",
         "start": {
           "column": 11,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -946,13 +960,13 @@
         "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.warning.available",
         "start": {
           "column": 27,
-          "line": 60
+          "line": 59
         }
       },
       {
@@ -960,13 +974,13 @@
         "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 71
+          "line": 70
         },
         "file": "source/renderer/app/components/assets/AssetSettingsDialog.tsx",
         "id": "assets.warning.notUsing",
         "start": {
           "column": 26,
-          "line": 66
+          "line": 65
         }
       }
     ],
@@ -979,13 +993,13 @@
         "description": "\"assetLabel\" item on AssetTransactionConfirmation.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 24
         },
         "file": "source/renderer/app/components/assets/AssetTransactionConfirmation.tsx",
         "id": "asset.transactionConfirmation.assetLabel",
         "start": {
           "column": 14,
-          "line": 22
+          "line": 20
         }
       },
       {
@@ -993,13 +1007,13 @@
         "description": "\"unformattedAmountLabel\" item on AssetTransactionConfirmation.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 30
         },
         "file": "source/renderer/app/components/assets/AssetTransactionConfirmation.tsx",
         "id": "asset.transactionConfirmation.unformattedAmountLabel",
         "start": {
           "column": 26,
-          "line": 27
+          "line": 25
         }
       },
       {
@@ -1007,13 +1021,13 @@
         "description": "\"unformattedAmountMessageForHardwareWallets\" item on AssetTransactionConfirmation.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/assets/AssetTransactionConfirmation.tsx",
         "id": "asset.transactionConfirmation.unformattedAmountMessageForHardwareWallets",
         "start": {
           "column": 46,
-          "line": 33
+          "line": 31
         }
       },
       {
@@ -1027,7 +1041,7 @@
         "id": "asset.transactionConfirmation.unformattedAmountMessageForSoftwareWallets",
         "start": {
           "column": 46,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -1068,13 +1082,13 @@
         "description": "\"title\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.title",
         "start": {
           "column": 9,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -1082,13 +1096,13 @@
         "description": "\"subtitle\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.subtitle",
         "start": {
           "column": 12,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -1096,13 +1110,13 @@
         "description": "\"fromWalletLabel\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.fromWalletLabel",
         "start": {
           "column": 19,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -1110,13 +1124,13 @@
         "description": "\"receiver\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.receiver.label",
         "start": {
           "column": 17,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -1124,13 +1138,13 @@
         "description": "\"walletsDropdownPlaceholder\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.walletsDropdown.placeholder",
         "start": {
           "column": 30,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -1138,13 +1152,13 @@
         "description": "\"addWalletLabel\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.walletsDropdown.addWalletLabel",
         "start": {
           "column": 18,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -1152,13 +1166,13 @@
         "description": "\"transactionFeeLabel\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 58
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.transactionFee.label",
         "start": {
           "column": 23,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -1166,13 +1180,13 @@
         "description": "\"additionalDataLabel\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 63
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.additionalData.label",
         "start": {
           "column": 23,
-          "line": 60
+          "line": 59
         }
       },
       {
@@ -1180,13 +1194,13 @@
         "description": "\"metaDataLabel\" in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 69
+          "line": 68
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.metaData.label",
         "start": {
           "column": 17,
-          "line": 65
+          "line": 64
         }
       },
       {
@@ -1194,13 +1208,13 @@
         "description": "\"Not enough ada\" error in the dApp transaction request dialog",
         "end": {
           "column": 3,
-          "line": 76
+          "line": 75
         },
         "file": "source/renderer/app/components/dapp/DappTransactionRequest.tsx",
         "id": "dapp.transaction.request.error.notEnoughAda",
         "start": {
           "column": 35,
-          "line": 70
+          "line": 69
         }
       }
     ],
@@ -1213,13 +1227,13 @@
         "description": "\"Connect your device and enter your PIN to unlock it\" device state",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 21
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.connecting",
         "start": {
           "column": 14,
-          "line": 19
+          "line": 16
         }
       },
       {
@@ -1227,13 +1241,13 @@
         "description": "\"Connect failed\" device state",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 27
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.connecting.failed",
         "start": {
           "column": 21,
-          "line": 25
+          "line": 22
         }
       },
       {
@@ -1241,13 +1255,13 @@
         "description": "\"Connect the IOHK Trezor 1 device\" device state",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 32
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.connecting.known",
         "start": {
           "column": 20,
-          "line": 31
+          "line": 28
         }
       },
       {
@@ -1255,13 +1269,13 @@
         "description": "\"Launch Cardano application on your device\" device state",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 37
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.launching_cardano_app",
         "start": {
           "column": 25,
-          "line": 36
+          "line": 33
         }
       },
       {
@@ -1269,13 +1283,13 @@
         "description": "\"Confirm exporting your public key on your device\" device state",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 43
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.exporting_public_key",
         "start": {
           "column": 24,
-          "line": 41
+          "line": 38
         }
       },
       {
@@ -1283,13 +1297,13 @@
         "description": "\"Exporting public key failed\" device state",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 48
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.exporting_public_key_failed",
         "start": {
           "column": 31,
-          "line": 47
+          "line": 44
         }
       },
       {
@@ -1297,13 +1311,13 @@
         "description": "\"Disconnect and reconnect your device to start the process again\" device state",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 55
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.exportingPublicKeyError",
         "start": {
           "column": 27,
-          "line": 52
+          "line": 49
         }
       },
       {
@@ -1311,13 +1325,13 @@
         "description": "\"Enter passphrase if needed\" device sub-state",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 60
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.enterPassphrase",
         "start": {
           "column": 19,
-          "line": 59
+          "line": 56
         }
       },
       {
@@ -1325,13 +1339,13 @@
         "description": "\"Device ready\" device state",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 65
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.ready",
         "start": {
           "column": 9,
-          "line": 64
+          "line": 61
         }
       },
       {
@@ -1339,13 +1353,13 @@
         "description": "\"Confirm the transaction using the IOHK Trezor 1 device\" device state",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 72
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_transaction",
         "start": {
           "column": 25,
-          "line": 69
+          "line": 66
         }
       },
       {
@@ -1353,13 +1367,13 @@
         "description": "\"Transaction verification and signing failed\" device state",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 77
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_transaction_failed",
         "start": {
           "column": 32,
-          "line": 76
+          "line": 73
         }
       },
       {
@@ -1367,13 +1381,13 @@
         "description": "\"Transaction verified and signed\" device state",
         "end": {
           "column": 3,
-          "line": 85
+          "line": 82
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_transaction_succeeded",
         "start": {
           "column": 35,
-          "line": 81
+          "line": 78
         }
       },
       {
@@ -1381,13 +1395,13 @@
         "description": "\"Trezor Bridge not installed! {instructionsLink}\" device state",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 88
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.trezor_bridge_failure",
         "start": {
           "column": 25,
-          "line": 86
+          "line": 83
         }
       },
       {
@@ -1395,13 +1409,13 @@
         "description": "Trezor Bridge installation instructions link label",
         "end": {
           "column": 3,
-          "line": 96
+          "line": 93
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.trezor_bridge_failure.link.label",
         "start": {
           "column": 36,
-          "line": 92
+          "line": 89
         }
       },
       {
@@ -1409,13 +1423,13 @@
         "description": "URL for the \"Trezor Bridge\" update",
         "end": {
           "column": 3,
-          "line": 102
+          "line": 99
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.trezor_bridge_failure.link.url",
         "start": {
           "column": 34,
-          "line": 97
+          "line": 94
         }
       },
       {
@@ -1423,13 +1437,13 @@
         "description": "\"Unsupported firmware!\" device state",
         "end": {
           "column": 3,
-          "line": 107
+          "line": 104
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.wrong_firmware",
         "start": {
           "column": 18,
-          "line": 103
+          "line": 100
         }
       },
       {
@@ -1437,13 +1451,13 @@
         "description": "Firmware update installation instructions link label",
         "end": {
           "column": 3,
-          "line": 112
+          "line": 109
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.wrong_firmware.link.label",
         "start": {
           "column": 29,
-          "line": 108
+          "line": 105
         }
       },
       {
@@ -1451,13 +1465,13 @@
         "description": "URL for the \"Firmware Update\"",
         "end": {
           "column": 3,
-          "line": 118
+          "line": 115
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.wrong_firmware.link.url",
         "start": {
           "column": 27,
-          "line": 113
+          "line": 110
         }
       },
       {
@@ -1465,13 +1479,13 @@
         "description": "\"The device is not supported!\" device state",
         "end": {
           "column": 3,
-          "line": 123
+          "line": 120
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.unsupported_device",
         "start": {
           "column": 22,
-          "line": 119
+          "line": 116
         }
       },
       {
@@ -1479,13 +1493,13 @@
         "description": "\"Unsupported firmware!\" device state",
         "end": {
           "column": 3,
-          "line": 128
+          "line": 125
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.wrong_cardano_app_version",
         "start": {
           "column": 29,
-          "line": 124
+          "line": 121
         }
       },
       {
@@ -1493,13 +1507,13 @@
         "description": "Firmware update installation instructions link label",
         "end": {
           "column": 3,
-          "line": 133
+          "line": 130
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.wrong_cardano_app_version.link.label",
         "start": {
           "column": 40,
-          "line": 129
+          "line": 126
         }
       },
       {
@@ -1507,13 +1521,13 @@
         "description": "URL for the \"Firmware Update\"",
         "end": {
           "column": 3,
-          "line": 139
+          "line": 136
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.wrong_cardano_app_version.link.url",
         "start": {
           "column": 38,
-          "line": 134
+          "line": 131
         }
       },
       {
@@ -1521,13 +1535,13 @@
         "description": "\"Verify receiving address on your Hardware Wallet device",
         "end": {
           "column": 3,
-          "line": 144
+          "line": 141
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_address",
         "start": {
           "column": 21,
-          "line": 140
+          "line": 137
         }
       },
       {
@@ -1535,13 +1549,13 @@
         "description": "\"Confirm receiving address on your Hardware Wallet device",
         "end": {
           "column": 3,
-          "line": 149
+          "line": 146
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_address_confirmation",
         "start": {
           "column": 34,
-          "line": 145
+          "line": 142
         }
       },
       {
@@ -1549,13 +1563,13 @@
         "description": "\"Address verification failed\" device state",
         "end": {
           "column": 3,
-          "line": 154
+          "line": 151
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_address_failed",
         "start": {
           "column": 28,
-          "line": 150
+          "line": 147
         }
       },
       {
@@ -1563,13 +1577,13 @@
         "description": "\"Address verification aborted\" device state",
         "end": {
           "column": 3,
-          "line": 159
+          "line": 156
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_address_aborted",
         "start": {
           "column": 29,
-          "line": 155
+          "line": 152
         }
       },
       {
@@ -1577,18 +1591,182 @@
         "description": "\"Address verified\" device state",
         "end": {
           "column": 3,
-          "line": 164
+          "line": 161
         },
         "file": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.tsx",
         "id": "wallet.hardware.deviceStatus.verifying_address_succeeded",
         "start": {
           "column": 31,
-          "line": 160
+          "line": 157
         }
       }
     ],
     "path": "source/renderer/app/components/hardware-wallet/HardwareWalletStatus.json"
   },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "!!!Recommended hardware requirements status",
+        "description": "Title of the RTS flags recommendation overlay",
+        "end": {
+          "column": 3,
+          "line": 21
+        },
+        "file": "source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx",
+        "id": "knownIssues.rtsRecommendationOverlay.title",
+        "start": {
+          "column": 9,
+          "line": 17
+        }
+      },
+      {
+        "defaultMessage": "!!!<p>Your system specifications do not meet Daedalus’ recommended hardware requirements.</p><p>You can enable RAM management (RTS Flags), an experimental setting that can reduce memory usage on computers with less than 16GB of RAM.</p><p>You can enable it now by clicking the ‘Enable and quit’ button. Note that you will have to restart Daedalus for this change to take effect. To enable or disable it at any time, go to the Help menu.</p>",
+        "description": "Content of the RTS flags recommendation overlay",
+        "end": {
+          "column": 3,
+          "line": 27
+        },
+        "file": "source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx",
+        "id": "knownIssues.rtsRecommendationOverlay.content",
+        "start": {
+          "column": 11,
+          "line": 22
+        }
+      },
+      {
+        "defaultMessage": "!!!Enable and quit",
+        "description": "Enable and quit button label",
+        "end": {
+          "column": 3,
+          "line": 32
+        },
+        "file": "source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx",
+        "id": "knownIssues.rtsRecommendationOverlay.enableAndQuitButtonLabel",
+        "start": {
+          "column": 28,
+          "line": 28
+        }
+      },
+      {
+        "defaultMessage": "!!!Decide later",
+        "description": "Decide later button label",
+        "end": {
+          "column": 3,
+          "line": 37
+        },
+        "file": "source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.tsx",
+        "id": "knownIssues.rtsRecommendationOverlay.decideLaterButtonLabel",
+        "start": {
+          "column": 26,
+          "line": 33
+        }
+      }
+    ],
+    "path": "source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay.json"
+  },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "!!!Enable RTS flags (RAM management system)",
+        "description": "Headline for the RTS flags dialog - when enabling",
+        "end": {
+          "column": 3,
+          "line": 15
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.enableRtsFlagsMode.title",
+        "start": {
+          "column": 30,
+          "line": 11
+        }
+      },
+      {
+        "defaultMessage": "!!!When enabled, the Cardano node will attempt to reduce its RAM usage. You will need to restart Daedalus for this change to take effect.",
+        "description": "Main body of the dialog - when enabling",
+        "end": {
+          "column": 3,
+          "line": 21
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.enableRtsFlagsMode.explanation",
+        "start": {
+          "column": 33,
+          "line": 16
+        }
+      },
+      {
+        "defaultMessage": "!!!Enable and quit",
+        "description": "Enable RTS flags button label",
+        "end": {
+          "column": 3,
+          "line": 26
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.enableRtsFlagsMode.actionButton",
+        "start": {
+          "column": 34,
+          "line": 22
+        }
+      },
+      {
+        "defaultMessage": "!!!Disable RTS flags (RAM management system)",
+        "description": "Headline for the RTS flags dialog - when disabling",
+        "end": {
+          "column": 3,
+          "line": 31
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.disableRtsFlagsMode.title",
+        "start": {
+          "column": 31,
+          "line": 27
+        }
+      },
+      {
+        "defaultMessage": "!!!When disabled, the Cardano node will start in default mode. You will need to restart Daedalus for this change to take effect.",
+        "description": "Main body of the dialog - when disabling",
+        "end": {
+          "column": 3,
+          "line": 37
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.disableRtsFlagsMode.explanation",
+        "start": {
+          "column": 34,
+          "line": 32
+        }
+      },
+      {
+        "defaultMessage": "!!!Disable and quit",
+        "description": "Disable RTS flags button label",
+        "end": {
+          "column": 3,
+          "line": 42
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.disableRtsFlagsMode.actionButton",
+        "start": {
+          "column": 35,
+          "line": 38
+        }
+      },
+      {
+        "defaultMessage": "!!!I understand that I will need to launch Daedalus manually",
+        "description": "Manual relaunch confirmation checkbox label",
+        "end": {
+          "column": 3,
+          "line": 49
+        },
+        "file": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.tsx",
+        "id": "knownIssues.dialog.toggleRtsFlagsMode.manualRelaunchConfirmationCheckboxLabel",
+        "start": {
+          "column": 43,
+          "line": 43
+        }
+      }
+    ],
+    "path": "source/renderer/app/components/knownIssues/ToggleRTSFlagsDialog/ToggleRTSFlagsDialog.json"
+  },
   {
     "descriptors": [
       {
@@ -1596,13 +1774,13 @@
         "description": "Content of No disk space overlay",
         "end": {
           "column": 3,
-          "line": 16
+          "line": 15
         },
         "file": "source/renderer/app/components/loading/no-disk-space-error/NoDiskSpaceError.tsx",
         "id": "noDiskSpace.error.overlayContent",
         "start": {
           "column": 18,
-          "line": 11
+          "line": 10
         }
       },
       {
@@ -1610,13 +1788,13 @@
         "description": "Title of No disk space overlay",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 20
         },
         "file": "source/renderer/app/components/loading/no-disk-space-error/NoDiskSpaceError.tsx",
         "id": "noDiskSpace.error.overlayTitle",
         "start": {
           "column": 16,
-          "line": 17
+          "line": 16
         }
       }
     ],
@@ -1629,13 +1807,13 @@
         "description": "Report connecting issue text on the loading screen.",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 18
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx",
         "id": "loading.screen.reportIssue.connecting.text",
         "start": {
           "column": 29,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -1643,13 +1821,13 @@
         "description": "Open support ticket button label on the loading.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx",
         "id": "loading.screen.reportIssue.buttonLabel",
         "start": {
           "column": 26,
-          "line": 20
+          "line": 19
         }
       },
       {
@@ -1657,13 +1835,13 @@
         "description": "Read the article button label on the loading.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx",
         "id": "loading.screen.readArticle.buttonLabel",
         "start": {
           "column": 26,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -1671,13 +1849,13 @@
         "description": "Download logs button label on the loading.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx",
         "id": "loading.screen.reportIssue.downloadLogsLinkLabel",
         "start": {
           "column": 36,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -1685,13 +1863,13 @@
         "description": "Link to Open Support page",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx",
         "id": "loading.screen.reportIssue.reportIssueButtonUrl",
         "start": {
           "column": 24,
-          "line": 35
+          "line": 34
         }
       },
       {
@@ -1699,13 +1877,13 @@
         "description": "Link to connectivity issue article page",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 44
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/ReportIssue.tsx",
         "id": "loading.screen.readIssueArticle.connectivityIssueArticleUrl",
         "start": {
           "column": 31,
-          "line": 40
+          "line": 39
         }
       }
     ],
@@ -1718,13 +1896,13 @@
         "description": "Message \"Cardano node is running\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 24
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeIsRunning",
         "start": {
           "column": 17,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -1732,13 +1910,13 @@
         "description": "Message \"Node is starting\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeIsStarting",
         "start": {
           "column": 18,
-          "line": 26
+          "line": 25
         }
       },
       {
@@ -1746,13 +1924,13 @@
         "description": "Message \"Cardano node is exiting\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeIsExiting",
         "start": {
           "column": 17,
-          "line": 31
+          "line": 30
         }
       },
       {
@@ -1760,13 +1938,13 @@
         "description": "Message \"Cardano node is stopping\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeIsStopping",
         "start": {
           "column": 18,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -1774,13 +1952,13 @@
         "description": "Message \"Cardano node has stopped\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 46
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeHasStopped",
         "start": {
           "column": 18,
-          "line": 42
+          "line": 41
         }
       },
       {
@@ -1788,13 +1966,13 @@
         "description": "Message \"Cardano node is updating\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 52
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeIsUpdating",
         "start": {
           "column": 18,
-          "line": 48
+          "line": 47
         }
       },
       {
@@ -1802,13 +1980,13 @@
         "description": "Message \"Cardano node has been updated\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 58
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeHasBeenUpdated",
         "start": {
           "column": 22,
-          "line": 54
+          "line": 53
         }
       },
       {
@@ -1816,13 +1994,13 @@
         "description": "Message \"Cardano node has crashed\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeHasCrashed",
         "start": {
           "column": 18,
-          "line": 60
+          "line": 59
         }
       },
       {
@@ -1830,13 +2008,13 @@
         "description": "Message \"Cardano node has errored\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 71
+          "line": 70
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeHasErrored",
         "start": {
           "column": 18,
-          "line": 66
+          "line": 65
         }
       },
       {
@@ -1844,13 +2022,13 @@
         "description": "Message \"Cardano node is unrecoverable\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 77
+          "line": 76
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.nodeIsUnrecoverable",
         "start": {
           "column": 23,
-          "line": 72
+          "line": 71
         }
       },
       {
@@ -1858,13 +2036,13 @@
         "description": "Message \"Check your Internet connection\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 82
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.checkYourInternetConnection",
         "start": {
           "column": 31,
-          "line": 78
+          "line": 77
         }
       },
       {
@@ -1872,13 +2050,13 @@
         "description": "Message \"Cardano node is responding\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 89
+          "line": 88
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeRespondingOn",
         "start": {
           "column": 22,
-          "line": 84
+          "line": 83
         }
       },
       {
@@ -1886,13 +2064,13 @@
         "description": "Message \"Cardano node is not responding\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 95
+          "line": 94
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeRespondingOff",
         "start": {
           "column": 23,
-          "line": 90
+          "line": 89
         }
       },
       {
@@ -1900,13 +2078,13 @@
         "description": "Message \"Checking if Cardano node is responding\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 101
+          "line": 100
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeRespondingLoading",
         "start": {
           "column": 27,
-          "line": 96
+          "line": 95
         }
       },
       {
@@ -1914,13 +2092,13 @@
         "description": "Message \"Cardano node is subscribed\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 107
+          "line": 106
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeSubscribedOn",
         "start": {
           "column": 22,
-          "line": 102
+          "line": 101
         }
       },
       {
@@ -1928,13 +2106,13 @@
         "description": "Message \"Cardano node is not subscribed\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 113
+          "line": 112
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeSubscribedOff",
         "start": {
           "column": 23,
-          "line": 108
+          "line": 107
         }
       },
       {
@@ -1942,13 +2120,13 @@
         "description": "Message \"Checking if Cardano node is subscribed\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 119
+          "line": 118
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeSubscribedLoading",
         "start": {
           "column": 27,
-          "line": 114
+          "line": 113
         }
       },
       {
@@ -1956,13 +2134,13 @@
         "description": "Message \"Cardano node time is correct\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 125
+          "line": 124
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeTimeCorrectOn",
         "start": {
           "column": 23,
-          "line": 120
+          "line": 119
         }
       },
       {
@@ -1970,13 +2148,13 @@
         "description": "Message \"Cardano node time is not correct\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 130
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeTimeCorrectOff",
         "start": {
           "column": 24,
-          "line": 126
+          "line": 125
         }
       },
       {
@@ -1984,13 +2162,13 @@
         "description": "Message \"Checking if Cardano node time is correct\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 137
+          "line": 136
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeTimeCorrectLoading",
         "start": {
           "column": 28,
-          "line": 132
+          "line": 131
         }
       },
       {
@@ -1998,13 +2176,13 @@
         "description": "Message \"Cardano node is syncing\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 142
+          "line": 141
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeSyncingOn",
         "start": {
           "column": 19,
-          "line": 138
+          "line": 137
         }
       },
       {
@@ -2012,13 +2190,13 @@
         "description": "Message \"Cardano node is not syncing\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 148
+          "line": 147
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeSyncingOff",
         "start": {
           "column": 20,
-          "line": 143
+          "line": 142
         }
       },
       {
@@ -2026,13 +2204,13 @@
         "description": "Message \"Checking if Cardano node is syncing\" on the status icon tooltip",
         "end": {
           "column": 3,
-          "line": 154
+          "line": 153
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/StatusIcons.tsx",
         "id": "status.icons.isNodeSyncingLoading",
         "start": {
           "column": 24,
-          "line": 149
+          "line": 148
         }
       }
     ],
@@ -2045,27 +2223,27 @@
         "description": "Message \"Starting Cardano node\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 14
+          "line": 17
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.startingCardanoMessage",
         "start": {
           "column": 12,
-          "line": 10
+          "line": 13
         }
       },
       {
-        "defaultMessage": "!!!This process validates the integrity of local blockchain data and could take several minutes.",
+        "defaultMessage": "!!!This process validates the integrity of local blockchain data.",
         "description": "Message \"Starting Cardano node\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 23
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.startingCardanoDescription",
         "start": {
           "column": 23,
-          "line": 15
+          "line": 18
         }
       },
       {
@@ -2073,13 +2251,13 @@
         "description": "Message \"Stopping Cardano node\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 28
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.stoppingCardanoMessage",
         "start": {
           "column": 12,
-          "line": 21
+          "line": 24
         }
       },
       {
@@ -2087,13 +2265,13 @@
         "description": "Message \"Stopping Cardano node\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 34
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.stoppingCardanoDescription",
         "start": {
           "column": 23,
-          "line": 26
+          "line": 29
         }
       },
       {
@@ -2101,13 +2279,13 @@
         "description": "Message \"Cardano node stopped\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 39
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.stoppedCardanoMessage",
         "start": {
           "column": 11,
-          "line": 32
+          "line": 35
         }
       },
       {
@@ -2115,13 +2293,13 @@
         "description": "Message \"Updating Cardano node\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 44
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.updatingCardanoMessage",
         "start": {
           "column": 12,
-          "line": 37
+          "line": 40
         }
       },
       {
@@ -2129,13 +2307,13 @@
         "description": "Message \"Cardano node updated\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 49
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.updatedCardanoMessage",
         "start": {
           "column": 11,
-          "line": 42
+          "line": 45
         }
       },
       {
@@ -2143,13 +2321,13 @@
         "description": "Message \"Cardano node crashed\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 54
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.crashedCardanoMessage",
         "start": {
           "column": 11,
-          "line": 47
+          "line": 50
         }
       },
       {
@@ -2157,13 +2335,13 @@
         "description": "Message \"Unable to start Cardano node. Please submit a support request.\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 61
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.unrecoverableCardanoMessage",
         "start": {
           "column": 17,
-          "line": 52
+          "line": 55
         }
       },
       {
@@ -2171,13 +2349,13 @@
         "description": "Message \"Connecting to network\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 66
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.connectingToNetworkMessage",
         "start": {
           "column": 14,
-          "line": 59
+          "line": 62
         }
       },
       {
@@ -2185,13 +2363,13 @@
         "description": "Message \"Network connection lost - reconnecting\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 69
+          "line": 72
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.reconnectingToNetworkMessage",
         "start": {
           "column": 16,
-          "line": 64
+          "line": 67
         }
       },
       {
@@ -2199,13 +2377,13 @@
         "description": "Message \"Loading wallet data\" on the loading screen.",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 77
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.loadingWalletData",
         "start": {
           "column": 21,
-          "line": 70
+          "line": 73
         }
       },
       {
@@ -2213,31 +2391,106 @@
         "description": "The TLS cert is not valid and Daedalus should be restarted",
         "end": {
           "column": 3,
-          "line": 79
+          "line": 82
         },
         "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
         "id": "loading.screen.errors.tlsCertificateNotValidPleaseRestartError",
         "start": {
           "column": 31,
-          "line": 75
+          "line": 78
+        }
+      }
+    ],
+    "path": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.json"
+  },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "!!!Verifying on-disk blockchain state",
+        "description": "One of three progress names on the loading screen.",
+        "end": {
+          "column": 3,
+          "line": 9
+        },
+        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts",
+        "id": "loading.screen.validatingChunk",
+        "start": {
+          "column": 19,
+          "line": 5
         }
       },
       {
-        "defaultMessage": "!!!Verifying the blockchain ({verificationProgress}% complete)",
-        "description": "Message \"Verifying the blockchain (65% complete) ...\" on the loading screen.",
+        "defaultMessage": "!!!Verifying the integrity of the blockchain calculating hashes",
+        "description": "Description of one of three progress names on the loading screen.",
         "end": {
           "column": 3,
-          "line": 86
+          "line": 16
         },
-        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.tsx",
-        "id": "loading.screen.verifyingBlockchainMessage",
+        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts",
+        "id": "loading.screen.validatingChunkDescription",
         "start": {
-          "column": 23,
-          "line": 80
+          "column": 30,
+          "line": 10
+        }
+      },
+      {
+        "defaultMessage": "!!!Replaying ledger from on-disk blockchain",
+        "description": "One of three progress names on the loading screen.",
+        "end": {
+          "column": 3,
+          "line": 21
+        },
+        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts",
+        "id": "loading.screen.replayedBlock",
+        "start": {
+          "column": 17,
+          "line": 17
+        }
+      },
+      {
+        "defaultMessage": "!!!Looking for a ledger snapshot and updating (recomputing) the latest state",
+        "description": "Description of one of three progress names on the loading screen.",
+        "end": {
+          "column": 3,
+          "line": 28
+        },
+        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts",
+        "id": "loading.screen.replayedBlockDescription",
+        "start": {
+          "column": 28,
+          "line": 22
+        }
+      },
+      {
+        "defaultMessage": "!!!Syncing blockchain",
+        "description": "One of three progress names on the loading screen.",
+        "end": {
+          "column": 3,
+          "line": 33
+        },
+        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts",
+        "id": "loading.screen.pushingLedger",
+        "start": {
+          "column": 17,
+          "line": 29
+        }
+      },
+      {
+        "defaultMessage": "!!!Performing initial chain selection and finalizing blockchain state",
+        "description": "Description of one of three progress names on the loading screen.",
+        "end": {
+          "column": 3,
+          "line": 40
+        },
+        "file": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.ts",
+        "id": "loading.screen.pushingLedgerDescription",
+        "start": {
+          "column": 28,
+          "line": 34
         }
       }
     ],
-    "path": "source/renderer/app/components/loading/syncing-connecting/SyncingConnectingStatus.json"
+    "path": "source/renderer/app/components/loading/syncing-connecting/SyncingProgress/SyncingProgress.messages.json"
   },
   {
     "descriptors": [
@@ -2246,13 +2499,13 @@
         "description": "Title of Sync error overlay",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.overlayTitle",
         "start": {
           "column": 16,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -2260,13 +2513,13 @@
         "description": "First paragraph of Sync error overlay",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.overlayTextP1",
         "start": {
           "column": 17,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -2274,13 +2527,13 @@
         "description": "Second paragraph of Sync error overlay",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.overlayTextP2",
         "start": {
           "column": 17,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -2288,13 +2541,13 @@
         "description": "Text of Sync error overlay when NTP service is unreachable",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.ntpUnreachableTextP1",
         "start": {
           "column": 24,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -2302,13 +2555,13 @@
         "description": "Text of Sync error overlay when NTP service is unreachable",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.ntpUnreachableTextP2",
         "start": {
           "column": 24,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -2316,13 +2569,13 @@
         "description": "\"Support Portal\" link text",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.supportPortalLink",
         "start": {
           "column": 21,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -2330,13 +2583,13 @@
         "description": "Link to \"Machine clock out of sync with Cardano network\" support page",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 55
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.supportPortalLinkUrl",
         "start": {
           "column": 24,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -2344,13 +2597,13 @@
         "description": "Text of Check the time again button",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 60
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.onCheckTheTimeAgainLink",
         "start": {
           "column": 27,
-          "line": 57
+          "line": 56
         }
       },
       {
@@ -2358,13 +2611,13 @@
         "description": "Text of \"Continue without clock synchronization checks\" button",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 66
         },
         "file": "source/renderer/app/components/loading/system-time-error/SystemTimeError.tsx",
         "id": "systemTime.error.onContinueWithoutClockSyncCheckLink",
         "start": {
           "column": 39,
-          "line": 62
+          "line": 61
         }
       }
     ],
@@ -2377,13 +2630,13 @@
         "description": "Newsfeed is empty",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 19
         },
         "file": "source/renderer/app/components/news/NewsFeed.tsx",
         "id": "news.newsfeed.empty",
         "start": {
           "column": 17,
-          "line": 17
+          "line": 15
         }
       },
       {
@@ -2391,13 +2644,13 @@
         "description": "Trying to fetch the newsfeed...",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 24
         },
         "file": "source/renderer/app/components/news/NewsFeed.tsx",
         "id": "news.newsfeed.noFetch",
         "start": {
           "column": 19,
-          "line": 22
+          "line": 20
         }
       },
       {
@@ -2405,13 +2658,13 @@
         "description": "Newsfeed",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 29
         },
         "file": "source/renderer/app/components/news/NewsFeed.tsx",
         "id": "news.newsfeed.title",
         "start": {
           "column": 17,
-          "line": 27
+          "line": 25
         }
       }
     ],
@@ -2424,13 +2677,13 @@
         "description": "Label \"Byron\" on the legacy badge.",
         "end": {
           "column": 3,
-          "line": 13
+          "line": 12
         },
         "file": "source/renderer/app/components/notifications/LegacyBadge.tsx",
         "id": "wallet.byron.badge.label",
         "start": {
           "column": 9,
-          "line": 9
+          "line": 8
         }
       }
     ],
@@ -2443,13 +2696,13 @@
         "description": "Title \"Move funds from the legacy wallet\" on the legacy notification.",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.moveFundsTitle",
         "start": {
           "column": 18,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -2457,13 +2710,13 @@
         "description": "Title \"Create a Shelley wallet\" on the legacy notification.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.addWalletTitle",
         "start": {
           "column": 18,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -2471,13 +2724,13 @@
         "description": "Legacy notification description.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.moveFundsDescription.line1",
         "start": {
           "column": 29,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -2485,13 +2738,13 @@
         "description": "Legacy notification description.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.moveFundsDescription.line2",
         "start": {
           "column": 29,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -2499,13 +2752,13 @@
         "description": "Legacy notification link label.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 39
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.moveFundsDescription.line2.link.label",
         "start": {
           "column": 22,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -2513,13 +2766,13 @@
         "description": "Legacy notification description WithFunds.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.legacy.notification.descriptionWithFunds",
         "start": {
           "column": 24,
-          "line": 41
+          "line": 40
         }
       },
       {
@@ -2527,13 +2780,13 @@
         "description": "Legacy notification description.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 51
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.addWalletDescription.line1",
         "start": {
           "column": 29,
-          "line": 47
+          "line": 46
         }
       },
       {
@@ -2541,13 +2794,13 @@
         "description": "Legacy notification description.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 57
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.addWalletDescription.line2",
         "start": {
           "column": 29,
-          "line": 53
+          "line": 52
         }
       },
       {
@@ -2555,13 +2808,13 @@
         "description": "Learn more action of legacy notification.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 62
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.actionLearnMore",
         "start": {
           "column": 19,
-          "line": 59
+          "line": 58
         }
       },
       {
@@ -2569,13 +2822,13 @@
         "description": "Move Move ada from this wallet of legacy notification.",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 67
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.actionMove",
         "start": {
           "column": 14,
-          "line": 64
+          "line": 63
         }
       },
       {
@@ -2583,13 +2836,13 @@
         "description": "Create a new wallet action of legacy notification.",
         "end": {
           "column": 3,
-          "line": 73
+          "line": 72
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.addWallet",
         "start": {
           "column": 13,
-          "line": 69
+          "line": 68
         }
       },
       {
@@ -2597,13 +2850,13 @@
         "description": "\"Learn more\" link URL",
         "end": {
           "column": 3,
-          "line": 79
+          "line": 78
         },
         "file": "source/renderer/app/components/notifications/LegacyNotification.tsx",
         "id": "wallet.byron.notification.learnMore.url",
         "start": {
           "column": 20,
-          "line": 74
+          "line": 73
         }
       }
     ],
@@ -2616,13 +2869,13 @@
         "description": "Status message \"Wallet restore in progress\" shown while wallet is being restored.",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 17
         },
         "file": "source/renderer/app/components/notifications/RestoreNotification.tsx",
         "id": "wallet.statusMessages.activeRestore",
         "start": {
           "column": 24,
-          "line": 13
+          "line": 11
         }
       }
     ],
@@ -2635,13 +2888,13 @@
         "description": "Title for the Data Layer Migration screen.",
         "end": {
           "column": 3,
-          "line": 15
+          "line": 14
         },
         "file": "source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx",
         "id": "profile.dataLayerMigration.title",
         "start": {
           "column": 9,
-          "line": 11
+          "line": 10
         }
       },
       {
@@ -2649,13 +2902,13 @@
         "description": "Content for the Data Layer Migration screen.",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 20
         },
         "file": "source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx",
         "id": "profile.dataLayerMigration.content1",
         "start": {
           "column": 12,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -2663,13 +2916,13 @@
         "description": "Content for the Data Layer Migration screen.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx",
         "id": "profile.dataLayerMigration.content2",
         "start": {
           "column": 12,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -2677,13 +2930,13 @@
         "description": "Content for the Data Layer Migration screen.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx",
         "id": "profile.dataLayerMigration.content3",
         "start": {
           "column": 12,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -2691,13 +2944,13 @@
         "description": "Submit label for the Data Layer Migration screen.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/profile/data-layer-migration/DataLayerMigrationForm.tsx",
         "id": "profile.dataLayerMigration.submitLabel",
         "start": {
           "column": 15,
-          "line": 34
+          "line": 33
         }
       }
     ],
@@ -2710,13 +2963,13 @@
         "description": "Label for the \"I agree with terms of service\" checkbox.",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 18
         },
         "file": "source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx",
         "id": "profile.termsOfUse.checkboxLabel",
         "start": {
           "column": 17,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -2724,13 +2977,13 @@
         "description": "Label for the \"I agree with terms of service\" checkbox when terms of use are not translated.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx",
         "id": "profile.termsOfUse.checkboxLabelWithDisclaimer",
         "start": {
           "column": 31,
-          "line": 20
+          "line": 19
         }
       },
       {
@@ -2738,13 +2991,13 @@
         "description": "Label for the \"Terms of service\" form submit button.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/profile/terms-of-use/TermsOfUseForm.tsx",
         "id": "profile.termsOfUse.submitLabel",
         "start": {
           "column": 15,
-          "line": 27
+          "line": 26
         }
       }
     ],
@@ -2757,13 +3010,13 @@
         "description": "Label for the \"Theme\" selection on the display settings page.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeLabel",
         "start": {
           "column": 14,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -2771,13 +3024,13 @@
         "description": "Name of the \"Incentivized Testnet\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.incentivizedTestnet",
         "start": {
           "column": 28,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -2785,13 +3038,13 @@
         "description": "Name of the \"Light blue\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.lightBlue",
         "start": {
           "column": 18,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -2799,13 +3052,13 @@
         "description": "Name of the \"Cardano\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.cardano",
         "start": {
           "column": 16,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -2813,13 +3066,13 @@
         "description": "Name of the \"Dark blue\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.darkBlue",
         "start": {
           "column": 17,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -2827,13 +3080,13 @@
         "description": "Name of the \"Dark cardano\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.darkCardano",
         "start": {
           "column": 20,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -2841,13 +3094,13 @@
         "description": "Name of the \"Flight Candidate\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 66
+          "line": 65
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.flightCandidate",
         "start": {
           "column": 24,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -2855,13 +3108,13 @@
         "description": "Name of the \"Shelley Testnet\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 72
+          "line": 71
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.shelleyTestnet",
         "start": {
           "column": 23,
-          "line": 67
+          "line": 66
         }
       },
       {
@@ -2869,13 +3122,13 @@
         "description": "Name of the \"Yellow\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 77
+          "line": 76
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.yellow",
         "start": {
           "column": 15,
-          "line": 73
+          "line": 72
         }
       },
       {
@@ -2883,13 +3136,13 @@
         "description": "Name of the \"White\" theme on the display settings page.",
         "end": {
           "column": 3,
-          "line": 82
+          "line": 81
         },
         "file": "source/renderer/app/components/settings/categories/DisplaySettings.tsx",
         "id": "settings.display.themeNames.white",
         "start": {
           "column": 14,
-          "line": 78
+          "line": 77
         }
       }
     ],
@@ -2963,13 +3216,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.description",
         "start": {
           "column": 15,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -2977,13 +3230,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 39
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionLinkLabel",
         "start": {
           "column": 24,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -2991,13 +3244,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionLinkUrl",
         "start": {
           "column": 22,
-          "line": 41
+          "line": 40
         }
       },
       {
@@ -3005,13 +3258,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 51
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionIOHKContent1",
         "start": {
           "column": 27,
-          "line": 47
+          "line": 46
         }
       },
       {
@@ -3019,13 +3272,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 57
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionIOHKContent2",
         "start": {
           "column": 27,
-          "line": 53
+          "line": 52
         }
       },
       {
@@ -3033,13 +3286,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 62
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionIOHKLinkLabel",
         "start": {
           "column": 28,
-          "line": 59
+          "line": 58
         }
       },
       {
@@ -3047,13 +3300,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 69
+          "line": 68
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionIOHKLinkUrl",
         "start": {
           "column": 26,
-          "line": 64
+          "line": 63
         }
       },
       {
@@ -3061,13 +3314,13 @@
         "description": "description for the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 74
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.descriptionNone",
         "start": {
           "column": 19,
-          "line": 70
+          "line": 69
         }
       },
       {
@@ -3075,13 +3328,13 @@
         "description": "smashSelectLabel for the \"Smash\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 81
+          "line": 80
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.select.label",
         "start": {
           "column": 20,
-          "line": 76
+          "line": 75
         }
       },
       {
@@ -3089,13 +3342,13 @@
         "description": "smashSelectCustomServer option for the \"Smash\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 87
+          "line": 86
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.select.IOHKServer",
         "start": {
           "column": 25,
-          "line": 82
+          "line": 81
         }
       },
       {
@@ -3103,13 +3356,13 @@
         "description": "smashSelectCustomServer option for the \"Smash\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 92
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.select.direct",
         "start": {
           "column": 21,
-          "line": 88
+          "line": 87
         }
       },
       {
@@ -3117,13 +3370,13 @@
         "description": "smashSelectCustomServer option for the \"Smash\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 99
+          "line": 98
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smash.select.customServer",
         "start": {
           "column": 27,
-          "line": 94
+          "line": 93
         }
       },
       {
@@ -3131,13 +3384,13 @@
         "description": "smashURLInputLabel for the \"Smash Custom Server\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 105
+          "line": 104
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smashUrl.input.label",
         "start": {
           "column": 22,
-          "line": 100
+          "line": 99
         }
       },
       {
@@ -3145,13 +3398,13 @@
         "description": "smashUrlInputPlaceholder for the \"Smash Custom Server\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 111
+          "line": 110
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smashUrl.input.placeholder",
         "start": {
           "column": 28,
-          "line": 106
+          "line": 105
         }
       },
       {
@@ -3159,13 +3412,13 @@
         "description": "Message \"Your changes have been saved\" for inline editing (eg. on Profile Settings page).",
         "end": {
           "column": 3,
-          "line": 117
+          "line": 116
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "inline.editing.input.changesSaved",
         "start": {
           "column": 16,
-          "line": 112
+          "line": 111
         }
       },
       {
@@ -3173,13 +3426,13 @@
         "description": "invalidUrl for the \"Smash Custom Server\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 123
+          "line": 122
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smashUrl.input.invalidUrl",
         "start": {
           "column": 14,
-          "line": 118
+          "line": 117
         }
       },
       {
@@ -3187,13 +3440,13 @@
         "description": "invalidUrlPrefix for the \"Smash Custom Server\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 129
+          "line": 128
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smashUrl.input.invalidUrlPrefix",
         "start": {
           "column": 20,
-          "line": 124
+          "line": 123
         }
       },
       {
@@ -3201,13 +3454,13 @@
         "description": "invalidUrlParameter for the \"Smash Custom Server\" selection on the Stake Pools settings page.",
         "end": {
           "column": 3,
-          "line": 136
+          "line": 135
         },
         "file": "source/renderer/app/components/settings/categories/StakePoolsSettings.tsx",
         "id": "settings.stakePools.smashUrl.input.invalidUrlParameter",
         "start": {
           "column": 23,
-          "line": 130
+          "line": 129
         }
       }
     ],
@@ -3220,13 +3473,13 @@
         "description": "Title \"Help and support\" on the support settings page.",
         "end": {
           "column": 3,
-          "line": 16
+          "line": 15
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.faq.title",
         "start": {
           "column": 12,
-          "line": 12
+          "line": 11
         }
       },
       {
@@ -3234,13 +3487,13 @@
         "description": "Content for the \"Help and support\" section on the support settings page.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.faq.content",
         "start": {
           "column": 14,
-          "line": 17
+          "line": 16
         }
       },
       {
@@ -3248,13 +3501,13 @@
         "description": "\"Known Issues\" link in the \"Help and support\" section on the support settings page",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.faq.faqLink",
         "start": {
           "column": 11,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -3262,13 +3515,13 @@
         "description": "Title \"Steps for creating a support request\" on the support settings page.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.title",
         "start": {
           "column": 14,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -3276,13 +3529,13 @@
         "description": "Title \"Download the logs\" on the support settings page.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 39
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.downloadLogs.title",
         "start": {
           "column": 26,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -3290,13 +3543,13 @@
         "description": "Description of \"Download the logs\" on the support settings page.",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 46
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.downloadLogs.description",
         "start": {
           "column": 32,
-          "line": 41
+          "line": 40
         }
       },
       {
@@ -3304,13 +3557,13 @@
         "description": "\"download your logs here\" link in the Logs section on the support settings page",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 52
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.downloadLogs.link",
         "start": {
           "column": 25,
-          "line": 48
+          "line": 47
         }
       },
       {
@@ -3318,13 +3571,13 @@
         "description": "Title \"Report a problem\" on the support settings page.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 57
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.reportProblem.title",
         "start": {
           "column": 27,
-          "line": 54
+          "line": 53
         }
       },
       {
@@ -3332,13 +3585,13 @@
         "description": "Description of \"Download the logs\" on the support settings page.",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.reportProblem.description",
         "start": {
           "column": 33,
-          "line": 59
+          "line": 58
         }
       },
       {
@@ -3346,13 +3599,13 @@
         "description": "\"download your logs here\" link in the Logs section on the support settings page",
         "end": {
           "column": 3,
-          "line": 71
+          "line": 70
         },
         "file": "source/renderer/app/components/settings/categories/SupportSettings.tsx",
         "id": "settings.support.steps.reportProblem.link",
         "start": {
           "column": 26,
-          "line": 66
+          "line": 65
         }
       }
     ],
@@ -3365,13 +3618,13 @@
         "description": "titleLabel for the Currency settings in the Wallets settings page.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/settings/categories/WalletsSettings.tsx",
         "id": "settings.wallets.currency.titleLabel",
         "start": {
           "column": 22,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -3379,13 +3632,13 @@
         "description": "currencyDescription for the Currency settings in the Wallets settings page.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/settings/categories/WalletsSettings.tsx",
         "id": "settings.wallets.currency.description",
         "start": {
           "column": 23,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -3393,13 +3646,13 @@
         "description": "currencySelectLabel for the Currency settings in the Wallets settings page.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/settings/categories/WalletsSettings.tsx",
         "id": "settings.wallets.currency.selectLabel",
         "start": {
           "column": 23,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -3407,13 +3660,13 @@
         "description": "currencyDisclaimer for the Currency settings in the Wallets settings page.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 39
         },
         "file": "source/renderer/app/components/settings/categories/WalletsSettings.tsx",
         "id": "settings.wallets.currency.disclaimer",
         "start": {
           "column": 22,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -3421,13 +3674,13 @@
         "description": "currencyPoweredByLabel for the Currency settings in the Wallets settings page.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/settings/categories/WalletsSettings.tsx",
         "id": "settings.wallets.currency.poweredBy.label",
         "start": {
           "column": 26,
-          "line": 41
+          "line": 40
         }
       }
     ],
@@ -3543,13 +3796,13 @@
         "description": "Label for mainnet network with version.",
         "end": {
           "column": 3,
-          "line": 12
+          "line": 11
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.mainnetLabel",
         "start": {
           "column": 11,
-          "line": 8
+          "line": 7
         }
       },
       {
@@ -3557,13 +3810,13 @@
         "description": "Label for Daedalus Flight with version.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.daedalusFlightLabel",
         "start": {
           "column": 10,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -3571,13 +3824,13 @@
         "description": "Label for testnet with version.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.testnetLabel",
         "start": {
           "column": 11,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -3585,13 +3838,13 @@
         "description": "Label for staging network with version.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.stagingLabel",
         "start": {
           "column": 11,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -3599,13 +3852,13 @@
         "description": "Label for shelley_qa with version.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.shelleyQaLabel",
         "start": {
           "column": 14,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -3613,13 +3866,13 @@
         "description": "Label for alonzo_purple with version.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.alonzoPurpleLabel",
         "start": {
           "column": 17,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -3627,13 +3880,13 @@
         "description": "Label for selfnode with version.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 41
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.selfnodeLabel",
         "start": {
           "column": 12,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -3641,13 +3894,13 @@
         "description": "Label for development with version.",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 46
         },
         "file": "source/renderer/app/components/sidebar/SidebarCategoryNetworkInfo.tsx",
         "id": "test.environment.developmentLabel",
         "start": {
           "column": 15,
-          "line": 43
+          "line": 42
         }
       }
     ],
@@ -3656,40 +3909,124 @@
   {
     "descriptors": [
       {
-        "defaultMessage": "!!!New discreet mode settings are available in <b>Security</b> tab.",
-        "description": "Label of settings sidebar category popover notification",
+        "defaultMessage": "!!!Add wallet",
+        "description": "Label for the \"Add wallet\" button in wallet sidebar menu.",
         "end": {
           "column": 3,
-          "line": 9
+          "line": 29
         },
-        "file": "source/renderer/app/components/sidebar/SidebarCategoryWrapper.messages.ts",
-        "id": "sidebar.category.settings.notification.label",
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.addWallet",
         "start": {
-          "column": 9,
-          "line": 4
+          "column": 16,
+          "line": 25
+        }
+      },
+      {
+        "defaultMessage": "!!!Date",
+        "description": "Label for the \"Date\" sort button",
+        "end": {
+          "column": 3,
+          "line": 34
+        },
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.sortByDateButton",
+        "start": {
+          "column": 20,
+          "line": 30
+        }
+      },
+      {
+        "defaultMessage": "!!!Sort wallets by creation date",
+        "description": "Tooltip message for Date sort button",
+        "end": {
+          "column": 3,
+          "line": 39
+        },
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.sortByDateTooltip",
+        "start": {
+          "column": 21,
+          "line": 35
+        }
+      },
+      {
+        "defaultMessage": "!!!Balance",
+        "description": "Label for the \"Balance\" sort button",
+        "end": {
+          "column": 3,
+          "line": 44
+        },
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.sortByBalanceButton",
+        "start": {
+          "column": 23,
+          "line": 40
+        }
+      },
+      {
+        "defaultMessage": "!!!Sort wallets by balance",
+        "description": "Tooltip message for Balance sort button",
+        "end": {
+          "column": 3,
+          "line": 49
+        },
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.sortByBalanceTooltip",
+        "start": {
+          "column": 24,
+          "line": 45
+        }
+      },
+      {
+        "defaultMessage": "!!!A – Z",
+        "description": "Label for the \"Name\" sort button",
+        "end": {
+          "column": 3,
+          "line": 54
+        },
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.sortByNameButton",
+        "start": {
+          "column": 20,
+          "line": 50
+        }
+      },
+      {
+        "defaultMessage": "!!!Sort wallets by name",
+        "description": "Tooltip message for Name sort button",
+        "end": {
+          "column": 3,
+          "line": 59
+        },
+        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
+        "id": "sidebar.wallets.sortByNameTooltip",
+        "start": {
+          "column": 21,
+          "line": 55
         }
       }
     ],
-    "path": "source/renderer/app/components/sidebar/SidebarCategoryWrapper.messages.json"
+    "path": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.json"
   },
   {
     "descriptors": [
       {
-        "defaultMessage": "!!!Add wallet",
-        "description": "Label for the \"Add wallet\" button in wallet sidebar menu.",
+        "defaultMessage": "!!!Filter",
+        "description": "Search placeholder for the sidebar wallet menu",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 18
         },
-        "file": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.tsx",
-        "id": "sidebar.wallets.addWallet",
+        "file": "source/renderer/app/components/sidebar/wallets/WalletSearch.tsx",
+        "id": "sidebar.wallets.search.placeholder",
         "start": {
-          "column": 16,
-          "line": 17
+          "column": 15,
+          "line": 14
         }
       }
     ],
-    "path": "source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu.json"
+    "path": "source/renderer/app/components/sidebar/wallets/WalletSearch.json"
   },
   {
     "descriptors": [
@@ -3857,13 +4194,13 @@
         "description": "Headline for the Decentralisation notification.",
         "end": {
           "column": 3,
-          "line": 15
+          "line": 14
         },
         "file": "source/renderer/app/components/staking/countdown/StakingCountdown.tsx",
         "id": "staking.delegationCountdown.heading",
         "start": {
           "column": 11,
-          "line": 11
+          "line": 10
         }
       },
       {
@@ -3871,13 +4208,13 @@
         "description": "Info for the Decentralisation notification.",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 20
         },
         "file": "source/renderer/app/components/staking/countdown/StakingCountdown.tsx",
         "id": "staking.delegationCountdown.description",
         "start": {
           "column": 15,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -3885,13 +4222,13 @@
         "description": "Description for the Decentralisation notification.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/staking/countdown/StakingCountdown.tsx",
         "id": "staking.delegationCountdown.timeLeftDesc",
         "start": {
           "column": 16,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -3899,13 +4236,13 @@
         "description": "Button Label for the Decentralisation notification.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/staking/countdown/StakingCountdown.tsx",
         "id": "staking.delegationCountdown.buttonLabel",
         "start": {
           "column": 15,
-          "line": 27
+          "line": 26
         }
       }
     ],
@@ -3918,13 +4255,13 @@
         "description": "Title for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx",
         "id": "staking.delegationCenter.bodyTitle",
         "start": {
           "column": 13,
-          "line": 14
+          "line": 13
         }
       },
       {
@@ -3932,13 +4269,13 @@
         "description": "Title for the Delegation current epoch.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx",
         "id": "staking.delegationCenter.currentEpochTitle",
         "start": {
           "column": 21,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -3946,13 +4283,13 @@
         "description": "Loading stake pool message for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterBody.tsx",
         "id": "staking.delegationCenter.loadingStakePoolsMessage",
         "start": {
           "column": 28,
-          "line": 24
+          "line": 23
         }
       }
     ],
@@ -3965,13 +4302,13 @@
         "description": "Headline for the Delegation center.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx",
         "id": "staking.delegationCenter.epoch",
         "start": {
           "column": 9,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -3979,13 +4316,13 @@
         "description": "Headline for the Delegation center.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx",
         "id": "staking.delegationCenter.currentSlot",
         "start": {
           "column": 15,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -3993,13 +4330,13 @@
         "description": "Headline for the Delegation center.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx",
         "id": "staking.delegationCenter.totalSlots",
         "start": {
           "column": 14,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -4007,13 +4344,13 @@
         "description": "Headline for the Delegation center.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx",
         "id": "staking.delegationCenter.headingLeft",
         "start": {
           "column": 15,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -4021,13 +4358,13 @@
         "description": "Headline for the Delegation center.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 41
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx",
         "id": "staking.delegationCenter.headingRight",
         "start": {
           "column": 16,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -4035,13 +4372,13 @@
         "description": "Delegation description for the Delegation center.",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterHeader.tsx",
         "id": "staking.delegationCenter.description",
         "start": {
           "column": 15,
-          "line": 43
+          "line": 42
         }
       }
     ],
@@ -4054,13 +4391,13 @@
         "description": "\"No wallets\" headLine on the Delegation centre Page.",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx",
         "id": "staking.delegationCenter.noWallets.headLine",
         "start": {
           "column": 12,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -4068,13 +4405,13 @@
         "description": "\"No wallets\" instructions on the Delegation centre Page.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx",
         "id": "staking.delegationCenter.noWallets.instructions",
         "start": {
           "column": 16,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -4082,13 +4419,13 @@
         "description": "Label for \"Create New Wallet\" button on the Delegation centre Page.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/staking/delegation-center/DelegationCenterNoWallets.tsx",
         "id": "staking.delegationCenter.noWallets.createWalletButtonLabel",
         "start": {
           "column": 27,
-          "line": 25
+          "line": 24
         }
       }
     ],
@@ -4101,13 +4438,13 @@
         "description": "Amount of each wallet for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 37
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.walletAmount",
         "start": {
           "column": 16,
-          "line": 34
+          "line": 32
         }
       },
       {
@@ -4115,13 +4452,13 @@
         "description": "Undelegated label for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 42
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.notDelegated",
         "start": {
           "column": 16,
-          "line": 40
+          "line": 38
         }
       },
       {
@@ -4129,13 +4466,13 @@
         "description": "Remove delegation label for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 48
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.removeDelegation",
         "start": {
           "column": 20,
-          "line": 45
+          "line": 43
         }
       },
       {
@@ -4143,13 +4480,13 @@
         "description": "Delegated stake pool tooltip ticker for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 54
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.stakePoolTooltipTickerEpoch",
         "start": {
           "column": 26,
-          "line": 51
+          "line": 49
         }
       },
       {
@@ -4157,13 +4494,13 @@
         "description": "Delegated stake pool tooltip ticker for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 62
+          "line": 60
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.stakePoolTooltipTickerEarningRewards",
         "start": {
           "column": 35,
-          "line": 57
+          "line": 55
         }
       },
       {
@@ -4171,13 +4508,13 @@
         "description": "Delegate label for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 65
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.delegate",
         "start": {
           "column": 12,
-          "line": 63
+          "line": 61
         }
       },
       {
@@ -4185,13 +4522,13 @@
         "description": "Redelegate label for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 72
+          "line": 70
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.redelegate",
         "start": {
           "column": 14,
-          "line": 68
+          "line": 66
         }
       },
       {
@@ -4199,13 +4536,13 @@
         "description": "unknown stake pool label for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 78
+          "line": 76
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.unknownStakePoolLabel",
         "start": {
           "column": 25,
-          "line": 73
+          "line": 71
         }
       },
       {
@@ -4213,13 +4550,13 @@
         "description": "unknown stake pool label for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 84
+          "line": 82
         },
         "file": "source/renderer/app/components/staking/delegation-center/WalletRow.tsx",
         "id": "staking.delegationCenter.syncingTooltipLabel",
         "start": {
           "column": 23,
-          "line": 79
+          "line": 77
         }
       }
     ],
@@ -4260,7 +4597,7 @@
         "description": "Select / Selected pool section label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 25
+          "line": 26
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.selectStakePoolLabel",
@@ -4274,13 +4611,13 @@
         "description": "\"Selected Pools\" Selected pool label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 32
+          "line": 34
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.selectedStakePoolLabel",
         "start": {
           "column": 28,
-          "line": 26
+          "line": 27
         }
       },
       {
@@ -4288,41 +4625,41 @@
         "description": "\"Selected Pools\" Selected pool label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 39
+          "line": 42
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.selectedStakePoolLabelRetiring",
         "start": {
           "column": 36,
-          "line": 33
+          "line": 35
         }
       },
       {
-        "defaultMessage": "!!!You are already delegating <span>{selectedWalletName}</span> wallet to <span>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
+        "defaultMessage": "!!!You are already delegating <span>{selectedWalletName}</span> wallet to <span class=\"ticker\">[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
         "description": "\"You are already delegating to stake pool\" label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 46
+          "line": 50
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolLabel",
         "start": {
           "column": 29,
-          "line": 40
+          "line": 43
         }
       },
       {
-        "defaultMessage": "!!!You are already pending delegation <span>{selectedWalletName}</span> wallet to <span>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
+        "defaultMessage": "!!!You are already pending delegation <span>{selectedWalletName}</span> wallet to <span class=\"ticker\">[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
         "description": "\"You are already delegating to stake pool\" label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 53
+          "line": 58
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolNextLabel",
         "start": {
           "column": 33,
-          "line": 47
+          "line": 51
         }
       },
       {
@@ -4330,13 +4667,13 @@
         "description": "Recent \"Pool\" choice section label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 59
+          "line": 65
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.recentPoolsLabel",
         "start": {
           "column": 22,
-          "line": 54
+          "line": 59
         }
       },
       {
@@ -4344,13 +4681,13 @@
         "description": "Search \"Pools\" input label on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 66
+          "line": 73
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.searchInput.label",
         "start": {
           "column": 22,
-          "line": 60
+          "line": 66
         }
       },
       {
@@ -4358,13 +4695,13 @@
         "description": "Search \"Pools\" input placeholder on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 72
+          "line": 80
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.searchInput.placeholder",
         "start": {
           "column": 28,
-          "line": 67
+          "line": 74
         }
       },
       {
@@ -4372,13 +4709,13 @@
         "description": "Label for continue button on the delegation setup \"choose stake pool\" dialog.",
         "end": {
           "column": 5,
-          "line": 78
+          "line": 87
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.continueButtonLabel",
         "start": {
           "column": 25,
-          "line": 73
+          "line": 81
         }
       },
       {
@@ -4386,13 +4723,13 @@
         "description": "Step indicator label on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 5,
-          "line": 84
+          "line": 94
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.stepIndicatorLabel",
         "start": {
           "column": 24,
-          "line": 79
+          "line": 88
         }
       },
       {
@@ -4400,13 +4737,13 @@
         "description": "Retiring Pool Footer label on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 5,
-          "line": 91
+          "line": 102
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.messages.ts",
         "id": "staking.delegationSetup.chooseStakePool.step.dialog.retiringPoolFooter",
         "start": {
           "column": 24,
-          "line": 85
+          "line": 95
         }
       }
     ],
@@ -4419,13 +4756,13 @@
         "description": "Title \"Delegate wallet\" on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.title",
         "start": {
           "column": 9,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -4433,13 +4770,13 @@
         "description": "Description on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.description",
         "start": {
           "column": 15,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -4453,7 +4790,7 @@
         "id": "staking.delegationSetup.chooseWallet.step.dialog.selectWalletInputLabel",
         "start": {
           "column": 26,
-          "line": 35
+          "line": 34
         }
       },
       {
@@ -4461,7 +4798,7 @@
         "description": "Placeholder \"Select Wallet\" for select input on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 47
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.selectWalletInputPlaceholder",
@@ -4475,13 +4812,13 @@
         "description": "Step indicator label on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 53
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.stepIndicatorLabel",
         "start": {
           "column": 22,
-          "line": 47
+          "line": 48
         }
       },
       {
@@ -4489,13 +4826,13 @@
         "description": "errorMinDelegationFunds Error Label on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 61
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.errorMinDelegationFunds",
         "start": {
           "column": 27,
-          "line": 53
+          "line": 54
         }
       },
       {
@@ -4503,13 +4840,13 @@
         "description": "errorMinDelegationFundsRewardsOnly Error Label on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 66
+          "line": 69
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.errorMinDelegationFundsRewardsOnly",
         "start": {
           "column": 38,
-          "line": 60
+          "line": 62
         }
       },
       {
@@ -4517,13 +4854,13 @@
         "description": "RestoringWallet Error Label on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 73
+          "line": 76
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.errorRestoringWallet",
         "start": {
           "column": 24,
-          "line": 67
+          "line": 70
         }
       },
       {
@@ -4531,13 +4868,13 @@
         "description": "Label for continue button on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 79
+          "line": 82
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsChooseWalletDialog.tsx",
         "id": "staking.delegationSetup.chooseWallet.step.dialog.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 74
+          "line": 77
         }
       }
     ],
@@ -4634,7 +4971,7 @@
         "description": "Placeholder for \"spending password\"",
         "end": {
           "column": 5,
-          "line": 48
+          "line": 49
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.messages.ts",
         "id": "staking.delegationSetup.confirmation.step.dialog.spendingPasswordPlaceholder",
@@ -4648,13 +4985,13 @@
         "description": "Label for \"spending password\"",
         "end": {
           "column": 5,
-          "line": 53
+          "line": 55
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.messages.ts",
         "id": "staking.delegationSetup.confirmation.step.dialog.spendingPasswordLabel",
         "start": {
           "column": 27,
-          "line": 49
+          "line": 50
         }
       },
       {
@@ -4662,13 +4999,13 @@
         "description": "Label for continue button on the delegation setup \"confirmation\" step dialog.",
         "end": {
           "column": 5,
-          "line": 59
+          "line": 61
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.messages.ts",
         "id": "staking.delegationSetup.confirmation.step.dialog.confirmButtonLabel",
         "start": {
           "column": 24,
-          "line": 54
+          "line": 56
         }
       },
       {
@@ -4676,13 +5013,13 @@
         "description": "Label for \"Cancel\" button on the delegation setup \"confirmation\" step dialog.",
         "end": {
           "column": 5,
-          "line": 65
+          "line": 67
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.messages.ts",
         "id": "staking.delegationSetup.confirmation.step.dialog.cancelButtonLabel",
         "start": {
           "column": 23,
-          "line": 60
+          "line": 62
         }
       },
       {
@@ -4690,13 +5027,13 @@
         "description": "\"Calculating fees\" message in the \"confirmation\" dialog.",
         "end": {
           "column": 5,
-          "line": 70
+          "line": 72
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.messages.ts",
         "id": "staking.delegationSetup.confirmation.step.dialog.calculatingFees",
         "start": {
           "column": 21,
-          "line": 66
+          "line": 68
         }
       },
       {
@@ -4704,13 +5041,13 @@
         "description": "\"Calculating deposit\" message in the \"confirmation\" dialog.",
         "end": {
           "column": 5,
-          "line": 76
+          "line": 78
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsConfirmationDialog.messages.ts",
         "id": "staking.delegationSetup.confirmation.step.dialog.calculatingDeposit",
         "start": {
           "column": 24,
-          "line": 71
+          "line": 73
         }
       }
     ],
@@ -4723,13 +5060,13 @@
         "description": "Title \"Delegation Setup\" on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 20
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.title",
         "start": {
           "column": 9,
-          "line": 17
+          "line": 15
         }
       },
       {
@@ -4737,13 +5074,13 @@
         "description": "Description on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 26
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.description",
         "start": {
           "column": 15,
-          "line": 23
+          "line": 21
         }
       },
       {
@@ -4751,13 +5088,13 @@
         "description": "\"Learn more\" button label on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 32
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.learnMore.buttonLabel",
         "start": {
           "column": 24,
-          "line": 29
+          "line": 27
         }
       },
       {
@@ -4765,13 +5102,13 @@
         "description": "Steps explanation list item 1 label on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 38
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.stepsExplanation.step1",
         "start": {
           "column": 26,
-          "line": 35
+          "line": 33
         }
       },
       {
@@ -4779,13 +5116,13 @@
         "description": "Steps explanation list item 2 label on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 44
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.stepsExplanation.step2",
         "start": {
           "column": 26,
-          "line": 41
+          "line": 39
         }
       },
       {
@@ -4793,13 +5130,13 @@
         "description": "Steps explanation list item 3 label on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 50
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.stepsExplanation.step3",
         "start": {
           "column": 26,
-          "line": 47
+          "line": 45
         }
       },
       {
@@ -4807,13 +5144,13 @@
         "description": "Label for close button on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 56
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.cancelButtonLabel",
         "start": {
           "column": 21,
-          "line": 53
+          "line": 51
         }
       },
       {
@@ -4821,13 +5158,13 @@
         "description": "Label for continue button on the delegation setup \"intro\" dialog.",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 62
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsIntroDialog.tsx",
         "id": "staking.delegationSetup.intro.step.dialog.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 59
+          "line": 57
         }
       }
     ],
@@ -4840,13 +5177,13 @@
         "description": "Title \"Delegation Setup\" on the delegation setup not available dialog.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 22
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx",
         "id": "staking.delegationSetup.notAvailable.dialog.title",
         "start": {
           "column": 9,
-          "line": 19
+          "line": 17
         }
       },
       {
@@ -4854,13 +5191,13 @@
         "description": "Description on the delegation setup not available dialog.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 28
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx",
         "id": "staking.delegationSetup.notAvailable.dialog.description",
         "start": {
           "column": 15,
-          "line": 25
+          "line": 23
         }
       },
       {
@@ -4868,13 +5205,13 @@
         "description": "Label for close button on the delegation setup not available dialog.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 34
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsNotAvailableDialog.tsx",
         "id": "staking.delegationSetup.notAvailable.dialog.closeButtonLabel",
         "start": {
           "column": 20,
-          "line": 31
+          "line": 29
         }
       }
     ],
@@ -4887,13 +5224,13 @@
         "description": "Title \"Wallet Delegated\" on the delegation setup \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 24
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx",
         "id": "staking.delegationSetup.success.step.dialog.title",
         "start": {
           "column": 9,
-          "line": 21
+          "line": 19
         }
       },
       {
@@ -4901,13 +5238,13 @@
         "description": "Description \"line 1\" on the delegation setup \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 31
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx",
         "id": "staking.delegationSetup.success.step.dialog.description.line1",
         "start": {
           "column": 20,
-          "line": 27
+          "line": 25
         }
       },
       {
@@ -4915,13 +5252,13 @@
         "description": "Description \"line 2\" on the delegation setup \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 38
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx",
         "id": "staking.delegationSetup.success.step.dialog.description.line2",
         "start": {
           "column": 20,
-          "line": 34
+          "line": 32
         }
       },
       {
@@ -4929,13 +5266,13 @@
         "description": "Label for Close button on the delegation setup \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 44
         },
         "file": "source/renderer/app/components/staking/delegation-setup-wizard/DelegationStepsSuccessDialog.tsx",
         "id": "staking.delegationSetup.success.step.dialog.closeButtonLabel",
         "start": {
           "column": 20,
-          "line": 41
+          "line": 39
         }
       }
     ],
@@ -4954,7 +5291,7 @@
         "id": "staking.delegationSetup.confirmation.step.dialog.oversaturationWarning",
         "start": {
           "column": 25,
-          "line": 14
+          "line": 13
         }
       }
     ],
@@ -4967,13 +5304,13 @@
         "description": "Headline for the current epoch.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochs.tsx",
         "id": "staking.epochs.currentHeading",
         "start": {
           "column": 23,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -4981,13 +5318,13 @@
         "description": "Headline for the previous epoch.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 24
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochs.tsx",
         "id": "staking.epochs.previousHeading",
         "start": {
           "column": 24,
-          "line": 21
+          "line": 20
         }
       }
     ],
@@ -5000,13 +5337,13 @@
         "description": "Table header \"Stake pool\" label on staking epochs page",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsCurrentEpochData.tsx",
         "id": "staking.epochs.currentEpoch.tableHeader.pool",
         "start": {
           "column": 19,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -5014,13 +5351,13 @@
         "description": "Table header \"Slots elected\" label on staking epochs page",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsCurrentEpochData.tsx",
         "id": "staking.epochs.currentEpoch.tableHeader.slotsElected",
         "start": {
           "column": 27,
-          "line": 23
+          "line": 22
         }
       }
     ],
@@ -5033,13 +5370,13 @@
         "description": "\"No results\" results label on staking epochs page.",
         "end": {
           "column": 3,
-          "line": 12
+          "line": 11
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsNoData.tsx",
         "id": "staking.epochs.no.results",
         "start": {
           "column": 13,
-          "line": 8
+          "line": 7
         }
       }
     ],
@@ -5052,13 +5389,13 @@
         "description": "Table header \"Stake pool\" label on staking epochs page",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx",
         "id": "staking.epochs.previousEpoch.tableHeader.pool",
         "start": {
           "column": 19,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -5066,13 +5403,13 @@
         "description": "Table header \"Slots elected\" label on staking epochs page",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx",
         "id": "staking.epochs.previousEpoch.tableHeader.slotsElected",
         "start": {
           "column": 27,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -5080,13 +5417,13 @@
         "description": "Table header \"Performance\" label on staking epochs page",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx",
         "id": "staking.epochs.tableHeader.performance",
         "start": {
           "column": 26,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -5094,13 +5431,13 @@
         "description": "Table header \"Shared rewards\" label on staking epochs page",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx",
         "id": "staking.epochs.tableHeader.sharedRewards",
         "start": {
           "column": 28,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -5108,13 +5445,13 @@
         "description": "\"slots\" text in table body on staking epochs page",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx",
         "id": "staking.epochs.tableBody.slots",
         "start": {
           "column": 18,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -5122,13 +5459,13 @@
         "description": "\"of\" text in table body on staking epochs page",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/staking/epochs/StakingEpochsPreviousEpochData.tsx",
         "id": "staking.epochs.tableBody.of",
         "start": {
           "column": 15,
-          "line": 44
+          "line": 43
         }
       }
     ],
@@ -5141,13 +5478,13 @@
         "description": "Headline for the \"Staking Info\" page screen.",
         "end": {
           "column": 3,
-          "line": 16
+          "line": 15
         },
         "file": "source/renderer/app/components/staking/info/StakingInfoCountdown.tsx",
         "id": "staking.infoCountdown.heading",
         "start": {
           "column": 11,
-          "line": 12
+          "line": 11
         }
       },
       {
@@ -5155,13 +5492,13 @@
         "description": "Info description for the \"Staking Info\" page screen.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/staking/info/StakingInfoCountdown.tsx",
         "id": "staking.infoCountdown.description.before",
         "start": {
           "column": 21,
-          "line": 17
+          "line": 16
         }
       },
       {
@@ -5169,13 +5506,13 @@
         "description": "Info description for the \"Staking Info\" page screen.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/staking/info/StakingInfoCountdown.tsx",
         "id": "staking.infoCountdown.description.after",
         "start": {
           "column": 20,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -5183,13 +5520,13 @@
         "description": "Countdown Title for the \"Staking Info\" page screen.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/staking/info/StakingInfoCountdown.tsx",
         "id": "staking.infoCountdown.countdownTitle",
         "start": {
           "column": 18,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -5197,13 +5534,13 @@
         "description": "Button Label for the \"Staking Info\" page screen.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/staking/info/StakingInfoCountdown.tsx",
         "id": "staking.infoCountdown.buttonLabel",
         "start": {
           "column": 15,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -5211,13 +5548,13 @@
         "description": "\"Learn more\" link URL in the \"Staking Info\" screen.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/staking/info/StakingInfoCountdown.tsx",
         "id": "staking.infoCountdown.learnMore.linkUrl",
         "start": {
           "column": 20,
-          "line": 39
+          "line": 38
         }
       }
     ],
@@ -5305,13 +5642,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/NoWalletsDialog.tsx",
         "id": "staking.redeemItnRewards.noWallets.description",
         "start": {
           "column": 15,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -5319,13 +5656,13 @@
         "description": "addWalletButtonLabel for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/NoWalletsDialog.tsx",
         "id": "staking.redeemItnRewards.noWallets.addWalletButtonLabel",
         "start": {
           "column": 24,
-          "line": 21
+          "line": 20
         }
       }
     ],
@@ -5338,13 +5675,13 @@
         "description": "Title for Redeem Incentivized Testnet - redemptionUnavailable",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/RedemptionUnavailableDialog.tsx",
         "id": "staking.redeemItnRewards.redemptionUnavailable.title",
         "start": {
           "column": 9,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -5352,13 +5689,13 @@
         "description": "closeButtonLabel for Redeem Incentivized Testnet - redemptionUnavailable",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/RedemptionUnavailableDialog.tsx",
         "id": "staking.redeemItnRewards.redemptionUnavailable.closeButton.label",
         "start": {
           "column": 20,
-          "line": 21
+          "line": 20
         }
       }
     ],
@@ -5371,13 +5708,13 @@
         "description": "Title for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.title",
         "start": {
           "column": 9,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -5385,13 +5722,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.description1",
         "start": {
           "column": 16,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -5399,13 +5736,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 54
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.description2",
         "start": {
           "column": 16,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -5413,13 +5750,13 @@
         "description": "descriptionItnLinkLabel for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 60
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.descriptionItnLinkLabel",
         "start": {
           "column": 27,
-          "line": 56
+          "line": 55
         }
       },
       {
@@ -5427,13 +5764,13 @@
         "description": "descriptionItnLinkUrl for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 66
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.descriptionItnLinkUrl",
         "start": {
           "column": 25,
-          "line": 62
+          "line": 61
         }
       },
       {
@@ -5441,13 +5778,13 @@
         "description": "recoveryPhraseLabel for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 72
+          "line": 71
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.recoveryPhraseLabel",
         "start": {
           "column": 23,
-          "line": 68
+          "line": 67
         }
       },
       {
@@ -5455,13 +5792,13 @@
         "description": "walletsDropdownLabel for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 78
+          "line": 77
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.walletsDropdownLabel",
         "start": {
           "column": 24,
-          "line": 73
+          "line": 72
         }
       },
       {
@@ -5469,13 +5806,13 @@
         "description": "checkbox1Label for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 84
+          "line": 83
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.checkbox1Label",
         "start": {
           "column": 18,
-          "line": 79
+          "line": 78
         }
       },
       {
@@ -5483,13 +5820,13 @@
         "description": "checkbox2Label for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 90
+          "line": 89
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.checkbox2Label",
         "start": {
           "column": 18,
-          "line": 85
+          "line": 84
         }
       },
       {
@@ -5497,13 +5834,13 @@
         "description": "continueButtonLabel for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 95
+          "line": 94
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.continueButton.label",
         "start": {
           "column": 23,
-          "line": 91
+          "line": 90
         }
       },
       {
@@ -5511,13 +5848,13 @@
         "description": "learnMoreLinkLabel for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 100
+          "line": 99
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.learnMoreLink.label",
         "start": {
           "column": 22,
-          "line": 96
+          "line": 95
         }
       },
       {
@@ -5525,13 +5862,13 @@
         "description": "learnMoreLinkUrl for Redeem Incentivized Testnet - Step 1",
         "end": {
           "column": 3,
-          "line": 106
+          "line": 105
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.learnMoreLink.url",
         "start": {
           "column": 20,
-          "line": 101
+          "line": 100
         }
       },
       {
@@ -5539,13 +5876,13 @@
         "description": "Hint \"Enter recovery phrase\" for the recovery phrase input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 112
+          "line": 111
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.recoveryPhraseInputHint",
         "start": {
           "column": 27,
-          "line": 107
+          "line": 106
         }
       },
       {
@@ -5553,13 +5890,13 @@
         "description": "Placeholder \"Select Wallet\" for select input on the delegation setup \"choose wallet\" step dialog.",
         "end": {
           "column": 3,
-          "line": 118
+          "line": 117
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.selectWalletInputPlaceholder",
         "start": {
           "column": 32,
-          "line": 113
+          "line": 112
         }
       },
       {
@@ -5567,13 +5904,13 @@
         "description": "\"No results\" message for the recovery phrase input search results.",
         "end": {
           "column": 3,
-          "line": 124
+          "line": 123
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.noResults",
         "start": {
           "column": 13,
-          "line": 119
+          "line": 118
         }
       },
       {
@@ -5581,13 +5918,13 @@
         "description": "Error message shown when invalid recovery phrase was entered.",
         "end": {
           "column": 3,
-          "line": 130
+          "line": 129
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step1ConfigurationDialog.tsx",
         "id": "staking.redeemItnRewards.step1.invalidRecoveryPhrase",
         "start": {
           "column": 25,
-          "line": 125
+          "line": 124
         }
       }
     ],
@@ -5600,13 +5937,13 @@
         "description": "title for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.title",
         "start": {
           "column": 9,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -5614,13 +5951,13 @@
         "description": "walletToLabel for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.walletToLabel",
         "start": {
           "column": 17,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -5628,13 +5965,13 @@
         "description": "walletToName for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.walletToName",
         "start": {
           "column": 16,
-          "line": 35
+          "line": 34
         }
       },
       {
@@ -5642,13 +5979,13 @@
         "description": "transactionFees for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.transactionFees",
         "start": {
           "column": 19,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -5656,13 +5993,13 @@
         "description": "spendingPasswordLabel for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 50
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.spendingPasswordLabel",
         "start": {
           "column": 25,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -5670,13 +6007,13 @@
         "description": "spendingPasswordPlaceholder for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 56
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.spendingPasswordPlaceholder",
         "start": {
           "column": 31,
-          "line": 52
+          "line": 51
         }
       },
       {
@@ -5684,13 +6021,13 @@
         "description": "continueButtonLabel for Redeem Incentivized Testnet - Step 2",
         "end": {
           "column": 3,
-          "line": 62
+          "line": 61
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 58
+          "line": 57
         }
       },
       {
@@ -5698,13 +6035,13 @@
         "description": "Label for the back button in the wallet send confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 67
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step2ConfirmationDialog.tsx",
         "id": "staking.redeemItnRewards.step2.backButtonLabel",
         "start": {
           "column": 19,
-          "line": 63
+          "line": 62
         }
       }
     ],
@@ -5717,13 +6054,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx",
         "id": "staking.redeemItnRewards.step3.failure.description1NoRewards",
         "start": {
           "column": 25,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -5731,13 +6068,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx",
         "id": "staking.redeemItnRewards.step3.failure.description2InvalidWallet",
         "start": {
           "column": 29,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -5745,13 +6082,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx",
         "id": "staking.redeemItnRewards.step3.failure.description3Generic",
         "start": {
           "column": 23,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -5759,13 +6096,13 @@
         "description": "backButtonLabel for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx",
         "id": "staking.redeemItnRewards.step3.failure.backButtonLabel",
         "start": {
           "column": 19,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -5773,13 +6110,13 @@
         "description": "closeWindowLinkLabel for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3FailureDialog.tsx",
         "id": "staking.redeemItnRewards.step3.failure.closeWindowLinkLabel",
         "start": {
           "column": 24,
-          "line": 38
+          "line": 37
         }
       }
     ],
@@ -5792,13 +6129,13 @@
         "description": "title for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx",
         "id": "staking.redeemItnRewards.step3.success.title",
         "start": {
           "column": 9,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -5806,13 +6143,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx",
         "id": "staking.redeemItnRewards.step3.success.description",
         "start": {
           "column": 15,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -5820,13 +6157,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx",
         "id": "staking.redeemItnRewards.step3.success.openWalletButtonLabel",
         "start": {
           "column": 25,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -5834,13 +6171,13 @@
         "description": "description for Redeem Incentivized Testnet - Step 3",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/staking/redeem-itn-rewards/Step3SuccessDialog.tsx",
         "id": "staking.redeemItnRewards.step3.success.downloadPDFButtonLabel",
         "start": {
           "column": 26,
-          "line": 34
+          "line": 33
         }
       }
     ],
@@ -5920,30 +6257,44 @@
       },
       {
         "defaultMessage": "!!!Total rewards earned (ADA)",
-        "description": "Table header \"Reward\" label on staking rewards page",
+        "description": "Table header \"Total Reward\" label on staking rewards page",
         "end": {
           "column": 3,
           "line": 64
         },
         "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
-        "id": "staking.rewards.tableHeader.reward",
+        "id": "staking.rewards.tableHeader.total",
         "start": {
-          "column": 21,
+          "column": 26,
           "line": 60
         }
       },
+      {
+        "defaultMessage": "!!!Unspent (ADA)",
+        "description": "Table header \"Unspent\" label on staking rewards page",
+        "end": {
+          "column": 3,
+          "line": 69
+        },
+        "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
+        "id": "staking.rewards.tableHeader.unspent",
+        "start": {
+          "column": 28,
+          "line": 65
+        }
+      },
       {
         "defaultMessage": "!!!Rewards address",
         "description": "Table header \"Rewards address\" label on staking rewards page",
         "end": {
           "column": 3,
-          "line": 69
+          "line": 74
         },
         "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
         "id": "staking.rewards.tableHeader.rewardsAddress",
         "start": {
           "column": 29,
-          "line": 65
+          "line": 70
         }
       },
       {
@@ -5951,13 +6302,13 @@
         "description": "Table header \"Date\" label in exported csv file",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 79
         },
         "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
         "id": "staking.rewards.tableHeader.date",
         "start": {
           "column": 19,
-          "line": 70
+          "line": 75
         }
       },
       {
@@ -5965,13 +6316,13 @@
         "description": "Rewards description text on staking rewards page",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 85
         },
         "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
         "id": "staking.rewards.note",
         "start": {
           "column": 8,
-          "line": 75
+          "line": 80
         }
       },
       {
@@ -5979,13 +6330,13 @@
         "description": "unknown stake pool label on staking rewards page.",
         "end": {
           "column": 3,
-          "line": 85
+          "line": 90
         },
         "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
         "id": "staking.delegationCenter.syncingTooltipLabel",
         "start": {
           "column": 23,
-          "line": 81
+          "line": 86
         }
       },
       {
@@ -5993,13 +6344,13 @@
         "description": "View in explorer button label on staking rewards page.",
         "end": {
           "column": 3,
-          "line": 90
+          "line": 95
         },
         "file": "source/renderer/app/components/staking/rewards/StakingRewards.tsx",
         "id": "staking.rewards.actionViewInExplorer",
         "start": {
           "column": 24,
-          "line": 86
+          "line": 91
         }
       }
     ],
@@ -6012,13 +6363,13 @@
         "description": "\"delegatingListTitle\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.delegatingListTitle",
         "start": {
           "column": 23,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -6026,13 +6377,13 @@
         "description": "\"listTitle\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.listTitle",
         "start": {
           "column": 13,
-          "line": 35
+          "line": 34
         }
       },
       {
@@ -6040,13 +6391,13 @@
         "description": "\"listTitleLoading\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.listTitleLoading",
         "start": {
           "column": 20,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -6054,13 +6405,13 @@
         "description": "\"listTitleSearch\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.listTitleSearch",
         "start": {
           "column": 19,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -6068,13 +6419,13 @@
         "description": "\"listTitleStakePools\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.listTitleStakePools",
         "start": {
           "column": 23,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -6082,13 +6433,13 @@
         "description": "Loading stake pool message for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.loadingStakePoolsMessage",
         "start": {
           "column": 28,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -6096,13 +6447,13 @@
         "description": "moderatedBy message for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.moderatedBy",
         "start": {
           "column": 15,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -6110,13 +6461,13 @@
         "description": "unmoderated message for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 69
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.tsx",
         "id": "staking.stakePools.unmoderated",
         "start": {
           "column": 15,
-          "line": 66
+          "line": 65
         }
       }
     ],
@@ -6330,13 +6681,13 @@
         "description": "\"Delegating List Title\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 8
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.searchInputPlaceholder",
         "start": {
           "column": 26,
-          "line": 23
+          "line": 4
         }
       },
       {
@@ -6344,13 +6695,13 @@
         "description": "\"delegatingListTitle\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 13
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.delegatingListTitle",
         "start": {
           "column": 23,
-          "line": 28
+          "line": 9
         }
       },
       {
@@ -6358,13 +6709,13 @@
         "description": "\"listTitle\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 18
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.listTitle",
         "start": {
           "column": 13,
-          "line": 33
+          "line": 14
         }
       },
       {
@@ -6372,13 +6723,13 @@
         "description": "\"gridIconTooltip\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 23
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.gridIconTooltip",
         "start": {
           "column": 19,
-          "line": 38
+          "line": 19
         }
       },
       {
@@ -6386,13 +6737,13 @@
         "description": "\"gridRewardsIconTooltip\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 28
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.gridRewardsIconTooltip",
         "start": {
           "column": 26,
-          "line": 43
+          "line": 24
         }
       },
       {
@@ -6400,13 +6751,13 @@
         "description": "\"listIconTooltip\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 33
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.listIconTooltip",
         "start": {
           "column": 19,
-          "line": 48
+          "line": 29
         }
       },
       {
@@ -6414,17 +6765,17 @@
         "description": "\"clearTooltip\" for the Stake Pools search.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 38
         },
-        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.tsx",
+        "file": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.ts",
         "id": "staking.stakePools.search.clearTooltip",
         "start": {
           "column": 16,
-          "line": 53
+          "line": 34
         }
       }
     ],
-    "path": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.json"
+    "path": "source/renderer/app/components/staking/stake-pools/StakePoolsSearch.messages.json"
   },
   {
     "descriptors": [
@@ -6433,13 +6784,13 @@
         "description": "Table header \"Rank\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.rank",
         "start": {
           "column": 19,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -6447,13 +6798,13 @@
         "description": "\"Rank\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.rankingTooltip",
         "start": {
           "column": 26,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -6461,13 +6812,13 @@
         "description": "Table header \"Ticker\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.ticker",
         "start": {
           "column": 21,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -6475,13 +6826,13 @@
         "description": "Table header \"Saturation\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.saturation",
         "start": {
           "column": 25,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -6489,13 +6840,13 @@
         "description": "\"Saturation\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.saturationTooltip",
         "start": {
           "column": 32,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -6503,13 +6854,13 @@
         "description": "Table header \"Performance\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.performance",
         "start": {
           "column": 26,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -6517,13 +6868,13 @@
         "description": "Table header \"Uptime\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.uptime",
         "start": {
           "column": 21,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -6531,13 +6882,13 @@
         "description": "Table header \"Margin\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 58
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.margin",
         "start": {
           "column": 21,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -6545,13 +6896,13 @@
         "description": "\"Pool margin\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.profitMarginTooltip",
         "start": {
           "column": 28,
-          "line": 60
+          "line": 59
         }
       },
       {
@@ -6559,13 +6910,13 @@
         "description": "Table header \"Roi\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 69
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.roi",
         "start": {
           "column": 18,
-          "line": 66
+          "line": 65
         }
       },
       {
@@ -6573,13 +6924,13 @@
         "description": "Table header \"Cost\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 74
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.cost",
         "start": {
           "column": 19,
-          "line": 71
+          "line": 70
         }
       },
       {
@@ -6587,13 +6938,13 @@
         "description": "\"Cost per epoch\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 81
+          "line": 80
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.costPerEpochTooltip",
         "start": {
           "column": 26,
-          "line": 76
+          "line": 75
         }
       },
       {
@@ -6601,13 +6952,13 @@
         "description": "Table header \"Produced Blocks\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 87
+          "line": 86
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.producedBlocks",
         "start": {
           "column": 29,
-          "line": 82
+          "line": 81
         }
       },
       {
@@ -6615,13 +6966,13 @@
         "description": "\"Blocks\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 92
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.producedBlocksTooltip",
         "start": {
           "column": 36,
-          "line": 88
+          "line": 87
         }
       },
       {
@@ -6629,13 +6980,13 @@
         "description": "Table header \"Potential rewards\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 99
+          "line": 98
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.potentialRewards",
         "start": {
           "column": 31,
-          "line": 94
+          "line": 93
         }
       },
       {
@@ -6643,13 +6994,13 @@
         "description": "\"Rewards\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 105
+          "line": 104
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.potentialRewardsTooltip",
         "start": {
           "column": 38,
-          "line": 100
+          "line": 99
         }
       },
       {
@@ -6657,13 +7008,13 @@
         "description": "Table header \"Pledge\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 110
+          "line": 109
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.pledge",
         "start": {
           "column": 21,
-          "line": 106
+          "line": 105
         }
       },
       {
@@ -6671,13 +7022,13 @@
         "description": "\"Pledge\" tooltip for the Stake Pools Table.",
         "end": {
           "column": 3,
-          "line": 116
+          "line": 115
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tooltip.pledgeTooltip",
         "start": {
           "column": 28,
-          "line": 111
+          "line": 110
         }
       },
       {
@@ -6685,13 +7036,13 @@
         "description": "Table header \"Retiring\" label on stake pools list view page",
         "end": {
           "column": 3,
-          "line": 121
+          "line": 120
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePoolsTable.tsx",
         "id": "staking.stakePools.tableHeader.retiring",
         "start": {
           "column": 23,
-          "line": 117
+          "line": 116
         }
       }
     ],
@@ -6704,13 +7055,13 @@
         "description": "\"Rank\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.ranking",
         "start": {
           "column": 11,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -6718,13 +7069,13 @@
         "description": "\"Rank\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 54
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.rankingTooltip",
         "start": {
           "column": 18,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -6732,13 +7083,13 @@
         "description": "\"Live stake\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.relativeStake",
         "start": {
           "column": 17,
-          "line": 56
+          "line": 55
         }
       },
       {
@@ -6746,13 +7097,13 @@
         "description": "\"Live stake\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 66
+          "line": 65
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.relativeStakeTooltip",
         "start": {
           "column": 24,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -6760,13 +7111,13 @@
         "description": "\"Pool margin\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 71
+          "line": 70
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.profitMargin",
         "start": {
           "column": 16,
-          "line": 67
+          "line": 66
         }
       },
       {
@@ -6774,13 +7125,13 @@
         "description": "\"Pool margin\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 77
+          "line": 76
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.profitMarginTooltip",
         "start": {
           "column": 23,
-          "line": 72
+          "line": 71
         }
       },
       {
@@ -6788,13 +7139,13 @@
         "description": "\"Cost per epoch\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 82
+          "line": 81
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.costPerEpoch",
         "start": {
           "column": 16,
-          "line": 78
+          "line": 77
         }
       },
       {
@@ -6802,13 +7153,13 @@
         "description": "\"Cost per epoch\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 88
+          "line": 87
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.costPerEpochTooltip",
         "start": {
           "column": 23,
-          "line": 83
+          "line": 82
         }
       },
       {
@@ -6816,13 +7167,13 @@
         "description": "\"Blocks\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 92
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.producedBlocks",
         "start": {
           "column": 18,
-          "line": 89
+          "line": 88
         }
       },
       {
@@ -6830,13 +7181,13 @@
         "description": "\"Blocks\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 99
+          "line": 98
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.producedBlocksTooltip",
         "start": {
           "column": 25,
-          "line": 94
+          "line": 93
         }
       },
       {
@@ -6844,13 +7195,13 @@
         "description": "\"Rewards\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 104
+          "line": 103
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.potentialRewards",
         "start": {
           "column": 20,
-          "line": 100
+          "line": 99
         }
       },
       {
@@ -6858,13 +7209,13 @@
         "description": "\"Rewards\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 110
+          "line": 109
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.potentialRewardsTooltip",
         "start": {
           "column": 27,
-          "line": 105
+          "line": 104
         }
       },
       {
@@ -6872,13 +7223,13 @@
         "description": "\"Retirement\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 115
+          "line": 114
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.retirement",
         "start": {
           "column": 14,
-          "line": 111
+          "line": 110
         }
       },
       {
@@ -6886,13 +7237,13 @@
         "description": "\"Saturation\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 120
+          "line": 119
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.saturation",
         "start": {
           "column": 14,
-          "line": 116
+          "line": 115
         }
       },
       {
@@ -6900,13 +7251,13 @@
         "description": "\"Saturation\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 126
+          "line": 125
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.saturationTooltip",
         "start": {
           "column": 21,
-          "line": 121
+          "line": 120
         }
       },
       {
@@ -6914,13 +7265,13 @@
         "description": "\"Pledge\" for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 130
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.pledge",
         "start": {
           "column": 10,
-          "line": 127
+          "line": 126
         }
       },
       {
@@ -6928,13 +7279,13 @@
         "description": "\"Pledge\" tooltip for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 137
+          "line": 136
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.pledgeTooltip",
         "start": {
           "column": 17,
-          "line": 132
+          "line": 131
         }
       },
       {
@@ -6942,13 +7293,13 @@
         "description": "\"Delegate to this pool\" Button for the Stake Pools Tooltip page.",
         "end": {
           "column": 3,
-          "line": 143
+          "line": 142
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.delegateButton",
         "start": {
           "column": 18,
-          "line": 138
+          "line": 137
         }
       },
       {
@@ -6956,13 +7307,13 @@
         "description": "copyId tooltip label",
         "end": {
           "column": 3,
-          "line": 148
+          "line": 147
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.copyIdTooltipLabel",
         "start": {
           "column": 22,
-          "line": 144
+          "line": 143
         }
       },
       {
@@ -6970,13 +7321,13 @@
         "description": "copyId tooltip label copied",
         "end": {
           "column": 3,
-          "line": 153
+          "line": 152
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.tooltip.copiedIdTooltipLabel",
         "start": {
           "column": 24,
-          "line": 149
+          "line": 148
         }
       },
       {
@@ -6984,13 +7335,13 @@
         "description": "Data not available yet label",
         "end": {
           "column": 3,
-          "line": 158
+          "line": 157
         },
         "file": "source/renderer/app/components/staking/widgets/TooltipPool.tsx",
         "id": "staking.stakePools.noDataDashTooltip",
         "start": {
           "column": 26,
-          "line": 154
+          "line": 153
         }
       }
     ],
@@ -7003,13 +7354,13 @@
         "description": "About \"title\"",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 18
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.title",
         "start": {
           "column": 14,
-          "line": 18
+          "line": 14
         }
       },
       {
@@ -7017,13 +7368,13 @@
         "description": "About page daedalus team headline",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 23
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.content.daedalus.headline",
         "start": {
           "column": 32,
-          "line": 23
+          "line": 19
         }
       },
       {
@@ -7031,41 +7382,41 @@
         "description": "About page cardano team headline",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 28
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.content.cardano.headline",
         "start": {
           "column": 31,
-          "line": 28
+          "line": 24
         }
       },
       {
-        "defaultMessage": "!!!Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Danilo Prates, Darko Mijić, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Manus McCole, Michael Bishop, Mior Sufian, Nikola Glumac, Piotr Stachyra, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov",
+        "defaultMessage": "!!!Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Daniel Main, Danilo Prates, Darko Mijić, Dmitrii Gaico, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Lucas Araujo, Manus McCole, Marcin Mazurek, Michael Bishop, Michael Chappell, Mior Sufian, Nikola Glumac, Piotr Stachyra, Przemysław Włodek, Renan Ferreira, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Szymon Masłowski, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov",
         "description": "About page daedalus team members",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 34
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.content.daedalus.members",
         "start": {
           "column": 31,
-          "line": 33
+          "line": 29
         }
       },
       {
-        "defaultMessage": "!!!Alexander Sukhoverkhov, Alexander Vieth, Alexandre Rodrigues Baldé, Alfredo Di Napoli, Anastasiya Besman, Andrzej Rybczak, Ante Kegalj, Anton Belyy, Anupam Jain, Arseniy Seroka, Artyom Kazak, Carlos D'Agostino, Charles Hoskinson, Dan Friedman, Denis Shevchenko, Dmitry Kovanikov, Dmitry Mukhutdinov, Dmitry Nikulin, Domen Kožar, Duncan Coutts, Edsko de Vries, Eileen Fitzgerald, George Agapov, Hiroto Shioi, Ilya Lubimov, Ilya Peresadin, Ivan Gromakovskii, Jake Mitchell, Jane Wild, Jens Krause, Jeremy Wood, Joel Mislov Kunst, Jonn Mostovoy, Konstantin Ivanov, Kristijan Šarić, Lars Brünjes, Laurie Wang, Lionel Miller, Michael Bishop, Mikhail Volkhov, Niklas Hambüchen, Peter Gaži, Philipp Kant, Serge Kosyrev, Vincent Hanquez",
+        "defaultMessage": "!!!Alan McNicholas, Alejandro Garcia, Alexander Diemand, Alexander Vieth, Anatoli Ivanou, Andreas Triantafyllos, Ante Kegalj, Armando Santos, Ben Ford, Charles Hoskinson, Dan Friedman, Deepak Kapiswe, Denis Shevchenko, Dorin Solomon, Duncan Coutts, Edsko de Vries, Erik de Castro Lopo, Gerard Moroney, Hiroto Shioi, Jane Wild, Jean-Christophe Mincke, Jeremy Wood, Johannes Lund, Jordan Millar, Karl Knutsson, Kristijan Šarić, Lars Brünjes, Laurie Wang, Liz Bancroft, Luke Nadur, Marc Fontaine, Marcin Szamotulski, Matt Parsons, Matthias Benkort, Michael Bishop, Michael Hueschen, Moritz Angermann, Neil Davis, Niamh Ahern, Nicholas Clarke, Nicolas Di Prima, Noel Rimbert, Patrick Kelly, Pawel Jakubas, Peter Gaži, Peter Thompson, Philipp Kant, Piotr Stachyra, Ravi Patel, Richard Wild, Rob Cohen, Rodney Lorrimar, Ryan Lemmer, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tom Flynn, Vasileios Gkoumas, Vincent Hanquez",
         "description": "About page cardano team members",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 40
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.content.cardano.members",
         "start": {
           "column": 30,
-          "line": 39
+          "line": 35
         }
       },
       {
@@ -7073,13 +7424,13 @@
         "description": "About \"copyright\"",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 45
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.copyright",
         "start": {
           "column": 18,
-          "line": 45
+          "line": 41
         }
       },
       {
@@ -7087,13 +7438,13 @@
         "description": "About page license name",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 50
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.license",
         "start": {
           "column": 15,
-          "line": 50
+          "line": 46
         }
       },
       {
@@ -7101,13 +7452,13 @@
         "description": "About page build information",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 55
         },
         "file": "source/renderer/app/components/static/About.tsx",
         "id": "static.about.buildInfo",
         "start": {
           "column": 18,
-          "line": 55
+          "line": 51
         }
       }
     ],
@@ -7120,13 +7471,13 @@
         "description": "System info",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 34
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.system.info",
         "start": {
           "column": 14,
-          "line": 37
+          "line": 30
         }
       },
       {
@@ -7134,13 +7485,13 @@
         "description": "Platform",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 39
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.platform",
         "start": {
           "column": 12,
-          "line": 42
+          "line": 35
         }
       },
       {
@@ -7148,13 +7499,13 @@
         "description": "Platform version",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 44
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.platform.version",
         "start": {
           "column": 19,
-          "line": 47
+          "line": 40
         }
       },
       {
@@ -7162,13 +7513,13 @@
         "description": "CPU",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 49
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cpu",
         "start": {
           "column": 7,
-          "line": 52
+          "line": 45
         }
       },
       {
@@ -7176,13 +7527,13 @@
         "description": "RAM",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 54
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.ram",
         "start": {
           "column": 7,
-          "line": 57
+          "line": 50
         }
       },
       {
@@ -7190,13 +7541,13 @@
         "description": "Available disk space",
         "end": {
           "column": 3,
-          "line": 66
+          "line": 59
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.availableDiskSpace",
         "start": {
           "column": 22,
-          "line": 62
+          "line": 55
         }
       },
       {
@@ -7204,13 +7555,13 @@
         "description": "Unknown amount of disk space",
         "end": {
           "column": 3,
-          "line": 71
+          "line": 64
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.unknownDiskSpace",
         "start": {
           "column": 20,
-          "line": 67
+          "line": 60
         }
       },
       {
@@ -7218,13 +7569,97 @@
         "description": "\"Support\" link URL while disk space is unknown",
         "end": {
           "column": 3,
-          "line": 76
+          "line": 69
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.unknownDiskSpaceSupportUrl",
         "start": {
           "column": 30,
-          "line": 72
+          "line": 65
+        }
+      },
+      {
+        "defaultMessage": "!!!Recommended system requirements status",
+        "description": "Displayed on the left of the Recommended system requirements status row",
+        "end": {
+          "column": 3,
+          "line": 75
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatus",
+        "start": {
+          "column": 35,
+          "line": 70
+        }
+      },
+      {
+        "defaultMessage": "!!!Low",
+        "description": "Displayed on the right of the Recommended system requirements status row when hardware requirements are insufficient",
+        "end": {
+          "column": 3,
+          "line": 81
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowValue",
+        "start": {
+          "column": 44,
+          "line": 76
+        }
+      },
+      {
+        "defaultMessage": "!!!Good",
+        "description": "Displayed on the right of the Recommended system requirements status row when hardware requirements are ok",
+        "end": {
+          "column": 3,
+          "line": 87
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodValue",
+        "start": {
+          "column": 45,
+          "line": 82
+        }
+      },
+      {
+        "defaultMessage": "!!!Your system specifications do not meet Daedalus’ recommended hardware requirements. We suggest using a machine with at least 16 GB of RAM",
+        "description": "Visible on hovering over Recommended system requirement status when status is Low",
+        "end": {
+          "column": 3,
+          "line": 95
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowTooltip",
+        "start": {
+          "column": 46,
+          "line": 88
+        }
+      },
+      {
+        "defaultMessage": "!!!Your system specifications meet Daedalus’ recommended hardware requirements",
+        "description": "Visible on hovering over Recommended system requirement status when status is Good",
+        "end": {
+          "column": 3,
+          "line": 103
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodTooltip",
+        "start": {
+          "column": 47,
+          "line": 96
+        }
+      },
+      {
+        "defaultMessage": "!!!RTS Flags Mode",
+        "description": "Indicates whether RTS Flags Mode is enabled or not",
+        "end": {
+          "column": 3,
+          "line": 108
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.isRTSFlagsModeEnabled",
+        "start": {
+          "column": 25,
+          "line": 104
         }
       },
       {
@@ -7232,13 +7667,13 @@
         "description": "CORE INFO",
         "end": {
           "column": 3,
-          "line": 81
+          "line": 113
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.coreInfo",
         "start": {
           "column": 12,
-          "line": 77
+          "line": 109
         }
       },
       {
@@ -7246,13 +7681,13 @@
         "description": "Daedalus version",
         "end": {
           "column": 3,
-          "line": 86
+          "line": 118
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.daedalusVersion",
         "start": {
           "column": 19,
-          "line": 82
+          "line": 114
         }
       },
       {
@@ -7260,13 +7695,13 @@
         "description": "Daedalus build number",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 123
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.daedalusBuildNumber",
         "start": {
           "column": 23,
-          "line": 87
+          "line": 119
         }
       },
       {
@@ -7274,13 +7709,13 @@
         "description": "Daedalus main process ID",
         "end": {
           "column": 3,
-          "line": 96
+          "line": 128
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.daedalusMainProcessID",
         "start": {
           "column": 25,
-          "line": 92
+          "line": 124
         }
       },
       {
@@ -7288,13 +7723,13 @@
         "description": "Daedalus renderer process ID",
         "end": {
           "column": 3,
-          "line": 101
+          "line": 133
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.daedalusProcessID",
         "start": {
           "column": 21,
-          "line": 97
+          "line": 129
         }
       },
       {
@@ -7302,13 +7737,13 @@
         "description": "Daedalus 'Blank Screen Fix' active",
         "end": {
           "column": 3,
-          "line": 106
+          "line": 138
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.blankScreenFix",
         "start": {
           "column": 18,
-          "line": 102
+          "line": 134
         }
       },
       {
@@ -7316,13 +7751,13 @@
         "description": "Cardano node version",
         "end": {
           "column": 3,
-          "line": 111
+          "line": 143
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeVersion",
         "start": {
           "column": 22,
-          "line": 107
+          "line": 139
         }
       },
       {
@@ -7330,13 +7765,13 @@
         "description": "Cardano node process ID",
         "end": {
           "column": 3,
-          "line": 116
+          "line": 148
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodePID",
         "start": {
           "column": 18,
-          "line": 112
+          "line": 144
         }
       },
       {
@@ -7344,13 +7779,13 @@
         "description": "Cardano node port",
         "end": {
           "column": 3,
-          "line": 121
+          "line": 153
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeApiPort",
         "start": {
           "column": 22,
-          "line": 117
+          "line": 149
         }
       },
       {
@@ -7358,13 +7793,13 @@
         "description": "Cardano wallet process ID",
         "end": {
           "column": 3,
-          "line": 126
+          "line": 158
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoWalletPID",
         "start": {
           "column": 20,
-          "line": 122
+          "line": 154
         }
       },
       {
@@ -7372,13 +7807,13 @@
         "description": "Cardano wallet version",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 163
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoWalletVersion",
         "start": {
           "column": 24,
-          "line": 127
+          "line": 159
         }
       },
       {
@@ -7386,13 +7821,13 @@
         "description": "Cardano wallet port",
         "end": {
           "column": 3,
-          "line": 136
+          "line": 168
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoWalletApiPort",
         "start": {
           "column": 24,
-          "line": 132
+          "line": 164
         }
       },
       {
@@ -7400,13 +7835,13 @@
         "description": "Cardano network",
         "end": {
           "column": 3,
-          "line": 141
+          "line": 173
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNetwork",
         "start": {
           "column": 18,
-          "line": 137
+          "line": 169
         }
       },
       {
@@ -7414,13 +7849,13 @@
         "description": "Daedalus state directory",
         "end": {
           "column": 3,
-          "line": 146
+          "line": 178
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.stateDirectory",
         "start": {
           "column": 22,
-          "line": 142
+          "line": 174
         }
       },
       {
@@ -7428,13 +7863,13 @@
         "description": "Open",
         "end": {
           "column": 3,
-          "line": 151
+          "line": 183
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.stateDirectoryPathOpenBtn",
         "start": {
           "column": 29,
-          "line": 147
+          "line": 179
         }
       },
       {
@@ -7442,13 +7877,13 @@
         "description": "CONNECTION ERROR",
         "end": {
           "column": 3,
-          "line": 156
+          "line": 188
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.connectionError",
         "start": {
           "column": 19,
-          "line": 152
+          "line": 184
         }
       },
       {
@@ -7456,13 +7891,13 @@
         "description": "DAEDALUS STATUS",
         "end": {
           "column": 3,
-          "line": 161
+          "line": 193
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.daedalusStatus",
         "start": {
           "column": 18,
-          "line": 157
+          "line": 189
         }
       },
       {
@@ -7470,13 +7905,13 @@
         "description": "Connected",
         "end": {
           "column": 3,
-          "line": 166
+          "line": 198
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.connected",
         "start": {
           "column": 13,
-          "line": 162
+          "line": 194
         }
       },
       {
@@ -7484,13 +7919,13 @@
         "description": "Synced",
         "end": {
           "column": 3,
-          "line": 171
+          "line": 203
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.synced",
         "start": {
           "column": 10,
-          "line": 167
+          "line": 199
         }
       },
       {
@@ -7498,13 +7933,13 @@
         "description": "Sync percentage",
         "end": {
           "column": 3,
-          "line": 176
+          "line": 208
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.syncPercentage",
         "start": {
           "column": 18,
-          "line": 172
+          "line": 204
         }
       },
       {
@@ -7512,13 +7947,13 @@
         "description": "Local time difference",
         "end": {
           "column": 3,
-          "line": 181
+          "line": 213
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.localTimeDifference",
         "start": {
           "column": 23,
-          "line": 177
+          "line": 209
         }
       },
       {
@@ -7526,13 +7961,13 @@
         "description": "System time correct",
         "end": {
           "column": 3,
-          "line": 186
+          "line": 218
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.systemTimeCorrect",
         "start": {
           "column": 21,
-          "line": 182
+          "line": 214
         }
       },
       {
@@ -7540,13 +7975,13 @@
         "description": "System time ignored",
         "end": {
           "column": 3,
-          "line": 191
+          "line": 223
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.systemTimeIgnored",
         "start": {
           "column": 21,
-          "line": 187
+          "line": 219
         }
       },
       {
@@ -7554,13 +7989,13 @@
         "description": "Checking system time",
         "end": {
           "column": 3,
-          "line": 196
+          "line": 228
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.checkingNodeTime",
         "start": {
           "column": 20,
-          "line": 192
+          "line": 224
         }
       },
       {
@@ -7568,13 +8003,13 @@
         "description": "CARDANO NODE STATUS",
         "end": {
           "column": 3,
-          "line": 201
+          "line": 233
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeStatus",
         "start": {
           "column": 21,
-          "line": 197
+          "line": 229
         }
       },
       {
@@ -7582,13 +8017,13 @@
         "description": "Restarting Cardano node...",
         "end": {
           "column": 3,
-          "line": 206
+          "line": 238
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeStatusRestarting",
         "start": {
           "column": 31,
-          "line": 202
+          "line": 234
         }
       },
       {
@@ -7596,13 +8031,13 @@
         "description": "Restart Cardano node",
         "end": {
           "column": 3,
-          "line": 211
+          "line": 243
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeStatusRestart",
         "start": {
           "column": 28,
-          "line": 207
+          "line": 239
         }
       },
       {
@@ -7610,13 +8045,13 @@
         "description": "Cardano node state",
         "end": {
           "column": 3,
-          "line": 216
+          "line": 248
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeState",
         "start": {
           "column": 20,
-          "line": 212
+          "line": 244
         }
       },
       {
@@ -7624,13 +8059,13 @@
         "description": "Updated",
         "end": {
           "column": 3,
-          "line": 221
+          "line": 253
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeHasBeenUpdated",
         "start": {
           "column": 22,
-          "line": 217
+          "line": 249
         }
       },
       {
@@ -7638,13 +8073,13 @@
         "description": "Crashed",
         "end": {
           "column": 3,
-          "line": 226
+          "line": 258
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeHasCrashed",
         "start": {
           "column": 18,
-          "line": 222
+          "line": 254
         }
       },
       {
@@ -7652,13 +8087,13 @@
         "description": "Errored",
         "end": {
           "column": 3,
-          "line": 231
+          "line": 263
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeHasErrored",
         "start": {
           "column": 18,
-          "line": 227
+          "line": 259
         }
       },
       {
@@ -7666,13 +8101,13 @@
         "description": "Stopped",
         "end": {
           "column": 3,
-          "line": 236
+          "line": 268
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeHasStopped",
         "start": {
           "column": 18,
-          "line": 232
+          "line": 264
         }
       },
       {
@@ -7680,13 +8115,13 @@
         "description": "Exiting",
         "end": {
           "column": 3,
-          "line": 241
+          "line": 273
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeIsExiting",
         "start": {
           "column": 17,
-          "line": 237
+          "line": 269
         }
       },
       {
@@ -7694,13 +8129,13 @@
         "description": "Running",
         "end": {
           "column": 3,
-          "line": 246
+          "line": 278
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeIsRunning",
         "start": {
           "column": 17,
-          "line": 242
+          "line": 274
         }
       },
       {
@@ -7708,13 +8143,13 @@
         "description": "Starting",
         "end": {
           "column": 3,
-          "line": 251
+          "line": 283
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeIsStarting",
         "start": {
           "column": 18,
-          "line": 247
+          "line": 279
         }
       },
       {
@@ -7722,13 +8157,13 @@
         "description": "Stopping",
         "end": {
           "column": 3,
-          "line": 256
+          "line": 288
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeIsStopping",
         "start": {
           "column": 18,
-          "line": 252
+          "line": 284
         }
       },
       {
@@ -7736,13 +8171,13 @@
         "description": "Unrecoverable",
         "end": {
           "column": 3,
-          "line": 261
+          "line": 293
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeIsUnrecoverable",
         "start": {
           "column": 23,
-          "line": 257
+          "line": 289
         }
       },
       {
@@ -7750,13 +8185,13 @@
         "description": "Updating",
         "end": {
           "column": 3,
-          "line": 266
+          "line": 298
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.nodeIsUpdating",
         "start": {
           "column": 18,
-          "line": 262
+          "line": 294
         }
       },
       {
@@ -7764,13 +8199,13 @@
         "description": "Cardano node responding",
         "end": {
           "column": 3,
-          "line": 271
+          "line": 303
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeResponding",
         "start": {
           "column": 25,
-          "line": 267
+          "line": 299
         }
       },
       {
@@ -7778,13 +8213,13 @@
         "description": "Cardano node subscribed",
         "end": {
           "column": 3,
-          "line": 276
+          "line": 308
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeSubscribed",
         "start": {
           "column": 25,
-          "line": 272
+          "line": 304
         }
       },
       {
@@ -7792,13 +8227,13 @@
         "description": "Cardano node time correct",
         "end": {
           "column": 3,
-          "line": 281
+          "line": 313
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeTimeCorrect",
         "start": {
           "column": 26,
-          "line": 277
+          "line": 309
         }
       },
       {
@@ -7806,13 +8241,13 @@
         "description": "Cardano node syncing",
         "end": {
           "column": 3,
-          "line": 286
+          "line": 318
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeSyncing",
         "start": {
           "column": 22,
-          "line": 282
+          "line": 314
         }
       },
       {
@@ -7820,13 +8255,13 @@
         "description": "Cardano node in sync",
         "end": {
           "column": 3,
-          "line": 291
+          "line": 323
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.cardanoNodeInSync",
         "start": {
           "column": 21,
-          "line": 287
+          "line": 319
         }
       },
       {
@@ -7834,13 +8269,13 @@
         "description": "Checking...",
         "end": {
           "column": 3,
-          "line": 296
+          "line": 328
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.localTimeDifferenceChecking",
         "start": {
           "column": 31,
-          "line": 292
+          "line": 324
         }
       },
       {
@@ -7848,41 +8283,69 @@
         "description": "Check time",
         "end": {
           "column": 3,
-          "line": 301
+          "line": 333
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.localTimeDifferenceCheckTime",
         "start": {
           "column": 32,
-          "line": 297
+          "line": 329
         }
       },
       {
-        "defaultMessage": "!!!YES",
-        "description": "YES",
+        "defaultMessage": "!!!Yes",
+        "description": "Yes",
         "end": {
           "column": 3,
-          "line": 306
+          "line": 338
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.statusOn",
         "start": {
           "column": 12,
-          "line": 302
+          "line": 334
         }
       },
       {
-        "defaultMessage": "!!!NO",
-        "description": "NO",
+        "defaultMessage": "!!!No",
+        "description": "No",
         "end": {
           "column": 3,
-          "line": 311
+          "line": 343
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.statusOff",
         "start": {
           "column": 13,
-          "line": 307
+          "line": 339
+        }
+      },
+      {
+        "defaultMessage": "!!!On",
+        "description": "On",
+        "end": {
+          "column": 3,
+          "line": 348
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.statusOnForUserSettings",
+        "start": {
+          "column": 27,
+          "line": 344
+        }
+      },
+      {
+        "defaultMessage": "!!!Off",
+        "description": "Off",
+        "end": {
+          "column": 3,
+          "line": 353
+        },
+        "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
+        "id": "daedalus.diagnostics.dialog.statusOffForUserSettings",
+        "start": {
+          "column": 28,
+          "line": 349
         }
       },
       {
@@ -7890,13 +8353,13 @@
         "description": "NTP service unreachable",
         "end": {
           "column": 3,
-          "line": 316
+          "line": 358
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.serviceUnreachable",
         "start": {
           "column": 22,
-          "line": 312
+          "line": 354
         }
       },
       {
@@ -7904,13 +8367,13 @@
         "description": "message",
         "end": {
           "column": 3,
-          "line": 321
+          "line": 363
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.message",
         "start": {
           "column": 11,
-          "line": 317
+          "line": 359
         }
       },
       {
@@ -7918,13 +8381,13 @@
         "description": "code",
         "end": {
           "column": 3,
-          "line": 326
+          "line": 368
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.code",
         "start": {
           "column": 8,
-          "line": 322
+          "line": 364
         }
       },
       {
@@ -7932,13 +8395,13 @@
         "description": "Last network block",
         "end": {
           "column": 3,
-          "line": 331
+          "line": 373
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.lastNetworkBlock",
         "start": {
           "column": 20,
-          "line": 327
+          "line": 369
         }
       },
       {
@@ -7946,13 +8409,13 @@
         "description": "Last synchronized block",
         "end": {
           "column": 3,
-          "line": 336
+          "line": 378
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.lastSynchronizedBlock",
         "start": {
           "column": 25,
-          "line": 332
+          "line": 374
         }
       },
       {
@@ -7960,13 +8423,13 @@
         "description": "epoch",
         "end": {
           "column": 3,
-          "line": 341
+          "line": 383
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.epoch",
         "start": {
           "column": 9,
-          "line": 337
+          "line": 379
         }
       },
       {
@@ -7974,18 +8437,65 @@
         "description": "slot",
         "end": {
           "column": 3,
-          "line": 346
+          "line": 388
         },
         "file": "source/renderer/app/components/status/DaedalusDiagnostics.tsx",
         "id": "daedalus.diagnostics.dialog.slot",
         "start": {
           "column": 8,
-          "line": 342
+          "line": 384
         }
       }
     ],
     "path": "source/renderer/app/components/status/DaedalusDiagnostics.json"
   },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "!!!Catalyst API unavailable",
+        "description": "Title",
+        "end": {
+          "column": 3,
+          "line": 8
+        },
+        "file": "source/renderer/app/components/voting/voting-info/ApiError.messages.ts",
+        "id": "voting.apiError.title",
+        "start": {
+          "column": 9,
+          "line": 4
+        }
+      },
+      {
+        "defaultMessage": "!!!Unable to communicate with the API that retrieves the Catalyst date information.",
+        "description": "Description 1",
+        "end": {
+          "column": 3,
+          "line": 14
+        },
+        "file": "source/renderer/app/components/voting/voting-info/ApiError.messages.ts",
+        "id": "voting.apiError.description1",
+        "start": {
+          "column": 16,
+          "line": 9
+        }
+      },
+      {
+        "defaultMessage": "!!!Please, try again later.",
+        "description": "Description 2",
+        "end": {
+          "column": 3,
+          "line": 19
+        },
+        "file": "source/renderer/app/components/voting/voting-info/ApiError.messages.ts",
+        "id": "voting.apiError.description2",
+        "start": {
+          "column": 16,
+          "line": 15
+        }
+      }
+    ],
+    "path": "source/renderer/app/components/voting/voting-info/ApiError.messages.json"
+  },
   {
     "descriptors": [
       {
@@ -8341,13 +8851,13 @@
         "description": "Description on the voting registration \"choose wallet\" step.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx",
         "id": "voting.votingRegistration.chooseWallet.step.description",
         "start": {
           "column": 15,
-          "line": 12
+          "line": 11
         }
       },
       {
@@ -8355,13 +8865,13 @@
         "description": "Label \"Wallet\" for select input on the voting registration \"choose wallet\" step.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx",
         "id": "voting.votingRegistration.chooseWallet.step.selectWalletInputLabel",
         "start": {
           "column": 26,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -8375,7 +8885,7 @@
         "id": "voting.votingRegistration.chooseWallet.step.selectWalletInputPlaceholder",
         "start": {
           "column": 32,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -8397,7 +8907,7 @@
         "description": "errorMinVotingFundsRewardsOnly Error Label on the voting registration \"choose wallet\" step.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 44
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx",
         "id": "voting.votingRegistration.chooseWallet.step.errorMinVotingFundsRewardsOnly",
@@ -8411,13 +8921,13 @@
         "description": "Byron wallet error message on the voting registration \"choose wallet\" step.",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 51
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx",
         "id": "voting.votingRegistration.chooseWallet.step.errorLegacyWallet",
         "start": {
           "column": 21,
-          "line": 44
+          "line": 45
         }
       },
       {
@@ -8425,13 +8935,13 @@
         "description": "Restoring wallet error message on the voting registration \"choose wallet\" step.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 58
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx",
         "id": "voting.votingRegistration.chooseWallet.step.errorRestoringWallet",
         "start": {
           "column": 24,
-          "line": 51
+          "line": 52
         }
       },
       {
@@ -8439,13 +8949,13 @@
         "description": "Label for continue button on the voting registration \"choose wallet\" step.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 64
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsChooseWallet.tsx",
         "id": "voting.votingRegistration.chooseWallet.step.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 58
+          "line": 59
         }
       }
     ],
@@ -8589,13 +9099,13 @@
         "description": "Description on the voting registration \"enter pin code\" step.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 23
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.description",
         "start": {
           "column": 15,
-          "line": 21
+          "line": 17
         }
       },
       {
@@ -8603,13 +9113,13 @@
         "description": "Reminder on the voting registration \"enter pin code\" step.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 29
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.reminder",
         "start": {
           "column": 12,
-          "line": 28
+          "line": 24
         }
       },
       {
@@ -8617,13 +9127,13 @@
         "description": "Label for pin code input on the voting registration \"enter pin code\" step.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 35
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.enterPinCodeLabel",
         "start": {
           "column": 21,
-          "line": 34
+          "line": 30
         }
       },
       {
@@ -8631,13 +9141,13 @@
         "description": "Label for repeat pin code on the voting registration \"enter pin code\" step.",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 41
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.repeatPinCodeLabel",
         "start": {
           "column": 22,
-          "line": 40
+          "line": 36
         }
       },
       {
@@ -8645,13 +9155,13 @@
         "description": "Error message shown when repeat pin code is invalid.",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 46
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.errors.invalidPinCode",
         "start": {
           "column": 18,
-          "line": 46
+          "line": 42
         }
       },
       {
@@ -8659,13 +9169,13 @@
         "description": "Error message shown when repeat pin code is invalid.",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 52
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.errors.invalidRepeatPinCode",
         "start": {
           "column": 24,
-          "line": 51
+          "line": 47
         }
       },
       {
@@ -8673,13 +9183,13 @@
         "description": "Label for continue button on the voting registration \"enter pin code\" step.",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 58
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode.tsx",
         "id": "voting.votingRegistration.enterPinCode.step.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 56
+          "line": 53
         }
       }
     ],
@@ -8692,13 +9202,13 @@
         "description": "Qr code title on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.qrCodeTitle",
         "start": {
           "column": 15,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -8706,13 +9216,13 @@
         "description": "Part 1 of Qr code description of use on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.qrCodeDescription1",
         "start": {
           "column": 22,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -8720,13 +9230,13 @@
         "description": "Part 2 of Qr code description of use on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.qrCodeDescription2",
         "start": {
           "column": 22,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -8734,13 +9244,13 @@
         "description": "Qr code warning on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.qrCodeWarning",
         "start": {
           "column": 17,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -8748,13 +9258,13 @@
         "description": "First checkbox label on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.checkbox1Label",
         "start": {
           "column": 18,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -8762,13 +9272,13 @@
         "description": "Second checkbox label on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 50
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.checkbox2Label",
         "start": {
           "column": 18,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -8776,13 +9286,13 @@
         "description": "\"Close\" button label on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 56
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.closeButtonLabel",
         "start": {
           "column": 20,
-          "line": 52
+          "line": 51
         }
       },
       {
@@ -8790,13 +9300,13 @@
         "description": "\"Save as PDF\" button label on the voting registration \"qr code\" step.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 62
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode.tsx",
         "id": "voting.votingRegistration.qrCode.step.saveAsPdfButtonLabel",
         "start": {
           "column": 24,
-          "line": 58
+          "line": 57
         }
       }
     ],
@@ -8809,13 +9319,13 @@
         "description": "Description on the voting registration \"sign\" step.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 31
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.description",
         "start": {
           "column": 15,
-          "line": 28
+          "line": 26
         }
       },
       {
@@ -8823,13 +9333,13 @@
         "description": "Label for continue button on the voting registration \"sign\" step.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 37
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 34
+          "line": 32
         }
       },
       {
@@ -8837,13 +9347,13 @@
         "description": "Fees label on the voting registration \"sign\" step.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 42
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.feesLabel",
         "start": {
           "column": 13,
-          "line": 40
+          "line": 38
         }
       },
       {
@@ -8851,13 +9361,13 @@
         "description": "Placeholder for \"spending password\"",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 47
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.spendingPasswordPlaceholder",
         "start": {
           "column": 31,
-          "line": 45
+          "line": 43
         }
       },
       {
@@ -8865,13 +9375,13 @@
         "description": "Label for \"spending password\"",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 52
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.spendingPasswordLabel",
         "start": {
           "column": 25,
-          "line": 50
+          "line": 48
         }
       },
       {
@@ -8879,13 +9389,13 @@
         "description": "\"Calculating fees\" message in the \"sign\" step.",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 57
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.calculatingFees",
         "start": {
           "column": 19,
-          "line": 55
+          "line": 53
         }
       },
       {
@@ -8893,13 +9403,13 @@
         "description": "\"Learn more\" link on the \"sign\" step.",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 62
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.learnMoreLink",
         "start": {
           "column": 17,
-          "line": 60
+          "line": 58
         }
       },
       {
@@ -8907,13 +9417,13 @@
         "description": "Learn more\" link URL on the \"sign\" step.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 68
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsRegister.tsx",
         "id": "voting.votingRegistration.register.step.learntMoreLinkUrl",
         "start": {
           "column": 21,
-          "line": 65
+          "line": 63
         }
       }
     ],
@@ -8926,13 +9436,13 @@
         "description": "Headline for the voting registration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 16
+          "line": 15
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx",
         "id": "voting.votingRegistration.dialog.confirmation.headline",
         "start": {
           "column": 12,
-          "line": 11
+          "line": 10
         }
       },
       {
@@ -8940,13 +9450,13 @@
         "description": "Content for the voting registration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx",
         "id": "voting.votingRegistration.dialog.confirmation.content",
         "start": {
           "column": 11,
-          "line": 17
+          "line": 16
         }
       },
       {
@@ -8960,7 +9470,7 @@
         "id": "voting.votingRegistration.dialog.confirmation.button.cancelButtonLabel",
         "start": {
           "column": 21,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -8968,7 +9478,7 @@
         "description": "\"Continue registration\" button label for the voting registration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 36
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/ConfirmationDialog.tsx",
         "id": "voting.votingRegistration.dialog.confirmation.button.confirmButtonLabel",
@@ -8987,13 +9497,13 @@
         "description": "Tile \"Register to vote\" for voting registration",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/VotingRegistrationDialog.tsx",
         "id": "voting.votingRegistration.dialog.dialogTitle",
         "start": {
           "column": 15,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -9001,13 +9511,13 @@
         "description": "Sub title for voting registration",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/voting/voting-registration-wizard-steps/widgets/VotingRegistrationDialog.tsx",
         "id": "voting.votingRegistration.dialog.subtitle",
         "start": {
           "column": 12,
-          "line": 23
+          "line": 22
         }
       }
     ],
@@ -9020,13 +9530,13 @@
         "description": "\"Newsletter\" link for Project Catalyst footer",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 20
         },
         "file": "source/renderer/app/components/voting/VotingFooterLinks.tsx",
         "id": "voting.catalystFooterLinks.newsletter",
         "start": {
           "column": 14,
-          "line": 17
+          "line": 16
         }
       },
       {
@@ -9034,13 +9544,13 @@
         "description": "\"Announcements Channel\" link for Project Catalyst footer",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/voting/VotingFooterLinks.tsx",
         "id": "voting.catalystFooterLinks.announcements",
         "start": {
           "column": 17,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -9048,13 +9558,13 @@
         "description": "\"Community Chat\" link for Project Catalyst footer",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/voting/VotingFooterLinks.tsx",
         "id": "voting.catalystFooterLinks.community",
         "start": {
           "column": 13,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -9062,13 +9572,13 @@
         "description": "\"Projects\" link for Project Catalyst footer",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/voting/VotingFooterLinks.tsx",
         "id": "voting.catalystFooterLinks.projects",
         "start": {
           "column": 12,
-          "line": 32
+          "line": 31
         }
       }
     ],
@@ -9081,13 +9591,13 @@
         "description": "\"No wallets\" headLine on the voting info page.",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 16
         },
         "file": "source/renderer/app/components/voting/VotingNoWallets.tsx",
         "id": "voting.info.noWallets.headLine",
         "start": {
           "column": 12,
-          "line": 14
+          "line": 11
         }
       },
       {
@@ -9095,13 +9605,13 @@
         "description": "\"No wallets\" instructions on the voting info page.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 22
         },
         "file": "source/renderer/app/components/voting/VotingNoWallets.tsx",
         "id": "voting.info.noWallets.instructions",
         "start": {
           "column": 16,
-          "line": 20
+          "line": 17
         }
       },
       {
@@ -9109,13 +9619,13 @@
         "description": "Label for \"Create New Wallet\" button on the voting info page.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 28
         },
         "file": "source/renderer/app/components/voting/VotingNoWallets.tsx",
         "id": "voting.info.noWallets.createWalletButtonLabel",
         "start": {
           "column": 27,
-          "line": 26
+          "line": 23
         }
       }
     ],
@@ -9128,13 +9638,13 @@
         "description": "Instructions for backing up wallet recovery phrase on dialog that displays wallet recovery phrase.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx",
         "id": "wallet.backup.privacy.warning.dialog.recoveryPhraseInstructions1",
         "start": {
           "column": 31,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -9142,13 +9652,13 @@
         "description": "Instructions for backing up wallet recovery phrase on dialog that displays wallet recovery phrase.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx",
         "id": "wallet.backup.privacy.warning.dialog.recoveryPhraseInstructions2",
         "start": {
           "column": 31,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -9156,13 +9666,13 @@
         "description": "Instructions for backing up wallet recovery phrase on dialog that displays wallet recovery phrase.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx",
         "id": "wallet.backup.privacy.warning.dialog.recoveryPhraseInstructions3",
         "start": {
           "column": 31,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -9170,13 +9680,13 @@
         "description": "Label for button \"Continue\" on wallet backup dialog",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx",
         "id": "wallet.backup.privacy.warning.dialog.button.labelContinue",
         "start": {
           "column": 23,
-          "line": 37
+          "line": 36
         }
       },
       {
@@ -9184,13 +9694,13 @@
         "description": "Label for the checkbox on wallet backup dialog describing that nobody should be watching when recovery phrase is shown",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletBackupPrivacyWarningDialog.tsx",
         "id": "wallet.backup.privacy.warning.dialog.checkbox.label.nobodyWatching",
         "start": {
           "column": 22,
-          "line": 42
+          "line": 41
         }
       }
     ],
@@ -9203,13 +9713,13 @@
         "description": "Instructions for backing up wallet recovery phrase on dialog that displays wallet recovery phrase.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseDisplayDialog.tsx",
         "id": "wallet.backup.recovery.phrase.display.dialog.backup.instructions",
         "start": {
           "column": 22,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -9223,7 +9733,7 @@
         "id": "wallet.backup.recovery.phrase.display.dialog.button.label.iHaveWrittenItDown",
         "start": {
           "column": 33,
-          "line": 23
+          "line": 22
         }
       }
     ],
@@ -9236,13 +9746,13 @@
         "description": "Instructions for verifying wallet recovery phrase on dialog for entering wallet recovery phrase.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.verification.instructions",
         "start": {
           "column": 28,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -9250,13 +9760,13 @@
         "description": "Label for the recovery phrase input on dialog for entering wallet recovery phrase.",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.recoveryPhraseInputLabel",
         "start": {
           "column": 28,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -9264,13 +9774,13 @@
         "description": "Placeholder hint for the mnemonics autocomplete.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.recoveryPhraseInputHint",
         "start": {
           "column": 27,
-          "line": 42
+          "line": 41
         }
       },
       {
@@ -9284,7 +9794,7 @@
         "id": "wallet.backup.recovery.phrase.entry.dialog.recoveryPhraseInputPlaceholder",
         "start": {
           "column": 34,
-          "line": 47
+          "line": 46
         }
       },
       {
@@ -9292,7 +9802,7 @@
         "description": "\"No results\" message for the recovery phrase input search results.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 58
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.recoveryPhraseInputNoResults",
@@ -9306,13 +9816,13 @@
         "description": "Error message shown when invalid recovery phrase was entered.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.recoveryPhraseInvalidMnemonics",
         "start": {
           "column": 34,
-          "line": 58
+          "line": 59
         }
       },
       {
@@ -9320,13 +9830,13 @@
         "description": "Label for button \"Confirm\" on wallet backup dialog",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 70
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.recovery.phrase.show.entry.dialog.button.labelConfirm",
         "start": {
           "column": 22,
-          "line": 64
+          "line": 66
         }
       },
       {
@@ -9334,13 +9844,13 @@
         "description": "Term on wallet creation to store recovery phrase offline",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 77
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.terms.and.condition.offline",
         "start": {
           "column": 15,
-          "line": 69
+          "line": 71
         }
       },
       {
@@ -9348,13 +9858,13 @@
         "description": "Term and condition on wallet backup dialog describing that wallet can only be recovered with a security phrase",
         "end": {
           "column": 3,
-          "line": 81
+          "line": 85
         },
         "file": "source/renderer/app/components/wallet/backup-recovery/WalletRecoveryPhraseEntryDialog.tsx",
         "id": "wallet.backup.recovery.phrase.entry.dialog.terms.and.condition.recovery",
         "start": {
           "column": 16,
-          "line": 75
+          "line": 78
         }
       }
     ],
@@ -9484,13 +9994,13 @@
         "description": "Title on the NotResponding dialog.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/not-responding/NotResponding.tsx",
         "id": "wallet.notResponding.title",
         "start": {
           "column": 9,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -9498,13 +10008,13 @@
         "description": "Description on the NotResponding dialog.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/not-responding/NotResponding.tsx",
         "id": "wallet.notResponding.description",
         "start": {
           "column": 15,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -9512,13 +10022,13 @@
         "description": "Restart Node Button Label on the NotResponding dialog.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/not-responding/NotResponding.tsx",
         "id": "wallet.notResponding.restartNodeButtonLabel",
         "start": {
           "column": 26,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -9526,13 +10036,13 @@
         "description": "Submit Support Request Label on the NotResponding dialog",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/wallet/not-responding/NotResponding.tsx",
         "id": "wallet.notResponding.submitSupportRequestLabel",
         "start": {
           "column": 29,
-          "line": 35
+          "line": 34
         }
       },
       {
@@ -9540,13 +10050,13 @@
         "description": "Submit Support Request Url on the NotResponding dialog",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/wallet/not-responding/NotResponding.tsx",
         "id": "wallet.notResponding.submitSupportRequestUrl",
         "start": {
           "column": 27,
-          "line": 40
+          "line": 39
         }
       }
     ],
@@ -9559,13 +10069,13 @@
         "description": "Headline for the \"Paper wallet create certificate completion dialog\" headline.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 23
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.headline",
         "start": {
           "column": 12,
-          "line": 20
+          "line": 18
         }
       },
       {
@@ -9573,13 +10083,13 @@
         "description": "Headline for the \"Paper wallet create certificate completion dialog\" subtitle.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.subtitle",
         "start": {
           "column": 12,
-          "line": 26
+          "line": 24
         }
       },
       {
@@ -9587,13 +10097,13 @@
         "description": "Headline for the \"Paper wallet create certificate completion dialog\" link instructions.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.linkInstructions",
         "start": {
           "column": 20,
-          "line": 33
+          "line": 31
         }
       },
       {
@@ -9601,13 +10111,13 @@
         "description": "Headline for the \"Paper wallet create certificate completion dialog\" address instructions.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 44
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.addressInstructions",
         "start": {
           "column": 23,
-          "line": 40
+          "line": 38
         }
       },
       {
@@ -9615,13 +10125,13 @@
         "description": "\"Paper wallet create certificate completion dialog\" cardano link label.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 50
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.cardanoLinkLabel",
         "start": {
           "column": 20,
-          "line": 47
+          "line": 45
         }
       },
       {
@@ -9629,13 +10139,13 @@
         "description": "\"Paper wallet create certificate completion dialog\" address copied.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 56
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.addressCopiedLabel",
         "start": {
           "column": 22,
-          "line": 53
+          "line": 51
         }
       },
       {
@@ -9643,13 +10153,13 @@
         "description": "\"Paper wallet create certificate completion dialog\" wallet address label.",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 62
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.addressLabel",
         "start": {
           "column": 16,
-          "line": 59
+          "line": 57
         }
       },
       {
@@ -9657,13 +10167,13 @@
         "description": "\"Paper wallet create certificate completion dialog\" finish button label.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 68
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog.tsx",
         "id": "paper.wallet.create.certificate.completion.dialog.finishButtonLabel",
         "start": {
           "column": 21,
-          "line": 65
+          "line": 63
         }
       }
     ],
@@ -9676,13 +10186,13 @@
         "description": "Headline for the paper wallet certificate cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 15
+          "line": 14
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx",
         "id": "paper.wallet.create.certificate.confirmation.dialog.headline",
         "start": {
           "column": 12,
-          "line": 10
+          "line": 9
         }
       },
       {
@@ -9690,13 +10200,13 @@
         "description": "Content for the paper wallet certificate cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx",
         "id": "paper.wallet.create.certificate.confirmation.dialog.contentPart1",
         "start": {
           "column": 12,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -9704,13 +10214,13 @@
         "description": "Content for the paper wallet certificate cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx",
         "id": "paper.wallet.create.certificate.confirmation.dialog.contentPart2",
         "start": {
           "column": 12,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -9718,13 +10228,13 @@
         "description": "\"Cancel\" button label for the paper wallet certificate cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx",
         "id": "paper.wallet.create.certificate.confirmation.dialog.button.backLabel",
         "start": {
           "column": 21,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -9732,13 +10242,13 @@
         "description": "\"Abort\" button label for the paper wallet certificate cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/ConfirmationDialog.tsx",
         "id": "paper.wallet.create.certificate.confirmation.dialog.button.abortLabel",
         "start": {
           "column": 22,
-          "line": 36
+          "line": 35
         }
       }
     ],
@@ -9751,13 +10261,13 @@
         "description": "Headline for the \"Paper wallet create certificate instructions dialog\".",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.headline",
         "start": {
           "column": 12,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -9765,13 +10275,13 @@
         "description": "Subtitle for the \"Paper wallet create certificate instructions dialog\".",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.subtitle",
         "start": {
           "column": 12,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -9779,13 +10289,13 @@
         "description": "subtitle2 for the \"Paper wallet create certificate instructions dialog\".",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.subtitle2",
         "start": {
           "column": 13,
-          "line": 35
+          "line": 34
         }
       },
       {
@@ -9799,7 +10309,7 @@
         "id": "paper.wallet.create.certificate.instructions.dialog.instructionsList.label",
         "start": {
           "column": 25,
-          "line": 42
+          "line": 41
         }
       },
       {
@@ -9807,7 +10317,7 @@
         "description": "Wallet certificate create instructions dialog definition 1.",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 56
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.instructionsList.definition1",
@@ -9821,13 +10331,13 @@
         "description": "Wallet certificate create instructions dialog definition 2.",
         "end": {
           "column": 3,
-          "line": 62
+          "line": 64
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.instructionsList.definition2",
         "start": {
           "column": 31,
-          "line": 56
+          "line": 57
         }
       },
       {
@@ -9835,13 +10345,13 @@
         "description": "Wallet certificate create instructions dialog definition 3.",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 71
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.instructionsList.definition3",
         "start": {
           "column": 31,
-          "line": 63
+          "line": 65
         }
       },
       {
@@ -9849,13 +10359,13 @@
         "description": "Wallet certificate create instructions dialog definition 4.",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 78
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.instructionsList.definition4",
         "start": {
           "column": 31,
-          "line": 69
+          "line": 72
         }
       },
       {
@@ -9863,13 +10373,13 @@
         "description": "Wallet certificate create instructions dialog definition 5.",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 85
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.instructionsList.definition5",
         "start": {
           "column": 31,
-          "line": 75
+          "line": 79
         }
       },
       {
@@ -9877,13 +10387,13 @@
         "description": "Wallet certificate create instructions dialog - printing instructions.",
         "end": {
           "column": 3,
-          "line": 88
+          "line": 94
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.printingInstructions",
         "start": {
           "column": 24,
-          "line": 81
+          "line": 86
         }
       },
       {
@@ -9891,13 +10401,13 @@
         "description": "Wallet certificate create instructions dialog \"Cardano Explorer\" label",
         "end": {
           "column": 3,
-          "line": 94
+          "line": 100
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.cardanoExplorer",
         "start": {
           "column": 19,
-          "line": 89
+          "line": 95
         }
       },
       {
@@ -9905,13 +10415,13 @@
         "description": "\"Wallet certificate create instructions dialog\" print button label.",
         "end": {
           "column": 3,
-          "line": 100
+          "line": 106
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/InstructionsDialog.tsx",
         "id": "paper.wallet.create.certificate.instructions.dialog.button.printLabel",
         "start": {
           "column": 20,
-          "line": 95
+          "line": 101
         }
       }
     ],
@@ -9924,13 +10434,13 @@
         "description": "Headline for the \"Paper wallet create certificate print dialog\".",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx",
         "id": "paper.wallet.create.certificate.print.dialog.headline",
         "start": {
           "column": 12,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -9938,13 +10448,13 @@
         "description": "\"Paper wallet create certificate print dialog\" subtitle.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx",
         "id": "paper.wallet.create.certificate.print.dialog.subtitle",
         "start": {
           "column": 12,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -9952,13 +10462,13 @@
         "description": "\"Paper wallet create certificate print dialog\" info.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx",
         "id": "paper.wallet.create.certificate.print.dialog.info",
         "start": {
           "column": 8,
-          "line": 31
+          "line": 30
         }
       },
       {
@@ -9972,7 +10482,7 @@
         "id": "paper.wallet.create.certificate.print.dialog.certificatePrintedConfirmation",
         "start": {
           "column": 39,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -9980,7 +10490,7 @@
         "description": "\"Paper wallet create certificate print dialog\" certificate readable confirmation.",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 52
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx",
         "id": "paper.wallet.create.certificate.print.dialog.certificateReadableConfirmation",
@@ -9994,13 +10504,13 @@
         "description": "\"Paper wallet create certificate print dialog\" QR scannable confirmation.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 58
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/PrintDialog.tsx",
         "id": "paper.wallet.create.certificate.print.dialog.qrScannableConfirmation",
         "start": {
           "column": 32,
-          "line": 52
+          "line": 53
         }
       }
     ],
@@ -10013,13 +10523,13 @@
         "description": "Headline for the \"Paper wallet create certificate securing password dialog\".",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx",
         "id": "paper.wallet.create.certificate.securingPassword.dialog.headline",
         "start": {
           "column": 12,
-          "line": 17
+          "line": 16
         }
       },
       {
@@ -10027,13 +10537,13 @@
         "description": "\"Paper wallet create certificate securing password dialog\" first info label.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx",
         "id": "paper.wallet.create.certificate.securingPassword.dialog.infoLabel1",
         "start": {
           "column": 14,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -10041,13 +10551,13 @@
         "description": "You may write the remaining words here:",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/SecuringPasswordDialog.tsx",
         "id": "paper.wallet.create.certificate.securingPassword.dialog.infoLabel2",
         "start": {
           "column": 14,
-          "line": 31
+          "line": 30
         }
       },
       {
@@ -10061,7 +10571,7 @@
         "id": "paper.wallet.create.certificate.securingPassword.dialog.securingPasswordConfirmation",
         "start": {
           "column": 32,
-          "line": 37
+          "line": 36
         }
       }
     ],
@@ -10074,13 +10584,13 @@
         "description": "Headline for the \"Paper wallet create certificate verification dialog\".",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.headline",
         "start": {
           "column": 12,
-          "line": 26
+          "line": 25
         }
       },
       {
@@ -10088,13 +10598,13 @@
         "description": "\"Paper wallet create certificate verification dialog\" subtitle.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.subtitle",
         "start": {
           "column": 12,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -10102,13 +10612,13 @@
         "description": "\"Paper wallet create certificate verification dialog\" subtitle.",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 44
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.instructions",
         "start": {
           "column": 16,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -10122,7 +10632,7 @@
         "id": "paper.wallet.create.certificate.verification.dialog.recoveryPhrase.label",
         "start": {
           "column": 23,
-          "line": 46
+          "line": 45
         }
       },
       {
@@ -10130,7 +10640,7 @@
         "description": "\"Paper wallet create certificate verification dialog\" recovery phrase hint.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 58
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.recoveryPhrase.hint",
@@ -10144,13 +10654,13 @@
         "description": "\"Paper wallet create certificate verification dialog\" recovery phrase no results label.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.recoveryPhrase.noResults",
         "start": {
           "column": 27,
-          "line": 58
+          "line": 59
         }
       },
       {
@@ -10158,13 +10668,13 @@
         "description": "\"Paper wallet create certificate verification dialog\" button clear label.",
         "end": {
           "column": 3,
-          "line": 69
+          "line": 71
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.button.clearLabel",
         "start": {
           "column": 20,
-          "line": 64
+          "line": 66
         }
       },
       {
@@ -10172,13 +10682,13 @@
         "description": "\"Paper wallet create certificate verification dialog\" storing understandance confirmation.",
         "end": {
           "column": 3,
-          "line": 76
+          "line": 79
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.storingUnderstandanceConfirmationLabel",
         "start": {
           "column": 30,
-          "line": 70
+          "line": 72
         }
       },
       {
@@ -10186,13 +10696,13 @@
         "description": "\"Paper wallet create certificate verification dialog\" recovering understandance confirmation.",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 87
         },
         "file": "source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog.tsx",
         "id": "paper.wallet.create.certificate.verification.dialog.recoveringUnderstandanceConfirmationLabel",
         "start": {
           "column": 33,
-          "line": 77
+          "line": 80
         }
       }
     ],
@@ -10205,13 +10715,13 @@
         "description": "Instructions Title on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/receive/AddressActions.tsx",
         "id": "wallet.receive.page.instructions.instructionsTitle",
         "start": {
           "column": 21,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -10219,13 +10729,13 @@
         "description": "Instructions Description on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/wallet/receive/AddressActions.tsx",
         "id": "wallet.receive.page.instructions.instructionsDescription",
         "start": {
           "column": 27,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -10233,13 +10743,13 @@
         "description": "Addresses Title on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/receive/AddressActions.tsx",
         "id": "wallet.receive.page.addresses.addressesTitle",
         "start": {
           "column": 18,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -10247,13 +10757,13 @@
         "description": "Label for \"show used\" wallet addresses link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/wallet/receive/AddressActions.tsx",
         "id": "wallet.receive.page.showUsedLabel",
         "start": {
           "column": 17,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -10261,13 +10771,13 @@
         "description": "Label for \"Share\" link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 41
         },
         "file": "source/renderer/app/components/wallet/receive/AddressActions.tsx",
         "id": "wallet.receive.page.shareAddressLabel",
         "start": {
           "column": 21,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -10275,13 +10785,13 @@
         "description": "Label for \"Copy address\" link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 46
         },
         "file": "source/renderer/app/components/wallet/receive/AddressActions.tsx",
         "id": "wallet.receive.page.copyAddressLabel",
         "start": {
           "column": 20,
-          "line": 43
+          "line": 42
         }
       }
     ],
@@ -10294,13 +10804,13 @@
         "description": "placeholder on the wallet \"Share Address\" dialog",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 36
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.inputLabel",
         "start": {
           "column": 14,
-          "line": 34
+          "line": 32
         }
       },
       {
@@ -10308,13 +10818,13 @@
         "description": "inputPlaceholder on the wallet \"Share Address\" dialog",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 41
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.inputPlaceholder",
         "start": {
           "column": 20,
-          "line": 39
+          "line": 37
         }
       },
       {
@@ -10322,13 +10832,13 @@
         "description": "saveQRCodeImage on the wallet \"Share Address\" dialog",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 46
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.saveQRCodeImage",
         "start": {
           "column": 19,
-          "line": 44
+          "line": 42
         }
       },
       {
@@ -10336,13 +10846,13 @@
         "description": "downloadPDFButton on the wallet \"Share Address\" dialog",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 51
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.downloadPDFButton",
         "start": {
           "column": 21,
-          "line": 49
+          "line": 47
         }
       },
       {
@@ -10350,13 +10860,13 @@
         "description": "dialogTitle on the wallet \"Share Address\" dialog",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 56
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.dialogTitle",
         "start": {
           "column": 15,
-          "line": 54
+          "line": 52
         }
       },
       {
@@ -10364,13 +10874,13 @@
         "description": "Label for \"Copy address\" link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 61
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.copyAddressLabel",
         "start": {
           "column": 20,
-          "line": 59
+          "line": 57
         }
       },
       {
@@ -10378,13 +10888,13 @@
         "description": "Tooltip for the receiving address path",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 66
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.spendingPathTooltip",
         "start": {
           "column": 23,
-          "line": 64
+          "line": 62
         }
       },
       {
@@ -10392,13 +10902,13 @@
         "description": "Tooltip for the rewards address path",
         "end": {
           "column": 3,
-          "line": 73
+          "line": 71
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.stakingPathTooltip",
         "start": {
           "column": 22,
-          "line": 69
+          "line": 67
         }
       },
       {
@@ -10406,13 +10916,13 @@
         "description": "Support request button label",
         "end": {
           "column": 3,
-          "line": 78
+          "line": 76
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.supportRequestButtonLabel",
         "start": {
           "column": 29,
-          "line": 74
+          "line": 72
         }
       },
       {
@@ -10420,13 +10930,13 @@
         "description": "Support request link URL",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 81
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.supportRequestLinkUrl",
         "start": {
           "column": 25,
-          "line": 79
+          "line": 77
         }
       },
       {
@@ -10434,13 +10944,13 @@
         "description": "Invalid address confirmation checkbox label",
         "end": {
           "column": 3,
-          "line": 89
+          "line": 87
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.invalidAddressConfirmationLabel",
         "start": {
           "column": 35,
-          "line": 84
+          "line": 82
         }
       },
       {
@@ -10448,13 +10958,13 @@
         "description": "Verification options section label",
         "end": {
           "column": 3,
-          "line": 94
+          "line": 92
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.verificationCheckOptionsLabel",
         "start": {
           "column": 33,
-          "line": 90
+          "line": 88
         }
       },
       {
@@ -10462,13 +10972,13 @@
         "description": "Verification option \"Valid\" label",
         "end": {
           "column": 3,
-          "line": 99
+          "line": 97
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.verificationCheckOptionValid",
         "start": {
           "column": 32,
-          "line": 95
+          "line": 93
         }
       },
       {
@@ -10476,13 +10986,13 @@
         "description": "Verification option \"Invalid\" label",
         "end": {
           "column": 3,
-          "line": 105
+          "line": 103
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.verificationCheckOptionInvalid",
         "start": {
           "column": 34,
-          "line": 100
+          "line": 98
         }
       },
       {
@@ -10490,13 +11000,13 @@
         "description": "Verification option \"Reverify\" label",
         "end": {
           "column": 3,
-          "line": 110
+          "line": 108
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.verificationCheckOptionReverify",
         "start": {
           "column": 35,
-          "line": 106
+          "line": 104
         }
       },
       {
@@ -10504,13 +11014,13 @@
         "description": "Daedalus verification status check label",
         "end": {
           "column": 3,
-          "line": 115
+          "line": 113
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.softwareCheckLabel",
         "start": {
           "column": 22,
-          "line": 111
+          "line": 109
         }
       },
       {
@@ -10518,13 +11028,13 @@
         "description": "User verification status check label",
         "end": {
           "column": 3,
-          "line": 120
+          "line": 118
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.confirmationCheckLabel",
         "start": {
           "column": 26,
-          "line": 116
+          "line": 114
         }
       },
       {
@@ -10532,13 +11042,13 @@
         "description": "Address verification instructions",
         "end": {
           "column": 3,
-          "line": 126
+          "line": 124
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.addressVerificationInstructions",
         "start": {
           "column": 35,
-          "line": 121
+          "line": 119
         }
       },
       {
@@ -10546,13 +11056,13 @@
         "description": "Invalid address \"Warning\" title",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 129
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.invalidAddressWarningTitle",
         "start": {
           "column": 30,
-          "line": 127
+          "line": 125
         }
       },
       {
@@ -10560,13 +11070,13 @@
         "description": "Invalid address \"Warning\" description",
         "end": {
           "column": 3,
-          "line": 137
+          "line": 135
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveDialog.tsx",
         "id": "wallet.receive.dialog.invalidAddressWarningDescription",
         "start": {
           "column": 36,
-          "line": 132
+          "line": 130
         }
       }
     ],
@@ -10579,13 +11089,13 @@
         "description": "Label for wallet address on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.walletAddressLabel",
         "start": {
           "column": 22,
-          "line": 28
+          "line": 26
         }
       },
       {
@@ -10593,13 +11103,13 @@
         "description": "Wallet receive payments instructions on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.walletReceiveInstructions",
         "start": {
           "column": 29,
-          "line": 33
+          "line": 31
         }
       },
       {
@@ -10607,13 +11117,13 @@
         "description": "Label for \"Generate new address\" button on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 43
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.generateNewAddressButtonLabel",
         "start": {
           "column": 33,
-          "line": 40
+          "line": 38
         }
       },
       {
@@ -10621,13 +11131,13 @@
         "description": "\"Generated addresses\" section title on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 49
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.receivingAddressesSectionTitle",
         "start": {
           "column": 34,
-          "line": 46
+          "line": 44
         }
       },
       {
@@ -10635,13 +11145,13 @@
         "description": "Label for \"show used\" wallet addresses link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 55
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.showUsedLabel",
         "start": {
           "column": 17,
-          "line": 52
+          "line": 50
         }
       },
       {
@@ -10649,13 +11159,13 @@
         "description": "Placeholder for \"spending password\" on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 61
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.spendingPasswordPlaceholder",
         "start": {
           "column": 31,
-          "line": 58
+          "line": 56
         }
       },
       {
@@ -10663,13 +11173,13 @@
         "description": "Label for \"Copy address\" link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 66
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveRandom.tsx",
         "id": "wallet.receive.page.copyAddressLabel",
         "start": {
           "column": 20,
-          "line": 64
+          "line": 62
         }
       }
     ],
@@ -10682,13 +11192,13 @@
         "description": "Instructions Title on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 18
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx",
         "id": "wallet.receive.page.instructions.instructionsTitle",
         "start": {
           "column": 21,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -10696,13 +11206,13 @@
         "description": "Instructions Description on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 24
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx",
         "id": "wallet.receive.page.instructions.instructionsDescription",
         "start": {
           "column": 27,
-          "line": 20
+          "line": 19
         }
       },
       {
@@ -10710,13 +11220,13 @@
         "description": "Privacy warning on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx",
         "id": "wallet.receive.page.instructions.privacyWarning",
         "start": {
           "column": 18,
-          "line": 26
+          "line": 25
         }
       },
       {
@@ -10724,13 +11234,13 @@
         "description": "Addresses Title on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx",
         "id": "wallet.receive.page.addresses.addressesTitle",
         "start": {
           "column": 18,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -10738,13 +11248,13 @@
         "description": "Label for \"show used\" wallet addresses link on the wallet \"Receive page\"",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 41
         },
         "file": "source/renderer/app/components/wallet/receive/WalletReceiveSequential.tsx",
         "id": "wallet.receive.page.showUsedLabel",
         "start": {
           "column": 17,
-          "line": 37
+          "line": 36
         }
       }
     ],
@@ -11073,6 +11583,62 @@
           "column": 24,
           "line": 128
         }
+      },
+      {
+        "defaultMessage": "!!!UPDATE",
+        "description": "Label for the \"UPDATE\" button responsible to set minimum amount required for transaction .",
+        "end": {
+          "column": 3,
+          "line": 139
+        },
+        "file": "source/renderer/app/components/wallet/send-form/messages.ts",
+        "id": "wallet.send.form.asset.updateAdaAmountButton",
+        "start": {
+          "column": 25,
+          "line": 134
+        }
+      },
+      {
+        "defaultMessage": "!!!to the minimum of {minimumAda} ADA required",
+        "description": "Description for the \"UPDATE\" button when ADA amount is less than required",
+        "end": {
+          "column": 3,
+          "line": 145
+        },
+        "file": "source/renderer/app/components/wallet/send-form/messages.ts",
+        "id": "wallet.send.form.updateAdaAmountDescription",
+        "start": {
+          "column": 30,
+          "line": 140
+        }
+      },
+      {
+        "defaultMessage": "!!!<b>Note:</b> the ada field was automatically updated because this transaction requires a minimum of {minimumAda} ADA.",
+        "description": "Minimum amount update notice",
+        "end": {
+          "column": 3,
+          "line": 151
+        },
+        "file": "source/renderer/app/components/wallet/send-form/messages.ts",
+        "id": "wallet.send.form.minimumAmountNote",
+        "start": {
+          "column": 23,
+          "line": 146
+        }
+      },
+      {
+        "defaultMessage": "!!!<b>Note:</b> the ada field was automatically updated to {adaAmount} ADA because now it fulfills the minimum amount of {minimumAda} ADA for the transaction.",
+        "description": "Restored ada amount to original user input",
+        "end": {
+          "column": 3,
+          "line": 157
+        },
+        "file": "source/renderer/app/components/wallet/send-form/messages.ts",
+        "id": "wallet.send.form.restoredAdaAmount",
+        "start": {
+          "column": 21,
+          "line": 152
+        }
       }
     ],
     "path": "source/renderer/app/components/wallet/send-form/messages.json"
@@ -11277,7 +11843,7 @@
       },
       {
         "defaultMessage": "!!!unformatted amount",
-        "description": "Label for \"unformated amount\"",
+        "description": "Label for \"unformatted amount\"",
         "end": {
           "column": 5,
           "line": 94
@@ -11291,10 +11857,10 @@
       },
       {
         "defaultMessage": "!!!Native assets may specify a number of decimal places, as defined in the Cardano token registry. Daedalus uses this information to format the amount that is being sent in the transaction.<br /><br />The native token unformatted amount is the amount without these decimal places. Please ensure that you verify both amounts, as some wallet software may not yet use the Cardano token registry.",
-        "description": "Message for \"unformated amount\"",
+        "description": "Message for \"unformatted amount\"",
         "end": {
           "column": 5,
-          "line": 100
+          "line": 101
         },
         "file": "source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts",
         "id": "wallet.send.confirmationDialog.unformattedAmountMessageForSoftwareWallets",
@@ -11305,16 +11871,16 @@
       },
       {
         "defaultMessage": "!!!Native assets may specify a number of decimal places, as defined in the Cardano token registry. Daedalus uses this information to format the amount that is being sent in the transaction.<br /><br />The native token unformatted amount is the amount without these decimal places. Please ensure that you verify both amounts, as some wallet software may not yet use the Cardano token registry.<br /><br />The native token unformatted amount will be displayed on the hardware wallet device during transaction confirmation.",
-        "description": "Message for \"unformated amount\"",
+        "description": "Message for \"unformatted amount\"",
         "end": {
           "column": 5,
-          "line": 106
+          "line": 108
         },
         "file": "source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts",
         "id": "wallet.send.confirmationDialog.unformattedAmountMessageForHardwareWallets",
         "start": {
           "column": 48,
-          "line": 101
+          "line": 102
         }
       },
       {
@@ -11322,13 +11888,13 @@
         "description": "Warning: This transaction will reduce your wallet's balance",
         "end": {
           "column": 5,
-          "line": 113
+          "line": 115
         },
         "file": "source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.messages.ts",
         "id": "wallet.send.confirmationDialog.emptyingWarning",
         "start": {
           "column": 21,
-          "line": 107
+          "line": 109
         }
       }
     ],
@@ -11341,13 +11907,13 @@
         "description": "Title for the \"Change wallet password\" dialog when there is no password set.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.title.setPassword",
         "start": {
           "column": 26,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -11355,13 +11921,13 @@
         "description": "Title for the \"Change wallet password\" dialog when there is already password set.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.title.changePassword",
         "start": {
           "column": 29,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -11369,13 +11935,13 @@
         "description": "Label for the \"Spending password\" input in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.spendingPasswordLabel",
         "start": {
           "column": 25,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -11383,13 +11949,13 @@
         "description": "Label for the \"Current password\" input in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 49
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.currentPasswordLabel",
         "start": {
           "column": 24,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -11397,13 +11963,13 @@
         "description": "Label for the \"New password\" input in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 55
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.newPasswordLabel",
         "start": {
           "column": 20,
-          "line": 51
+          "line": 50
         }
       },
       {
@@ -11411,13 +11977,13 @@
         "description": "Label for the \"Repeat password\" input in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 62
+          "line": 61
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.repeatPasswordLabel",
         "start": {
           "column": 23,
-          "line": 57
+          "line": 56
         }
       },
       {
@@ -11425,13 +11991,13 @@
         "description": "Placeholder for the \"Current password\" inputs in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 67
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.currentPasswordFieldPlaceholder",
         "start": {
           "column": 35,
-          "line": 63
+          "line": 62
         }
       },
       {
@@ -11439,13 +12005,13 @@
         "description": "Placeholder for the \"New password\" inputs in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 73
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.newPasswordFieldPlaceholder",
         "start": {
           "column": 31,
-          "line": 69
+          "line": 68
         }
       },
       {
@@ -11453,13 +12019,13 @@
         "description": "Placeholder for the \"Repeat password\" inputs in the change wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 79
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.settings.changePassword.dialog.repeatPasswordFieldPlaceholder",
         "start": {
           "column": 34,
-          "line": 75
+          "line": 74
         }
       },
       {
@@ -11467,13 +12033,13 @@
         "description": "Tooltip for the password input in the wallet dialog.",
         "end": {
           "column": 3,
-          "line": 86
+          "line": 85
         },
         "file": "source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx",
         "id": "wallet.dialog.passwordTooltip",
         "start": {
           "column": 19,
-          "line": 81
+          "line": 80
         }
       }
     ],
@@ -11486,13 +12052,13 @@
         "description": "Label for the delegate button on wallet settings",
         "end": {
           "column": 3,
-          "line": 12
+          "line": 11
         },
         "file": "source/renderer/app/components/wallet/settings/DelegateWalletButton.tsx",
         "id": "wallet.settings.delegateWalletButtonLabel",
         "start": {
           "column": 9,
-          "line": 8
+          "line": 7
         }
       }
     ],
@@ -11505,13 +12071,13 @@
         "description": "Delete wallet header on the wallet settings page.",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/wallet/settings/DeleteWallet.tsx",
         "id": "wallet.settings.deleteWallet.header",
         "start": {
           "column": 22,
-          "line": 14
+          "line": 13
         }
       },
       {
@@ -11519,13 +12085,13 @@
         "description": "Delete wallet warning explaining the consequences.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/wallet/settings/DeleteWallet.tsx",
         "id": "wallet.settings.deleteWallet.warning1",
         "start": {
           "column": 24,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -11533,13 +12099,13 @@
         "description": "Delete wallet warning explaining the consequences.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/settings/DeleteWallet.tsx",
         "id": "wallet.settings.deleteWallet.warning2",
         "start": {
           "column": 24,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -11547,13 +12113,13 @@
         "description": "Label for the delete button on wallet settings",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/settings/DeleteWallet.tsx",
         "id": "wallet.settings.deleteWalletButtonLabel",
         "start": {
           "column": 16,
-          "line": 31
+          "line": 30
         }
       }
     ],
@@ -11613,13 +12179,13 @@
         "description": "Wallet public key label.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx",
         "id": "wallet.settings.icoPublicKey",
         "start": {
           "column": 13,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -11627,13 +12193,13 @@
         "description": "ICO public key header on the wallet settings page.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx",
         "id": "wallet.settings.icoPublicKey.description",
         "start": {
           "column": 24,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -11641,13 +12207,13 @@
         "description": "ICO public key show instruction.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx",
         "id": "wallet.settings.icoPublicKeyShowInstruction",
         "start": {
           "column": 28,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -11655,13 +12221,13 @@
         "description": "Show QR code tooltip.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyBox.tsx",
         "id": "wallet.settings.showQRCode",
         "start": {
           "column": 14,
-          "line": 30
+          "line": 29
         }
       }
     ],
@@ -11674,13 +12240,13 @@
         "description": "Title \"Choose a stake pool\" on the reveal Wallet Id dialog.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx",
         "id": "wallet.settings.icoPublicKeyDialog.title",
         "start": {
           "column": 9,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -11688,13 +12254,13 @@
         "description": "Description on the reveal Wallet Id dialog.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx",
         "id": "wallet.settings.icoPublicKeyDialog.description",
         "start": {
           "column": 15,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -11702,13 +12268,13 @@
         "description": "Description on the reveal ICO Id dialog.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyDialog.tsx",
         "id": "wallet.settings.icoPublicKeyDialog.button",
         "start": {
           "column": 15,
-          "line": 30
+          "line": 29
         }
       }
     ],
@@ -11721,13 +12287,13 @@
         "description": "Title for the \"ICO Public Key QR Code\" dialog.",
         "end": {
           "column": 3,
-          "line": 11
+          "line": 9
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts",
         "id": "wallet.settings.icoPublicKey",
         "start": {
           "column": 15,
-          "line": 7
+          "line": 5
         }
       },
       {
@@ -11735,13 +12301,13 @@
         "description": "Copy ICO public key label.",
         "end": {
           "column": 3,
-          "line": 16
+          "line": 14
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts",
         "id": "wallet.settings.copyICOPublicKey",
         "start": {
           "column": 22,
-          "line": 12
+          "line": 10
         }
       },
       {
@@ -11749,13 +12315,13 @@
         "description": "Tooltip for the derivation path",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog.messages.ts",
         "id": "wallet.settings.dialog.derivationPathTooltip",
         "start": {
           "column": 25,
-          "line": 17
+          "line": 15
         }
       }
     ],
@@ -11768,13 +12334,13 @@
         "description": "Label for the \"Set a password\" button in the set wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/wallet/settings/SetWalletPassword.tsx",
         "id": "wallet.settings.setWalletPassword.dialog.setPasswordButton",
         "start": {
           "column": 21,
-          "line": 12
+          "line": 11
         }
       },
       {
@@ -11782,13 +12348,13 @@
         "description": "Message for the \"Set a password\" button in the set wallet password dialog.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/wallet/settings/SetWalletPassword.tsx",
         "id": "wallet.settings.setWalletPassword.dialog.setPasswordMessage",
         "start": {
           "column": 22,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -11796,13 +12362,13 @@
         "description": "Title for the \"Set wallet password\" dialog when there is not password set.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/settings/SetWalletPassword.tsx",
         "id": "wallet.settings.setWalletPassword.dialog.setPasswordTitle",
         "start": {
           "column": 20,
-          "line": 25
+          "line": 24
         }
       }
     ],
@@ -11815,13 +12381,13 @@
         "description": "Label for the undelegate button on wallet settings",
         "end": {
           "column": 3,
-          "line": 12
+          "line": 11
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletButton.tsx",
         "id": "wallet.settings.undelegateWalletButtonLabel",
         "start": {
           "column": 9,
-          "line": 8
+          "line": 7
         }
       }
     ],
@@ -11834,13 +12400,13 @@
         "description": "Title for the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.title",
         "start": {
           "column": 9,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -11848,13 +12414,13 @@
         "description": "Label for the \"Undelegate\" button in the undelegate wallet dialog.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.confirmButtonLabel",
         "start": {
           "column": 22,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -11862,13 +12428,13 @@
         "description": "Description of current delegation of wallet in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.descriptionWithTicker",
         "start": {
           "column": 25,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -11876,13 +12442,13 @@
         "description": "Description of current delegation of wallet in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 50
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.descriptionWithUnknownTicker",
         "start": {
           "column": 32,
-          "line": 45
+          "line": 44
         }
       },
       {
@@ -11890,13 +12456,13 @@
         "description": "unknown stake pool label in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 55
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.unknownStakePoolLabel",
         "start": {
           "column": 25,
-          "line": 52
+          "line": 51
         }
       },
       {
@@ -11904,13 +12470,13 @@
         "description": "Notice to confirm if the user understands unsupporting Cardano network after undelegation",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 62
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.confirmUnsupportNotice",
         "start": {
           "column": 26,
-          "line": 57
+          "line": 56
         }
       },
       {
@@ -11918,13 +12484,13 @@
         "description": "Notice to confirm if the user understands non-earning rewards after undelegation",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 69
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.confirmIneligibleNotice",
         "start": {
           "column": 27,
-          "line": 64
+          "line": 63
         }
       },
       {
@@ -11932,13 +12498,13 @@
         "description": "Fees label in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 74
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.feesLabel",
         "start": {
           "column": 13,
-          "line": 71
+          "line": 70
         }
       },
       {
@@ -11946,13 +12512,13 @@
         "description": "Deposits reclaimed label in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 79
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.depositLabel",
         "start": {
           "column": 16,
-          "line": 76
+          "line": 75
         }
       },
       {
@@ -11960,13 +12526,13 @@
         "description": "Spending password label in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 85
+          "line": 84
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.spendingPasswordLabel",
         "start": {
           "column": 25,
-          "line": 81
+          "line": 80
         }
       },
       {
@@ -11974,13 +12540,13 @@
         "description": "Spending password placeholder in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 90
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.spendingPasswordPlaceholder",
         "start": {
           "column": 31,
-          "line": 86
+          "line": 85
         }
       },
       {
@@ -11988,13 +12554,13 @@
         "description": "Label for password error in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 96
+          "line": 95
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.passwordError",
         "start": {
           "column": 24,
-          "line": 92
+          "line": 91
         }
       },
       {
@@ -12002,13 +12568,13 @@
         "description": "\"Calculating fees\" message in the \"Undelegate wallet\" dialog.",
         "end": {
           "column": 3,
-          "line": 102
+          "line": 101
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletConfirmationDialog.tsx",
         "id": "wallet.settings.undelegate.dialog.calculatingFees",
         "start": {
           "column": 19,
-          "line": 97
+          "line": 96
         }
       }
     ],
@@ -12021,13 +12587,13 @@
         "description": "Title for the \"Undelegate Result\" dialog.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx",
         "id": "wallet.settings.undelegate.result.dialog.title",
         "start": {
           "column": 9,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -12035,13 +12601,13 @@
         "description": "Description 1 for the \"Undelegate Result\" dialog.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx",
         "id": "wallet.settings.undelegate.result.dialog.description1",
         "start": {
           "column": 16,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -12049,13 +12615,13 @@
         "description": "Description 2 for the \"Undelegate Result\" dialog.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/wallet/settings/UndelegateWalletSuccessDialog.tsx",
         "id": "wallet.settings.undelegate.result.dialog.description2",
         "start": {
           "column": 16,
-          "line": 27
+          "line": 26
         }
       }
     ],
@@ -12068,13 +12634,13 @@
         "description": "Unpair wallet header on the wallet settings page.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/settings/UnpairWallet.tsx",
         "id": "wallet.settings.unpairWallet.header",
         "start": {
           "column": 22,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -12082,13 +12648,13 @@
         "description": "Unpair wallet warning explaining the consequences.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/settings/UnpairWallet.tsx",
         "id": "wallet.settings.unpairWallet.warning",
         "start": {
           "column": 23,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -12096,13 +12662,13 @@
         "description": "Label for the unpair button on wallet settings",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/settings/UnpairWallet.tsx",
         "id": "wallet.settings.unpairWalletButtonLabel",
         "start": {
           "column": 16,
-          "line": 30
+          "line": 29
         }
       }
     ],
@@ -12115,13 +12681,13 @@
         "description": "Wallet public key label.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx",
         "id": "wallet.settings.walletPublicKey",
         "start": {
           "column": 13,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -12129,13 +12695,13 @@
         "description": "Wallet public key show instruction.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx",
         "id": "wallet.settings.walletPublicKeyShowInstruction",
         "start": {
           "column": 28,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -12143,13 +12709,13 @@
         "description": "Show QR code tooltip.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/wallet/settings/WalletPublicKeyBox.tsx",
         "id": "wallet.settings.showQRCode",
         "start": {
           "column": 14,
-          "line": 24
+          "line": 23
         }
       }
     ],
@@ -12162,13 +12728,13 @@
         "description": "Title \"Choose a stake pool\" on the reveal Wallet Id dialog.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx",
         "id": "wallet.settings.walletPublicKeyDialog.title",
         "start": {
           "column": 9,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -12176,13 +12742,13 @@
         "description": "Description on the reveal Wallet Id dialog.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx",
         "id": "wallet.settings.walletPublicKeyDialog.description",
         "start": {
           "column": 15,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -12190,13 +12756,13 @@
         "description": "Description on the reveal Wallet Id dialog.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/wallet/settings/WalletPublicKeyDialog.tsx",
         "id": "wallet.settings.walletPublicKeyDialog.button",
         "start": {
           "column": 15,
-          "line": 29
+          "line": 28
         }
       }
     ],
@@ -12209,13 +12775,13 @@
         "description": "Label for the recoveryPhraseStep1Title on wallet settings.",
         "end": {
           "column": 3,
-          "line": 16
+          "line": 15
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep1Title",
         "start": {
           "column": 28,
-          "line": 12
+          "line": 11
         }
       },
       {
@@ -12223,13 +12789,13 @@
         "description": "Label for the recoveryPhraseStep1Paragraph1 on wallet settings.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep1Paragraph1",
         "start": {
           "column": 33,
-          "line": 17
+          "line": 16
         }
       },
       {
@@ -12237,13 +12803,13 @@
         "description": "Label for the recoveryPhraseStep1Paragraph2 on wallet settings.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep1Paragraph2",
         "start": {
           "column": 33,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -12251,13 +12817,13 @@
         "description": "Label for the recoveryPhraseStep1Button on wallet settings.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep1Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep1Button",
         "start": {
           "column": 29,
-          "line": 31
+          "line": 30
         }
       }
     ],
@@ -12270,13 +12836,13 @@
         "description": "Label for the recoveryPhraseStep2Title on wallet settings.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 24
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep2Title",
         "start": {
           "column": 28,
-          "line": 21
+          "line": 20
         }
       },
       {
@@ -12284,13 +12850,13 @@
         "description": "Label for the recoveryPhraseStep2Description on wallet settings.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep2Description",
         "start": {
           "column": 34,
-          "line": 26
+          "line": 25
         }
       },
       {
@@ -12298,13 +12864,13 @@
         "description": "Label for the recoveryPhraseStep2Subtitle on wallet settings.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep2Subtitle",
         "start": {
           "column": 31,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -12312,13 +12878,13 @@
         "description": "Label for the recoveryPhraseStep2Button on wallet settings.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep2Button",
         "start": {
           "column": 29,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -12326,13 +12892,13 @@
         "description": "Placeholder \"Enter word #{wordNumber}\" for the recovery phrase input on the verification dialog.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseInputPlaceholder",
         "start": {
           "column": 34,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -12340,13 +12906,13 @@
         "description": "\"No results\" message for the recovery phrase input search results.",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 54
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseInputNoResults",
         "start": {
           "column": 27,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -12354,13 +12920,13 @@
         "description": "Error message shown when invalid recovery phrase was entered.",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 60
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep2Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep2InvalidMnemonics",
         "start": {
           "column": 39,
-          "line": 56
+          "line": 55
         }
       }
     ],
@@ -12434,13 +13000,13 @@
         "description": "Label for the recoveryPhraseStep4Title on wallet settings.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep4Title",
         "start": {
           "column": 28,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -12448,13 +13014,13 @@
         "description": "Label for the recoveryPhraseStep4Paragraph1 on wallet settings.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep4Paragraph1",
         "start": {
           "column": 33,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -12462,13 +13028,13 @@
         "description": "Label for the recoveryPhraseStep4Paragraph2 on wallet settings.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep4Paragraph2",
         "start": {
           "column": 33,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -12476,13 +13042,13 @@
         "description": "Label for the recoveryPhraseStep4Button on wallet settings.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep4Button",
         "start": {
           "column": 29,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -12490,13 +13056,13 @@
         "description": "Label for the recoveryPhraseStep4SupportTitle on wallet settings.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 41
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep4SupportTitle",
         "start": {
           "column": 35,
-          "line": 37
+          "line": 36
         }
       },
       {
@@ -12504,13 +13070,13 @@
         "description": "Label for the recoveryPhraseStep4SupportUrl on wallet settings.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseStep4Dialog.tsx",
         "id": "wallet.settings.recoveryPhraseStep4SupportUrl",
         "start": {
           "column": 33,
-          "line": 43
+          "line": 42
         }
       }
     ],
@@ -12523,13 +13089,13 @@
         "description": "Label for the recoveryPhraseVerificationTitle on wallet settings.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.title",
         "start": {
           "column": 9,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -12537,13 +13103,13 @@
         "description": "Label for the recoveryPhraseVerificationDescription on wallet settings.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.description",
         "start": {
           "column": 15,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -12551,13 +13117,13 @@
         "description": "Label for the recoveryPhraseVerificationNeverOk on wallet settings.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.neverOkTimeUntil",
         "start": {
           "column": 20,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -12565,13 +13131,13 @@
         "description": "Label for the recoveryPhraseVerificationNeverOk on wallet settings.",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 52
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.neverOkFewMonths",
         "start": {
           "column": 20,
-          "line": 47
+          "line": 46
         }
       },
       {
@@ -12579,13 +13145,13 @@
         "description": "Label for the recoveryPhraseVerificationNeverOk on wallet settings.",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.neverOkFewWeeks",
         "start": {
           "column": 19,
-          "line": 54
+          "line": 53
         }
       },
       {
@@ -12593,13 +13159,13 @@
         "description": "Label for the recoveryPhraseVerificationNeverOk on wallet settings.",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 66
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.neverOkFewDays",
         "start": {
           "column": 18,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -12607,13 +13173,13 @@
         "description": "Label for the recoveryPhraseVerificationNeverWarning on wallet settings.",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 73
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.neverWarning",
         "start": {
           "column": 16,
-          "line": 68
+          "line": 67
         }
       },
       {
@@ -12621,13 +13187,13 @@
         "description": "Label for the recoveryPhraseVerificationNeverNotification on wallet settings.",
         "end": {
           "column": 3,
-          "line": 81
+          "line": 80
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.neverNotification",
         "start": {
           "column": 21,
-          "line": 75
+          "line": 74
         }
       },
       {
@@ -12635,13 +13201,13 @@
         "description": "Label for the recoveryPhraseVerificationCheckedOk on wallet settings.",
         "end": {
           "column": 3,
-          "line": 88
+          "line": 87
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.checkedOk",
         "start": {
           "column": 13,
-          "line": 82
+          "line": 81
         }
       },
       {
@@ -12649,13 +13215,13 @@
         "description": "Label for the recoveryPhraseVerificationCheckedWarning on wallet settings.",
         "end": {
           "column": 3,
-          "line": 95
+          "line": 94
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.checkedWarning",
         "start": {
           "column": 18,
-          "line": 89
+          "line": 88
         }
       },
       {
@@ -12663,13 +13229,13 @@
         "description": "Label for the recoveryPhraseVerificationCheckedNotification on wallet settings.",
         "end": {
           "column": 3,
-          "line": 102
+          "line": 101
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.checkedNotification",
         "start": {
           "column": 23,
-          "line": 96
+          "line": 95
         }
       },
       {
@@ -12677,13 +13243,13 @@
         "description": "Description for the paperWallet instructions on wallet settings.",
         "end": {
           "column": 3,
-          "line": 109
+          "line": 108
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.paperWalletDescription",
         "start": {
           "column": 26,
-          "line": 103
+          "line": 102
         }
       },
       {
@@ -12691,13 +13257,13 @@
         "description": "Title for the paperWallet instructions on wallet settings.",
         "end": {
           "column": 3,
-          "line": 114
+          "line": 113
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.paperWalletTitle",
         "start": {
           "column": 20,
-          "line": 110
+          "line": 109
         }
       },
       {
@@ -12705,13 +13271,13 @@
         "description": "Label for the recoveryPhraseVerificationButton on wallet settings.",
         "end": {
           "column": 3,
-          "line": 120
+          "line": 119
         },
         "file": "source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget.tsx",
         "id": "wallet.settings.recoveryPhraseVerification.button",
         "start": {
           "column": 10,
-          "line": 115
+          "line": 114
         }
       },
       {
@@ -12725,7 +13291,7 @@
         "id": "wallet.settings.recoveryPhraseVerification.timeUntilWarningReplacement",
         "start": {
           "column": 31,
-          "line": 121
+          "line": 120
         }
       }
     ],
@@ -12738,13 +13304,13 @@
         "description": "Label for the \"Transaction assurance security level\" dropdown.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.assurance",
         "start": {
           "column": 23,
-          "line": 38
+          "line": 37
         }
       },
       {
@@ -12752,13 +13318,13 @@
         "description": "Undelegate wallet header on the wallet settings page.",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.undelegateWallet.header",
         "start": {
           "column": 26,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -12766,13 +13332,13 @@
         "description": "Undelegate wallet warning explaining the consequences.",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.undelegateWallet.warning",
         "start": {
           "column": 27,
-          "line": 49
+          "line": 48
         }
       },
       {
@@ -12780,13 +13346,13 @@
         "description": "Undelegate wallet disabled warning explaining why it is disabled.",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 60
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.undelegateWallet.disabledWarning",
         "start": {
           "column": 35,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -12794,13 +13360,13 @@
         "description": "Delegate wallet header on the wallet settings page.",
         "end": {
           "column": 3,
-          "line": 66
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.delegateWallet.header",
         "start": {
           "column": 24,
-          "line": 62
+          "line": 61
         }
       },
       {
@@ -12808,13 +13374,13 @@
         "description": "Delegate wallet warning.",
         "end": {
           "column": 3,
-          "line": 72
+          "line": 71
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.delegateWallet.warning",
         "start": {
           "column": 25,
-          "line": 67
+          "line": 66
         }
       },
       {
@@ -12822,13 +13388,13 @@
         "description": "Delegate wallet disabled warning explaining why it is disabled.",
         "end": {
           "column": 3,
-          "line": 79
+          "line": 78
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.delegateWallet.disabledWarning",
         "start": {
           "column": 33,
-          "line": 73
+          "line": 72
         }
       },
       {
@@ -12836,13 +13402,13 @@
         "description": "Label for the \"Name\" text input on the wallet settings page.",
         "end": {
           "column": 3,
-          "line": 84
+          "line": 83
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.name.label",
         "start": {
           "column": 8,
-          "line": 80
+          "line": 79
         }
       },
       {
@@ -12850,13 +13416,13 @@
         "description": "Label for the \"Password\" field.",
         "end": {
           "column": 3,
-          "line": 89
+          "line": 88
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.password",
         "start": {
           "column": 17,
-          "line": 85
+          "line": 84
         }
       },
       {
@@ -12864,13 +13430,13 @@
         "description": "Last updated X time ago message.",
         "end": {
           "column": 3,
-          "line": 94
+          "line": 93
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.passwordLastUpdated",
         "start": {
           "column": 23,
-          "line": 90
+          "line": 89
         }
       },
       {
@@ -12878,13 +13444,13 @@
         "description": "You still don't have password set message.",
         "end": {
           "column": 3,
-          "line": 99
+          "line": 98
         },
         "file": "source/renderer/app/components/wallet/settings/WalletSettings.tsx",
         "id": "wallet.settings.passwordNotSet",
         "start": {
           "column": 18,
-          "line": 95
+          "line": 94
         }
       }
     ],
@@ -12897,13 +13463,13 @@
         "description": "Label for the \"+ 12.042481 of fees\" message above amount input field.",
         "end": {
           "column": 3,
-          "line": 14
+          "line": 13
         },
         "file": "source/renderer/app/components/wallet/skins/AmountInputSkin.tsx",
         "id": "wallet.amountInput.feesLabel",
         "start": {
           "column": 13,
-          "line": 9
+          "line": 8
         }
       },
       {
@@ -12911,13 +13477,13 @@
         "description": "Label for the \"Calculating fees\" message above amount input field.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/skins/AmountInputSkin.tsx",
         "id": "wallet.amountInput.calculatingFeesLabel",
         "start": {
           "column": 24,
-          "line": 15
+          "line": 14
         }
       }
     ],
@@ -12930,13 +13496,13 @@
         "description": "Tokens title in the wallet summary",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 18
         },
         "file": "source/renderer/app/components/wallet/summary/WalletSummary.tsx",
         "id": "wallet.summary.assets.tokensTitle",
         "start": {
           "column": 19,
-          "line": 13
+          "line": 14
         }
       }
     ],
@@ -12949,13 +13515,13 @@
         "description": "\"Currency - title\" label on Wallet summary currency page",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx",
         "id": "wallet.summary.currency.title",
         "start": {
           "column": 17,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -12963,13 +13529,13 @@
         "description": "\"Currency - last fetched\" label on Wallet summary currency page",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx",
         "id": "wallet.summary.currency.lastFetched",
         "start": {
           "column": 23,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -12977,13 +13543,13 @@
         "description": "\"Currency - Fetching\" label on Wallet summary currency page",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/wallet/summary/WalletSummaryCurrency.tsx",
         "id": "wallet.summary.currency.isFetchingRate",
         "start": {
           "column": 26,
-          "line": 29
+          "line": 28
         }
       }
     ],
@@ -12992,35 +13558,54 @@
   {
     "descriptors": [
       {
-        "defaultMessage": "!!!Number of transactions",
+        "defaultMessage": "!!!{total} transactions, {pending} pending",
         "description": "\"Number of transactions\" label on Wallet summary header page",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/summary/WalletSummaryHeader.tsx",
         "id": "wallet.summary.header.transactionsLabel",
         "start": {
           "column": 21,
-          "line": 16
+          "line": 17
+        }
+      }
+    ],
+    "path": "source/renderer/app/components/wallet/summary/WalletSummaryHeader.json"
+  },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "!!!{total} rewards earned, {unspent} unspent rewards",
+        "description": "Headline for the Decentralisation notification.",
+        "end": {
+          "column": 3,
+          "line": 24
+        },
+        "file": "source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.tsx",
+        "id": "wallet.summary.header.rewardsSummary",
+        "start": {
+          "column": 11,
+          "line": 20
         }
       },
       {
-        "defaultMessage": "!!!Number of pending transactions",
-        "description": "\"Number of pending transactions\" label on Wallet summary header page",
+        "defaultMessage": "!!!All the ada in this wallet is in the rewards account.\n      Since transaction fees cannot be paid with rewards, please send 2 or\n      more ada to this wallet to cover transaction fees.",
+        "description": "Tooltip describing that rewards are unspendable on the Wallet summary header",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 32
         },
-        "file": "source/renderer/app/components/wallet/summary/WalletSummaryHeader.tsx",
-        "id": "wallet.summary.header.pendingTransactionsLabel",
+        "file": "source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.tsx",
+        "id": "wallet.summary.header.unspendableTooltip",
         "start": {
-          "column": 28,
-          "line": 21
+          "column": 22,
+          "line": 25
         }
       }
     ],
-    "path": "source/renderer/app/components/wallet/summary/WalletSummaryHeader.json"
+    "path": "source/renderer/app/components/wallet/summary/WalletSummaryHeaderRewards.json"
   },
   {
     "descriptors": [
@@ -13029,13 +13614,13 @@
         "description": "Number of tokens title on Wallet summary assets page",
         "end": {
           "column": 3,
-          "line": 14
+          "line": 13
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletNoTokens.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx",
         "id": "wallet.summary.assets.tokensTitle",
         "start": {
           "column": 15,
-          "line": 10
+          "line": 9
         }
       },
       {
@@ -13043,13 +13628,13 @@
         "description": "\"Learn more\" text in the Wallets Summary No Tokens component",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 18
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletNoTokens.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx",
         "id": "wallet.summary.noTokens.learnMore.textTop",
         "start": {
           "column": 20,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -13057,13 +13642,13 @@
         "description": "\"Learn more\" text in the Wallets Summary No Tokens component",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletNoTokens.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx",
         "id": "wallet.summary.noTokens.learnMore.textBottom",
         "start": {
           "column": 23,
-          "line": 20
+          "line": 19
         }
       },
       {
@@ -13071,13 +13656,13 @@
         "description": "\"Learn more\" label or button in the Wallets Summary No Tokens component",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletNoTokens.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx",
         "id": "wallet.summary.noTokens.learnMore.linkLabel",
         "start": {
           "column": 22,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -13085,139 +13670,237 @@
         "description": "\"Learn more\" link URL in the Wallets Summary No Tokens component",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletNoTokens.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.tsx",
         "id": "wallet.summary.noTokens.learnMore.linkUrl",
         "start": {
           "column": 20,
-          "line": 31
+          "line": 30
         }
       }
     ],
-    "path": "source/renderer/app/components/wallet/tokens/WalletNoTokens.json"
+    "path": "source/renderer/app/components/wallet/tokens/wallet-no-tokens/WalletNoTokens.json"
   },
   {
     "descriptors": [
       {
-        "defaultMessage": "!!!Send",
-        "description": "Send button on Wallet summary assets page",
+        "defaultMessage": "!!!Add tokens",
+        "description": "Token picker title",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 8
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletToken.tsx",
-        "id": "wallet.summary.asset.tokenSendButton",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.title",
         "start": {
-          "column": 19,
-          "line": 25
+          "column": 9,
+          "line": 4
         }
       },
       {
-        "defaultMessage": "!!!Amount",
-        "description": "Amount label on Wallet summary assets page",
+        "defaultMessage": "!!!All tokens",
+        "description": "Label for all tokens option",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 13
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletToken.tsx",
-        "id": "wallet.summary.asset.amountLabel",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.allTokensLabel",
         "start": {
-          "column": 15,
-          "line": 30
+          "column": 18,
+          "line": 9
         }
       },
       {
-        "defaultMessage": "!!!Settings",
-        "description": "Settings label on Wallet summary assets page",
+        "defaultMessage": "!!!Favorites",
+        "description": "Label for favorite tokens option",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 18
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletToken.tsx",
-        "id": "wallet.summary.asset.settings.button.label",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.favoriteTokensLabel",
         "start": {
           "column": 23,
-          "line": 35
+          "line": 14
         }
       },
       {
-        "defaultMessage": "!!!Recommended configuration for decimal places for this native token is available.",
-        "description": "Asset settings recommended pop over content",
+        "defaultMessage": "!!!Select all",
+        "description": "Label for select all button label",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 23
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletToken.tsx",
-        "id": "assets.warning.available",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.checkAllLabel",
         "start": {
-          "column": 35,
-          "line": 40
+          "column": 17,
+          "line": 19
         }
       },
       {
-        "defaultMessage": "!!!You are not using the recommended decimal place configuration for this native token.",
-        "description": "Asset settings recommended pop over content",
+        "defaultMessage": "!!!{checkedCount} out of {maxTokens} tokens.",
+        "description": "Label of selected tokens count",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 28
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletToken.tsx",
-        "id": "assets.warning.notUsing",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.checkedCountLabel",
         "start": {
-          "column": 34,
-          "line": 46
+          "column": 21,
+          "line": 24
+        }
+      },
+      {
+        "defaultMessage": "!!!Cancel",
+        "description": "Label of cancel button",
+        "end": {
+          "column": 3,
+          "line": 33
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.cancelButtonLabel",
+        "start": {
+          "column": 21,
+          "line": 29
+        }
+      },
+      {
+        "defaultMessage": "!!!Add",
+        "description": "Label of add button",
+        "end": {
+          "column": 3,
+          "line": 38
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.addButtonLabel",
+        "start": {
+          "column": 18,
+          "line": 34
+        }
+      },
+      {
+        "defaultMessage": "!!!Clear selection",
+        "description": "Label of clear selection button",
+        "end": {
+          "column": 3,
+          "line": 43
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.clearAll",
+        "start": {
+          "column": 12,
+          "line": 39
+        }
+      },
+      {
+        "defaultMessage": "!!!Results do not match search query",
+        "description": "Text for no results",
+        "end": {
+          "column": 3,
+          "line": 48
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.noResults",
+        "start": {
+          "column": 13,
+          "line": 44
+        }
+      },
+      {
+        "defaultMessage": "!!!You have already reached a maximum of {maxTokens} tokens for your transaction. To add another token you need to remove one from a list.",
+        "description": "Max tokens warning",
+        "end": {
+          "column": 3,
+          "line": 54
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.ts",
+        "id": "wallet.token.picker.maxTokensWarning",
+        "start": {
+          "column": 20,
+          "line": 49
         }
       }
     ],
-    "path": "source/renderer/app/components/wallet/tokens/WalletToken.json"
+    "path": "source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.messages.json"
   },
   {
     "descriptors": [
       {
-        "defaultMessage": "!!!Favorites",
-        "description": "Favorites list title label",
+        "defaultMessage": "!!!Send",
+        "description": "Send button on Wallet summary assets page",
+        "end": {
+          "column": 3,
+          "line": 8
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts",
+        "id": "wallet.summary.asset.tokenSendButton",
+        "start": {
+          "column": 19,
+          "line": 4
+        }
+      },
+      {
+        "defaultMessage": "!!!Amount",
+        "description": "Amount label on Wallet summary assets page",
+        "end": {
+          "column": 3,
+          "line": 13
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts",
+        "id": "wallet.summary.asset.amountLabel",
+        "start": {
+          "column": 15,
+          "line": 9
+        }
+      },
+      {
+        "defaultMessage": "!!!Settings",
+        "description": "Settings label on Wallet summary assets page",
         "end": {
           "column": 3,
           "line": 18
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokens.tsx",
-        "id": "wallet.tokens.list.favorites.title",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts",
+        "id": "wallet.summary.asset.settings.button.label",
         "start": {
-          "column": 22,
+          "column": 23,
           "line": 14
         }
       },
       {
-        "defaultMessage": "!!!Tokens",
-        "description": "Favorites list title label",
+        "defaultMessage": "!!!Recommended configuration for decimal places for this native token is available.",
+        "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 24
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokens.tsx",
-        "id": "wallet.tokens.list.tokens.title",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts",
+        "id": "assets.warning.available",
         "start": {
-          "column": 19,
+          "column": 35,
           "line": 19
         }
       },
       {
-        "defaultMessage": "!!!The balance and transaction history of this wallet is being synced with the blockchain.",
-        "description": "Syncing transactions message shown during async wallet restore in the wallet send form.",
+        "defaultMessage": "!!!You are not using the recommended decimal place configuration for this native token.",
+        "description": "Asset settings recommended pop over content",
         "end": {
           "column": 3,
           "line": 30
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokens.tsx",
-        "id": "wallet.send.form.syncingTransactionsMessage",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.ts",
+        "id": "assets.warning.notUsing",
         "start": {
-          "column": 18,
-          "line": 24
+          "column": 34,
+          "line": 25
         }
       }
     ],
-    "path": "source/renderer/app/components/wallet/tokens/WalletTokens.json"
+    "path": "source/renderer/app/components/wallet/tokens/wallet-token/WalletToken.messages.json"
   },
   {
     "descriptors": [
@@ -13226,13 +13909,13 @@
         "description": "No results on the WalletTokensList",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 8
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokensList.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts",
         "id": "wallet.tokens.list.search.noResults",
         "start": {
           "column": 13,
-          "line": 21
+          "line": 4
         }
       },
       {
@@ -13240,13 +13923,13 @@
         "description": "Search Results on the WalletTokensList",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 13
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokensList.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts",
         "id": "wallet.tokens.list.search.searchResults",
         "start": {
           "column": 17,
-          "line": 26
+          "line": 9
         }
       },
       {
@@ -13254,13 +13937,13 @@
         "description": "Amount header on the WalletTokensList",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 18
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokensList.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts",
         "id": "wallet.tokens.list.column.amount",
         "start": {
           "column": 16,
-          "line": 31
+          "line": 14
         }
       },
       {
@@ -13268,13 +13951,13 @@
         "description": "Token header on the WalletTokensList",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 23
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokensList.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts",
         "id": "wallet.tokens.list.column.token",
         "start": {
           "column": 15,
-          "line": 36
+          "line": 19
         }
       },
       {
@@ -13282,17 +13965,17 @@
         "description": "View all button label on the WalletTokensList",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 28
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokensList.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.ts",
         "id": "wallet.tokens.list.viewAllButton.label",
         "start": {
           "column": 22,
-          "line": 41
+          "line": 24
         }
       }
     ],
-    "path": "source/renderer/app/components/wallet/tokens/WalletTokensList.json"
+    "path": "source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList.messages.json"
   },
   {
     "descriptors": [
@@ -13301,17 +13984,64 @@
         "description": "Search placeholder for the Wallet Tokens search",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 18
         },
-        "file": "source/renderer/app/components/wallet/tokens/WalletTokensSearch.tsx",
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.tsx",
         "id": "wallet.tokens.search.placeholder",
         "start": {
           "column": 15,
-          "line": 15
+          "line": 14
         }
       }
     ],
-    "path": "source/renderer/app/components/wallet/tokens/WalletTokensSearch.json"
+    "path": "source/renderer/app/components/wallet/tokens/wallet-tokens-search/WalletTokensSearch.json"
+  },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "!!!Favorites",
+        "description": "Favorites list title label",
+        "end": {
+          "column": 3,
+          "line": 17
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.tsx",
+        "id": "wallet.tokens.list.favorites.title",
+        "start": {
+          "column": 22,
+          "line": 13
+        }
+      },
+      {
+        "defaultMessage": "!!!Tokens",
+        "description": "Favorites list title label",
+        "end": {
+          "column": 3,
+          "line": 22
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.tsx",
+        "id": "wallet.tokens.list.tokens.title",
+        "start": {
+          "column": 19,
+          "line": 18
+        }
+      },
+      {
+        "defaultMessage": "!!!The balance and transaction history of this wallet is being synced with the blockchain.",
+        "description": "Syncing transactions message shown during async wallet restore in the wallet send form.",
+        "end": {
+          "column": 3,
+          "line": 29
+        },
+        "file": "source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.tsx",
+        "id": "wallet.send.form.syncingTransactionsMessage",
+        "start": {
+          "column": 18,
+          "line": 23
+        }
+      }
+    ],
+    "path": "source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens.json"
   },
   {
     "descriptors": [
@@ -13320,13 +14050,13 @@
         "description": "Label for the cancel pending transaction button",
         "end": {
           "column": 3,
-          "line": 13
+          "line": 12
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionButton.tsx",
         "id": "wallet.transaction.pending.cancelTransactionButton",
         "start": {
           "column": 15,
-          "line": 9
+          "line": 8
         }
       },
       {
@@ -13334,13 +14064,13 @@
         "description": "Label for the remove failed transaction button",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionButton.tsx",
         "id": "wallet.transaction.failed.removeTransactionButton",
         "start": {
           "column": 15,
-          "line": 14
+          "line": 13
         }
       }
     ],
@@ -13353,27 +14083,27 @@
         "description": "Headline for the pending transaction cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 15
+          "line": 14
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx",
         "id": "cancel.transaction.confirmation.dialog.headline",
         "start": {
           "column": 12,
-          "line": 10
+          "line": 9
         }
       },
       {
-        "defaultMessage": "!!!This transaction was submitted to the Cardano network some time ago, but hasn’t been finalized yet. You can try to cancel the transaction now to release the pending funds, but there is a chance that the transaction will be finalized regardless. In this case, the transaction will reappear in your wallet as a completed transaction.",
+        "defaultMessage": "!!!This transaction was submitted to the Cardano network some time ago, but has not been finalized yet. You can try to cancel the transaction now to release the pending funds, but there is a chance that the transaction will be finalized regardless. In this case, the transaction will reappear in your wallet as a completed transaction.",
         "description": "Content for the pending transaction cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx",
         "id": "cancel.transaction.confirmation.dialog.content1",
         "start": {
           "column": 12,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -13381,13 +14111,13 @@
         "description": "Content for the pending transaction cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx",
         "id": "cancel.transaction.confirmation.dialog.content2",
         "start": {
           "column": 12,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -13395,13 +14125,13 @@
         "description": "\"Cancel\" button label for the pending transaction cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx",
         "id": "cancel.transaction.confirmation.dialog.button.backLabel",
         "start": {
           "column": 21,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -13409,13 +14139,13 @@
         "description": "\"Confirm\" button label for the pending transaction cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/transactions/CancelTransactionConfirmationDialog.tsx",
         "id": "cancel.transaction.confirmation.dialog.button.confirmLabel",
         "start": {
           "column": 22,
-          "line": 36
+          "line": 35
         }
       }
     ],
@@ -13428,13 +14158,13 @@
         "description": "All Transactions button label.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.allTransactions",
         "start": {
           "column": 19,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -13442,13 +14172,13 @@
         "description": "Reset Filter button label.",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.resetFilter",
         "start": {
           "column": 15,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -13456,13 +14186,13 @@
         "description": "Incoming filter type.",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 52
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.incoming",
         "start": {
           "column": 12,
-          "line": 49
+          "line": 48
         }
       },
       {
@@ -13470,13 +14200,13 @@
         "description": "Outgoing filter type.",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 57
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.outgoing",
         "start": {
           "column": 12,
-          "line": 54
+          "line": 53
         }
       },
       {
@@ -13484,13 +14214,13 @@
         "description": "Date range of filter.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 62
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.dateRange",
         "start": {
           "column": 13,
-          "line": 59
+          "line": 58
         }
       },
       {
@@ -13498,13 +14228,13 @@
         "description": "Select time range indication of filter.",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 67
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.selectTimeRange",
         "start": {
           "column": 19,
-          "line": 64
+          "line": 63
         }
       },
       {
@@ -13512,13 +14242,13 @@
         "description": "Last 7 days range of filter.",
         "end": {
           "column": 3,
-          "line": 73
+          "line": 72
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.last7Days",
         "start": {
           "column": 13,
-          "line": 69
+          "line": 68
         }
       },
       {
@@ -13526,13 +14256,13 @@
         "description": "Last 30 days range of filter.",
         "end": {
           "column": 3,
-          "line": 78
+          "line": 77
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.last30Days",
         "start": {
           "column": 14,
-          "line": 74
+          "line": 73
         }
       },
       {
@@ -13540,13 +14270,13 @@
         "description": "Last 90 days range of filter.",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 82
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.last90Days",
         "start": {
           "column": 14,
-          "line": 79
+          "line": 78
         }
       },
       {
@@ -13554,13 +14284,13 @@
         "description": "This year date range of filter.",
         "end": {
           "column": 3,
-          "line": 88
+          "line": 87
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.thisYear",
         "start": {
           "column": 12,
-          "line": 84
+          "line": 83
         }
       },
       {
@@ -13568,13 +14298,13 @@
         "description": "Custom date range of filter.",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 92
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.custom",
         "start": {
           "column": 10,
-          "line": 89
+          "line": 88
         }
       },
       {
@@ -13582,13 +14312,13 @@
         "description": "Amount range of filter.",
         "end": {
           "column": 3,
-          "line": 98
+          "line": 97
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.amountRange",
         "start": {
           "column": 15,
-          "line": 94
+          "line": 93
         }
       },
       {
@@ -13596,13 +14326,13 @@
         "description": "Filter button label.",
         "end": {
           "column": 3,
-          "line": 103
+          "line": 102
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterDialog.tsx",
         "id": "wallet.transaction.filter.apply",
         "start": {
           "column": 9,
-          "line": 99
+          "line": 98
         }
       }
     ],
@@ -13615,13 +14345,13 @@
         "description": "Filter result info.",
         "end": {
           "column": 3,
-          "line": 13
+          "line": 12
         },
         "file": "source/renderer/app/components/wallet/transactions/FilterResultInfo.tsx",
         "id": "wallet.transaction.filter.resultInfo",
         "start": {
           "column": 14,
-          "line": 8
+          "line": 7
         }
       }
     ],
@@ -13634,13 +14364,13 @@
         "description": "Transaction type shown for credit card payments.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.type.card",
         "start": {
           "column": 8,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -13648,13 +14378,13 @@
         "description": "Transaction type shown for {currency} transactions.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.type",
         "start": {
           "column": 8,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -13662,13 +14392,13 @@
         "description": "Transaction type shown for money exchanges between currencies.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 48
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.type.exchange",
         "start": {
           "column": 12,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -13676,13 +14406,13 @@
         "description": "Transaction ID.",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 53
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.transactionId",
         "start": {
           "column": 17,
-          "line": 50
+          "line": 49
         }
       },
       {
@@ -13690,13 +14420,13 @@
         "description": "Transaction Metadata.",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 58
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.transactionMetadata",
         "start": {
           "column": 23,
-          "line": 55
+          "line": 54
         }
       },
       {
@@ -13704,13 +14434,13 @@
         "description": "",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.transactionMetadataDescription",
         "start": {
           "column": 34,
-          "line": 60
+          "line": 59
         }
       },
       {
@@ -13718,13 +14448,13 @@
         "description": "Transaction metadata label",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 69
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.metadataLabel",
         "start": {
           "column": 17,
-          "line": 66
+          "line": 65
         }
       },
       {
@@ -13732,13 +14462,13 @@
         "description": "Transaction metadata disclaimer",
         "end": {
           "column": 3,
-          "line": 76
+          "line": 75
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.metadataDisclaimer",
         "start": {
           "column": 22,
-          "line": 71
+          "line": 70
         }
       },
       {
@@ -13746,13 +14476,13 @@
         "description": "Transaction metadata confirmation toggle",
         "end": {
           "column": 3,
-          "line": 81
+          "line": 80
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.metadataConfirmationLabel",
         "start": {
           "column": 29,
-          "line": 77
+          "line": 76
         }
       },
       {
@@ -13760,13 +14490,13 @@
         "description": "Conversion rate.",
         "end": {
           "column": 3,
-          "line": 86
+          "line": 85
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.conversion.rate",
         "start": {
           "column": 18,
-          "line": 82
+          "line": 81
         }
       },
       {
@@ -13774,13 +14504,13 @@
         "description": "Label \"{transactionsType} sent\" for the transaction.",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 90
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.sent",
         "start": {
           "column": 8,
-          "line": 87
+          "line": 86
         }
       },
       {
@@ -13788,13 +14518,13 @@
         "description": "Label \"{transactionsType} received\" for the transaction.",
         "end": {
           "column": 3,
-          "line": 96
+          "line": 95
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.received",
         "start": {
           "column": 12,
-          "line": 92
+          "line": 91
         }
       },
       {
@@ -13802,13 +14532,13 @@
         "description": "From address",
         "end": {
           "column": 3,
-          "line": 101
+          "line": 100
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.address.from",
         "start": {
           "column": 15,
-          "line": 97
+          "line": 96
         }
       },
       {
@@ -13816,13 +14546,13 @@
         "description": "From addresses",
         "end": {
           "column": 3,
-          "line": 106
+          "line": 105
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.addresses.from",
         "start": {
           "column": 17,
-          "line": 102
+          "line": 101
         }
       },
       {
@@ -13830,13 +14560,13 @@
         "description": "From rewards",
         "end": {
           "column": 3,
-          "line": 111
+          "line": 110
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.rewards.from",
         "start": {
           "column": 15,
-          "line": 107
+          "line": 106
         }
       },
       {
@@ -13844,13 +14574,13 @@
         "description": "To address",
         "end": {
           "column": 3,
-          "line": 116
+          "line": 115
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.address.to",
         "start": {
           "column": 13,
-          "line": 112
+          "line": 111
         }
       },
       {
@@ -13858,13 +14588,13 @@
         "description": "To addresses",
         "end": {
           "column": 3,
-          "line": 121
+          "line": 120
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.addresses.to",
         "start": {
           "column": 15,
-          "line": 117
+          "line": 116
         }
       },
       {
@@ -13872,13 +14602,13 @@
         "description": "Receiver",
         "end": {
           "column": 3,
-          "line": 126
+          "line": 125
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.receiverLabel",
         "start": {
           "column": 17,
-          "line": 122
+          "line": 121
         }
       },
       {
@@ -13886,13 +14616,13 @@
         "description": "Token label",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 130
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.assetLabel",
         "start": {
           "column": 14,
-          "line": 127
+          "line": 126
         }
       },
       {
@@ -13900,13 +14630,13 @@
         "description": "Transaction fee",
         "end": {
           "column": 3,
-          "line": 136
+          "line": 135
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.transactionFee",
         "start": {
           "column": 18,
-          "line": 132
+          "line": 131
         }
       },
       {
@@ -13914,13 +14644,13 @@
         "description": "Deposit",
         "end": {
           "column": 3,
-          "line": 141
+          "line": 140
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.deposit",
         "start": {
           "column": 11,
-          "line": 137
+          "line": 136
         }
       },
       {
@@ -13928,13 +14658,13 @@
         "description": "Transaction amount.",
         "end": {
           "column": 3,
-          "line": 146
+          "line": 145
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.transactionAmount",
         "start": {
           "column": 21,
-          "line": 142
+          "line": 141
         }
       },
       {
@@ -13942,13 +14672,13 @@
         "description": "Multiple tokens.",
         "end": {
           "column": 3,
-          "line": 151
+          "line": 150
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.multipleTokens",
         "start": {
           "column": 18,
-          "line": 147
+          "line": 146
         }
       },
       {
@@ -13956,13 +14686,13 @@
         "description": "Tokens sent.",
         "end": {
           "column": 3,
-          "line": 156
+          "line": 155
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.tokensSent",
         "start": {
           "column": 14,
-          "line": 152
+          "line": 151
         }
       },
       {
@@ -13970,13 +14700,13 @@
         "description": "Tokens received.",
         "end": {
           "column": 3,
-          "line": 161
+          "line": 160
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.tokensReceived",
         "start": {
           "column": 18,
-          "line": 157
+          "line": 156
         }
       },
       {
@@ -13984,13 +14714,13 @@
         "description": "\"Fetching token data...\" message.",
         "end": {
           "column": 3,
-          "line": 166
+          "line": 165
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.fetchingTokenData",
         "start": {
           "column": 21,
-          "line": 162
+          "line": 161
         }
       },
       {
@@ -13998,13 +14728,13 @@
         "description": "Note to cancel a transaction that has been pending too long",
         "end": {
           "column": 3,
-          "line": 172
+          "line": 171
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.pending.cancelPendingTxnNote",
         "start": {
           "column": 24,
-          "line": 167
+          "line": 166
         }
       },
       {
@@ -14012,13 +14742,13 @@
         "description": "Link to support article for canceling a pending transaction",
         "end": {
           "column": 3,
-          "line": 177
+          "line": 176
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.pending.cancelPendingTxnSupportArticle",
         "start": {
           "column": 34,
-          "line": 173
+          "line": 172
         }
       },
       {
@@ -14026,13 +14756,13 @@
         "description": "Url to support article for canceling a pending transaction",
         "end": {
           "column": 3,
-          "line": 183
+          "line": 182
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.pending.supportArticleUrl",
         "start": {
           "column": 21,
-          "line": 178
+          "line": 177
         }
       },
       {
@@ -14040,13 +14770,13 @@
         "description": "Input Addresses label.",
         "end": {
           "column": 3,
-          "line": 188
+          "line": 187
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.noInputAddressesLabel",
         "start": {
           "column": 25,
-          "line": 184
+          "line": 183
         }
       },
       {
@@ -14054,13 +14784,13 @@
         "description": "Unresolved Input Addresses link label.",
         "end": {
           "column": 3,
-          "line": 193
+          "line": 192
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.unresolvedInputAddressesLinkLabel",
         "start": {
           "column": 37,
-          "line": 189
+          "line": 188
         }
       },
       {
@@ -14068,13 +14798,13 @@
         "description": "Unresolved Input Addresses additional label.",
         "end": {
           "column": 3,
-          "line": 198
+          "line": 197
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.unresolvedInputAddressesAdditionalLabel",
         "start": {
           "column": 43,
-          "line": 194
+          "line": 193
         }
       },
       {
@@ -14082,13 +14812,13 @@
         "description": "Note to cancel a transaction that has been failed",
         "end": {
           "column": 3,
-          "line": 204
+          "line": 203
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.failed.cancelFailedTxnNote",
         "start": {
           "column": 23,
-          "line": 199
+          "line": 198
         }
       },
       {
@@ -14096,13 +14826,13 @@
         "description": "Link to support article for removing a failed transaction",
         "end": {
           "column": 3,
-          "line": 209
+          "line": 208
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.failed.cancelFailedTxnSupportArticle",
         "start": {
           "column": 33,
-          "line": 205
+          "line": 204
         }
       },
       {
@@ -14110,13 +14840,13 @@
         "description": "Transaction state \"confirmed\"",
         "end": {
           "column": 3,
-          "line": 216
+          "line": 215
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.state.confirmed",
         "start": {
           "column": 26,
-          "line": 212
+          "line": 211
         }
       },
       {
@@ -14124,13 +14854,13 @@
         "description": "Transaction state \"pending\"",
         "end": {
           "column": 3,
-          "line": 221
+          "line": 220
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.state.pending",
         "start": {
           "column": 31,
-          "line": 217
+          "line": 216
         }
       },
       {
@@ -14138,13 +14868,13 @@
         "description": "Transaction state \"failed\"",
         "end": {
           "column": 3,
-          "line": 226
+          "line": 225
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.state.failed",
         "start": {
           "column": 30,
-          "line": 222
+          "line": 221
         }
       },
       {
@@ -14152,13 +14882,13 @@
         "description": "Transaction state \"confirmed\"",
         "end": {
           "column": 3,
-          "line": 233
+          "line": 232
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.state.confirmedHeading",
         "start": {
           "column": 26,
-          "line": 229
+          "line": 228
         }
       },
       {
@@ -14166,13 +14896,13 @@
         "description": "Transaction state \"pending\"",
         "end": {
           "column": 3,
-          "line": 238
+          "line": 237
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.state.pendingHeading",
         "start": {
           "column": 31,
-          "line": 234
+          "line": 233
         }
       },
       {
@@ -14180,13 +14910,13 @@
         "description": "Transaction state \"failed\"",
         "end": {
           "column": 3,
-          "line": 243
+          "line": 242
         },
         "file": "source/renderer/app/components/wallet/transactions/Transaction.tsx",
         "id": "wallet.transaction.state.failedHeading",
         "start": {
           "column": 30,
-          "line": 239
+          "line": 238
         }
       }
     ],
@@ -14199,13 +14929,13 @@
         "description": "Message shown when wallet has no transactions yet.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactions.tsx",
         "id": "wallet.transactions.no.transactions",
         "start": {
           "column": 18,
-          "line": 19
+          "line": 18
         }
       }
     ],
@@ -14218,13 +14948,13 @@
         "description": "Label for the \"Transactions\" header.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactionsHeader.tsx",
         "id": "wallet.transactions.header.transactions",
         "start": {
           "column": 16,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -14232,13 +14962,13 @@
         "description": "Label for the \"Export CSV\" button.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 24
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactionsHeader.tsx",
         "id": "wallet.transactions.header.exportCSV.button.label",
         "start": {
           "column": 24,
-          "line": 21
+          "line": 20
         }
       }
     ],
@@ -14251,13 +14981,13 @@
         "description": "Label for the \"Today\" label on the wallet summary page.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx",
         "id": "wallet.summary.transactionsList.todayLabel",
         "start": {
           "column": 9,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -14265,13 +14995,13 @@
         "description": "Label for the \"Yesterday\" label on the wallet summary page.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx",
         "id": "wallet.summary.transactionsList.yesterdayLabel",
         "start": {
           "column": 13,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -14279,13 +15009,13 @@
         "description": "Label for the \"Show more transactions\" button on the wallet summary page.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx",
         "id": "wallet.summary.transactionsList.showMoreTransactionsButtonLabel",
         "start": {
           "column": 35,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -14293,13 +15023,13 @@
         "description": "Syncing transactions message on async wallet restore.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/transactions/WalletTransactionsList.tsx",
         "id": "wallet.summary.transactionsList.syncingTransactionsMessage",
         "start": {
           "column": 30,
-          "line": 38
+          "line": 37
         }
       }
     ],
@@ -14312,13 +15042,13 @@
         "description": "Title  in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 19
+          "line": 18
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx",
         "id": "wallet.transferFunds.dialog1.title",
         "start": {
           "column": 15,
-          "line": 15
+          "line": 14
         }
       },
       {
@@ -14326,13 +15056,13 @@
         "description": "sourceWallet in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx",
         "id": "wallet.transferFunds.dialog1.sourceWallet",
         "start": {
           "column": 16,
-          "line": 20
+          "line": 19
         }
       },
       {
@@ -14340,13 +15070,13 @@
         "description": "targetWallet in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx",
         "id": "wallet.transferFunds.dialog1.targetWallet",
         "start": {
           "column": 16,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -14354,13 +15084,13 @@
         "description": "buttonLabel in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep1Dialog.tsx",
         "id": "wallet.transferFunds.dialog1.continueLabel",
         "start": {
           "column": 15,
-          "line": 30
+          "line": 29
         }
       }
     ],
@@ -14373,13 +15103,13 @@
         "description": "Title in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 28
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.title",
         "start": {
           "column": 15,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -14387,13 +15117,13 @@
         "description": "description in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.description.label",
         "start": {
           "column": 15,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -14401,13 +15131,13 @@
         "description": "Label Source wallet Amount in the transfer funds form",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 39
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.sourceWalletAmount.label",
         "start": {
           "column": 27,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -14415,13 +15145,13 @@
         "description": "Label Fees in the transfer funds form",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 44
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.fees.label",
         "start": {
           "column": 13,
-          "line": 41
+          "line": 40
         }
       },
       {
@@ -14429,13 +15159,13 @@
         "description": "Total Fees in the transfer funds form",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 49
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.total.label",
         "start": {
           "column": 14,
-          "line": 46
+          "line": 45
         }
       },
       {
@@ -14443,13 +15173,13 @@
         "description": "Label Leftovers in the transfer funds form",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 54
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.leftovers.label",
         "start": {
           "column": 18,
-          "line": 51
+          "line": 50
         }
       },
       {
@@ -14457,13 +15187,13 @@
         "description": "Label Leftovers in the transfer funds form",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.leftovers.LearnMore.label",
         "start": {
           "column": 27,
-          "line": 56
+          "line": 55
         }
       },
       {
@@ -14471,13 +15201,13 @@
         "description": "Label Leftovers in the transfer funds form",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.leftovers.LearnMore.url",
         "start": {
           "column": 25,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -14485,13 +15215,13 @@
         "description": "buttonLabel in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 69
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.label.buttonLabel",
         "start": {
           "column": 15,
-          "line": 66
+          "line": 65
         }
       },
       {
@@ -14499,13 +15229,13 @@
         "description": "passphraseFieldPlaceholder in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 74
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.passphraseFieldPlaceholder",
         "start": {
           "column": 30,
-          "line": 71
+          "line": 70
         }
       },
       {
@@ -14513,13 +15243,13 @@
         "description": "passphraseLabel in the transfer funds form.",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 79
         },
         "file": "source/renderer/app/components/wallet/transfer-funds/TransferFundsStep2Dialog.tsx",
         "id": "wallet.transferFunds.dialog2.passphraseLabel",
         "start": {
           "column": 19,
-          "line": 76
+          "line": 75
         }
       }
     ],
@@ -14532,13 +15262,13 @@
         "description": "Title for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.title",
         "start": {
           "column": 9,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -14546,13 +15276,13 @@
         "description": "Description for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 39
+          "line": 38
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.description",
         "start": {
           "column": 15,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -14560,13 +15290,13 @@
         "description": "Empty wallet description for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 44
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.emptyWallet",
         "start": {
           "column": 15,
-          "line": 40
+          "line": 39
         }
       },
       {
@@ -14574,13 +15304,13 @@
         "description": "\"Find out more\" link on the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 49
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.findOutMoreLink",
         "start": {
           "column": 19,
-          "line": 46
+          "line": 45
         }
       },
       {
@@ -14588,13 +15318,13 @@
         "description": "\"Find out more\" link URL on the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 55
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.findOutMoreLinkUrl",
         "start": {
           "column": 22,
-          "line": 51
+          "line": 50
         }
       },
       {
@@ -14602,13 +15332,13 @@
         "description": "Label X for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 60
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.labelX",
         "start": {
           "column": 10,
-          "line": 57
+          "line": 56
         }
       },
       {
@@ -14616,13 +15346,13 @@
         "description": "Label Y for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 66
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.labelY",
         "start": {
           "column": 10,
-          "line": 62
+          "line": 61
         }
       },
       {
@@ -14630,13 +15360,13 @@
         "description": "Number of pending transactions for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 73
+          "line": 72
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxo.tsx",
         "id": "wallet.settings.utxos.pendingTransactions",
         "start": {
           "column": 23,
-          "line": 67
+          "line": 66
         }
       }
     ],
@@ -14649,13 +15379,13 @@
         "description": "Tooltip for the \"Wallet Utxos - first bar\" screen.",
         "end": {
           "column": 3,
-          "line": 15
+          "line": 14
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx",
         "id": "wallet.settings.utxos.tooltipFirst",
         "start": {
           "column": 16,
-          "line": 10
+          "line": 9
         }
       },
       {
@@ -14663,13 +15393,13 @@
         "description": "Tooltip for the \"Wallet Utxos\" screen.",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 20
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx",
         "id": "wallet.settings.utxos.tooltip",
         "start": {
           "column": 11,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -14677,13 +15407,13 @@
         "description": "Tooltip for the \"Wallet Utxos - last bar\" screen.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/wallet/utxo/WalletUtxoTooltip.tsx",
         "id": "wallet.settings.utxos.tooltipLast",
         "start": {
           "column": 15,
-          "line": 22
+          "line": 21
         }
       }
     ],
@@ -14696,13 +15426,13 @@
         "description": "Title \"Create a new wallet\" in the wallet create form.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.title",
         "start": {
           "column": 15,
-          "line": 13
+          "line": 12
         }
       }
     ],
@@ -14715,27 +15445,27 @@
         "description": "Title \"Create a new wallet\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.title",
         "start": {
           "column": 15,
-          "line": 14
+          "line": 13
         }
       },
       {
         "defaultMessage": "!!!Step {currentStep} of {totalSteps}",
-        "description": "Step couters in the wallet create dialog.",
+        "description": "Step counters in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.stepsCounter",
         "start": {
           "column": 16,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -14743,13 +15473,13 @@
         "description": "Step \"Instructions\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.instructionsStep",
         "start": {
           "column": 20,
-          "line": 24
+          "line": 23
         }
       },
       {
@@ -14757,13 +15487,13 @@
         "description": "Step \"Template\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 33
+          "line": 32
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.templateStep",
         "start": {
           "column": 16,
-          "line": 29
+          "line": 28
         }
       },
       {
@@ -14771,13 +15501,13 @@
         "description": "Step \"Mnemonics\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.mnemonicsStep",
         "start": {
           "column": 17,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -14785,13 +15515,13 @@
         "description": "Step \"Validate\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.validateStep",
         "start": {
           "column": 16,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -14799,13 +15529,13 @@
         "description": "Step \"HashImage\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.hashImageStep",
         "start": {
           "column": 17,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -14813,13 +15543,13 @@
         "description": "Step \"Config\" in the wallet create dialog.",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 52
         },
         "file": "source/renderer/app/components/wallet/wallet-create/WalletCreateSteps.tsx",
         "id": "wallet.create.dialog.configStep",
         "start": {
           "column": 14,
-          "line": 49
+          "line": 48
         }
       }
     ],
@@ -14832,13 +15562,13 @@
         "description": "Import wallets dialog title",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.title",
         "start": {
           "column": 9,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -14846,13 +15576,13 @@
         "description": "<p>This feature enables you to import wallets from the production version of Daedalus, or from the Daedalus state directory. </p> <p>If you don’t have the complete state directory, then you will need either the ‘Secrets’ or ‘Secrets-1.0’ folder containing the ‘secret.key’ file to be able to import a wallet, although without the complete state directory Daedalus won’t be able to detect your wallet names. </p> <p>If you don’t have either the ‘Secrets’ or the ‘Secrets-1.0’ folder containing the ‘secret.key’ file, then you cannot import wallets using this feature.</p>",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.description",
         "start": {
           "column": 15,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -14860,13 +15590,13 @@
         "description": "Select Daedalus state folder:",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.stateFolderLabel",
         "start": {
           "column": 20,
-          "line": 39
+          "line": 38
         }
       },
       {
@@ -14874,13 +15604,13 @@
         "description": "Select Daedalus 'secret.key' file:",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.secretFileLabel",
         "start": {
           "column": 19,
-          "line": 44
+          "line": 43
         }
       },
       {
@@ -14888,13 +15618,13 @@
         "description": "Import wallets",
         "end": {
           "column": 3,
-          "line": 53
+          "line": 52
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.buttonLabel",
         "start": {
           "column": 15,
-          "line": 49
+          "line": 48
         }
       },
       {
@@ -14902,13 +15632,13 @@
         "description": "No wallets found. Make sure you have selected a Daedalus state directory which contains the ‘Secrets’ or `Secrets-1.0` folder with a `secret.key` file inside.",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.stateDirNoWallets",
         "start": {
           "column": 21,
-          "line": 54
+          "line": 53
         }
       },
       {
@@ -14916,13 +15646,13 @@
         "description": "No wallets found. Make sure you have selected a valid `secret.key` file.",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 66
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.secretFileNoWallets",
         "start": {
           "column": 23,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -14930,13 +15660,13 @@
         "description": "Learn more",
         "end": {
           "column": 3,
-          "line": 72
+          "line": 71
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.linkLabel",
         "start": {
           "column": 13,
-          "line": 68
+          "line": 67
         }
       },
       {
@@ -14944,13 +15674,13 @@
         "description": "\"Learn more\" link URL on the wallet import file dialog",
         "end": {
           "column": 3,
-          "line": 78
+          "line": 77
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.linkUrl",
         "start": {
           "column": 11,
-          "line": 73
+          "line": 72
         }
       },
       {
@@ -14958,13 +15688,13 @@
         "description": "Import from:",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 82
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.importFromLabel",
         "start": {
           "column": 19,
-          "line": 79
+          "line": 78
         }
       },
       {
@@ -14972,13 +15702,13 @@
         "description": "Daedalus state directory",
         "end": {
           "column": 3,
-          "line": 88
+          "line": 87
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.stateDirOptionLabel",
         "start": {
           "column": 23,
-          "line": 84
+          "line": 83
         }
       },
       {
@@ -14986,13 +15716,13 @@
         "description": "Daedalus 'secret.key' file",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 92
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletImportFileDialog.tsx",
         "id": "wallet.import.file.dialog.secretFileOptionLabel",
         "start": {
           "column": 25,
-          "line": 89
+          "line": 88
         }
       }
     ],
@@ -15005,13 +15735,13 @@
         "description": "Select import wallets dialog title",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 37
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.title",
         "start": {
           "column": 9,
-          "line": 34
+          "line": 33
         }
       },
       {
@@ -15019,27 +15749,27 @@
         "description": "These wallets were found in your Daedalus state directory. Please select the wallets you want to import.",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 44
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.description",
         "start": {
           "column": 15,
-          "line": 39
+          "line": 38
         }
       },
       {
         "defaultMessage": "!!!Unnamed wallets",
-        "description": "unamedWalletsTitle",
+        "description": "unnamedWalletsTitle",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 49
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
-        "id": "wallet.select.import.dialog.unamedWalletsTitle",
+        "id": "wallet.select.import.dialog.unnamedWalletsTitle",
         "start": {
-          "column": 22,
-          "line": 46
+          "column": 23,
+          "line": 45
         }
       },
       {
@@ -15047,13 +15777,13 @@
         "description": "Password protected",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 54
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.passwordProtected",
         "start": {
           "column": 21,
-          "line": 51
+          "line": 50
         }
       },
       {
@@ -15061,13 +15791,13 @@
         "description": "Wallet already exists",
         "end": {
           "column": 3,
-          "line": 60
+          "line": 59
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.walletExists",
         "start": {
           "column": 16,
-          "line": 56
+          "line": 55
         }
       },
       {
@@ -15075,13 +15805,13 @@
         "description": "No password",
         "end": {
           "column": 3,
-          "line": 65
+          "line": 64
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.noPassword",
         "start": {
           "column": 14,
-          "line": 61
+          "line": 60
         }
       },
       {
@@ -15089,13 +15819,13 @@
         "description": "Importing wallet...",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 69
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.importingWallet",
         "start": {
           "column": 19,
-          "line": 66
+          "line": 65
         }
       },
       {
@@ -15103,13 +15833,13 @@
         "description": "Enter wallet name",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 74
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.walletName",
         "start": {
           "column": 14,
-          "line": 71
+          "line": 70
         }
       },
       {
@@ -15117,13 +15847,13 @@
         "description": "Name not found",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 79
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.notFound",
         "start": {
           "column": 12,
-          "line": 76
+          "line": 75
         }
       },
       {
@@ -15131,13 +15861,13 @@
         "description": "Enter a wallet name first",
         "end": {
           "column": 3,
-          "line": 85
+          "line": 84
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.enterWalletNameTooltip",
         "start": {
           "column": 26,
-          "line": 81
+          "line": 80
         }
       },
       {
@@ -15145,13 +15875,13 @@
         "description": "Max number of wallets reached",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 90
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.maxWalletsReachedTooltip",
         "start": {
           "column": 28,
-          "line": 86
+          "line": 85
         }
       },
       {
@@ -15159,13 +15889,13 @@
         "description": "Wallet imported",
         "end": {
           "column": 3,
-          "line": 96
+          "line": 95
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.walletImported",
         "start": {
           "column": 18,
-          "line": 92
+          "line": 91
         }
       },
       {
@@ -15173,13 +15903,13 @@
         "description": "Import selected wallets",
         "end": {
           "column": 3,
-          "line": 101
+          "line": 100
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.buttonLabel",
         "start": {
           "column": 15,
-          "line": 97
+          "line": 96
         }
       },
       {
@@ -15187,13 +15917,13 @@
         "description": "Learn more",
         "end": {
           "column": 3,
-          "line": 106
+          "line": 105
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.linkLabel",
         "start": {
           "column": 13,
-          "line": 102
+          "line": 101
         }
       },
       {
@@ -15201,13 +15931,13 @@
         "description": "\"Learn more\" link URL on the wallet import file dialog",
         "end": {
           "column": 3,
-          "line": 112
+          "line": 111
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.linkUrl",
         "start": {
           "column": 11,
-          "line": 107
+          "line": 106
         }
       },
       {
@@ -15215,13 +15945,13 @@
         "description": "Close window",
         "end": {
           "column": 3,
-          "line": 117
+          "line": 116
         },
         "file": "source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx",
         "id": "wallet.select.import.dialog.closeWindow",
         "start": {
           "column": 15,
-          "line": 113
+          "line": 112
         }
       }
     ],
@@ -15234,13 +15964,13 @@
         "description": "Description1 for Configuration Step",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx",
         "id": "wallet.restore.dialog.step.configuration.description1",
         "start": {
           "column": 16,
-          "line": 30
+          "line": 29
         }
       },
       {
@@ -15248,13 +15978,13 @@
         "description": "Description2 for Configuration Step",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx",
         "id": "wallet.restore.dialog.step.configuration.description2",
         "start": {
           "column": 16,
-          "line": 36
+          "line": 35
         }
       },
       {
@@ -15262,13 +15992,13 @@
         "description": "Label for Wallet Name Input",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx",
         "id": "wallet.restore.dialog.step.configuration.input.walletName.label",
         "start": {
           "column": 19,
-          "line": 42
+          "line": 41
         }
       },
       {
@@ -15276,13 +16006,13 @@
         "description": "Placeholder for Wallet Name Input",
         "end": {
           "column": 3,
-          "line": 51
+          "line": 50
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx",
         "id": "wallet.restore.dialog.step.configuration.input.walletName.placeholder",
         "start": {
           "column": 25,
-          "line": 47
+          "line": 46
         }
       },
       {
@@ -15290,13 +16020,13 @@
         "description": "Label for the \"Wallet password\" input in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 57
+          "line": 56
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx",
         "id": "wallet.restore.dialog.step.configuration.input.spendingPassword.label",
         "start": {
           "column": 25,
-          "line": 52
+          "line": 51
         }
       },
       {
@@ -15304,13 +16034,13 @@
         "description": "Label for the \"Repeat password\" input in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 62
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/ConfigurationDialog.tsx",
         "id": "wallet.restore.dialog.step.configuration.input.repeatPassword.label",
         "start": {
           "column": 23,
-          "line": 58
+          "line": 57
         }
       },
       {
@@ -15324,7 +16054,7 @@
         "id": "wallet.restore.dialog.step.configuration.input.passwordFields.placeholder",
         "start": {
           "column": 29,
-          "line": 64
+          "line": 63
         }
       },
       {
@@ -15379,7 +16109,7 @@
         "description": "Placeholder for the multi-length mnemonics autocomplete.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx",
         "id": "wallet.restore.dialog.step.mnemonics.autocomplete.multiLengthPhrase.placeholder",
@@ -15393,13 +16123,13 @@
         "description": "\"No results\" message for the mnemonics autocomplete search results.",
         "end": {
           "column": 3,
-          "line": 38
+          "line": 39
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx",
         "id": "wallet.restore.dialog.step.mnemonics.autocomplete.noResults",
         "start": {
           "column": 25,
-          "line": 33
+          "line": 34
         }
       },
       {
@@ -15407,13 +16137,13 @@
         "description": "Label for the mnemonics Continue button.",
         "end": {
           "column": 3,
-          "line": 43
+          "line": 44
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx",
         "id": "wallet.restore.dialog.step.mnemonics.autocomplete.continueButtonLabel",
         "start": {
           "column": 23,
-          "line": 39
+          "line": 40
         }
       },
       {
@@ -15421,13 +16151,13 @@
         "description": "Label for invalid recovery phrase",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 50
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/MnemonicsDialog.tsx",
         "id": "wallet.restore.dialog.step.mnemonics.autocomplete.invalidRecoveryPhrase",
         "start": {
           "column": 25,
-          "line": 44
+          "line": 45
         }
       }
     ],
@@ -15440,13 +16170,13 @@
         "description": "Label for Close button on the wallet restore \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 23
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx",
         "id": "wallet.restore.dialog.step.success.dialog.close",
         "start": {
           "column": 20,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -15454,13 +16184,13 @@
         "description": "Description \"line 1\" on the wallet restore \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx",
         "id": "wallet.restore.dialog.step.success.dialog.description.line1",
         "start": {
           "column": 20,
-          "line": 25
+          "line": 24
         }
       },
       {
@@ -15468,13 +16198,13 @@
         "description": "Description \"line 2\" on the wallet restore \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx",
         "id": "wallet.restore.dialog.step.success.dialog.description.line2",
         "start": {
           "column": 20,
-          "line": 31
+          "line": 30
         }
       },
       {
@@ -15482,13 +16212,13 @@
         "description": "Description \"line 3\" on the wallet restore \"success\" step dialog.",
         "end": {
           "column": 3,
-          "line": 44
+          "line": 43
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/SuccessDialog.tsx",
         "id": "wallet.restore.dialog.step.success.dialog.description.line3",
         "start": {
           "column": 20,
-          "line": 38
+          "line": 37
         }
       }
     ],
@@ -15501,13 +16231,13 @@
         "description": "Label for the \"labelwalletKind\" checkbox.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.walletKind",
         "start": {
           "column": 19,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -15515,13 +16245,13 @@
         "description": "Label for the \"labelWalletKindDaedalus\" checkbox.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.walletKindDaedalus",
         "start": {
           "column": 27,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -15529,13 +16259,13 @@
         "description": "Label for the \"labelWalletKindYoroi\" checkbox.",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.walletKindYoroi",
         "start": {
           "column": 24,
-          "line": 37
+          "line": 36
         }
       },
       {
@@ -15543,13 +16273,13 @@
         "description": "Label for the \"labelWalletKindHardware\" checkbox.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.walletKindHardware",
         "start": {
           "column": 27,
-          "line": 42
+          "line": 41
         }
       },
       {
@@ -15557,13 +16287,13 @@
         "description": "Label for the \"labelDaedalusWalletKind\" checkbox.",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 51
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.daedalusWalletKind",
         "start": {
           "column": 27,
-          "line": 47
+          "line": 46
         }
       },
       {
@@ -15577,7 +16307,7 @@
         "id": "wallet.restore.dialog.step.walletKind.label.daedalusWalletKind12WordByron",
         "start": {
           "column": 38,
-          "line": 53
+          "line": 52
         }
       },
       {
@@ -15585,7 +16315,7 @@
         "description": "Label for the \"labelDaedalusWalletKind15WordShelley\" checkbox.",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.daedalusWalletKind15WordShelley",
@@ -15599,13 +16329,13 @@
         "description": "Label for the \"labelDaedalusWalletKind24WordShelley\" checkbox.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 72
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.daedalusWalletKind24WordShelley",
         "start": {
           "column": 40,
-          "line": 65
+          "line": 66
         }
       },
       {
@@ -15613,13 +16343,13 @@
         "description": "Label for the \"labelDaedalusWalletKind27WordPaper\" checkbox.",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 78
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.daedalusWalletKind27WordPaper",
         "start": {
           "column": 38,
-          "line": 71
+          "line": 73
         }
       },
       {
@@ -15627,13 +16357,13 @@
         "description": "Label for the \"labelYoroiWalletKind\" checkbox.",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 83
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.yoroiWalletKind",
         "start": {
           "column": 24,
-          "line": 76
+          "line": 79
         }
       },
       {
@@ -15641,13 +16371,13 @@
         "description": "Label for the \"labelDaedalusWalletKind15WordByron\" checkbox.",
         "end": {
           "column": 3,
-          "line": 85
+          "line": 89
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.yoroiWalletKindByronLegacy15Word",
         "start": {
           "column": 35,
-          "line": 81
+          "line": 84
         }
       },
       {
@@ -15655,13 +16385,13 @@
         "description": "Label for the \"labelDaedalusWalletKind15WordShelley\" checkbox.",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 96
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.yoroiWalletKindShelley15Word",
         "start": {
           "column": 37,
-          "line": 86
+          "line": 90
         }
       },
       {
@@ -15669,13 +16399,13 @@
         "description": "Label for the \"labelHardwareWalletKind\" checkbox.",
         "end": {
           "column": 3,
-          "line": 97
+          "line": 102
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.hardwareWalletKind",
         "start": {
           "column": 27,
-          "line": 92
+          "line": 97
         }
       },
       {
@@ -15683,13 +16413,13 @@
         "description": "Label for the \"labelHardwareWalletKindLedger\" checkbox.",
         "end": {
           "column": 3,
-          "line": 102
+          "line": 107
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.hardwareWalletKindLedger",
         "start": {
           "column": 33,
-          "line": 98
+          "line": 103
         }
       },
       {
@@ -15697,13 +16427,13 @@
         "description": "Label for the \"labelHardwareWalletKindTrezor\" checkbox.",
         "end": {
           "column": 3,
-          "line": 107
+          "line": 112
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.label.hardwareWalletKindTrezor",
         "start": {
           "column": 33,
-          "line": 103
+          "line": 108
         }
       },
       {
@@ -15711,13 +16441,13 @@
         "description": "Label for the \"hardwareWalletDisclaimer1\" disclaimer.",
         "end": {
           "column": 3,
-          "line": 113
+          "line": 118
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.hardwareWalletDisclaimer1",
         "start": {
           "column": 29,
-          "line": 108
+          "line": 113
         }
       },
       {
@@ -15725,13 +16455,13 @@
         "description": "Label for the \"hardwareWalletDisclaimer2\" disclaimer.",
         "end": {
           "column": 3,
-          "line": 119
+          "line": 124
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.hardwareWalletDisclaimer2",
         "start": {
           "column": 29,
-          "line": 114
+          "line": 119
         }
       },
       {
@@ -15739,13 +16469,13 @@
         "description": "Label for the \"hardwareWalletDisclaimer3\" disclaimer.",
         "end": {
           "column": 3,
-          "line": 125
+          "line": 130
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.hardwareWalletDisclaimer3",
         "start": {
           "column": 29,
-          "line": 120
+          "line": 125
         }
       },
       {
@@ -15753,13 +16483,13 @@
         "description": "Label for the \"hardwareWalletCheckbox1\" disclaimer.",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 136
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.hardwareWalletCheckbox1",
         "start": {
           "column": 27,
-          "line": 126
+          "line": 131
         }
       },
       {
@@ -15767,13 +16497,13 @@
         "description": "Label for the \"hardwareWalletCheckbox2\" disclaimer.",
         "end": {
           "column": 3,
-          "line": 137
+          "line": 142
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.hardwareWalletCheckbox2",
         "start": {
           "column": 27,
-          "line": 132
+          "line": 137
         }
       },
       {
@@ -15781,13 +16511,13 @@
         "description": "Label for the \"hardwareWalletCheckbox2\" disclaimer.",
         "end": {
           "column": 3,
-          "line": 143
+          "line": 148
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/WalletTypeDialog.tsx",
         "id": "wallet.restore.dialog.step.walletKind.hardwareWalletCheckbox3",
         "start": {
           "column": 27,
-          "line": 138
+          "line": 143
         }
       }
     ],
@@ -15800,13 +16530,13 @@
         "description": "Headline for the wallet restoration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 15
+          "line": 14
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx",
         "id": "wallet.restore.dialog.confirmation.headline",
         "start": {
           "column": 12,
-          "line": 10
+          "line": 9
         }
       },
       {
@@ -15814,13 +16544,13 @@
         "description": "Content for the wallet restoration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx",
         "id": "wallet.restore.dialog.confirmation.content",
         "start": {
           "column": 11,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -15828,13 +16558,13 @@
         "description": "\"Cancel\" button label for the wallet restoration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx",
         "id": "wallet.restore.dialog.confirmation.button.cancelButtonLabel",
         "start": {
           "column": 21,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -15842,13 +16572,13 @@
         "description": "\"Abort\" button label for the wallet restoration cancellation confirmation dialog.",
         "end": {
           "column": 3,
-          "line": 34
+          "line": 33
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/ConfirmationDialog.tsx",
         "id": "wallet.restore.dialog.confirmation.button.confirmButtonLabel",
         "start": {
           "column": 22,
-          "line": 29
+          "line": 28
         }
       }
     ],
@@ -15861,13 +16591,13 @@
         "description": "Title \"Create a new wallet\" in the wallet restore form.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.title",
         "start": {
           "column": 15,
-          "line": 16
+          "line": 15
         }
       },
       {
@@ -15875,27 +16605,27 @@
         "description": "Title \"Create a new wallet\" in the wallet restore form.",
         "end": {
           "column": 3,
-          "line": 25
+          "line": 24
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.titleSuccess",
         "start": {
           "column": 22,
-          "line": 21
+          "line": 20
         }
       },
       {
         "defaultMessage": "!!!Step {currentStep} of {totalSteps}",
-        "description": "Step couters in the wallet restore dialog.",
+        "description": "Step counters in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.stepsCounter",
         "start": {
           "column": 16,
-          "line": 26
+          "line": 25
         }
       }
     ],
@@ -15908,13 +16638,13 @@
         "description": "Step \"Type\" in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx",
         "id": "wallet.restore.dialog.typeStep",
         "start": {
           "column": 12,
-          "line": 14
+          "line": 13
         }
       },
       {
@@ -15922,13 +16652,13 @@
         "description": "Step \"Recovery Phrase\" in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx",
         "id": "wallet.restore.dialog.mnemonicsStep",
         "start": {
           "column": 17,
-          "line": 19
+          "line": 18
         }
       },
       {
@@ -15936,13 +16666,13 @@
         "description": "Step \"Configuration\" in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 28
+          "line": 27
         },
         "file": "source/renderer/app/components/wallet/wallet-restore/widgets/WalletRestoreSteps.tsx",
         "id": "wallet.restore.dialog.configurationStep",
         "start": {
           "column": 21,
-          "line": 24
+          "line": 23
         }
       }
     ],
@@ -15955,13 +16685,13 @@
         "description": "Label for the \"Add wallet\" title on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 24
+          "line": 19
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.title.label",
         "start": {
           "column": 9,
-          "line": 20
+          "line": 15
         }
       },
       {
@@ -15969,13 +16699,13 @@
         "description": "Label for the \"Create\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 29
+          "line": 24
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.create.label",
         "start": {
           "column": 15,
-          "line": 25
+          "line": 20
         }
       },
       {
@@ -15983,13 +16713,13 @@
         "description": "Description for the \"Create a new wallet\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 30
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.create.description",
         "start": {
           "column": 21,
-          "line": 30
+          "line": 25
         }
       },
       {
@@ -15997,13 +16727,13 @@
         "description": "Label for the \"Join\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 40
+          "line": 35
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.join.label",
         "start": {
           "column": 13,
-          "line": 36
+          "line": 31
         }
       },
       {
@@ -16011,13 +16741,13 @@
         "description": "Description for the \"Join\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 45
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.join.description",
         "start": {
           "column": 19,
-          "line": 41
+          "line": 36
         }
       },
       {
@@ -16025,13 +16755,13 @@
         "description": "Label for the \"Connect\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 50
+          "line": 45
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.connect.label",
         "start": {
           "column": 16,
-          "line": 46
+          "line": 41
         }
       },
       {
@@ -16039,13 +16769,13 @@
         "description": "Description for the \"Connect\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 51
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.connect.description",
         "start": {
           "column": 22,
-          "line": 51
+          "line": 46
         }
       },
       {
@@ -16053,13 +16783,13 @@
         "description": "Label for the \"Restore\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 56
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.restore.label",
         "start": {
           "column": 16,
-          "line": 57
+          "line": 52
         }
       },
       {
@@ -16067,13 +16797,13 @@
         "description": "Description for the \"Restore\" button with paper wallet certificate on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 68
+          "line": 63
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.restore.withCertificate.description",
         "start": {
           "column": 37,
-          "line": 62
+          "line": 57
         }
       },
       {
@@ -16081,13 +16811,13 @@
         "description": "Description for the \"Restore\" button without paper wallet certificate on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 74
+          "line": 69
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.restore.withoutCertificate.description",
         "start": {
           "column": 40,
-          "line": 69
+          "line": 64
         }
       },
       {
@@ -16095,13 +16825,13 @@
         "description": "Label for the \"Import\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 79
+          "line": 74
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.import.label",
         "start": {
           "column": 15,
-          "line": 75
+          "line": 70
         }
       },
       {
@@ -16109,13 +16839,13 @@
         "description": "Description for the \"Import\" button on the wallet add dialog.",
         "end": {
           "column": 3,
-          "line": 86
+          "line": 81
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.import.description",
         "start": {
           "column": 21,
-          "line": 80
+          "line": 75
         }
       },
       {
@@ -16123,13 +16853,13 @@
         "description": "Restore notification message shown during async wallet restore on the wallet add screen.",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 88
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.restoreNotificationMessage",
         "start": {
           "column": 30,
-          "line": 87
+          "line": 82
         }
       },
       {
@@ -16137,13 +16867,13 @@
         "description": "\"Maximum number of wallets reached\" notification message shown on the wallet add screen if user has 50 wallets.",
         "end": {
           "column": 3,
-          "line": 100
+          "line": 95
         },
         "file": "source/renderer/app/components/wallet/WalletAdd.tsx",
         "id": "wallet.add.dialog.maxNumberOfWalletsNotificationMessage",
         "start": {
           "column": 41,
-          "line": 94
+          "line": 89
         }
       }
     ],
@@ -16156,13 +16886,13 @@
         "description": "Title \"Connect a hardware wallet device\" in the connect wallet dialog.",
         "end": {
           "column": 3,
-          "line": 47
+          "line": 42
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.title",
         "start": {
           "column": 15,
-          "line": 42
+          "line": 37
         }
       },
       {
@@ -16170,13 +16900,13 @@
         "description": "Label for the \"Cancel\" button in the connect wallet dialog",
         "end": {
           "column": 3,
-          "line": 52
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.button.cancel",
         "start": {
           "column": 16,
-          "line": 48
+          "line": 43
         }
       },
       {
@@ -16184,13 +16914,13 @@
         "description": "Follow instructions label",
         "end": {
           "column": 3,
-          "line": 58
+          "line": 53
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.instructions",
         "start": {
           "column": 16,
-          "line": 53
+          "line": 48
         }
       },
       {
@@ -16198,13 +16928,13 @@
         "description": "Follow instructions label",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 59
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.instructionsTrezorOnly",
         "start": {
           "column": 26,
-          "line": 59
+          "line": 54
         }
       },
       {
@@ -16212,13 +16942,13 @@
         "description": "Connecting issue support description",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.connectingIssueSupportLabel",
         "start": {
           "column": 31,
-          "line": 65
+          "line": 60
         }
       },
       {
@@ -16226,13 +16956,13 @@
         "description": "Connecting issue support link",
         "end": {
           "column": 3,
-          "line": 75
+          "line": 70
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.connectingIssueSupportLink",
         "start": {
           "column": 30,
-          "line": 71
+          "line": 66
         }
       },
       {
@@ -16240,13 +16970,13 @@
         "description": "Link to support article",
         "end": {
           "column": 3,
-          "line": 80
+          "line": 75
         },
         "file": "source/renderer/app/components/wallet/WalletConnectDialog.tsx",
         "id": "wallet.connect.dialog.connectingIssueSupportLinkUrl",
         "start": {
           "column": 33,
-          "line": 76
+          "line": 71
         }
       }
     ],
@@ -16259,13 +16989,13 @@
         "description": "Title \"Create a new wallet\" in the wallet create form.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 34
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.title",
         "start": {
           "column": 15,
-          "line": 32
+          "line": 30
         }
       },
       {
@@ -16273,13 +17003,13 @@
         "description": "Label for the \"Wallet Name\" text input in the wallet create form.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 40
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.name.label",
         "start": {
           "column": 14,
-          "line": 37
+          "line": 35
         }
       },
       {
@@ -16287,13 +17017,13 @@
         "description": "Hint for the \"Wallet Name\" text input in the wallet create form.",
         "end": {
           "column": 3,
-          "line": 48
+          "line": 46
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.walletNameHint",
         "start": {
           "column": 18,
-          "line": 43
+          "line": 41
         }
       },
       {
@@ -16301,13 +17031,13 @@
         "description": "Label for the \"Create Shelley wallet\" button on create wallet dialog.",
         "end": {
           "column": 3,
-          "line": 54
+          "line": 52
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.create.personal.wallet.button.label",
         "start": {
           "column": 24,
-          "line": 49
+          "line": 47
         }
       },
       {
@@ -16315,13 +17045,13 @@
         "description": "Password creation label.",
         "end": {
           "column": 3,
-          "line": 59
+          "line": 57
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.passwordSectionLabel",
         "start": {
           "column": 24,
-          "line": 55
+          "line": 53
         }
       },
       {
@@ -16329,13 +17059,13 @@
         "description": "Password creation description.",
         "end": {
           "column": 3,
-          "line": 64
+          "line": 62
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.passwordSectionDescription",
         "start": {
           "column": 30,
-          "line": 60
+          "line": 58
         }
       },
       {
@@ -16343,13 +17073,13 @@
         "description": "Label for the \"Wallet password\" input in the create wallet dialog.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 68
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.spendingPasswordLabel",
         "start": {
           "column": 25,
-          "line": 65
+          "line": 63
         }
       },
       {
@@ -16357,13 +17087,13 @@
         "description": "Label for the \"Repeat password\" input in the create wallet dialog.",
         "end": {
           "column": 3,
-          "line": 76
+          "line": 74
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.repeatPasswordLabel",
         "start": {
           "column": 23,
-          "line": 71
+          "line": 69
         }
       },
       {
@@ -16371,13 +17101,13 @@
         "description": "Placeholder for the \"Password\" inputs in the create wallet dialog.",
         "end": {
           "column": 3,
-          "line": 82
+          "line": 80
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.create.dialog.passwordFieldPlaceholder",
         "start": {
           "column": 28,
-          "line": 77
+          "line": 75
         }
       },
       {
@@ -16385,13 +17115,13 @@
         "description": "Tooltip for the password input in the wallet dialog.",
         "end": {
           "column": 3,
-          "line": 88
+          "line": 86
         },
         "file": "source/renderer/app/components/wallet/WalletCreateDialog.tsx",
         "id": "wallet.dialog.passwordTooltip",
         "start": {
           "column": 19,
-          "line": 83
+          "line": 81
         }
       }
     ],
@@ -16404,13 +17134,13 @@
         "description": "Label \"Restore wallet\" on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 47
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.title.label",
         "start": {
           "column": 9,
-          "line": 45
+          "line": 43
         }
       },
       {
@@ -16418,13 +17148,13 @@
         "description": "Label for the wallet name input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 55
+          "line": 53
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.wallet.name.input.label",
         "start": {
           "column": 24,
-          "line": 50
+          "line": 48
         }
       },
       {
@@ -16432,13 +17162,13 @@
         "description": "Hint \"Name the wallet you are restoring\" for the wallet name input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 61
+          "line": 59
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.wallet.name.input.hint",
         "start": {
           "column": 23,
-          "line": 56
+          "line": 54
         }
       },
       {
@@ -16446,13 +17176,13 @@
         "description": "Label for the recovery phrase type options on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 67
+          "line": 65
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.type.options.label",
         "start": {
           "column": 27,
-          "line": 62
+          "line": 60
         }
       },
       {
@@ -16460,13 +17190,13 @@
         "description": "Word for the recovery phrase type on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 73
+          "line": 71
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.type.word",
         "start": {
           "column": 32,
-          "line": 68
+          "line": 66
         }
       },
       {
@@ -16474,13 +17204,13 @@
         "description": "Label for the recovery phrase type 15-word option on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 79
+          "line": 77
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.type.15word.option",
         "start": {
           "column": 34,
-          "line": 74
+          "line": 72
         }
       },
       {
@@ -16488,13 +17218,13 @@
         "description": "Label for the recovery phrase type 12-word option on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 85
+          "line": 83
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.type.12word.option",
         "start": {
           "column": 34,
-          "line": 80
+          "line": 78
         }
       },
       {
@@ -16502,13 +17232,13 @@
         "description": "Label for the recovery phrase input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 91
+          "line": 89
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.input.label",
         "start": {
           "column": 28,
-          "line": 86
+          "line": 84
         }
       },
       {
@@ -16516,13 +17246,13 @@
         "description": "Hint \"Enter recovery phrase\" for the recovery phrase input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 97
+          "line": 95
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.input.hint",
         "start": {
           "column": 27,
-          "line": 92
+          "line": 90
         }
       },
       {
@@ -16530,13 +17260,13 @@
         "description": "Label \"new\" on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 102
+          "line": 100
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.newLabel",
         "start": {
           "column": 12,
-          "line": 98
+          "line": 96
         }
       },
       {
@@ -16544,13 +17274,13 @@
         "description": "\"No results\" message for the recovery phrase input search results.",
         "end": {
           "column": 3,
-          "line": 108
+          "line": 106
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.recovery.phrase.input.noResults",
         "start": {
           "column": 27,
-          "line": 103
+          "line": 101
         }
       },
       {
@@ -16558,13 +17288,13 @@
         "description": "Label for the \"Restore wallet\" button on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 114
+          "line": 112
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.restore.wallet.button.label",
         "start": {
           "column": 21,
-          "line": 109
+          "line": 107
         }
       },
       {
@@ -16572,13 +17302,13 @@
         "description": "Error message shown when invalid recovery phrase was entered.",
         "end": {
           "column": 3,
-          "line": 120
+          "line": 118
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.form.errors.invalidRecoveryPhrase",
         "start": {
           "column": 25,
-          "line": 115
+          "line": 113
         }
       },
       {
@@ -16586,13 +17316,13 @@
         "description": "Password creation label.",
         "end": {
           "column": 3,
-          "line": 125
+          "line": 123
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.passwordSectionLabel",
         "start": {
           "column": 24,
-          "line": 121
+          "line": 119
         }
       },
       {
@@ -16600,13 +17330,13 @@
         "description": "Password creation description.",
         "end": {
           "column": 3,
-          "line": 131
+          "line": 129
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.passwordSectionDescription",
         "start": {
           "column": 30,
-          "line": 126
+          "line": 124
         }
       },
       {
@@ -16614,13 +17344,13 @@
         "description": "Label for the \"Wallet password\" input in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 137
+          "line": 135
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.spendingPasswordLabel",
         "start": {
           "column": 25,
-          "line": 132
+          "line": 130
         }
       },
       {
@@ -16628,13 +17358,13 @@
         "description": "Label for the \"Repeat password\" input in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 143
+          "line": 141
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.repeatPasswordLabel",
         "start": {
           "column": 23,
-          "line": 138
+          "line": 136
         }
       },
       {
@@ -16642,13 +17372,13 @@
         "description": "Placeholder for the \"Password\" inputs in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 149
+          "line": 147
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.passwordFieldPlaceholder",
         "start": {
           "column": 28,
-          "line": 144
+          "line": 142
         }
       },
       {
@@ -16656,13 +17386,13 @@
         "description": "Tab title \"Daedalus wallet\" in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 154
+          "line": 152
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.tab.title.recoveryPhrase",
         "start": {
           "column": 26,
-          "line": 150
+          "line": 148
         }
       },
       {
@@ -16670,13 +17400,13 @@
         "description": "Tab title \"Daedalus paper wallet\" in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 160
+          "line": 158
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.tab.title.certificate",
         "start": {
           "column": 23,
-          "line": 155
+          "line": 153
         }
       },
       {
@@ -16684,13 +17414,13 @@
         "description": "Tab title \"Yoroi wallet\" in the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 165
+          "line": 163
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.tab.title.yoroi",
         "start": {
           "column": 17,
-          "line": 161
+          "line": 159
         }
       },
       {
@@ -16698,13 +17428,13 @@
         "description": "Label for the shielded recovery phrase input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 171
+          "line": 169
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.shielded.recovery.phrase.input.label",
         "start": {
           "column": 36,
-          "line": 166
+          "line": 164
         }
       },
       {
@@ -16712,13 +17442,13 @@
         "description": "Hint \"Enter your 27-word paper wallet recovery phrase.\" for the recovery phrase input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 178
+          "line": 176
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.shielded.recovery.phrase.input.hint",
         "start": {
           "column": 35,
-          "line": 172
+          "line": 170
         }
       },
       {
@@ -16726,13 +17456,13 @@
         "description": "Placeholder \"Enter word #\" for the recovery phrase input on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 184
+          "line": 182
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.shielded.recovery.phrase.input.placeholder",
         "start": {
           "column": 42,
-          "line": 179
+          "line": 177
         }
       },
       {
@@ -16740,13 +17470,13 @@
         "description": "Label for the \"Restore paper wallet\" button on the wallet restore dialog.",
         "end": {
           "column": 3,
-          "line": 190
+          "line": 188
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.restore.dialog.paper.wallet.button.label",
         "start": {
           "column": 33,
-          "line": 185
+          "line": 183
         }
       },
       {
@@ -16754,13 +17484,13 @@
         "description": "Tooltip for the password input in the wallet dialog.",
         "end": {
           "column": 3,
-          "line": 196
+          "line": 194
         },
         "file": "source/renderer/app/components/wallet/WalletRestoreDialog.tsx",
         "id": "wallet.dialog.passwordTooltip",
         "start": {
           "column": 19,
-          "line": 191
+          "line": 189
         }
       }
     ],
@@ -16773,13 +17503,13 @@
         "description": "\"backToTop\" button label.",
         "end": {
           "column": 3,
-          "line": 13
+          "line": 12
         },
         "file": "source/renderer/app/components/widgets/BackToTopButton.tsx",
         "id": "backToTopButton.label",
         "start": {
           "column": 18,
-          "line": 9
+          "line": 8
         }
       }
     ],
@@ -16792,13 +17522,13 @@
         "description": "Label \"change\" on inline editing inputs in inactive state.",
         "end": {
           "column": 3,
-          "line": 30
+          "line": 29
         },
         "file": "source/renderer/app/components/widgets/forms/InlineEditingInput.tsx",
         "id": "inline.editing.input.change.label",
         "start": {
           "column": 10,
-          "line": 26
+          "line": 25
         }
       },
       {
@@ -16806,13 +17536,13 @@
         "description": "Label \"cancel\" on inline editing inputs in inactive state.",
         "end": {
           "column": 3,
-          "line": 35
+          "line": 34
         },
         "file": "source/renderer/app/components/widgets/forms/InlineEditingInput.tsx",
         "id": "inline.editing.input.cancel.label",
         "start": {
           "column": 10,
-          "line": 31
+          "line": 30
         }
       },
       {
@@ -16820,13 +17550,13 @@
         "description": "Message \"Your changes have been saved\" for inline editing (eg. on Profile Settings page).",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/widgets/forms/InlineEditingInput.tsx",
         "id": "inline.editing.input.changesSaved",
         "start": {
           "column": 16,
-          "line": 36
+          "line": 35
         }
       }
     ],
@@ -16839,13 +17569,13 @@
         "description": "syncingLabel for ItemDropdownOption",
         "end": {
           "column": 3,
-          "line": 18
+          "line": 17
         },
         "file": "source/renderer/app/components/widgets/forms/ItemDropdownOption.tsx",
         "id": "widgets.itemsDropdown.syncingLabel",
         "start": {
           "column": 16,
-          "line": 14
+          "line": 13
         }
       },
       {
@@ -16853,13 +17583,13 @@
         "description": "syncingLabel for WalletsDropdown",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 22
         },
         "file": "source/renderer/app/components/widgets/forms/ItemDropdownOption.tsx",
         "id": "widgets.itemsDropdown.syncingLabelProgress",
         "start": {
           "column": 24,
-          "line": 19
+          "line": 18
         }
       }
     ],
@@ -16872,13 +17602,13 @@
         "description": "Label for the language select.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 25
         },
         "file": "source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx",
         "id": "profile.settings.languageSelect.label",
         "start": {
           "column": 21,
-          "line": 22
+          "line": 21
         }
       },
       {
@@ -16886,13 +17616,13 @@
         "description": "Label for the number select.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 30
         },
         "file": "source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx",
         "id": "profile.settings.numberSelect.label",
         "start": {
           "column": 27,
-          "line": 27
+          "line": 26
         }
       },
       {
@@ -16900,13 +17630,13 @@
         "description": "Label for the date select.",
         "end": {
           "column": 3,
-          "line": 36
+          "line": 35
         },
         "file": "source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx",
         "id": "profile.settings.dateSelect.label",
         "start": {
           "column": 25,
-          "line": 32
+          "line": 31
         }
       },
       {
@@ -16914,13 +17644,13 @@
         "description": "Label for the time select.",
         "end": {
           "column": 3,
-          "line": 41
+          "line": 40
         },
         "file": "source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx",
         "id": "profile.settings.timeSelect.label",
         "start": {
           "column": 25,
-          "line": 37
+          "line": 36
         }
       },
       {
@@ -16928,13 +17658,13 @@
         "description": "Label for the \"Language select\" form submit button.",
         "end": {
           "column": 3,
-          "line": 46
+          "line": 45
         },
         "file": "source/renderer/app/components/widgets/forms/ProfileSettingsForm.tsx",
         "id": "profile.settings.submitLabel",
         "start": {
           "column": 15,
-          "line": 42
+          "line": 41
         }
       }
     ],
@@ -16947,13 +17677,13 @@
         "description": "Label for the blocks synced info overlay on node sync status icon.",
         "end": {
           "column": 3,
-          "line": 20
+          "line": 17
         },
         "file": "source/renderer/app/components/widgets/NodeSyncStatusIcon.tsx",
         "id": "cardano.node.sync.status.blocksSynced",
         "start": {
           "column": 16,
-          "line": 15
+          "line": 12
         }
       }
     ],
@@ -16966,13 +17696,13 @@
         "description": "Label for Daedalus Flight with version.",
         "end": {
           "column": 3,
-          "line": 12
+          "line": 11
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.daedalusFlightLabel",
         "start": {
           "column": 10,
-          "line": 8
+          "line": 7
         }
       },
       {
@@ -16980,13 +17710,13 @@
         "description": "Label for testnet with version.",
         "end": {
           "column": 3,
-          "line": 17
+          "line": 16
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.testnetLabel",
         "start": {
           "column": 11,
-          "line": 13
+          "line": 12
         }
       },
       {
@@ -16994,13 +17724,13 @@
         "description": "Label for staging network with version.",
         "end": {
           "column": 3,
-          "line": 22
+          "line": 21
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.stagingLabel",
         "start": {
           "column": 11,
-          "line": 18
+          "line": 17
         }
       },
       {
@@ -17008,13 +17738,13 @@
         "description": "Label for shelley_qa with version.",
         "end": {
           "column": 3,
-          "line": 27
+          "line": 26
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.shelleyQaLabel",
         "start": {
           "column": 14,
-          "line": 23
+          "line": 22
         }
       },
       {
@@ -17022,13 +17752,13 @@
         "description": "Label for alonzo_purple with version.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 31
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.alonzoPurpleLabel",
         "start": {
           "column": 17,
-          "line": 28
+          "line": 27
         }
       },
       {
@@ -17036,13 +17766,13 @@
         "description": "Label for selfnode with version.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 36
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.selfnodeLabel",
         "start": {
           "column": 12,
-          "line": 33
+          "line": 32
         }
       },
       {
@@ -17050,13 +17780,13 @@
         "description": "Label for development with version.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 41
         },
         "file": "source/renderer/app/components/widgets/WalletTestEnvironmentLabel.tsx",
         "id": "test.environment.developmentLabel",
         "start": {
           "column": 15,
-          "line": 38
+          "line": 37
         }
       }
     ],
@@ -17069,13 +17799,13 @@
         "description": "Notification for download logs in progress in the Loading and Settings pages.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 24
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadLogsProgress",
         "start": {
           "column": 24,
-          "line": 21
+          "line": 19
         }
       },
       {
@@ -17083,13 +17813,13 @@
         "description": "Notification for download logs in the Loading and Settings pages.",
         "end": {
           "column": 3,
-          "line": 32
+          "line": 30
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadLogsSuccess",
         "start": {
           "column": 23,
-          "line": 27
+          "line": 25
         }
       },
       {
@@ -17097,13 +17827,13 @@
         "description": "Notification for download Rewards CSV file.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 35
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadRewardsCSVSuccess",
         "start": {
           "column": 29,
-          "line": 33
+          "line": 31
         }
       },
       {
@@ -17111,13 +17841,13 @@
         "description": "Notification for download Transactions CSV file.",
         "end": {
           "column": 3,
-          "line": 42
+          "line": 40
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadTransactionsCSVSuccess",
         "start": {
           "column": 34,
-          "line": 38
+          "line": 36
         }
       },
       {
@@ -17125,13 +17855,13 @@
         "description": "Notification for the wallet public key copy success in the Wallet Settings page.",
         "end": {
           "column": 3,
-          "line": 49
+          "line": 47
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.copyWalletPublicKey",
         "start": {
           "column": 23,
-          "line": 43
+          "line": 41
         }
       },
       {
@@ -17139,13 +17869,13 @@
         "description": "Notification for the ICO public key copy success in the Wallet Settings page.",
         "end": {
           "column": 3,
-          "line": 56
+          "line": 54
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.copyICOPublicKey",
         "start": {
           "column": 20,
-          "line": 50
+          "line": 48
         }
       },
       {
@@ -17153,13 +17883,13 @@
         "description": "Notification for the wallet address copy success in the Wallet Receive page.",
         "end": {
           "column": 3,
-          "line": 63
+          "line": 61
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.copyAddress",
         "start": {
           "column": 15,
-          "line": 57
+          "line": 55
         }
       },
       {
@@ -17167,13 +17897,13 @@
         "description": "Notification for the wallet assetItem copy success in the Wallet Receive page.",
         "end": {
           "column": 3,
-          "line": 70
+          "line": 68
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.copyAssetParam",
         "start": {
           "column": 18,
-          "line": 64
+          "line": 62
         }
       },
       {
@@ -17181,13 +17911,13 @@
         "description": "Notification for the wallet address PDF download success in the Wallet Receive page.",
         "end": {
           "column": 3,
-          "line": 77
+          "line": 75
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadAddressPDFSuccess",
         "start": {
           "column": 29,
-          "line": 71
+          "line": 69
         }
       },
       {
@@ -17195,13 +17925,13 @@
         "description": "Notification for the wallet voting PDF download success in the Voting Registration dialog.",
         "end": {
           "column": 3,
-          "line": 83
+          "line": 81
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadVotingPDFSuccess",
         "start": {
           "column": 28,
-          "line": 78
+          "line": 76
         }
       },
       {
@@ -17209,13 +17939,13 @@
         "description": "Notification for the wallet address PDF download success in the Wallet Receive page.",
         "end": {
           "column": 3,
-          "line": 90
+          "line": 88
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.downloadQRCodeImageSuccess",
         "start": {
           "column": 30,
-          "line": 84
+          "line": 82
         }
       },
       {
@@ -17223,13 +17953,13 @@
         "description": "Notification for the state directory copy success in the Diagnostics page.",
         "end": {
           "column": 3,
-          "line": 96
+          "line": 94
         },
         "file": "source/renderer/app/containers/notifications/NotificationsContainer.tsx",
         "id": "notification.copyStateDirectoryPath",
         "start": {
           "column": 26,
-          "line": 91
+          "line": 89
         }
       }
     ],
@@ -17656,13 +18386,13 @@
         "description": "Message shown when wallet has no transactions on wallet summary page.",
         "end": {
           "column": 3,
-          "line": 23
+          "line": 25
         },
         "file": "source/renderer/app/containers/wallet/WalletSummaryPage.tsx",
         "id": "wallet.summary.page.no.transactions",
         "start": {
           "column": 18,
-          "line": 18
+          "line": 20
         }
       }
     ],
diff --git a/source/renderer/app/i18n/locales/en-US.json b/source/renderer/app/i18n/locales/en-US.json
index c193bf71ba..e62d0e2320 100755
--- a/source/renderer/app/i18n/locales/en-US.json
+++ b/source/renderer/app/i18n/locales/en-US.json
@@ -6,6 +6,7 @@
   "api.errors.IncorrectPasswordError": "Incorrect wallet password.",
   "api.errors.NotEnoughFundsForTransactionError": "Not enough ada. Try sending a smaller amount.",
   "api.errors.NotEnoughFundsForTransactionFeesError": "Not enough ada for fees. Try sending a smaller amount.",
+  "api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens": "Insufficient funds to support tokens. A minimum of {adaToRemain} ADA must remain in the wallet after this transaction.",
   "api.errors.NotEnoughMoneyToSendError": "Not enough money to make this transaction.",
   "api.errors.TooBigTransactionError": "Transaction too big due to too many inputs.",
   "api.errors.TooBigTransactionErrorLinkLabel": "Learn more.",
@@ -96,6 +97,12 @@
   "daedalus.diagnostics.dialog.daedalusStatus": "DAEDALUS STATUS",
   "daedalus.diagnostics.dialog.daedalusVersion": "Daedalus version",
   "daedalus.diagnostics.dialog.epoch": "epoch",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatus": "Recommended system requirements status",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodTooltip": "Your system specifications meet Daedalus’ recommended hardware requirements",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodValue": "Good",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowTooltip": "Your system specifications do not meet Daedalus’ recommended hardware requirements. We suggest using a machine with at least 16 GB of RAM",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowValue": "Low",
+  "daedalus.diagnostics.dialog.isRTSFlagsModeEnabled": "RTS Flags Mode enabled",
   "daedalus.diagnostics.dialog.lastNetworkBlock": "Last network block",
   "daedalus.diagnostics.dialog.lastSynchronizedBlock": "Last synchronized block",
   "daedalus.diagnostics.dialog.localTimeDifference": "Local time difference",
@@ -119,8 +126,10 @@
   "daedalus.diagnostics.dialog.slot": "slot",
   "daedalus.diagnostics.dialog.stateDirectory": "Daedalus state directory",
   "daedalus.diagnostics.dialog.stateDirectoryPathOpenBtn": "Open",
-  "daedalus.diagnostics.dialog.statusOff": "NO",
-  "daedalus.diagnostics.dialog.statusOn": "YES",
+  "daedalus.diagnostics.dialog.statusOff": "No",
+  "daedalus.diagnostics.dialog.statusOffForUserSettings": "Off",
+  "daedalus.diagnostics.dialog.statusOn": "Yes",
+  "daedalus.diagnostics.dialog.statusOnForUserSettings": "On",
   "daedalus.diagnostics.dialog.syncPercentage": "Sync percentage",
   "daedalus.diagnostics.dialog.synced": "Synced",
   "daedalus.diagnostics.dialog.system.info": "SYSTEM INFO",
@@ -203,18 +212,33 @@
   "inline.editing.input.cancel.label": "cancel",
   "inline.editing.input.change.label": "change",
   "inline.editing.input.changesSaved": "Your changes have been saved",
+  "knownIssues.dialog.disableRtsFlagsMode.actionButton": "Disable and quit",
+  "knownIssues.dialog.disableRtsFlagsMode.explanation": "When disabled, the Cardano node will start in default mode. You will need to restart Daedalus for this change to take effect.",
+  "knownIssues.dialog.disableRtsFlagsMode.title": "Disable RAM management (RTS Flags)",
+  "knownIssues.dialog.enableRtsFlagsMode.actionButton": "Enable and quit",
+  "knownIssues.dialog.enableRtsFlagsMode.explanation": "When enabled, the Cardano node will attempt to reduce its RAM usage. You will need to restart Daedalus for this change to take effect.",
+  "knownIssues.dialog.enableRtsFlagsMode.title": "Enable RAM management (RTS Flags)",
+  "knownIssues.dialog.toggleRtsFlagsMode.manualRelaunchConfirmationCheckboxLabel": "I understand that I will need to manually launch Daedalus",
+  "knownIssues.rtsRecommendationOverlay.content": "<p>Your system specifications do not meet Daedalus’ recommended hardware requirements.</p><p>You can enable RAM management (RTS Flags), an experimental setting that can reduce memory usage on computers with less than 16GB of RAM.</p><p>You can enable it now by clicking the ‘Enable and quit’ button. Note that you will have to restart Daedalus for this change to take effect. To enable or disable it at any time, go to the Help menu.</p>",
+  "knownIssues.rtsRecommendationOverlay.decideLaterButtonLabel": "Decide later",
+  "knownIssues.rtsRecommendationOverlay.enableAndQuitButtonLabel": "Enable and quit",
+  "knownIssues.rtsRecommendationOverlay.title": "Recommended hardware requirements status",
   "loading.screen.connectingToNetworkMessage": "Connecting to network",
   "loading.screen.crashedCardanoMessage": "Cardano node crashed",
   "loading.screen.errors.tlsCertificateNotValidPleaseRestartError": "A configuration issue was detected and fixed. Please restart Daedalus to continue.",
   "loading.screen.loadingWalletData": "Loading wallet data",
+  "loading.screen.pushingLedger": "Syncing blockchain",
+  "loading.screen.pushingLedgerDescription": "Performing initial chain selection and finalizing blockchain state",
   "loading.screen.readArticle.buttonLabel": "Read the article",
   "loading.screen.readIssueArticle.connectivityIssueArticleUrl": "https://iohk.zendesk.com/hc/en-us/articles/360010522913",
   "loading.screen.reconnectingToNetworkMessage": "Network connection lost - reconnecting",
+  "loading.screen.replayedBlock": "Replaying ledger from on-disk blockchain",
+  "loading.screen.replayedBlockDescription": "Looking for a ledger snapshot and updating (recomputing) the latest state",
   "loading.screen.reportIssue.buttonLabel": "Open support ticket",
   "loading.screen.reportIssue.connecting.text": "Having trouble connecting to network?",
   "loading.screen.reportIssue.downloadLogsLinkLabel": "Download logs",
   "loading.screen.reportIssue.reportIssueButtonUrl": "https://iohk.zendesk.com/hc/en-us/requests/new/",
-  "loading.screen.startingCardanoDescription": "This process validates the integrity of local blockchain data and could take several minutes.",
+  "loading.screen.startingCardanoDescription": "This process validates the integrity of local blockchain data.",
   "loading.screen.startingCardanoMessage": "Starting Cardano node",
   "loading.screen.stoppedCardanoMessage": "Cardano node stopped",
   "loading.screen.stoppingCardanoDescription": "This process updates the databases and could take several minutes.<br />To preserve data integrity, please wait until this process is complete.",
@@ -222,7 +246,8 @@
   "loading.screen.unrecoverableCardanoMessage": "Unable to start Cardano node. Please submit a support request.",
   "loading.screen.updatedCardanoMessage": "Cardano node updated",
   "loading.screen.updatingCardanoMessage": "Updating Cardano node",
-  "loading.screen.verifyingBlockchainMessage": "Verifying the blockchain ({verificationProgress}% complete) ",
+  "loading.screen.validatingChunk": "Verifying on-disk blockchain state",
+  "loading.screen.validatingChunkDescription": "Verifying the integrity of the blockchain calculating hashes",
   "news.newsfeed.empty": "Newsfeed is empty",
   "news.newsfeed.noFetch": "Trying to fetch the newsfeed...",
   "news.newsfeed.title": "Newsfeed",
@@ -357,8 +382,14 @@
   "settings.wallets.currency.poweredBy.label": "Powered by ",
   "settings.wallets.currency.selectLabel": "Select currency",
   "settings.wallets.currency.titleLabel": "Display ada balances in other currency",
-  "sidebar.category.settings.notification.label": "New discreet mode settings are available in <b>Security</b> tab.",
   "sidebar.wallets.addWallet": "Add wallet",
+  "sidebar.wallets.search.placeholder": "Filter",
+  "sidebar.wallets.sortByBalanceButton": "Balance",
+  "sidebar.wallets.sortByBalanceTooltip": "Sort by balance",
+  "sidebar.wallets.sortByDateButton": "Date",
+  "sidebar.wallets.sortByDateTooltip": "Sort by creation date",
+  "sidebar.wallets.sortByNameButton": "A – Z",
+  "sidebar.wallets.sortByNameTooltip": "Sort by name",
   "staking.countdown.learnMore.linkUrl": "https://iohk.zendesk.com/hc/en-us",
   "staking.delegationCenter.bodyTitle": "Wallets",
   "staking.delegationCenter.currentEpochTitle": "Now",
@@ -386,8 +417,8 @@
   "staking.delegationCountdown.heading": "Shelley upgrade",
   "staking.delegationCountdown.timeLeftDesc": "Shelley upgrade in",
   "staking.delegationSetup.chooseStakePool.step.dialog.continueButtonLabel": "Continue",
-  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolLabel": "You are already delegating <span>{selectedWalletName}</span> wallet to <span>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
-  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolNextLabel": "You are already pending delegation <span>{selectedWalletName}</span> wallet to <span>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
+  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolLabel": "You are already delegating <span>{selectedWalletName}</span> wallet to <span class='ticker'>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
+  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolNextLabel": "You are already pending delegation <span>{selectedWalletName}</span> wallet to <span class='ticker'>[{selectedPoolTicker}]</span> stake pool. <span>If you wish to re-delegate your stake, please select a different pool.</span>",
   "staking.delegationSetup.chooseStakePool.step.dialog.description": "Currently selected stake pool:",
   "staking.delegationSetup.chooseStakePool.step.dialog.recentPoolsLabel": "Choose one of your recent stake pool choices:",
   "staking.delegationSetup.chooseStakePool.step.dialog.retiringPoolFooter": "The stake pool you have selected is about to be retired. If you continue the delegation process, you will need to delegate your stake to another pool at least one complete epoch before the current pool’s retirement date to avoid losing rewards.",
@@ -507,8 +538,9 @@
   "staking.rewards.no.rewards": "No rewards",
   "staking.rewards.note": "Rewards earned by delegating your stake are automatically collected into your reward account and added to your wallet balance.",
   "staking.rewards.tableHeader.date": "Date",
-  "staking.rewards.tableHeader.reward": "Total rewards earned",
   "staking.rewards.tableHeader.rewardsAddress": "Rewards address",
+  "staking.rewards.tableHeader.total": "Total",
+  "staking.rewards.tableHeader.unspent": "Unspent",
   "staking.rewards.tableHeader.wallet": "Wallet",
   "staking.rewards.title": "Earned delegation rewards",
   "staking.stakePools.delegatingListTitle": "Stake pools to which you are delegating",
@@ -575,9 +607,9 @@
   "staking.stakePools.unmoderated": "Unmoderated",
   "static.about.buildInfo": "{platform} build <strong>{build}</strong>, {apiName} Node <strong>{nodeVersion}</strong>, {apiName} Wallet <strong>{apiVersion}</strong>",
   "static.about.content.cardano.headline": "Cardano Team:",
-  "static.about.content.cardano.members": "Alan McNicholas, Alejandro Garcia, Alexander Diemand, Alexander Vieth, Anatoli Ivanou, Andreas Triantafyllos, Ante Kegalj, Ben Ford, Charles Hoskinson, Dan Friedman, Deepak Kapiswe, Denis Shevchenko, Dorin Solomon, Duncan Coutts, Edsko de Vries, Erik de Castro Lopo, Gerard Moroney, Hiroto Shioi, Jane Wild, Jean-Christophe Mincke, Jeremy Wood, Johannes Lund, Jordan Millar, Karl Knutsson, Kristijan Šarić, Lars Brünjes, Laurie Wang, Liz Bancroft, Luke Nadur, Marc Fontaine, Marcin Szamotulski, Matt Parsons, Matthias Benkort, Michael Bishop, Michael Hueschen, Moritz Angermann, Neil Davis, Niamh Ahern, Nicholas Clarke, Nicolas Di Prima, Noel Rimbert, Patrick Kelly, Pawel Jakubas, Peter Gaži, Peter Thompson, Philipp Kant, Piotr Stachyra, Ravi Patel, Richard Wild, Rob Cohen, Rodney Lorrimar, Ryan Lemmer, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tom Flynn, Vasileios Gkoumas, Vincent Hanquez",
+  "static.about.content.cardano.members": "Alan McNicholas, Alejandro Garcia, Alexander Diemand, Alexander Vieth, Anatoli Ivanou, Andreas Triantafyllos, Ante Kegalj, Armando Santos, Ben Ford, Charles Hoskinson, Dan Friedman, Deepak Kapiswe, Denis Shevchenko, Dorin Solomon, Duncan Coutts, Edsko de Vries, Erik de Castro Lopo, Gerard Moroney, Hiroto Shioi, Jane Wild, Jean-Christophe Mincke, Jeremy Wood, Johannes Lund, Jordan Millar, Karl Knutsson, Kristijan Šarić, Lars Brünjes, Laurie Wang, Liz Bancroft, Luke Nadur, Marc Fontaine, Marcin Szamotulski, Matt Parsons, Matthias Benkort, Michael Bishop, Michael Hueschen, Moritz Angermann, Neil Davis, Niamh Ahern, Nicholas Clarke, Nicolas Di Prima, Noel Rimbert, Patrick Kelly, Pawel Jakubas, Peter Gaži, Peter Thompson, Philipp Kant, Piotr Stachyra, Ravi Patel, Richard Wild, Rob Cohen, Rodney Lorrimar, Ryan Lemmer, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tom Flynn, Vasileios Gkoumas, Vincent Hanquez",
   "static.about.content.daedalus.headline": "Daedalus Team:",
-  "static.about.content.daedalus.members": "Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Danilo Prates, Darko Mijić, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Manus McCole, Michael Bishop, Mior Sufian, Nikola Glumac, Piotr Stachyra, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov",
+  "static.about.content.daedalus.members": "Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Daniel Main, Danilo Prates, Darko Mijić, Dmitrii Gaico, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Lucas Araujo, Manus McCole, Marcin Mazurek, Michael Bishop, Michael Chappell, Mior Sufian, Nikola Glumac, Piotr Stachyra, Przemysław Włodek, Renan Ferreira, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Szymon Masłowski, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov",
   "static.about.copyright": "Input Output HK Limited. Licensed under",
   "static.about.license": "Apache 2.0 license",
   "static.about.title": "Daedalus",
@@ -632,6 +664,9 @@
   "test.environment.shelleyQaLabel": "Shelley QA",
   "test.environment.stagingLabel": "Staging",
   "test.environment.testnetLabel": "Testnet",
+  "voting.apiError.description1": "Unable to communicate with the API that retrieves the Catalyst date information.",
+  "voting.apiError.description2": "Please, try again later.",
+  "voting.apiError.title": "Catalyst API unavailable",
   "voting.catalyst.descriptionRow1": "Decide which innovative ideas for Cardano will receive funding.",
   "voting.catalyst.descriptionRow2": "${reward} worth of ada rewards will be distributed between ada holders who register their vote.",
   "voting.catalyst.heading": "Project Catalyst",
@@ -962,7 +997,7 @@
   "wallet.select.import.dialog.notFound": "Name not found",
   "wallet.select.import.dialog.passwordProtected": "Password protected",
   "wallet.select.import.dialog.title": "Found wallets",
-  "wallet.select.import.dialog.unamedWalletsTitle": "Unnamed wallets",
+  "wallet.select.import.dialog.unnamedWalletsTitle": "Unnamed wallets",
   "wallet.select.import.dialog.walletExists": "Wallet already exists",
   "wallet.select.import.dialog.walletImported": "Wallet imported",
   "wallet.select.import.dialog.walletName": "Enter wallet name",
@@ -986,6 +1021,7 @@
   "wallet.send.confirmationDialog.unformattedAmountMessageForSoftwareWallets": "<p>Native tokens are represented as integer numbers without decimal places on the blockchain.</p><p>The formatted amount is displayed as configured in the native token settings available on the wallet summary screen.</p><p>Please, double check the number of decimal places before confirming the transaction.</p>",
   "wallet.send.form.asset.adaLabel": "Ada",
   "wallet.send.form.asset.label": "Token",
+  "wallet.send.form.asset.updateAdaAmountButton": "UPDATE",
   "wallet.send.form.button.addAssetButtonLabel": "+ Add a token",
   "wallet.send.form.button.clearLabel": "Clear",
   "wallet.send.form.button.removeLabel": "Remove",
@@ -998,15 +1034,18 @@
   "wallet.send.form.minAdaRequired": "a minimum of {minimumAda} ADA required",
   "wallet.send.form.minAdaRequiredWithAssetTooltip": "The transaction requires a minimum of {minimumAda} ADA.",
   "wallet.send.form.minAdaRequiredWithNoAssetTooltip": "The transaction needs to include at least {minimumAda} ADA.",
+  "wallet.send.form.minimumAmountNote": "<b>Note:</b> the ada field was automatically updated because this transaction requires a minimum of {minimumAda} ADA.",
   "wallet.send.form.of.label": "of",
   "wallet.send.form.receiver.label": "Receiver",
   "wallet.send.form.receiver.placeholder": "Paste an address",
   "wallet.send.form.reset": "Reset",
+  "wallet.send.form.restoredAdaAmount": "<b>Note:</b> the ada field was automatically updated to {adaAmount} ADA because now it fulfills the minimum amount of {minimumAda} ADA for the transaction.",
   "wallet.send.form.sameWalletLabel": "This receiver address belongs to the same wallet from which you are sending funds. If you proceed with this transaction, the transferred funds will remain in this wallet, and you will incur transaction fees, as outlined in Estimated fees.",
   "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.title.hint": "E.g: Money for Frank",
   "wallet.send.form.title.label": "Title",
+  "wallet.send.form.updateAdaAmountDescription": "to the minimum of {minimumAda} ADA required",
   "wallet.settings.assurance": "Transaction assurance security level",
   "wallet.settings.changePassword.dialog.currentPasswordFieldPlaceholder": "Type current password",
   "wallet.settings.changePassword.dialog.currentPasswordLabel": "Current password",
@@ -1136,8 +1175,9 @@
   "wallet.summary.currency.isFetchingRate": "fetching conversion rates",
   "wallet.summary.currency.lastFetched": "converted {fetchedTimeAgo}",
   "wallet.summary.currency.title": "Converts as",
-  "wallet.summary.header.pendingTransactionsLabel": "Number of pending transactions",
-  "wallet.summary.header.transactionsLabel": "Number of transactions",
+  "wallet.summary.header.rewardsSummary": "<span class='amount'>{total}</span> rewards earned, <span class='amount'>{unspent}</span> unspent rewards",
+  "wallet.summary.header.transactionsLabel": "<span>{total}</span> transactions, <span>{pending}</span> pending",
+  "wallet.summary.header.unspendableTooltip": "All the ada in this wallet is in the rewards account. Since transaction fees cannot be paid with rewards, please send 2 or more ada to this wallet to cover transaction fees.",
   "wallet.summary.noTokens.learnMore.linkLabel": "Learn more",
   "wallet.summary.noTokens.learnMore.linkUrl": "https://iohk.io/en/blog/posts/2021/02/04/native-tokens-to-bring-new-utility-to-life-on-cardano/",
   "wallet.summary.noTokens.learnMore.textBottom": "Start by visiting the IOHK blog for a useful primer.",
@@ -1147,10 +1187,20 @@
   "wallet.summary.transactionsList.syncingTransactionsMessage": "Your transaction history for this wallet is being synced with the blockchain.",
   "wallet.summary.transactionsList.todayLabel": "Today",
   "wallet.summary.transactionsList.yesterdayLabel": "Yesterday",
+  "wallet.token.picker.addButtonLabel": "Add",
+  "wallet.token.picker.allTokensLabel": "All tokens",
+  "wallet.token.picker.cancelButtonLabel": "Cancel",
+  "wallet.token.picker.checkAllLabel": "Select all",
+  "wallet.token.picker.checkedCountLabel": "{checkedCount} out of {maxTokens} tokens.",
+  "wallet.token.picker.clearAll": "Clear selection",
+  "wallet.token.picker.favoriteTokensLabel": "Favorites",
+  "wallet.token.picker.maxTokensWarning": "You have already reached a maximum of {maxTokens} tokens for your transaction. To add another token you need to remove one from a list.",
+  "wallet.token.picker.noResults": "Results do not match search query",
+  "wallet.token.picker.title": "Add tokens",
   "wallet.tokens.list.column.amount": "Amount",
   "wallet.tokens.list.column.token": "Token",
   "wallet.tokens.list.favorites.title": "Favorites",
-  "wallet.tokens.list.search.noResults": "No results matching your query",
+  "wallet.tokens.list.search.noResults": "Results do not match search query",
   "wallet.tokens.list.search.searchResults": ". Search results",
   "wallet.tokens.list.tokens.title": "Tokens",
   "wallet.tokens.list.viewAllButton.label": "View all tokens",
diff --git a/source/renderer/app/i18n/locales/ja-JP.json b/source/renderer/app/i18n/locales/ja-JP.json
index 7b3b031874..78dc6a0d4d 100755
--- a/source/renderer/app/i18n/locales/ja-JP.json
+++ b/source/renderer/app/i18n/locales/ja-JP.json
@@ -6,6 +6,7 @@
   "api.errors.IncorrectPasswordError": "ウォレットパスワードが間違っています",
   "api.errors.NotEnoughFundsForTransactionError": "ADAが不足しています。送金額を減らしてください。",
   "api.errors.NotEnoughFundsForTransactionFeesError": "手数料分のADAが不足しています。送金額を減らしてください。",
+  "api.errors.NotEnoughFundsForTransactionFeesErrorWithTokens": "トークンをサポートする資金が不足しています。このトランザクションの後に、ウォレットに{adaToRemain} ADA以上残るようにしてください。",
   "api.errors.NotEnoughMoneyToSendError": "このトランザクションに必要な資金が不足しています。",
   "api.errors.TooBigTransactionError": "入力過多によりトランザクションサイズが超過しています。",
   "api.errors.TooBigTransactionErrorLinkLabel": "もっと知る。",
@@ -96,6 +97,12 @@
   "daedalus.diagnostics.dialog.daedalusStatus": "DAEDALUSステータス",
   "daedalus.diagnostics.dialog.daedalusVersion": "Daedalusバージョン",
   "daedalus.diagnostics.dialog.epoch": "エポック",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatus": "推奨ハードウェア要件ステータス",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodTooltip": "システム仕様はDaedalusの推奨ハードウェア要件を満たしています",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusGoodValue": "良",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowTooltip": "システム仕様がDaedalusの推奨ハードウェア要件を満たしていません。推奨されるRAMは16GB以上です",
+  "daedalus.diagnostics.dialog.hasMetHardwareRequirementsStatusLowValue": "低",
+  "daedalus.diagnostics.dialog.isRTSFlagsModeEnabled": "RTSフラグモード",
   "daedalus.diagnostics.dialog.lastNetworkBlock": "最新のネットワークブロック",
   "daedalus.diagnostics.dialog.lastSynchronizedBlock": "最新の同期済みブロック",
   "daedalus.diagnostics.dialog.localTimeDifference": "時差",
@@ -120,7 +127,9 @@
   "daedalus.diagnostics.dialog.stateDirectory": "Daedalusステータスディレクトリー",
   "daedalus.diagnostics.dialog.stateDirectoryPathOpenBtn": "開く",
   "daedalus.diagnostics.dialog.statusOff": "いいえ",
+  "daedalus.diagnostics.dialog.statusOffForUserSettings": "オフ",
   "daedalus.diagnostics.dialog.statusOn": "はい",
+  "daedalus.diagnostics.dialog.statusOnForUserSettings": "オン",
   "daedalus.diagnostics.dialog.syncPercentage": "同期率",
   "daedalus.diagnostics.dialog.synced": "同期済み",
   "daedalus.diagnostics.dialog.system.info": "システム情報",
@@ -203,18 +212,33 @@
   "inline.editing.input.cancel.label": "キャンセル",
   "inline.editing.input.change.label": "変更",
   "inline.editing.input.changesSaved": "変更は保存されました",
+  "knownIssues.dialog.disableRtsFlagsMode.actionButton": "無効にして終了する",
+  "knownIssues.dialog.disableRtsFlagsMode.explanation": "無効にすると、Cardanoノードはデフォルトモードで起動します。変更を有効にするために、Daedalusを再起動する必要があります。",
+  "knownIssues.dialog.disableRtsFlagsMode.title": "RAM管理（RTSフラグ）を有効にする",
+  "knownIssues.dialog.enableRtsFlagsMode.actionButton": "有効にして終了する",
+  "knownIssues.dialog.enableRtsFlagsMode.explanation": "有効にすると、CardanoノードはRAM使用量の削減を試みます。変更を有効にするために、Daedalusを再起動する必要があります。",
+  "knownIssues.dialog.enableRtsFlagsMode.title": "RAM管理（RTSフラグ）を有効にする",
+  "knownIssues.dialog.toggleRtsFlagsMode.manualRelaunchConfirmationCheckboxLabel": "Daedalusを手動で再起動する必要があることを理解しました。",
+  "knownIssues.rtsRecommendationOverlay.content": "<p>システム仕様がDaedalusの推奨ハードウェア要件を満たしていません。</p><p>RAMが16GB未満のコンピューターでメモリー使用量を削減できる試験的設定であるRAM管理（RTSフラグ）を有効にすることができます。</p><p>[有効にして終了する] ボタンをクリックすると有効化できます。変更を有効にするためには、Daedalusを再起動する必要があります。有効化または無効化は、いつでもヘルプメニューから実行できます。</p>",
+  "knownIssues.rtsRecommendationOverlay.decideLaterButtonLabel": "あとで決める",
+  "knownIssues.rtsRecommendationOverlay.enableAndQuitButtonLabel": "有効にして終了する",
+  "knownIssues.rtsRecommendationOverlay.title": "推奨ハードウェア要件ステータス",
   "loading.screen.connectingToNetworkMessage": "ネットワークに接続しています",
   "loading.screen.crashedCardanoMessage": "Cardanoノードはクラッシュしました",
   "loading.screen.errors.tlsCertificateNotValidPleaseRestartError": "設定の不具合が検知され修正されました。続けるにはDaedalusを再起動してください。",
   "loading.screen.loadingWalletData": "ウォレットデータをロードしています",
+  "loading.screen.pushingLedger": "ブロックチェーンの同期",
+  "loading.screen.pushingLedgerDescription": "初回チェーン選定を実行してブロックチェーンステータスを確定します",
   "loading.screen.readArticle.buttonLabel": "記事を読む",
   "loading.screen.readIssueArticle.connectivityIssueArticleUrl": "https://iohk.zendesk.com/hc/ja/articles/360010522913",
   "loading.screen.reconnectingToNetworkMessage": "接続失敗 - 再接続中",
+  "loading.screen.replayedBlock": "ディスクのブロックチェーンから台帳をリプレイ",
+  "loading.screen.replayedBlockDescription": "台帳スナップショットを探して最新ステータスを更新（再計算）します",
   "loading.screen.reportIssue.buttonLabel": "サポートチケットを作成する",
   "loading.screen.reportIssue.connecting.text": "接続に問題がありますか",
   "loading.screen.reportIssue.downloadLogsLinkLabel": "ログをダウンロードする",
   "loading.screen.reportIssue.reportIssueButtonUrl": "https://iohk.zendesk.com/hc/ja/requests/new/",
-  "loading.screen.startingCardanoDescription": "このプロセスはローカルブロックチェーンデータの完全性を検証するもので、数分間かかる場合があります。",
+  "loading.screen.startingCardanoDescription": "このプロセスは、ローカルブロックチェーンデータの整合性を検証します。",
   "loading.screen.startingCardanoMessage": "Cardanoノードを起動しています",
   "loading.screen.stoppedCardanoMessage": "Cardanoノードは停止しました",
   "loading.screen.stoppingCardanoDescription": "このプロセスはデータベースを更新するもので、数分間かかる場合があります。<br />データの完全性を保つために、このプロセスが完了するまでお待ちください。",
@@ -222,8 +246,9 @@
   "loading.screen.unrecoverableCardanoMessage": "Cardanoノードを起動できません。サポートリクエストを送信してください。",
   "loading.screen.updatedCardanoMessage": "Cardanoノードが更新されました",
   "loading.screen.updatingCardanoMessage": "Cardanoノードを更新しています",
-  "loading.screen.verifyingBlockchainMessage": "ブロックチェーンを検証しています（{verificationProgress}%完了）",
-  "news.newsfeed.empty": "ニュースフィードは空です",
+  "loading.screen.validatingChunk": "ディスクのブロックチェーンステータスの検証",
+  "loading.screen.validatingChunkDescription": "ブロックチェーンのハッシュ計算の整合性を検証します",
+  "news.newsfeed.empty": "Newsfeed is empty",
   "news.newsfeed.noFetch": "ニュースフィードを読み込んでいます...",
   "news.newsfeed.title": "ニュースフィード",
   "noDiskSpace.error.overlayContent": "<b>Daedalusを動作させるには、ハードディスクに{diskSpaceRequired}以上の空き容量が必要です。ご使用のコンピューターには空き容量が{diskSpaceMissing}不足しています。Daedalusのご利用を続けるためには、ファイルをいくつか削除して空き容量を増やしてください。</b><br /><br />オペレーティングシステムとインストール済みプログラムを正常かつ安定した状態で動作させるには、ハードディスクに少なくとも15%（ご使用のコンピューターの場合は{diskSpaceRecommended}）の空き容量が必要です。ハードディスクにこれ以上の空き容量を確保してください。",
@@ -357,8 +382,14 @@
   "settings.wallets.currency.poweredBy.label": "提供：",
   "settings.wallets.currency.selectLabel": "通貨を選択してください",
   "settings.wallets.currency.titleLabel": "ADA残高を別の通貨で表示する",
-  "sidebar.category.settings.notification.label": "<b>設定</b>タブで、新たにディスクリートモードが使用可能になりました。",
   "sidebar.wallets.addWallet": "ウォレット追加",
+  "sidebar.wallets.search.placeholder": "フィルター",
+  "sidebar.wallets.sortByBalanceButton": "残高",
+  "sidebar.wallets.sortByBalanceTooltip": "残高で並べ替える",
+  "sidebar.wallets.sortByDateButton": "日付",
+  "sidebar.wallets.sortByDateTooltip": "作成日で並べ替える",
+  "sidebar.wallets.sortByNameButton": "A – Z",
+  "sidebar.wallets.sortByNameTooltip": "ウォレット名で並べ替える",
   "staking.countdown.learnMore.linkUrl": "https://iohk.zendesk.com/hc/ja",
   "staking.delegationCenter.bodyTitle": "ウォレット",
   "staking.delegationCenter.currentEpochTitle": "現在",
@@ -386,8 +417,8 @@
   "staking.delegationCountdown.heading": "Shelleyアップグレード",
   "staking.delegationCountdown.timeLeftDesc": "Shelley開始まであと",
   "staking.delegationSetup.chooseStakePool.step.dialog.continueButtonLabel": "続ける",
-  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolLabel": "<span>{selectedWalletName}</span>ウォレットは既に<span>「{selectedPoolTicker}」</span>ステークプールに委任されています。<span>ステークの委任先を変更する場合は、異なるプールを選択してください。</span>",
-  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolNextLabel": "<span>{selectedWalletName}</span>ウォレットは既に<span>「{selectedPoolTicker}」</span>ステークプールへの委任処理中です。<span>ステークの委任先を変更する場合は、異なるプールを選択してください。</span>",
+  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolLabel": "<span>{selectedWalletName}</span>ウォレットは既に<span class='ticker'>「{selectedPoolTicker}」</span>ステークプールに委任されています。<span>ステークの委任先を変更する場合は、異なるプールを選択してください。</span>",
+  "staking.delegationSetup.chooseStakePool.step.dialog.delegatedStakePoolNextLabel": "<span>{selectedWalletName}</span>ウォレットは既に<span class='ticker'>「{selectedPoolTicker}」</span>ステークプールへの委任処理中です。<span>ステークの委任先を変更する場合は、異なるプールを選択してください。</span>",
   "staking.delegationSetup.chooseStakePool.step.dialog.description": "現在選択されているステークプール：",
   "staking.delegationSetup.chooseStakePool.step.dialog.recentPoolsLabel": "最近選択したステークプールから選択する：",
   "staking.delegationSetup.chooseStakePool.step.dialog.retiringPoolFooter": "選択されたステークプールはまもなく終了します。このまま委任プロセスを続けた場合、このプールの終了に伴い報酬が停止することを避けるためには、プール終了日までに完全な1エポック以上が残っているうちに別のプールにステークを委任し直す必要があります。",
@@ -507,8 +538,9 @@
   "staking.rewards.no.rewards": "報酬なし",
   "staking.rewards.note": "ステークを委任することにより得た報酬は自動的に報酬アカウントに振り込まれ、ウォレット残高に追加されます。",
   "staking.rewards.tableHeader.date": "日付",
-  "staking.rewards.tableHeader.reward": "獲得した報酬の合計",
   "staking.rewards.tableHeader.rewardsAddress": "報酬アドレス",
+  "staking.rewards.tableHeader.total": "合計",
+  "staking.rewards.tableHeader.unspent": "未使用",
   "staking.rewards.tableHeader.wallet": "ウォレット",
   "staking.rewards.title": "獲得した委任報酬",
   "staking.stakePools.delegatingListTitle": "委任するステークプール",
@@ -575,9 +607,9 @@
   "staking.stakePools.unmoderated": "未調整",
   "static.about.buildInfo": "{platform} ビルド <strong>{build}</strong>, {apiName} Node <strong>{nodeVersion}</strong>, {apiName} Wallet <strong>{apiVersion}</strong>",
   "static.about.content.cardano.headline": "Cardanoチーム：",
-  "static.about.content.cardano.members": "Alan McNicholas, Alejandro Garcia, Alexander Diemand, Alexander Vieth, Anatoli Ivanou, Andreas Triantafyllos, Ante Kegalj, Ben Ford, Charles Hoskinson, Dan Friedman, Deepak Kapiswe, Denis Shevchenko, Dorin Solomon, Duncan Coutts, Edsko de Vries, Erik de Castro Lopo, Gerard Moroney, Hiroto Shioi, Jane Wild, Jean-Christophe Mincke, Jeremy Wood, Johannes Lund, Jordan Millar, Karl Knutsson, Kristijan Šarić, Lars Brünjes, Laurie Wang, Liz Bancroft, Luke Nadur, Marc Fontaine, Marcin Szamotulski, Matt Parsons, Matthias Benkort, Michael Bishop, Michael Hueschen, Moritz Angermann, Neil Davis, Niamh Ahern, Nicholas Clarke, Nicolas Di Prima, Noel Rimbert, Patrick Kelly, Pawel Jakubas, Peter Gaži, Peter Thompson, Philipp Kant, Piotr Stachyra, Ravi Patel, Richard Wild, Rob Cohen, Rodney Lorrimar, Ryan Lemmer, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tom Flynn, Vasileios Gkoumas, Vincent Hanquez",
+  "static.about.content.cardano.members": "Alan McNicholas, Alejandro Garcia, Alexander Diemand, Alexander Vieth, Anatoli Ivanou, Andreas Triantafyllos, Ante Kegalj, Armando Santos, Ben Ford, Charles Hoskinson, Dan Friedman, Deepak Kapiswe, Denis Shevchenko, Dorin Solomon, Duncan Coutts, Edsko de Vries, Erik de Castro Lopo, Gerard Moroney, Hiroto Shioi, Jane Wild, Jean-Christophe Mincke, Jeremy Wood, Johannes Lund, Jordan Millar, Karl Knutsson, Kristijan Šarić, Lars Brünjes, Laurie Wang, Liz Bancroft, Luke Nadur, Marc Fontaine, Marcin Szamotulski, Matt Parsons, Matthias Benkort, Michael Bishop, Michael Hueschen, Moritz Angermann, Neil Davis, Niamh Ahern, Nicholas Clarke, Nicolas Di Prima, Noel Rimbert, Patrick Kelly, Pawel Jakubas, Peter Gaži, Peter Thompson, Philipp Kant, Piotr Stachyra, Ravi Patel, Richard Wild, Rob Cohen, Rodney Lorrimar, Ryan Lemmer, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tom Flynn, Vasileios Gkoumas, Vincent Hanquez",
   "static.about.content.daedalus.headline": "Daedalusチーム：",
-  "static.about.content.daedalus.members": "Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Danilo Prates, Darko Mijić, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Manus McCole, Michael Bishop, Mior Sufian, Nikola Glumac, Piotr Stachyra, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov",
+  "static.about.content.daedalus.members": "Alan McNicholas, Aleksandar Djordjevic, Alexander Rukin, Brian McKenna, Charles Hoskinson, Daniel Main, Danilo Prates, Darko Mijić, Dmitrii Gaico, Dominik Guzei, Elin Liu, Gabriela Ponce, Jane Wild, Jeremy Wood, Juli Sudi, Junko Oda, Laurie Wang, Lucas Araujo, Manus McCole, Marcin Mazurek, Michael Bishop, Michael Chappell, Mior Sufian, Nikola Glumac, Piotr Stachyra, Przemysław Włodek, Renan Ferreira, Rhys Bartels-Waller, Richard Wild, Robert Moore, Rodney Lorrimar, Sam Jeston, Samuel Leathers, Serge Kosyrev, Szymon Masłowski, Tatyana Valkevych, Tomas Vrana, Tomislav Horaček, Yakov Karavelov",
   "static.about.copyright": "Input Output HK Limited. Licensed under",
   "static.about.license": "Apache 2.0 license",
   "static.about.title": "Daedalus",
@@ -632,6 +664,9 @@
   "test.environment.shelleyQaLabel": "Shelley QA",
   "test.environment.stagingLabel": "ステージング",
   "test.environment.testnetLabel": "テストネット",
+  "voting.apiError.description1": "Catalystの日付情報を取得するAPIと通信できません。",
+  "voting.apiError.description2": "しばらくしてからもう一度試してみてください。",
+  "voting.apiError.title": "Catalyst APIは使用できません",
   "voting.catalyst.descriptionRow1": "Cardanoの革新的なアイデアの中で、どのアイデアに資金を提供するか決定します。",
   "voting.catalyst.descriptionRow2": "{reward}米ドル相当のADA報酬が、有権者登録を行ったADA保有者に分配されます。",
   "voting.catalyst.heading": "Project Catalyst",
@@ -687,7 +722,7 @@
   "voting.votingRegistration.enterPinCode.step.continueButtonLabel": "続ける",
   "voting.votingRegistration.enterPinCode.step.description": "Fund{nextVotingFundNumber}有権者登録のPINコードを入力してください。ここで設定したPINコードと、次のステップで表示されるQRコードは、スマートフォンでCatalyst Votingアプリを使用して投票するときに必要となります。",
   "voting.votingRegistration.enterPinCode.step.enterPinCodeLabel": "PINコードを入力してください",
-  "voting.votingRegistration.enterPinCode.step.errors.invalidPinCode": "!!!Invalid PIN",
+  "voting.votingRegistration.enterPinCode.step.errors.invalidPinCode": "無効なPINコード",
   "voting.votingRegistration.enterPinCode.step.errors.invalidRepeatPinCode": "PINコードが一致しません",
   "voting.votingRegistration.enterPinCode.step.reminder": "<span>PINコードを忘れないでください。</span>PINを忘れると本登録で投票することができなくなり、登録手続きをやり直すことになります。",
   "voting.votingRegistration.enterPinCode.step.repeatPinCodeLabel": "PINコードを再入力してください",
@@ -962,7 +997,7 @@
   "wallet.select.import.dialog.notFound": "ウォレット名不明",
   "wallet.select.import.dialog.passwordProtected": "パスワード設定済み",
   "wallet.select.import.dialog.title": "既存のウォレット",
-  "wallet.select.import.dialog.unamedWalletsTitle": "名称不明のウォレット",
+  "wallet.select.import.dialog.unnamedWalletsTitle": "名称不明のウォレット",
   "wallet.select.import.dialog.walletExists": "既存のウォレット",
   "wallet.select.import.dialog.walletImported": "ウォレットをインポート済み",
   "wallet.select.import.dialog.walletName": "ウォレット名を入力してください",
@@ -986,6 +1021,7 @@
   "wallet.send.confirmationDialog.unformattedAmountMessageForSoftwareWallets": "<p>ブロックチェーンでは、ネイティブトークンは少数なしの整数で表現されます。</p><p>書式化した金額は、ウォレット概要画面のネイティブトークンの設定で指定した書式で表示されています。</p><p>トランザクションを送信する前に、小数点以下の桁数をもう一度確認してください。</p>",
   "wallet.send.form.asset.adaLabel": "ADA",
   "wallet.send.form.asset.label": "トークン",
+  "wallet.send.form.asset.updateAdaAmountButton": "更新する",
   "wallet.send.form.button.addAssetButtonLabel": "+ トークンを追加する",
   "wallet.send.form.button.clearLabel": "取り消す",
   "wallet.send.form.button.removeLabel": "削除",
@@ -998,15 +1034,18 @@
   "wallet.send.form.minAdaRequired": "最低{minimumAda}ADAが必要です",
   "wallet.send.form.minAdaRequiredWithAssetTooltip": "トランザクションには最低{minimumAda}ADAを含む必要があります。",
   "wallet.send.form.minAdaRequiredWithNoAssetTooltip": "トランザクションには最低{minimumAda}ADAを含む必要があります。",
+  "wallet.send.form.minimumAmountNote": "<b>注：</b>このトランザクションは最低{minimumAda} ADAを必要とするため、ADAフィールドは自動更新されました。",
   "wallet.send.form.of.label": "/",
   "wallet.send.form.receiver.label": "送金先",
   "wallet.send.form.receiver.placeholder": "アドレスを貼り付け",
   "wallet.send.form.reset": "リセット",
+  "wallet.send.form.restoredAdaAmount": "<b>注：</b>このトランザクションに必要な最低額{minimumAda} ADAを満たしているため、ADAフィールドは自動更新されました。",
   "wallet.send.form.sameWalletLabel": "この送金先アドレスは、送金元となるウォレットと同じウォレットのものです。このトランザクションを実行すると、送信された資金はこのウォレットにとどまりますが、見積もり手数料に示されるトランザクション手数料は発生します。",
   "wallet.send.form.send": "送信",
   "wallet.send.form.syncingTransactionsMessage": "ウォレットの残高とトランザクション履歴は現在ブロックチェーンと同期中です。",
   "wallet.send.form.title.hint": "例：太郎用資金",
   "wallet.send.form.title.label": "タイトル",
+  "wallet.send.form.updateAdaAmountDescription": "最低{minimumAda} ADAが必要です",
   "wallet.settings.assurance": "!!!Transaction assurance security level",
   "wallet.settings.changePassword.dialog.currentPasswordFieldPlaceholder": "現在のパスワードを入力してください",
   "wallet.settings.changePassword.dialog.currentPasswordLabel": "現在のパスワード",
@@ -1136,8 +1175,9 @@
   "wallet.summary.currency.isFetchingRate": "フェッチ時の換算レート",
   "wallet.summary.currency.lastFetched": "換算：{fetchedTimeAgo}",
   "wallet.summary.currency.title": "換算通貨：",
-  "wallet.summary.header.pendingTransactionsLabel": "処理中のトランザクション数",
-  "wallet.summary.header.transactionsLabel": "トランザクション数",
+  "wallet.summary.header.rewardsSummary": "獲得した報酬：<span class='amount'>{total}</span>、未使用の報酬：<span class='amount'>{unspent}</span>",
+  "wallet.summary.header.transactionsLabel": "トランザクション数 <span>{total}</span>、処理中 <span>{pending}</span>",
+  "wallet.summary.header.unspendableTooltip": "このウォレットのADAはすべて報酬アカウントに入っています。トランザクション手数料に報酬を使用することはできないため、このウォレットに手数料分として2ADA以上入金してください。",
   "wallet.summary.noTokens.learnMore.linkLabel": "もっと知る",
   "wallet.summary.noTokens.learnMore.linkUrl": "https://iohk.io/en/blog/posts/2021/02/04/native-tokens-to-bring-new-utility-to-life-on-cardano/",
   "wallet.summary.noTokens.learnMore.textBottom": "役立つ入門書については、IOHKブログにアクセスすることから始めてください。",
@@ -1147,10 +1187,20 @@
   "wallet.summary.transactionsList.syncingTransactionsMessage": "ウォレットのトランザクション履歴は現在ブロックチェーンと同期中です。",
   "wallet.summary.transactionsList.todayLabel": "今日",
   "wallet.summary.transactionsList.yesterdayLabel": "昨日",
+  "wallet.token.picker.addButtonLabel": "キャンセル",
+  "wallet.token.picker.allTokensLabel": "すべてのトークン",
+  "wallet.token.picker.cancelButtonLabel": "キャンセル",
+  "wallet.token.picker.checkAllLabel": "すべてを選択",
+  "wallet.token.picker.checkedCountLabel": "{checkedCount}/{maxTokens}トークン。",
+  "wallet.token.picker.clearAll": "選択を解除する",
+  "wallet.token.picker.favoriteTokensLabel": "お気に入り",
+  "wallet.token.picker.maxTokensWarning": "最大{maxTokens}のトランザクション上限に達しています。別のトークンを加えるには、リストから1つ削除する必要があります。",
+  "wallet.token.picker.noResults": "検索クエリと一致する結果はありません",
+  "wallet.token.picker.title": "トークンを追加する",
   "wallet.tokens.list.column.amount": "金額",
   "wallet.tokens.list.column.token": "トークン",
   "wallet.tokens.list.favorites.title": "お気に入り",
-  "wallet.tokens.list.search.noResults": "該当する結果はありません",
+  "wallet.tokens.list.search.noResults": "検索クエリと一致する結果はありません",
   "wallet.tokens.list.search.searchResults": "。検索結果",
   "wallet.tokens.list.tokens.title": "トークン",
   "wallet.tokens.list.viewAllButton.label": "すべてのトークンを表示する",
diff --git a/source/renderer/app/ipc/getBlockSyncChannel.ts b/source/renderer/app/ipc/getBlockSyncChannel.ts
new file mode 100644
index 0000000000..b32b817040
--- /dev/null
+++ b/source/renderer/app/ipc/getBlockSyncChannel.ts
@@ -0,0 +1,12 @@
+import { GET_BLOCK_SYNC_PROGRESS_CHANNEL } from '../../../common/ipc/api';
+import type {
+  GetBlockSyncProgressRendererRequest,
+  GetBlockSyncProgressMainResponse,
+} from '../../../common/ipc/api';
+import { RendererIpcChannel } from './lib/RendererIpcChannel';
+
+export const getBlockSyncProgressChannel: // IpcChannel<Incoming, Outgoing>
+RendererIpcChannel<
+  GetBlockSyncProgressMainResponse,
+  GetBlockSyncProgressRendererRequest
+> = new RendererIpcChannel(GET_BLOCK_SYNC_PROGRESS_CHANNEL);
diff --git a/source/renderer/app/ipc/getHardwareWalletChannel.ts b/source/renderer/app/ipc/getHardwareWalletChannel.ts
index e39528f397..1097114465 100644
--- a/source/renderer/app/ipc/getHardwareWalletChannel.ts
+++ b/source/renderer/app/ipc/getHardwareWalletChannel.ts
@@ -18,8 +18,8 @@ import type {
   getHardwareWalletTransportMainResponse,
   getExtendedPublicKeyRendererRequest,
   getExtendedPublicKeyMainResponse,
-  getHardwareWalletConnectiontMainRequest,
-  getHardwareWalletConnectiontRendererResponse,
+  getHardwareWalletConnectionMainRequest,
+  getHardwareWalletConnectionRendererResponse,
   signTransactionLedgerMainResponse,
   signTransactionLedgerRendererRequest,
   signTransactionTrezorMainResponse,
@@ -56,8 +56,8 @@ export const getCardanoAdaAppChannel: RendererIpcChannel<
 > = new RendererIpcChannel(GET_CARDANO_ADA_APP_CHANNEL);
 // IpcChannel<Incoming, Outgoing>
 export const getHardwareWalletConnectionChannel: RendererIpcChannel<
-  getHardwareWalletConnectiontMainRequest,
-  getHardwareWalletConnectiontRendererResponse
+  getHardwareWalletConnectionMainRequest,
+  getHardwareWalletConnectionRendererResponse
 > = new RendererIpcChannel(GET_HARDWARE_WALLET_CONNECTION_CHANNEL);
 // IpcChannel<Incoming, Outgoing>
 export const signTransactionLedgerChannel: RendererIpcChannel<
diff --git a/source/renderer/app/ipc/rebuild-application-menu.ts b/source/renderer/app/ipc/rebuild-application-menu.ts
index 9253284246..957c20e501 100644
--- a/source/renderer/app/ipc/rebuild-application-menu.ts
+++ b/source/renderer/app/ipc/rebuild-application-menu.ts
@@ -5,7 +5,9 @@ import type {
   RebuildAppMenuRendererRequest,
 } from '../../../common/ipc/api';
 // IpcChannel<Incoming, Outgoing>
-export const rebuildApplicationMenu: RendererIpcChannel<
+export type RebuildApplicationMenu = RendererIpcChannel<
   RebuildAppMenuMainResponse,
   RebuildAppMenuRendererRequest
-> = new RendererIpcChannel(REBUILD_APP_MENU_CHANNEL);
+>;
+export const rebuildApplicationMenu: RebuildApplicationMenu =
+  new RendererIpcChannel(REBUILD_APP_MENU_CHANNEL);
diff --git a/source/renderer/app/ipc/toggleRTSFlagsModeChannel.ts b/source/renderer/app/ipc/toggleRTSFlagsModeChannel.ts
new file mode 100644
index 0000000000..0974c77e41
--- /dev/null
+++ b/source/renderer/app/ipc/toggleRTSFlagsModeChannel.ts
@@ -0,0 +1,11 @@
+import { TOGGLE_RTS_FLAGS_MODE_CHANNEL } from '../../../common/ipc/api';
+import type {
+  ToggleRTSFlagsModeMainResponse,
+  ToggleRTSFlagsModeRendererRequest,
+} from '../../../common/ipc/api';
+import { RendererIpcChannel } from './lib/RendererIpcChannel';
+
+export const toggleRTSFlagsModeChannel: RendererIpcChannel<
+  ToggleRTSFlagsModeRendererRequest,
+  ToggleRTSFlagsModeMainResponse
+> = new RendererIpcChannel(TOGGLE_RTS_FLAGS_MODE_CHANNEL);
diff --git a/source/renderer/app/stores/AddressesStore.ts b/source/renderer/app/stores/AddressesStore.ts
index 3be55407ea..fb63b822a0 100644
--- a/source/renderer/app/stores/AddressesStore.ts
+++ b/source/renderer/app/stores/AddressesStore.ts
@@ -181,16 +181,22 @@ export default class AddressesStore extends Store {
   _resetErrors = () => {
     this.error = null;
   };
-  isInternalAddress = (address: string): boolean =>
-    findIndex(this.all, {
-      id: address,
-    }) > -1;
-  getAddressIndex = (address: string): number =>
-    this.all.length -
-    findIndex(this.all, {
-      id: address,
-    }) -
-    1;
+  isInternalAddress = (address: string): boolean => {
+    return (
+      findIndex(this.all, {
+        id: address,
+      }) > -1
+    );
+  };
+  getAddressIndex = (address: string): number => {
+    return (
+      this.all.length -
+      findIndex(this.all, {
+        id: address,
+      }) -
+      1
+    );
+  };
   getAccountIndexByWalletId = async (
     walletId: string
   ): Promise<number | null | undefined> => {
diff --git a/source/renderer/app/stores/AppStore.ts b/source/renderer/app/stores/AppStore.ts
index d9149e6311..c55152a255 100644
--- a/source/renderer/app/stores/AppStore.ts
+++ b/source/renderer/app/stores/AppStore.ts
@@ -50,6 +50,13 @@ export default class AppStore extends Store {
       // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string' is not assignable to par... Remove this comment to see the full error message
       this._updateActiveDialog(DIALOGS.DAEDALUS_DIAGNOSTICS);
     });
+    this.actions.app.closeToggleRTSFlagsModeDialog.listen(() => {
+      this._closeActiveDialog();
+    });
+    this.actions.app.openToggleRTSFlagsModeDialog.listen(() => {
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string' is not assignable to par... Remove this comment to see the full error message
+      this._updateActiveDialog(DIALOGS.TOGGLE_RTS_FLAGS_MODE);
+    });
     this.actions.app.downloadLogs.listen(this._downloadLogs);
     this.actions.app.setIsDownloadingLogs.listen(this._setIsDownloadingLogs);
     this.actions.app.toggleNewsFeed.listen(this._toggleNewsFeed);
@@ -74,8 +81,9 @@ export default class AppStore extends Store {
     openExternalUrlChannel.send(url);
   }
 
-  isActiveDialog = (dialog: ApplicationDialog): boolean =>
-    this.activeDialog === dialog;
+  isActiveDialog = (dialog: ApplicationDialog): boolean => {
+    return this.activeDialog === dialog;
+  };
   @action
   _toggleNewsFeed = () => {
     this.newsFeedIsOpen = !this.newsFeedIsOpen;
@@ -115,6 +123,12 @@ export default class AppStore extends Store {
 
         break;
 
+      case DIALOGS.TOGGLE_RTS_FLAGS_MODE:
+        // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string' is not assignable to par... Remove this comment to see the full error message
+        this._updateActiveDialog(DIALOGS.TOGGLE_RTS_FLAGS_MODE);
+
+        break;
+
       case DIALOGS.ITN_REWARDS_REDEMPTION:
         // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
         this.actions.staking.onRedeemStart.trigger();
@@ -182,6 +196,9 @@ export default class AppStore extends Store {
   };
   @action
   _updateActiveDialog = (currentDialog: ApplicationDialog) => {
+    if (this.newsFeedIsOpen) {
+      this.newsFeedIsOpen = false;
+    }
     if (this.activeDialog !== currentDialog) this.activeDialog = currentDialog;
   };
   @action
diff --git a/source/renderer/app/stores/AppUpdateStore.ts b/source/renderer/app/stores/AppUpdateStore.ts
index 74747d2a59..b8d881654a 100644
--- a/source/renderer/app/stores/AppUpdateStore.ts
+++ b/source/renderer/app/stores/AppUpdateStore.ts
@@ -177,14 +177,14 @@ export default class AppUpdateStore extends Store {
   // @ts-ignore ts-migrate(2749) FIXME: 'News' refers to a value, but is being used as a t... Remove this comment to see the full error message
   _checkNewAppUpdate = async (update: News) => {
     const { version, url } = this.getUpdateInfo(update);
+    // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     const appUpdateCompleted =
-      // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
       await this.getAppUpdateCompletedRequest.execute();
 
     /*
      * The update was already installed and the installer was already deleted.
      * We can't simply compare with the `package.json` version
-     * otherwise we would trigger the localdata cleaning on every app load
+     * otherwise we would trigger the local data cleaning on every app load
      */
     if (appUpdateCompleted === version) return false;
 
@@ -208,8 +208,8 @@ export default class AppUpdateStore extends Store {
     // Cancels if the update download is already in progress
     if (this.isUpdateDownloading) return false;
     // Is there an 'Automatic Update Failed' flag?
+    // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     const isAutomaticUpdateFailed =
-      // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
       await this.getAppAutomaticUpdateFailedRequest.execute();
 
     if (isAutomaticUpdateFailed) {
@@ -333,7 +333,7 @@ export default class AppUpdateStore extends Store {
   _requestResumeUpdateDownload = async () => {
     await requestResumeDownloadChannel.request({
       id: APP_UPDATE_DOWNLOAD_ID,
-      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ id: string; options: { progres... Remove this comment to see the full error message
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ id: string; options: { progress... Remove this comment to see the full error message
       options: {
         progressIsThrottled: false,
         persistLocalData: true,
diff --git a/source/renderer/app/stores/AssetsStore.ts b/source/renderer/app/stores/AssetsStore.ts
index b08f9e534e..c8ff22af56 100644
--- a/source/renderer/app/stores/AssetsStore.ts
+++ b/source/renderer/app/stores/AssetsStore.ts
@@ -4,7 +4,6 @@ import Store from './lib/Store';
 import Request from './lib/LocalizedRequest';
 import Asset from '../domains/Asset';
 import { ROUTES } from '../routes-config';
-import { requestGetter } from '../utils/storesUtils';
 import { ellipsis } from '../utils/strings';
 import type { GetAssetsResponse, AssetToken } from '../api/assets/types';
 
@@ -15,30 +14,27 @@ export default class AssetsStore extends Store {
   // REQUESTS
   @observable
   favoritesRequest: Request<Record<string, any>> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'AssetsStore... Remove this comment to see the full error message
     this.api.localStorage.getWalletTokenFavorites
   );
   @observable
   activeAsset: string | null | undefined = null;
   @observable
-  editingsAsset: AssetToken | null | undefined = null;
+  editedAsset: AssetToken | null | undefined = null;
   @observable
   assetsRequests: Record<WalletId, Request<GetAssetsResponse>> = {};
   @observable
   insertingAssetUniqueId: string | null | undefined = null;
   @observable
   removingAssetUniqueId: string | null | undefined = null;
-  // REQUESTS
-  @observable
-  getAssetSettingsDialogWasOpenedRequest: Request<void> = new Request(
-    this.api.localStorage.getAssetSettingsDialogWasOpened
-  );
 
   setup() {
     setInterval(this._refreshAssetsData, this.ASSETS_REFRESH_INTERVAL);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'AssetsS... Remove this comment to see the full error message
     const { assets: assetsActions, wallets: walletsActions } = this.actions;
-    assetsActions.onAssetSettingsOpen.listen(this._onAssetSettingsOpen);
+    assetsActions.setEditedAsset.listen(this._onEditedAssetSet);
     assetsActions.onAssetSettingsSubmit.listen(this._onAssetSettingsSubmit);
-    assetsActions.onAssetSettingsCancel.listen(this._onAssetSettingsCancel);
+    assetsActions.unsetEditedAsset.listen(this._onEditedAssetUnset);
     assetsActions.onOpenAssetSend.listen(this._onOpenAssetSend);
     assetsActions.onCopyAssetParam.listen(this._onCopyAssetParam);
     assetsActions.onToggleFavorite.listen(this._onToggleFavorite);
@@ -75,11 +71,6 @@ export default class AssetsStore extends Store {
   getAsset = (policyId: string, assetName: string): Asset | null | undefined =>
     this.details[`${policyId}${assetName}`];
 
-  @computed
-  get assetSettingsDialogWasOpened(): boolean {
-    return requestGetter(this.getAssetSettingsDialogWasOpenedRequest, false);
-  }
-
   @computed
   get favorites(): Record<string, any> {
     return this.favoritesRequest.result || {};
@@ -90,10 +81,8 @@ export default class AssetsStore extends Store {
     this.favoritesRequest.execute();
   };
   @action
-  _onAssetSettingsOpen = ({ asset }: { asset: AssetToken }) => {
-    this.editingsAsset = asset;
-    this.api.localStorage.setAssetSettingsDialogWasOpened();
-    this.getAssetSettingsDialogWasOpenedRequest.execute();
+  _onEditedAssetSet = ({ asset }: { asset: AssetToken }) => {
+    this.editedAsset = asset;
   };
   @action
   _onAssetSettingsSubmit = async ({
@@ -103,7 +92,7 @@ export default class AssetsStore extends Store {
     asset: AssetToken;
     decimals: number;
   }) => {
-    this.editingsAsset = null;
+    this.editedAsset = null;
     const { policyId, assetName } = asset;
     const assetDomain = this.getAsset(policyId, assetName);
 
@@ -120,11 +109,12 @@ export default class AssetsStore extends Store {
     });
   };
   @action
-  _onAssetSettingsCancel = () => {
-    this.editingsAsset = null;
+  _onEditedAssetUnset = () => {
+    this.editedAsset = null;
   };
   @action
   _onOpenAssetSend = ({ uniqueId }: { uniqueId: string }) => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'AssetsSt... Remove this comment to see the full error message
     const { stores, actions } = this;
     const { wallets } = stores;
     const { active } = wallets;
@@ -151,6 +141,7 @@ export default class AssetsStore extends Store {
     fullValue: string;
   }) => {
     const shortValue = ellipsis(fullValue, 15, 15);
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'AssetsS... Remove this comment to see the full error message
     this.actions.assets.copyAssetParamNotification.trigger({
       param,
       shortValue,
@@ -159,6 +150,7 @@ export default class AssetsStore extends Store {
   @action
   _refreshAssetsData = () => {
     if (this.stores.networkStatus.isConnected) {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'AssetsSt... Remove this comment to see the full error message
       const { all } = this.stores.wallets;
 
       for (const wallet of all) {
@@ -182,6 +174,7 @@ export default class AssetsStore extends Store {
   _createWalletTokensRequest = (
     walletId: string
   ): Request<GetAssetsResponse> => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'AssetsStore... Remove this comment to see the full error message
     this.assetsRequests[walletId] = new Request(this.api.ada.getAssets);
     return this.assetsRequests[walletId];
   };
@@ -193,6 +186,7 @@ export default class AssetsStore extends Store {
     uniqueId: string;
     isFavorite: boolean;
   }) => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'AssetsStore... Remove this comment to see the full error message
     await this.api.localStorage.toggleWalletTokenFavorite(
       uniqueId,
       !isFavorite
diff --git a/source/renderer/app/stores/HardwareWalletsStore.ts b/source/renderer/app/stores/HardwareWalletsStore.ts
index e030709968..652ca65930 100644
--- a/source/renderer/app/stores/HardwareWalletsStore.ts
+++ b/source/renderer/app/stores/HardwareWalletsStore.ts
@@ -431,7 +431,7 @@ export default class HardwareWalletsStore extends Store {
       throw e;
     }
   };
-  // Check stake pool transaction state and reset pending state when transction is "in_ledger"
+  // Check stake pool transaction state and reset pending state when transaction is "in_ledger"
   @action
   checkTransaction = (request: {
     transactionId: string;
@@ -654,7 +654,7 @@ export default class HardwareWalletsStore extends Store {
           '[HW-DEBUG] HWStore - Establish connection:: New Transaction / Address verification initiated - check device'
         );
 
-        // Return device that belongs to active hardwate wallet if is already plugged-in
+        // Return device that belongs to active hardware wallet if is already plugged-in
         if (
           recognizedPairedHardwareWallet &&
           !recognizedPairedHardwareWallet.disconnected
@@ -758,7 +758,7 @@ export default class HardwareWalletsStore extends Store {
         logger.debug(
           '[HW-DEBUG] HWStore - establishHardwareWalletConnection:: Start process with last UNPAIRED device'
         );
-        // Start listeners for specific (last pluged) device
+        // Start listeners for specific (last plugged) device
         let devicePath = null;
         let isTrezor = false;
 
@@ -783,7 +783,7 @@ export default class HardwareWalletsStore extends Store {
         }
 
         // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
-        logger.debug('[HW-DEBUG] HWStore - Transport retreived');
+        logger.debug('[HW-DEBUG] HWStore - Transport retrieved');
       } else {
         // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
         logger.debug(
@@ -1148,7 +1148,7 @@ export default class HardwareWalletsStore extends Store {
             transportDevice: toJS(transportDevice),
           });
           runInAction(
-            'HardwareWalletsStore:: Set transport device fomr tx init',
+            'HardwareWalletsStore:: Set transport device for tx init',
             () => {
               this.transportDevice = transportDevice;
             }
@@ -1720,7 +1720,7 @@ export default class HardwareWalletsStore extends Store {
        * ============  Exporting aborted  =============
        * e.statusCode === 28169 // Ledger
        * e.code === 'Failure_ActionCancelled' // Trezor
-       * ============  Exporting cancellet - device unplugged during action  =============
+       * ============  Exporting cancelled - device unplugged during action  =============
        * e.name === DisconnectedDevice // Ledger
        * e.error === 'device disconnected during action' // Trezor
        */
@@ -1907,7 +1907,7 @@ export default class HardwareWalletsStore extends Store {
       (hardwareWalletDevice) => hardwareWalletDevice.paired === walletId
     );
     const recognizedDevicePath = get(recognizedDevice, 'path', null);
-    logger.debug('[HW-DEBUG] sign Trezor:: recognizedDevicePath and walelt: ', {
+    logger.debug('[HW-DEBUG] sign Trezor:: recognizedDevicePath and wallet: ', {
       walletId,
       deviceId,
       isTransactionInitiated: this.isTransactionInitiated,
@@ -2099,9 +2099,9 @@ export default class HardwareWalletsStore extends Store {
 
     return null;
   };
-  _deriveXpub = CachedDeriveXpubFactory(async (xpubHex) =>
-    Buffer.from(xpubHex, 'hex')
-  );
+  _deriveXpub = CachedDeriveXpubFactory(async (xpubHex) => {
+    return Buffer.from(xpubHex, 'hex');
+  });
   _getRewardAccountAddress = async (walletId: string, path: Array<string>) => {
     const pathParams = getParamsFromPath(path);
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
@@ -2210,7 +2210,7 @@ export default class HardwareWalletsStore extends Store {
       const { stakeAddress, stakeKey, votingKey, nonce } = this.votingData;
       unsignedTxAuxiliaryData = {
         nonce,
-        // unique increaseable number e.g. current epoch number or absolute slot number ( identifies unique tx / vote registration )
+        // unique increasable number e.g. current epoch number or absolute slot number ( identifies unique tx / vote registration )
         rewardDestinationAddress: {
           address: stakeAddress,
           stakingPath: [2147485500, 2147485463, 2147483648, 2, 0],
@@ -2408,7 +2408,7 @@ export default class HardwareWalletsStore extends Store {
           transportDevice: toJS(transportDevice),
         });
         runInAction(
-          'HardwareWalletsStore:: Set transport device fomr tx init',
+          'HardwareWalletsStore:: Set transport device for tx init',
           () => {
             this.transportDevice = transportDevice;
           }
@@ -2849,11 +2849,12 @@ export default class HardwareWalletsStore extends Store {
   };
   _getHardwareWalletDeviceInfoByWalletId = (
     walletId: string
-  ): HardwareWalletLocalData =>
-    find(
+  ): HardwareWalletLocalData => {
+    return find(
       this.hardwareWalletsConnectionData,
       (connectionData) => connectionData.id === walletId
     );
+  };
   _setHardwareWalletLocalData = async ({
     walletId,
     data,
diff --git a/source/renderer/app/stores/NetworkStatusStore.ts b/source/renderer/app/stores/NetworkStatusStore.ts
index 794b9b4a0a..5fb1b03a6f 100644
--- a/source/renderer/app/stores/NetworkStatusStore.ts
+++ b/source/renderer/app/stores/NetworkStatusStore.ts
@@ -19,14 +19,15 @@ import {
   restartCardanoNodeChannel,
   setCachedCardanoStatusChannel,
 } from '../ipc/cardano.ipc';
-import type {
+import {
+  BlockSyncType,
   CardanoNodeState,
+  CardanoNodeStates,
   CardanoStatus,
   TlsConfig,
 } from '../../../common/types/cardano-node.types';
-import { CardanoNodeStates } from '../../../common/types/cardano-node.types';
 import { getDiskSpaceStatusChannel } from '../ipc/getDiskSpaceChannel';
-import { getBlockReplayProgressChannel } from '../ipc/getBlockReplayChannel';
+import { getBlockSyncProgressChannel } from '../ipc/getBlockSyncChannel';
 import { getStateDirectoryPathChannel } from '../ipc/getStateDirectoryPathChannel';
 import type {
   FutureEpoch,
@@ -36,9 +37,12 @@ import type {
   NextEpoch,
   TipInfo,
 } from '../api/network/types';
+import type { GetBlockSyncProgressMainResponse } from '../../../common/ipc/api';
 import type { CheckDiskSpaceResponse } from '../../../common/types/no-disk-space.types';
 import { TlsCertificateNotValidError } from '../api/nodes/errors';
 import { openLocalDirectoryChannel } from '../ipc/open-local-directory';
+import { toggleRTSFlagsModeChannel } from '../ipc/toggleRTSFlagsModeChannel';
+
 // DEFINE CONSTANTS -------------------------
 const NETWORK_STATUS = {
   CONNECTING: 0,
@@ -80,6 +84,7 @@ export default class NetworkStatusStore extends Store {
   cardanoNodePID = 0;
   @observable
   cardanoWalletPID = 0;
+  @observable isRTSFlagsModeEnabled = false;
   @observable
   isNodeResponding = false; // Is 'true' as long we are receiving node Api responses
 
@@ -165,14 +170,15 @@ export default class NetworkStatusStore extends Store {
   @observable
   shelleyActivationTime = '';
   @observable
-  // @ts-ignore ts-migrate(2300) FIXME: Duplicate identifier 'isAlonzoActivated'.
-  isAlonzoActivated = false;
-  @observable
   isAlonzoPending = false;
   @observable
   alonzoActivationTime = '';
   @observable
-  verificationProgress = 0;
+  blockSyncProgress: Record<BlockSyncType, number> = {
+    [BlockSyncType.validatingChunk]: 0,
+    [BlockSyncType.replayedBlock]: 0,
+    [BlockSyncType.pushingLedger]: 0,
+  };
   @observable
   epochLength: number | null | undefined = null; // unit: 1 slot
 
@@ -188,6 +194,7 @@ export default class NetworkStatusStore extends Store {
     networkStatusActions.forceCheckNetworkClock.listen(
       this._forceCheckNetworkClock
     );
+    networkStatusActions.toggleRTSFlagsMode.listen(this._toggleRTSFlagsMode);
 
     // Request node state
     this._requestCardanoState();
@@ -216,11 +223,12 @@ export default class NetworkStatusStore extends Store {
 
     // Setup disk space checks
     getDiskSpaceStatusChannel.onReceive(this._onCheckDiskSpace);
+    this._checkDiskSpace();
 
     this._getStateDirectoryPath();
 
     // Blockchain verification checking
-    getBlockReplayProgressChannel.onReceive(this._onCheckVerificationProgress);
+    getBlockSyncProgressChannel.onReceive(this._onBlockSyncProgressUpdate);
   }
 
   _restartNode = async () => {
@@ -231,6 +239,7 @@ export default class NetworkStatusStore extends Store {
       logger.info('NetworkStatusStore: Requesting a restart of cardano-node');
       await restartCardanoNodeChannel.send();
     } catch (error) {
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.error('NetworkStatusStore: Restart of cardano-node failed', {
         error,
       });
@@ -277,6 +286,7 @@ export default class NetworkStatusStore extends Store {
       logger.info('NetworkStatusStore: Updating node status');
       await setCachedCardanoStatusChannel.send(this._extractNodeStatus(this));
     } catch (error) {
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.error('NetworkStatusStore: Error while updating node status', {
         error,
       });
@@ -302,6 +312,7 @@ export default class NetworkStatusStore extends Store {
     // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('NetworkStatusStore: requesting node state');
     const state = await cardanoStateChangeChannel.request();
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info(`NetworkStatusStore: handling node state <${state}>`, {
       state,
     });
@@ -313,12 +324,14 @@ export default class NetworkStatusStore extends Store {
       logger.info('NetworkStatusStore: requesting node status');
       // @ts-ignore ts-migrate(2554) FIXME: Expected 1-3 arguments, but got 0.
       const status = await getCachedCardanoStatusChannel.request();
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.info('NetworkStatusStore: received cached node status', {
         status,
       });
       if (status)
         runInAction('assigning node status', () => Object.assign(this, status));
     } catch (error) {
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.error('NetworkStatusStore: error while requesting node state', {
         error,
       });
@@ -333,6 +346,7 @@ export default class NetworkStatusStore extends Store {
       const tlsConfig = await cardanoTlsConfigChannel.request();
       await this._updateTlsConfig(tlsConfig);
     } catch (error) {
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.error('NetworkStatusStore: error while requesting tls config', {
         error,
       });
@@ -354,6 +368,7 @@ export default class NetworkStatusStore extends Store {
   };
   _handleCardanoNodeStateChange = async (state: CardanoNodeState) => {
     if (state === this.cardanoNodeState) return Promise.resolve();
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info(`NetworkStatusStore: handling cardano-node state <${state}>`, {
       state,
     });
@@ -402,6 +417,7 @@ export default class NetworkStatusStore extends Store {
       hasBeenConnected,
       cardanoNodePID,
       cardanoWalletPID,
+      isRTSFlagsModeEnabled,
     } = from;
     return {
       isNodeResponding,
@@ -410,9 +426,15 @@ export default class NetworkStatusStore extends Store {
       hasBeenConnected,
       cardanoNodePID,
       cardanoWalletPID,
+      isRTSFlagsModeEnabled,
     };
   };
+
   // DEFINE ACTIONS
+  @action _toggleRTSFlagsMode = async () => {
+    await toggleRTSFlagsModeChannel.send();
+  };
+
   @action
   _setNetworkStatusPollingInterval = () => {
     this._networkStatusPollingInterval = setInterval(
@@ -483,6 +505,7 @@ export default class NetworkStatusStore extends Store {
       }
     }
 
+    // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
     logger.info('NetworkStatusStore: Checking network clock...', {
       isForceCheck,
     });
@@ -504,6 +527,7 @@ export default class NetworkStatusStore extends Store {
           this._clearNetworkClockPollingInterval();
         }
       });
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.info('NetworkStatusStore: Network clock response received', {
         localTimeDifference: this.localTimeDifference,
         isNodeTimeCorrect: this.isNodeTimeCorrect,
@@ -568,6 +592,7 @@ export default class NetworkStatusStore extends Store {
 
         const connectingTimeDelta = this._getStartupTimeDelta();
 
+        // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
         logger.info(`Connected after ${connectingTimeDelta} milliseconds`, {
           connectingTimeDelta,
         });
@@ -613,6 +638,7 @@ export default class NetworkStatusStore extends Store {
 
         const syncingTimeDelta = this._getStartupTimeDelta();
 
+        // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
         logger.info(`Synced after ${syncingTimeDelta} milliseconds`, {
           syncingTimeDelta,
         });
@@ -777,13 +803,17 @@ export default class NetworkStatusStore extends Store {
 
     return Promise.resolve();
   };
-  @action
-  _onCheckVerificationProgress = (
-    verificationProgress: number
-  ): Promise<void> => {
-    this.verificationProgress = verificationProgress;
-    return Promise.resolve();
+
+  @action _onBlockSyncProgressUpdate = async ({
+    progress,
+    type,
+  }: GetBlockSyncProgressMainResponse) => {
+    this.blockSyncProgress = {
+      ...this.blockSyncProgress,
+      [type]: progress,
+    };
   };
+
   @action
   _onReceiveStateDirectoryPath = (stateDirectoryPath: string) => {
     this.stateDirectoryPath = stateDirectoryPath;
@@ -842,6 +872,9 @@ export default class NetworkStatusStore extends Store {
 
   @computed
   get isVerifyingBlockchain(): boolean {
-    return !this.isConnected && this.verificationProgress < 100;
+    return (
+      !this.isConnected &&
+      Object.values(this.blockSyncProgress).some((value) => value < 100)
+    );
   }
 }
diff --git a/source/renderer/app/stores/NewsFeedStore.ts b/source/renderer/app/stores/NewsFeedStore.ts
index 7025f23320..88dbb52f44 100644
--- a/source/renderer/app/stores/NewsFeedStore.ts
+++ b/source/renderer/app/stores/NewsFeedStore.ts
@@ -136,7 +136,7 @@ export default class NewsFeedStore extends Store {
 
       // If no incidents and incident poller interval active, reset interval and set regular one
       if (!hasIncident && this.pollingNewsOnIncidentIntervalId) {
-        // Clear regulat interval
+        // Clear regular interval
         if (this.pollingNewsOnIncidentIntervalId) {
           clearInterval(this.pollingNewsOnIncidentIntervalId);
           this.pollingNewsOnIncidentIntervalId = null;
diff --git a/source/renderer/app/stores/ProfileStore.ts b/source/renderer/app/stores/ProfileStore.ts
index 8421ec100a..ed0e70383d 100644
--- a/source/renderer/app/stores/ProfileStore.ts
+++ b/source/renderer/app/stores/ProfileStore.ts
@@ -9,12 +9,10 @@ import { ROUTES } from '../routes-config';
 import LocalizableError from '../i18n/LocalizableError';
 import { WalletSupportRequestLogsCompressError } from '../i18n/errors';
 import { generateFileNameWithTimestamp } from '../../../common/utils/files';
-import { formattedBytesToSize } from '../utils/formatters';
 import { logger } from '../utils/logging';
 import { setStateSnapshotLogChannel } from '../ipc/setStateSnapshotLogChannel';
 import { getDesktopDirectoryPathChannel } from '../ipc/getDesktopDirectoryPathChannel';
 import { getSystemLocaleChannel } from '../ipc/getSystemLocaleChannel';
-import { enableApplicationMenuNavigationChannel } from '../ipc/enableApplicationMenuNavigationChannel';
 import { LOCALES } from '../../../common/types/locales.types';
 import {
   compressLogsChannel,
@@ -42,6 +40,7 @@ import {
   TIME_OPTIONS,
   PROFILE_SETTINGS,
 } from '../config/profileConfig';
+import { buildSystemInfo } from '../utils/buildSystemInfo';
 
 export default class ProfileStore extends Store {
   @observable
@@ -80,10 +79,12 @@ export default class ProfileStore extends Store {
   );
   @observable
   getProfileDateFormatJapaneseRequest: Request<string> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'ProfileStor... Remove this comment to see the full error message
     this.api.localStorage.getUserDateFormatJapanese
   );
   @observable
   setProfileDateFormatJapaneseRequest: Request<string> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'ProfileStor... Remove this comment to see the full error message
     this.api.localStorage.setUserDateFormatJapanese
   );
   @observable
@@ -104,10 +105,12 @@ export default class ProfileStore extends Store {
   );
   @observable
   getDataLayerMigrationAcceptanceRequest: Request<string> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'ProfileStor... Remove this comment to see the full error message
     this.api.localStorage.getDataLayerMigrationAcceptance
   );
   @observable
   setDataLayerMigrationAcceptanceRequest: Request<string> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'ProfileStor... Remove this comment to see the full error message
     this.api.localStorage.setDataLayerMigrationAcceptance
   );
   @observable
@@ -133,9 +136,12 @@ export default class ProfileStore extends Store {
   isSubmittingBugReport = false;
   @observable
   isInitialScreen = false;
+  @observable
+  isRTSModeRecommendationAcknowledged = false;
 
   /* eslint-enable max-len */
   setup() {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Profile... Remove this comment to see the full error message
     const { profile: profileActions } = this.actions;
     profileActions.finishInitialScreenSettings.listen(
       this._finishInitialScreenSettings
@@ -150,6 +156,9 @@ export default class ProfileStore extends Store {
     profileActions.getLogsAndCompress.listen(this._getLogsAndCompress);
     profileActions.downloadLogs.listen(this._downloadLogs);
     profileActions.downloadLogsSuccess.listen(this._toggleDisableDownloadLogs);
+    profileActions.acknowledgeRTSModeRecommendation.listen(
+      this._acknowledgeRTSFlagsModeRecommendation
+    );
     this.actions.app.initAppEnvironment.listen(() => {});
     this.registerReactions([
       this._updateBigNumberFormat,
@@ -201,6 +210,7 @@ export default class ProfileStore extends Store {
     if (global.isFlight) {
       systemValue = THEMES.FLIGHT_CANDIDATE;
     } else {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'environment' does not exist on type 'Pro... Remove this comment to see the full error message
       systemValue = this.environment.isMainnet
         ? THEMES.DARK_CARDANO
         : THEMES.LIGHT_BLUE;
@@ -338,6 +348,7 @@ export default class ProfileStore extends Store {
 
     if (param === 'numberFormat') {
       // Force re-rendering of the sidebar in order to apply new number format
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
       this.stores.wallets.refreshWalletsData();
     }
   };
@@ -352,15 +363,10 @@ export default class ProfileStore extends Store {
     await this.setTermsOfUseAcceptanceRequest.execute();
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.getTermsOfUseAcceptanceRequest.execute();
-    await enableApplicationMenuNavigationChannel.send();
   };
   _getTermsOfUseAcceptance = async () => {
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.getTermsOfUseAcceptanceRequest.execute();
-
-    if (this.getTermsOfUseAcceptanceRequest.result) {
-      await enableApplicationMenuNavigationChannel.send();
-    }
   };
   _acceptDataLayerMigration = async () => {
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
@@ -368,6 +374,10 @@ export default class ProfileStore extends Store {
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.getDataLayerMigrationAcceptanceRequest.execute();
   };
+  @action
+  _acknowledgeRTSFlagsModeRecommendation = () => {
+    this.isRTSModeRecommendationAcknowledged = true;
+  };
   _getDataLayerMigrationAcceptance = () => {
     this.getDataLayerMigrationAcceptanceRequest.execute();
   };
@@ -387,6 +397,7 @@ export default class ProfileStore extends Store {
       runInAction('Set `isInitialScreen` true', () => {
         this.isInitialScreen = true;
       });
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Profile... Remove this comment to see the full error message
       this.actions.router.goToRoute.trigger({
         route: ROUTES.PROFILE.INITIAL_SETTINGS,
       });
@@ -401,14 +412,17 @@ export default class ProfileStore extends Store {
       this.isCurrentLocaleSet &&
       termsOfUseNotAccepted
     ) {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Profile... Remove this comment to see the full error message
       this.actions.router.goToRoute.trigger({
         route: ROUTES.PROFILE.TERMS_OF_USE,
       });
     }
   };
   _isOnTermsOfUsePage = () =>
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
     this.stores.app.currentRoute === ROUTES.PROFILE.TERMS_OF_USE;
   _redirectToDataLayerMigrationScreenIfMigrationHasNotAccepted = () => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
     const { isConnected } = this.stores.networkStatus;
     const dataLayerMigrationNotAccepted =
       this.hasLoadedDataLayerMigrationAcceptance &&
@@ -418,15 +432,18 @@ export default class ProfileStore extends Store {
       isConnected &&
       this.isCurrentLocaleSet &&
       this.areTermsOfUseAccepted &&
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
       this.stores.wallets.hasLoadedWallets &&
       dataLayerMigrationNotAccepted
     ) {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
       if (!this.stores.wallets.hasAnyWallets) {
         // There are no wallets to migrate:
         // set the data layer migration acceptance to true
         // in order to prevent future data migration checks
         this._acceptDataLayerMigration();
       } else {
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Profile... Remove this comment to see the full error message
         this.actions.router.goToRoute.trigger({
           route: ROUTES.PROFILE.DATA_LAYER_MIGRATION,
         });
@@ -447,6 +464,7 @@ export default class ProfileStore extends Store {
     }
   };
   _isOnDataLayerMigrationPage = () =>
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
     this.stores.app.currentRoute === ROUTES.PROFILE.DATA_LAYER_MIGRATION;
   _redirectToRoot = () => {
     this.actions.router.goToRoute.trigger({
@@ -518,6 +536,7 @@ export default class ProfileStore extends Store {
           compressedLogsFilePath: this.compressedLogsFilePath,
           destinationPath: destination,
         });
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Profile... Remove this comment to see the full error message
         this.actions.profile.downloadLogsSuccess.trigger(false);
 
         this._reset();
@@ -534,13 +553,13 @@ export default class ProfileStore extends Store {
     try {
       // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.info('ProfileStore: Requesting state snapshot log file creation');
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'ProfileS... Remove this comment to see the full error message
       const { networkStatus } = this.stores;
       const {
         cardanoNodePID,
         cardanoWalletPID,
         tlsConfig,
         stateDirectoryPath,
-        diskSpaceAvailable,
         cardanoNodeState,
         isConnected,
         isNodeInSync,
@@ -556,7 +575,6 @@ export default class ProfileStore extends Store {
         network,
         apiVersion,
         nodeVersion,
-        cpu,
         version,
         mainProcessID,
         rendererProcessID,
@@ -565,17 +583,8 @@ export default class ProfileStore extends Store {
         isMainnet,
         isStaging,
         isTestnet,
-        os,
-        platformVersion,
-        ram,
       } = this.environment;
-      const systemInfo = {
-        platform: os,
-        platformVersion,
-        cpu: Array.isArray(cpu) ? cpu[0].model : '',
-        ram: formattedBytesToSize(ram),
-        availableDiskSpace: diskSpaceAvailable,
-      };
+      const systemInfo = buildSystemInfo(this.environment, networkStatus);
       const coreInfo = {
         daedalusVersion: version,
         daedalusBuildNumber: build,
@@ -621,6 +630,7 @@ export default class ProfileStore extends Store {
       };
       await setStateSnapshotLogChannel.send(stateSnapshotData);
     } catch (error) {
+      // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       logger.error('ProfileStore: State snapshot log file creation failed', {
         error,
       });
@@ -628,6 +638,7 @@ export default class ProfileStore extends Store {
   };
   _toggleDisableDownloadLogs = action(
     async ({ isDownloadNotificationVisible }) => {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Profile... Remove this comment to see the full error message
       this.actions.app.setIsDownloadingLogs.trigger(
         isDownloadNotificationVisible
       );
diff --git a/source/renderer/app/stores/SidebarStore.spec.ts b/source/renderer/app/stores/SidebarStore.spec.ts
new file mode 100644
index 0000000000..ad1ba96246
--- /dev/null
+++ b/source/renderer/app/stores/SidebarStore.spec.ts
@@ -0,0 +1,263 @@
+import BigNumber from 'bignumber.js';
+import type { Api } from '../api/index';
+import type { ActionsMap } from '../actions/index';
+import { WalletSortBy, WalletSortOrder } from '../types/sidebarTypes';
+import type { SidebarWalletType } from '../types/sidebarTypes';
+import SidebarStore from './SidebarStore';
+
+describe('Sidebar Store', () => {
+  const api: Api = {
+    ada: jest.fn(),
+    localStorage: jest.fn(),
+  } as any;
+  const actions: ActionsMap = jest.fn() as any;
+
+  function setupStore({
+    wallets,
+  }: {
+    wallets: Array<{
+      id: string;
+      name: string;
+      amount: BigNumber;
+      isLegacy?: boolean;
+    }>;
+  }) {
+    const sidebarStore = new SidebarStore(api, actions);
+    sidebarStore.stores = {
+      wallets: {
+        all: wallets,
+      },
+      hardwareWallets: jest.fn(),
+      walletSettings: {
+        getWalletsRecoveryPhraseVerificationData: jest.fn().mockReturnValue({
+          hasNotification: false,
+        }),
+      },
+      networkStatus: {
+        isConnected: true,
+      },
+    } as any;
+    return sidebarStore;
+  }
+
+  function pickAssertionProps(wallets: SidebarWalletType[]) {
+    return wallets.map(({ id, amount, title, isLegacy }) => ({
+      id,
+      amount,
+      title,
+      isLegacy,
+    }));
+  }
+
+  it('should sort wallets initially by DATE from oldest to newest', () => {
+    const sidebarStore = setupStore({
+      wallets: [
+        {
+          id: '1',
+          name: 'Wallet A',
+          amount: new BigNumber(1),
+          isLegacy: false,
+        },
+        {
+          id: '2',
+          name: 'Wallet B',
+          amount: new BigNumber(2),
+          isLegacy: false,
+        },
+      ],
+    });
+    expect(pickAssertionProps(sidebarStore.wallets)).toEqual([
+      {
+        id: '1',
+        title: 'Wallet A',
+        amount: new BigNumber(1),
+        isLegacy: false,
+      },
+      {
+        id: '2',
+        title: 'Wallet B',
+        amount: new BigNumber(2),
+        isLegacy: false,
+      },
+    ]);
+  });
+  const defaultSortingCases = [
+    // Sort wallets by NAME from A-Z as default order
+    [
+      WalletSortBy.Name,
+      [
+        ['1', 'Sigurd', 1600],
+        ['2', 'Hel', 25],
+        ['3', 'Loki', 0],
+        ['4', 'empty', 0],
+        ['5', 'empty', 0],
+        ['6', 'Odin', 246, true],
+        ['7', 'Jormungand', 0, true],
+      ],
+      [
+        ['4', 'empty', 0],
+        ['5', 'empty', 0],
+        ['2', 'Hel', 25],
+        ['3', 'Loki', 0],
+        ['1', 'Sigurd', 1600],
+        ['7', 'Jormungand', 0, true],
+        ['6', 'Odin', 246, true],
+      ],
+    ], // Sort wallets by BALANCE from from higher to lower as default order
+    [
+      WalletSortBy.Balance,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+    ],
+  ];
+  test.each(defaultSortingCases)(
+    `should set default sorting for %s`,
+    (sortBy, wallets, expected) => {
+      const sidebarStore = setupStore({
+        wallets: wallets.map(([id, name, amount, isLegacy = false]) => ({
+          id,
+          name,
+          amount: new BigNumber(amount),
+          isLegacy,
+        })),
+      });
+      sidebarStore.onChangeWalletSortType(sortBy);
+      expect(pickAssertionProps(sidebarStore.wallets)).toEqual(
+        expected.map(([id, title, amount, isLegacy = false]) => ({
+          id,
+          amount: new BigNumber(amount),
+          title,
+          isLegacy,
+        }))
+      );
+    }
+  );
+  it('should move Byron wallets at the bottom', () => {
+    const sidebarStore = setupStore({
+      wallets: [
+        {
+          id: '1',
+          name: 'Byron Wallet A',
+          amount: new BigNumber(1000),
+          isLegacy: true,
+        },
+        {
+          id: '2',
+          name: 'Byron Wallet B',
+          amount: new BigNumber(200),
+          isLegacy: true,
+        },
+        {
+          id: '3',
+          name: 'Shelley Wallet A',
+          amount: new BigNumber(1000),
+          isLegacy: false,
+        },
+        {
+          id: '4',
+          name: 'Shelley Wallet B',
+          amount: new BigNumber(200),
+          isLegacy: false,
+        },
+      ],
+    });
+    sidebarStore.onChangeWalletSortType(WalletSortBy.Balance);
+    expect(pickAssertionProps(sidebarStore.wallets)).toEqual([
+      {
+        id: '3',
+        title: 'Shelley Wallet A',
+        amount: new BigNumber(1000),
+        isLegacy: false,
+      },
+      {
+        id: '4',
+        title: 'Shelley Wallet B',
+        amount: new BigNumber(200),
+        isLegacy: false,
+      },
+      {
+        id: '1',
+        title: 'Byron Wallet A',
+        amount: new BigNumber(1000),
+        isLegacy: true,
+      },
+      {
+        id: '2',
+        title: 'Byron Wallet B',
+        amount: new BigNumber(200),
+        isLegacy: true,
+      },
+    ]);
+  });
+  const reverseSortingOrderCases = [
+    // Sort wallets by DATE by reversing from ASC to DESC
+    [
+      WalletSortBy.Date,
+      WalletSortOrder.Asc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+    ], // Sort wallets by NAME by reversing from A-Z to Z-A
+    [
+      WalletSortBy.Name,
+      WalletSortOrder.Asc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+    ], // Sort wallets by BALANCE by reversing from higher amount to lower ones
+    [
+      WalletSortBy.Balance,
+      WalletSortOrder.Desc,
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+    ],
+  ];
+  test.each(reverseSortingOrderCases)(
+    `should reverse sorting for %s on %s order`,
+    (sortBy, sortOrder, wallets, expected) => {
+      const sidebarStore = setupStore({
+        wallets: wallets.map(([id, name, amount, isLegacy = false]) => ({
+          id,
+          name,
+          amount: new BigNumber(amount),
+          isLegacy,
+        })),
+      });
+      sidebarStore.walletSortConfig = {
+        sortBy,
+        sortOrder,
+      };
+      sidebarStore.onChangeWalletSortType(sortBy);
+      expect(pickAssertionProps(sidebarStore.wallets)).toEqual(
+        expected.map(([id, title, amount, isLegacy = false]) => ({
+          id,
+          amount: new BigNumber(amount),
+          title,
+          isLegacy,
+        }))
+      );
+    }
+  );
+});
diff --git a/source/renderer/app/stores/SidebarStore.ts b/source/renderer/app/stores/SidebarStore.ts
index 36e40f0b75..f2dd4d150e 100644
--- a/source/renderer/app/stores/SidebarStore.ts
+++ b/source/renderer/app/stores/SidebarStore.ts
@@ -1,9 +1,15 @@
 import { action, computed, observable } from 'mobx';
 import { get } from 'lodash';
-import Store from './lib/Store';
 import { sidebarConfig } from '../config/sidebarConfig';
 import type { SidebarCategoryInfo } from '../config/sidebarConfig';
-import type { SidebarWalletType } from '../types/sidebarTypes';
+import type {
+  SidebarWalletType,
+  WalletSortConfig,
+  WalletSortByOptions,
+} from '../types/sidebarTypes';
+import { WalletSortBy, WalletSortOrder } from '../types/sidebarTypes';
+import { changeWalletSorting, sortWallets } from '../utils/walletSorting';
+import Store from './lib/Store';
 
 export default class SidebarStore extends Store {
   @observable
@@ -12,6 +18,13 @@ export default class SidebarStore extends Store {
   activeSidebarCategory: string = this.CATEGORIES[0].route;
   @observable
   isShowingSubMenus = true;
+  @observable
+  walletSortConfig: WalletSortConfig = {
+    sortBy: WalletSortBy.Date,
+    sortOrder: WalletSortOrder.Asc,
+  };
+  @observable
+  searchValue = '';
 
   setup() {
     const { sidebar: sidebarActions } = this.actions;
@@ -37,7 +50,18 @@ export default class SidebarStore extends Store {
     const { networkStatus, wallets, walletSettings, hardwareWallets } =
       this.stores;
     const { hardwareWalletsConnectionData } = hardwareWallets;
-    return wallets.all.map((wallet) => {
+    const shelleyWallets = sortWallets({
+      wallets: wallets.all.filter((w) => !w.isLegacy),
+      sortOrder: this.walletSortConfig.sortOrder,
+      sortBy: this.walletSortConfig.sortBy,
+    });
+    const byronWallets = sortWallets({
+      wallets: wallets.all.filter((w) => w.isLegacy),
+      sortOrder: this.walletSortConfig.sortOrder,
+      sortBy: this.walletSortConfig.sortBy,
+    });
+    const sortedWallets = [...shelleyWallets, ...byronWallets];
+    return sortedWallets.map((wallet) => {
       const isHardwareWalletDisconnected = get(
         hardwareWalletsConnectionData,
         [wallet.id, 'disconnected'],
@@ -61,6 +85,18 @@ export default class SidebarStore extends Store {
     });
   }
 
+  @action
+  onChangeWalletSortType = (sortBy: WalletSortByOptions) => {
+    this.walletSortConfig = changeWalletSorting({
+      sortBy,
+      sortOrder: this.walletSortConfig.sortOrder,
+      currentSortBy: this.walletSortConfig.sortBy,
+    });
+  };
+  @action
+  onSearchValueUpdated = (searchValue: string) => {
+    this.searchValue = searchValue;
+  };
   @action
   _configureCategories = () => {
     const {
diff --git a/source/renderer/app/stores/StakingStore.ts b/source/renderer/app/stores/StakingStore.ts
index 39d2ecc357..b93424dc43 100644
--- a/source/renderer/app/stores/StakingStore.ts
+++ b/source/renderer/app/stores/StakingStore.ts
@@ -54,6 +54,8 @@ export default class StakingStore extends Store {
   smashServerUrlError: LocalizableError | null | undefined = null;
   @observable
   smashServerLoading = false;
+  @observable
+  stakePoolsListViewTooltipVisible = true;
 
   /* ----------  Redeem ITN Rewards  ---------- */
   @observable
@@ -101,8 +103,11 @@ export default class StakingStore extends Store {
   _delegationFeeCalculationWalletId: string | null | undefined = null;
 
   setup() {
-    const { staking: stakingActions, networkStatus: networkStatusActions } =
-      this.actions;
+    const {
+      staking: stakingActions,
+      networkStatus: networkStatusActions,
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Staking... Remove this comment to see the full error message
+    } = this.actions;
     this.refreshPolling = setInterval(
       this.getStakePoolsData,
       STAKE_POOLS_FAST_INTERVAL
@@ -136,45 +141,55 @@ export default class StakingStore extends Store {
     stakingActions.setStakingInfoWasOpen.listen(this._setStakingInfoWasOpen);
     networkStatusActions.isSyncedAndReady.listen(this._getSmashSettingsRequest);
     // ========== MOBX REACTIONS =========== //
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'registerReactions' does not exist on typ... Remove this comment to see the full error message
     this.registerReactions([this._pollOnSync]);
 
     this._startStakePoolsFetchTracker();
 
     this._getStakingInfoWasOpen();
+    this._getStakePoolsListViewTooltip();
   }
 
   // REQUESTS
   @observable
   joinStakePoolRequest: Request<JoinStakePoolRequest> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.joinStakePool
   );
   @observable
   quitStakePoolRequest: Request<QuitStakePoolRequest> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.quitStakePool
   );
   @observable
   stakePoolsRequest: Request<Array<StakePool>> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.getStakePools
   );
   @observable
   calculateDelegationFeeRequest: Request<DelegationCalculateFeeResponse> = new Request(
+  // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.calculateDelegationFee
   );
   // @REDEEM TODO: Proper type it when the API endpoint is implemented.
   @observable
   getRedeemItnRewardsFeeRequest: Request<any> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.getRedeemItnRewardsFee
   );
   @observable
   requestRedeemItnRewardsRequest: Request<any> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.requestRedeemItnRewards
   );
   @observable
   getSmashSettingsRequest: Request<any> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.getSmashSettings
   );
   @observable
   updateSmashSettingsRequest: Request<PoolMetadataSource> = new Request(
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.ada.updateSmashSettings
   );
   // =================== PUBLIC API ==================== //
@@ -183,6 +198,7 @@ export default class StakingStore extends Store {
     this.smashServerLoading = true;
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     let smashServerUrl: string = await this.getSmashSettingsRequest.execute();
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     const localSmashServer = await this.api.localStorage.getSmashServer();
 
     // If the server wasn't set, sets it for IOHK
@@ -192,6 +208,7 @@ export default class StakingStore extends Store {
       (smashServerUrl === SMASH_SERVER_TYPES.DIRECT &&
         localSmashServer !== SMASH_SERVER_TYPES.DIRECT)
     ) {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'environment' does not exist on type 'Sta... Remove this comment to see the full error message
       smashServerUrl = this.environment.isSelfnode
         ? SMASH_SERVERS_LIST.direct.url
         : SMASH_SERVERS_LIST.iohk.url;
@@ -245,6 +262,7 @@ export default class StakingStore extends Store {
           this.smashServerLoading = false;
         });
         // Update
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
         await this.api.localStorage.setSmashServer(smashServerUrl);
       } catch (error) {
         runInAction(() => {
@@ -267,6 +285,7 @@ export default class StakingStore extends Store {
   };
   @action
   _getStakingInfoWasOpen = async () => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     const stakingInfoWasOpen =
       await this.api.localStorage.getStakingInfoWasOpen();
     runInAction(() => {
@@ -276,9 +295,25 @@ export default class StakingStore extends Store {
   @action
   _setStakingInfoWasOpen = () => {
     this.stakingInfoWasOpen = true;
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'api' does not exist on type 'StakingStor... Remove this comment to see the full error message
     this.api.localStorage.setStakingInfoWasOpen();
   };
   @action
+  _getStakePoolsListViewTooltip = async () => {
+    const tooltipShown =
+      await this.api.localStorage.getStakePoolsListViewTooltip();
+    runInAction(() => {
+      this.stakePoolsListViewTooltipVisible = tooltipShown;
+    });
+  };
+  @action
+  hideStakePoolsListViewTooltip = () => {
+    this.stakePoolsListViewTooltipVisible = false;
+    this.api.localStorage.setStakePoolsListViewTooltip(
+      this.stakePoolsListViewTooltipVisible
+    );
+  };
+  @action
   _stakePoolsFetchTracker = () => {
     const lastNumberOfStakePoolsFetched = this.numberOfStakePoolsFetched;
     this.numberOfStakePoolsFetched = this.stakePools.length;
@@ -321,6 +356,7 @@ export default class StakingStore extends Store {
       let joinTransaction;
 
       if (isHardwareWallet) {
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
         joinTransaction = await this.stores.hardwareWallets._sendMoney({
           isDelegationTransaction: true,
           selectedWalletId: walletId,
@@ -362,6 +398,7 @@ export default class StakingStore extends Store {
       let quitTransaction;
 
       if (isHardwareWallet) {
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
         quitTransaction = await this.stores.hardwareWallets._sendMoney({
           isDelegationTransaction: true,
           selectedWalletId: walletId,
@@ -400,6 +437,7 @@ export default class StakingStore extends Store {
   }) => {
     const { transactionId, walletId } = request;
 
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const recentTransactionsResponse =
       this.stores.transactions._getTransactionsRecentRequest(walletId).result;
 
@@ -427,6 +465,7 @@ export default class StakingStore extends Store {
     }
 
     // this.stores.hardwareWallets._resetTransaction();
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     this.stores.wallets.refreshWalletsData();
     this.isDelegationTransactionPending = false;
   };
@@ -439,6 +478,7 @@ export default class StakingStore extends Store {
     filenamePrefix: string;
   }) => {
     const {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Staking... Remove this comment to see the full error message
       actions: { wallets },
     } = this;
     const fileName = generateFileNameWithTimestamp({
@@ -446,6 +486,7 @@ export default class StakingStore extends Store {
       extension: 'csv',
       isUTC: true,
     });
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const { desktopDirectoryPath } = this.stores.profile;
     const defaultPath = path.join(desktopDirectoryPath, fileName);
     const params = {
@@ -463,13 +504,14 @@ export default class StakingStore extends Store {
       fileContent,
       filePath,
     });
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Staking... Remove this comment to see the full error message
     this.actions.staking.requestCSVFileSuccess.trigger();
   };
   calculateDelegationFee = async (
     delegationFeeRequest: GetDelegationFeeRequest
   ): Promise<DelegationCalculateFeeResponse | null | undefined> => {
     const { walletId } = delegationFeeRequest;
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const wallet = this.stores.wallets.getWalletById(walletId);
     this._delegationFeeCalculationWalletId = walletId;
 
@@ -503,6 +545,7 @@ export default class StakingStore extends Store {
   // GETTERS
   @computed
   get currentRoute(): string {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     return this.stores.router.location.pathname;
   }
 
@@ -513,6 +556,7 @@ export default class StakingStore extends Store {
 
   @computed
   get maxDelegationFunds(): number {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const { desiredPoolNumber } = this.stores.networkStatus;
     return Math.round(CIRCULATING_SUPPLY / desiredPoolNumber);
   }
@@ -525,6 +569,7 @@ export default class StakingStore extends Store {
   @computed
   get recentStakePools(): Array<StakePool> {
     const delegatedStakePools = [];
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     map(this.stores.wallets.all, (wallet) => {
       const hasPendingDelegations =
         wallet.pendingDelegations && wallet.pendingDelegations.length > 0;
@@ -562,20 +607,41 @@ export default class StakingStore extends Store {
 
   @computed
   get rewards(): Array<Reward> {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const { wallets } = this.stores;
-    return wallets.allWallets.map(this._transformWalletToReward);
+    return wallets.allWallets.map((w) => this.getRewardForWallet(w));
+  }
+
+  getRewardForWallet(wallet: Wallet): Reward {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
+    const { transactions, addresses } = this.stores;
+    const rewardsAddress = addresses.stakeAddresses[wallet.id];
+    const syncingProgress = get(wallet.syncState, 'progress.quantity', '');
+    return {
+      wallet: wallet.name,
+      total: wallet.reward.plus(transactions.withdrawals[wallet.id]),
+      unspent: wallet.reward,
+      isRestoring: wallet.isRestoring,
+      syncingProgress,
+      rewardsAddress,
+    };
   }
 
   @action
   showCountdown(): boolean {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const { isShelleyPending } = this.stores.networkStatus;
     return isShelleyPending;
   }
 
   @action
   getStakePoolsData = async (isSmash?: boolean) => {
-    const { isConnected, isSynced, isShelleyActivated } =
-      this.stores.networkStatus;
+    const {
+      isConnected,
+      isSynced,
+      isShelleyActivated,
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
+    } = this.stores.networkStatus;
 
     if (!isShelleyActivated || !isConnected || !isSynced) {
       this._resetIsRanking();
@@ -653,6 +719,7 @@ export default class StakingStore extends Store {
   // For testing only
   @action
   _setFakePoller = (forceLoading: boolean) => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const { stores, environment } = this;
     const { networkStatus, wallets } = stores;
     const { isConnected } = networkStatus;
@@ -695,6 +762,7 @@ export default class StakingStore extends Store {
   // For testing only
   @action
   _setFakedStakePools = () => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'environment' does not exist on type 'Sta... Remove this comment to see the full error message
     if (this.environment.isDev) {
       if (this.refreshPolling) {
         clearInterval(this.refreshPolling);
@@ -762,11 +830,13 @@ export default class StakingStore extends Store {
     walletId: string;
     recoveryPhrase: Array<string>;
   }) => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     this.redeemWallet = this.stores.wallets.getWalletById(walletId);
     this.redeemRecoveryPhrase = recoveryPhrase;
     this.isCalculatingReedemFees = true;
 
     try {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
       const [address] = await this.stores.addresses.getAddressesByWalletId(
         walletId
       );
@@ -819,6 +889,7 @@ export default class StakingStore extends Store {
     const { id: walletId } = redeemWallet;
 
     try {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
       const [address] = await this.stores.addresses.getAddressesByWalletId(
         walletId
       );
@@ -854,6 +925,7 @@ export default class StakingStore extends Store {
   _onResultContinue = () => {
     if (!this.redeemWallet) throw new Error('Redeem wallet require');
     const { id } = this.redeemWallet;
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     this.stores.wallets.goToWalletRoute(id);
     this.redeemStep = null;
 
@@ -879,6 +951,7 @@ export default class StakingStore extends Store {
   };
   // ================= REACTIONS ==================
   _pollOnSync = () => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'StakingS... Remove this comment to see the full error message
     const { isSynced, isShelleyActivated } = this.stores.networkStatus;
 
     if (isSynced && isShelleyActivated) {
@@ -892,36 +965,17 @@ export default class StakingStore extends Store {
 
   /* ====  End of Redeem ITN Rewards  ===== */
   _goToStakingInfoPage = () => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Staking... Remove this comment to see the full error message
     this.actions.router.goToRoute.trigger({
       route: ROUTES.STAKING.INFO,
     });
   };
   _goToStakingDelegationCenterPage = () => {
+    // @ts-ignore ts-migrate(2339) FIXME: Property 'actions' does not exist on type 'Staking... Remove this comment to see the full error message
     this.actions.router.goToRoute.trigger({
       route: ROUTES.STAKING.DELEGATION_CENTER,
     });
   };
-  _transformWalletToReward = (inputWallet: Wallet) => {
-    const {
-      id: walletId,
-      name: wallet,
-      isRestoring,
-      reward: rewards,
-      syncState,
-    } = inputWallet;
-    const { stakeAddresses } = this.stores.addresses;
-    const { withdrawals } = this.stores.transactions;
-    const reward = rewards.plus(withdrawals[walletId]);
-    const rewardsAddress = stakeAddresses[walletId];
-    const syncingProgress = get(syncState, 'progress.quantity', '');
-    return {
-      wallet,
-      reward,
-      isRestoring,
-      syncingProgress,
-      rewardsAddress,
-    };
-  };
   getStakePoolById = (stakePoolId: string) =>
     this.stakePools.find(({ id }: StakePool) => id === stakePoolId);
 }
diff --git a/source/renderer/app/stores/VotingStore.spec.ts b/source/renderer/app/stores/VotingStore.spec.ts
index d078b5307c..89d0fb292b 100644
--- a/source/renderer/app/stores/VotingStore.spec.ts
+++ b/source/renderer/app/stores/VotingStore.spec.ts
@@ -1,12 +1,16 @@
 import type { Api } from '../api/index';
 import type { ActionsMap } from '../actions/index';
-import VotingStore, { FundPhases } from './VotingStore';
-import {
-  VOTING_CAST_END_DATE,
-  VOTING_CAST_START_DATE,
-  VOTING_RESULTS_DATE,
-  VOTING_SNAPSHOT_DATE,
-} from '../config/votingConfig';
+import VotingStore, { FundPhase } from './VotingStore';
+import type { CatalystFund } from '../api/voting/types';
+
+const mockFundInfo = {
+  current: {
+    startTime: new Date('Jan 20, 2022, 11:00 UTC'),
+    endTime: new Date('Feb 3, 2022, 11:00 UTC'),
+    resultsTime: new Date('Feb 10, 2022'),
+    registrationSnapshotTime: new Date('Jan 6, 2022, 11:00 UTC'),
+  },
+};
 
 describe('VotingStore', () => {
   const api: Api = {
@@ -14,22 +18,38 @@ describe('VotingStore', () => {
   } as any;
   const actions: ActionsMap = jest.fn() as any;
   const cases = [
-    [new Date(VOTING_SNAPSHOT_DATE.getTime() - 60000), FundPhases.SNAPSHOT],
-    [VOTING_SNAPSHOT_DATE, FundPhases.SNAPSHOT],
-    [new Date(VOTING_CAST_START_DATE.getTime() - 60000), FundPhases.SNAPSHOT],
-    [VOTING_CAST_START_DATE, FundPhases.VOTING],
-    [new Date(VOTING_CAST_END_DATE.getTime() - 60000), FundPhases.VOTING],
-    [VOTING_CAST_END_DATE, FundPhases.TALLYING],
-    [new Date(VOTING_RESULTS_DATE.getTime() - 60000), FundPhases.TALLYING],
-    [VOTING_RESULTS_DATE, FundPhases.RESULTS],
+    [undefined, null],
+    [
+      new Date(mockFundInfo.current.registrationSnapshotTime.getTime() - 60000),
+      FundPhase.SNAPSHOT,
+    ],
+    [mockFundInfo.current.registrationSnapshotTime, FundPhase.SNAPSHOT],
+    [
+      new Date(mockFundInfo.current.startTime.getTime() - 60000),
+      FundPhase.SNAPSHOT,
+    ],
+    [mockFundInfo.current.startTime, FundPhase.VOTING],
+    [
+      new Date(mockFundInfo.current.endTime.getTime() - 60000),
+      FundPhase.VOTING,
+    ],
+    [mockFundInfo.current.endTime, FundPhase.TALLYING],
+    [
+      new Date(mockFundInfo.current.resultsTime.getTime() - 60000),
+      FundPhase.TALLYING,
+    ],
+    [mockFundInfo.current.resultsTime, FundPhase.RESULTS],
   ];
+  const votingStore = new VotingStore(api, actions);
+
+  beforeAll(() => {
+    votingStore.catalystFund = mockFundInfo as CatalystFund;
+  });
+
   test.each(cases)(
     `should have correct fund phase for date %s - %s phase`,
-    (date, expected) => {
-      const votingStore = new VotingStore(api, actions);
-
+    (date: Date, expected: FundPhase) => {
       votingStore._checkFundPhase(date);
-
       expect(votingStore.fundPhase).toEqual(expected);
     }
   );
diff --git a/source/renderer/app/stores/VotingStore.ts b/source/renderer/app/stores/VotingStore.ts
index 2a36b31bfb..17bc673cd4 100644
--- a/source/renderer/app/stores/VotingStore.ts
+++ b/source/renderer/app/stores/VotingStore.ts
@@ -1,4 +1,4 @@
-import { action, computed, observable } from 'mobx';
+import { action, computed, observable, runInAction } from 'mobx';
 import { get } from 'lodash';
 import Store from './lib/Store';
 import Request from './lib/LocalizedRequest';
@@ -10,13 +10,9 @@ import {
 import { formattedArrayBufferToHexString } from '../utils/formatters';
 import walletUtils from '../utils/walletUtils';
 import {
-  VOTING_CAST_START_DATE,
-  VOTING_CAST_END_DATE,
-  VOTING_RESULTS_DATE,
   VOTING_PHASE_CHECK_INTERVAL,
   VOTING_REGISTRATION_TRANSACTION_POLLING_INTERVAL,
   VOTING_REGISTRATION_MIN_TRANSACTION_CONFIRMATIONS,
-  NEXT_VOTING_FUND_NUMBER,
 } from '../config/votingConfig';
 import { votingPDFGenerator } from '../utils/votingPDFGenerator';
 import { i18nContext } from '../utils/i18nContext';
@@ -25,7 +21,7 @@ import type {
   GetTransactionRequest,
   VotingMetadataType,
 } from '../api/transactions/types';
-import { EnumMap } from '../types/enumTypes';
+import type { CatalystFund } from '../api/voting/types';
 
 export type VotingRegistrationKeyType = {
   bytes: (...args: Array<any>) => any;
@@ -41,14 +37,13 @@ export type VotingDataType = {
   metadata: VotingMetadataType;
   absoluteSlotNumber: number;
 };
-export type FundPhase = 'snapshot' | 'voting' | 'tallying' | 'results';
 
-export const FundPhases: EnumMap<string, FundPhase> = {
-  SNAPSHOT: 'snapshot',
-  VOTING: 'voting',
-  TALLYING: 'tallying',
-  RESULTS: 'results',
-};
+export enum FundPhase {
+  SNAPSHOT = 'snapshot',
+  VOTING = 'voting',
+  TALLYING = 'tallying',
+  RESULTS = 'results',
+}
 export default class VotingStore extends Store {
   @observable
   registrationStep = 1;
@@ -69,7 +64,9 @@ export default class VotingStore extends Store {
   @observable
   isConfirmationDialogOpen = false;
   @observable
-  fundPhase: FundPhase = FundPhases.SNAPSHOT;
+  fundPhase?: FundPhase;
+  @observable
+  catalystFund: CatalystFund;
   // @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'IntervalID'.
   transactionPollingInterval: IntervalID | null | undefined = null;
   // @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'IntervalID'.
@@ -89,9 +86,20 @@ export default class VotingStore extends Store {
     votingActions.showConfirmationDialog.listen(this._showConfirmationDialog);
     votingActions.closeConfirmationDialog.listen(this._closeConfirmationDialog);
 
-    this._initializeFundPhaseInterval();
+    this._setupFund();
   }
 
+  @action
+  _setupFund = async () => {
+    await this.getCatalystFundRequest.execute().promise;
+    this._initializeFundPhaseInterval();
+
+    runInAction('Initialize fund', () => {
+      this.catalystFund = this.getCatalystFundRequest.result;
+      this._checkFundPhase(new Date());
+    });
+  };
+
   // REQUESTS
   @observable
   getWalletPublicKeyRequest: Request<string> = new Request(
@@ -109,6 +117,11 @@ export default class VotingStore extends Store {
   getTransactionRequest: Request<GetTransactionRequest> = new Request(
     this.api.ada.getTransaction
   );
+  @observable
+  getCatalystFundRequest: Request<CatalystFund> = new Request(
+    this.api.ada.getCatalystFund
+  );
+
   // ACTIONS
   @action
   _showConfirmationDialog = () => {
@@ -333,8 +346,8 @@ export default class VotingStore extends Store {
           index,
           absoluteSlotNumber,
         });
+        // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
         transaction =
-          // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
           await this.createVotingRegistrationTransactionRequest.execute({
             address: address.id,
             addressHex: stakeAddressHex,
@@ -398,7 +411,7 @@ export default class VotingStore extends Store {
     const { desktopDirectoryPath } = this.stores.profile;
     const { currentLocale, currentDateFormat, currentTimeFormat } =
       this.stores.profile;
-    const nextVotingFundNumber = NEXT_VOTING_FUND_NUMBER;
+    const nextVotingFundNumber = this.catalystFund?.next?.number;
     const { network, isMainnet } = this.environment;
     const intl = i18nContext(currentLocale);
 
@@ -422,12 +435,14 @@ export default class VotingStore extends Store {
     }
   };
   _checkVotingRegistrationTransaction = async () => {
-    const { confirmations, state }: WalletTransaction =
-      // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
-      await this.getTransactionRequest.execute({
-        walletId: this.selectedWalletId,
-        transactionId: this.transactionId,
-      });
+    const {
+      confirmations,
+      state,
+    }: // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
+    WalletTransaction = await this.getTransactionRequest.execute({
+      walletId: this.selectedWalletId,
+      transactionId: this.transactionId,
+    });
 
     // Update voting registration confirmations count
     if (this.transactionConfirmations !== confirmations) {
@@ -453,17 +468,20 @@ export default class VotingStore extends Store {
   @action
   _checkFundPhase = (now: Date) => {
     const phaseValidation = {
-      [FundPhases.SNAPSHOT]: (date: Date) => date < VOTING_CAST_START_DATE,
-      [FundPhases.VOTING]: (date: Date) =>
-        now >= VOTING_CAST_START_DATE && date < VOTING_CAST_END_DATE,
-      [FundPhases.TALLYING]: (date: Date) =>
-        now >= VOTING_CAST_END_DATE && date < VOTING_RESULTS_DATE,
-      [FundPhases.RESULTS]: (date: Date) => date >= VOTING_RESULTS_DATE,
+      [FundPhase.SNAPSHOT]: (date: Date) =>
+        date < this.catalystFund?.current?.startTime,
+      [FundPhase.VOTING]: (date: Date) =>
+        date >= this.catalystFund?.current?.startTime &&
+        date < this.catalystFund?.current?.endTime,
+      [FundPhase.TALLYING]: (date: Date) =>
+        date >= this.catalystFund?.current?.endTime &&
+        date < this.catalystFund?.current?.resultsTime,
+      [FundPhase.RESULTS]: (date: Date) =>
+        date >= this.catalystFund?.current?.resultsTime,
     };
     this.fundPhase =
-      Object.keys(FundPhases)
-        .map((key) => FundPhases[key])
-        .find((phase) => phaseValidation[phase](now)) || FundPhases.SNAPSHOT;
+      Object.values(FundPhase).find((phase) => phaseValidation[phase](now)) ||
+      null;
   };
   _generateVotingRegistrationKey = async () => {
     const { Ed25519ExtendedPrivate: extendedPrivateKey } = await walletUtils;
diff --git a/source/renderer/app/stores/WalletsStore.ts b/source/renderer/app/stores/WalletsStore.ts
index 235f4b336b..19243d2396 100644
--- a/source/renderer/app/stores/WalletsStore.ts
+++ b/source/renderer/app/stores/WalletsStore.ts
@@ -57,7 +57,6 @@ import type {
   HardwareWalletExtendedPublicKeyResponse,
 } from '../../../common/types/hardware-wallets.types';
 import { NetworkMagics } from '../../../common/types/cardano-node.types';
-
 /* eslint-disable consistent-return */
 
 /**
@@ -66,140 +65,188 @@ import { NetworkMagics } from '../../../common/types/cardano-node.types';
 
 export default class WalletsStore extends Store {
   WALLET_REFRESH_INTERVAL = 5000;
-
-  @observable undelegateWalletSubmissionSuccess: boolean | null | undefined =
-    null;
-
-  @observable isAddressFromSameWallet = false;
-
+  @observable
+  undelegateWalletSubmissionSuccess: boolean | null | undefined = null;
+  @observable
+  isAddressFromSameWallet = false;
   // REQUESTS
-  @observable walletsRequest: Request<Array<Wallet>> = new Request(
-    this.api.ada.getWallets
-  );
-  @observable accountPublicKeyRequest: Request<string> = new Request(
+  @observable
+  walletsRequest: Request<Array<Wallet>> = new Request(this.api.ada.getWallets);
+  @observable
+  accountPublicKeyRequest: Request<string> = new Request(
     this.api.ada.getAccountPublicKey
   );
-  @observable icoPublicKeyRequest: Request<string> = new Request(
+  @observable
+  icoPublicKeyRequest: Request<string> = new Request(
     this.api.ada.getICOPublicKey
   );
-  @observable importFromFileRequest: Request<Wallet> = new Request(
+  @observable
+  importFromFileRequest: Request<Wallet> = new Request(
     this.api.ada.importWalletFromFile
   );
-  @observable createWalletRequest: Request<Wallet> = new Request(
-    this.api.ada.createWallet
-  );
+  @observable
+  createWalletRequest: Request<Wallet> = new Request(this.api.ada.createWallet);
   @observable
   getWalletAddressesRequest: Request<Array<WalletAddress>> = new Request(
     this.api.ada.getAddresses
   );
-  @observable deleteWalletRequest: Request<boolean> = new Request(
+  @observable
+  deleteWalletRequest: Request<boolean> = new Request(
     this.api.ada.deleteWallet
   );
-  @observable sendMoneyRequest: Request<WalletTransaction> = new Request(
+  @observable
+  sendMoneyRequest: Request<WalletTransaction> = new Request(
     this.api.ada.createTransaction
   );
-  @observable getWalletRecoveryPhraseRequest: Request<Array<string>> =
-    new Request(this.api.ada.getWalletRecoveryPhrase);
-  @observable getWalletCertificateAdditionalMnemonicsRequest: Request<
-    Array<string>
-  > = new Request(this.api.ada.getWalletCertificateAdditionalMnemonics);
-  @observable getWalletCertificateRecoveryPhraseRequest: Request<
-    Array<string>
-  > = new Request(this.api.ada.getWalletCertificateRecoveryPhrase);
-  @observable getWalletRecoveryPhraseFromCertificateRequest: Request<
-    Array<string>
-  > = new Request(this.api.ada.getWalletRecoveryPhraseFromCertificate);
-  @observable restoreDaedalusRequest: Request<Wallet> = new Request(
+  @observable
+  getWalletRecoveryPhraseRequest: Request<Array<string>> = new Request(
+    this.api.ada.getWalletRecoveryPhrase
+  );
+  @observable
+  getWalletCertificateAdditionalMnemonicsRequest: Request<Array<string>> =
+    new Request(this.api.ada.getWalletCertificateAdditionalMnemonics);
+  @observable
+  getWalletCertificateRecoveryPhraseRequest: Request<Array<string>> =
+    new Request(this.api.ada.getWalletCertificateRecoveryPhrase);
+  @observable
+  getWalletRecoveryPhraseFromCertificateRequest: Request<Array<string>> =
+    new Request(this.api.ada.getWalletRecoveryPhraseFromCertificate);
+  @observable
+  restoreDaedalusRequest: Request<Wallet> = new Request(
     this.api.ada.restoreWallet
   );
-  @observable restoreLegacyRequest: Request<Wallet> = new Request(
+  @observable
+  restoreLegacyRequest: Request<Wallet> = new Request(
     this.api.ada.restoreLegacyWallet
   );
-  @observable restoreByronRandomWalletRequest: Request<Wallet> = new Request(
+  @observable
+  restoreByronRandomWalletRequest: Request<Wallet> = new Request(
     this.api.ada.restoreByronRandomWallet
   );
-  @observable restoreByronIcarusWalletRequest: Request<Wallet> = new Request(
+  @observable
+  restoreByronIcarusWalletRequest: Request<Wallet> = new Request(
     this.api.ada.restoreByronIcarusWallet
   );
-  @observable restoreByronTrezorWalletRequest: Request<Wallet> = new Request(
+  @observable
+  restoreByronTrezorWalletRequest: Request<Wallet> = new Request(
     this.api.ada.restoreByronTrezorWallet
   );
-  @observable restoreByronLedgerWalletRequest: Request<Wallet> = new Request(
+  @observable
+  restoreByronLedgerWalletRequest: Request<Wallet> = new Request(
     this.api.ada.restoreByronLedgerWallet
   );
   @observable
   transferFundsCalculateFeeRequest: Request<TransferFundsCalculateFeeRequest> =
     new Request(this.api.ada.transferFundsCalculateFee);
-  @observable transferFundsRequest: Request<TransferFundsRequest> = new Request(
+  @observable
+  transferFundsRequest: Request<TransferFundsRequest> = new Request(
     this.api.ada.transferFunds
   );
-  @observable createHardwareWalletRequest: Request<Wallet> = new Request(
+  @observable
+  createHardwareWalletRequest: Request<Wallet> = new Request(
     this.api.ada.createHardwareWallet
   );
 
   /* ----------  Active Wallet  ---------- */
-  @observable active: Wallet | null | undefined = null;
-  @observable activeValue: BigNumber | null | undefined = null;
-  @observable activePublicKey: string | null | undefined = null;
-  @observable icoPublicKey: string | null | undefined = null;
+  @observable
+  active: Wallet | null | undefined = null;
+  @observable
+  activeValue: BigNumber | null | undefined = null;
+  @observable
+  activePublicKey: string | null | undefined = null;
+  @observable
+  icoPublicKey: string | null | undefined = null;
+
   /* ----------  Create Wallet  ---------- */
-  @observable createWalletStep = null;
-  @observable createWalletShowAbortConfirmation = false;
+  @observable
+  createWalletStep = null;
+  @observable
+  createWalletShowAbortConfirmation = false;
   // TODO: Remove once the new wallet creation process is ready
-  @observable createWalletUseNewProcess = false;
+  @observable
+  createWalletUseNewProcess = false;
 
   /* ----------  Restore Wallet  ---------- */
-  @observable restoreWalletStep = null;
-  @observable restoreWalletShowAbortConfirmation = false;
+  @observable
+  restoreWalletStep = null;
+  @observable
+  restoreWalletShowAbortConfirmation = false;
   // STEP: WALLET TYPE
-  @observable walletKind: WalletKind | null | undefined = null;
-  @observable walletKindDaedalus: WalletDaedalusKind | null | undefined = null;
-  @observable walletKindYoroi: WalletYoroiKind | null | undefined = null;
-  @observable walletKindHardware: WalletHardwareKind | null | undefined = null;
+  @observable
+  walletKind: WalletKind | null | undefined = null;
+  @observable
+  walletKindDaedalus: WalletDaedalusKind | null | undefined = null;
+  @observable
+  walletKindYoroi: WalletYoroiKind | null | undefined = null;
+  @observable
+  walletKindHardware: WalletHardwareKind | null | undefined = null;
   // STEP: RECOVERY PHRASE
-  @observable mnemonics: Array<string> = [];
+  @observable
+  mnemonics: Array<string> = [];
   // STEP: CONFIGURATION
-  @observable walletName = '';
-  @observable spendingPassword = '';
-  @observable repeatPassword = '';
+  @observable
+  walletName = '';
+  @observable
+  spendingPassword = '';
+  @observable
+  repeatPassword = '';
   // TODO: Remove once the new restore creation process is ready
-  @observable restoreWalletUseNewProcess = true;
-  @observable restoredWallet: Wallet | null | undefined = null;
+  @observable
+  restoreWalletUseNewProcess = true;
+  @observable
+  restoredWallet: Wallet | null | undefined = null;
 
   /* ----------  Export Wallet  ---------- */
-  @observable walletExportType: WalletExportTypeChoices = 'paperWallet';
-  @observable walletExportMnemonic =
-    'marine joke dry silk ticket thing sugar stereo aim';
+  @observable
+  walletExportType: WalletExportTypeChoices = 'paperWallet';
+  @observable
+  walletExportMnemonic = 'marine joke dry silk ticket thing sugar stereo aim';
 
   /* ----------  Delete Wallet  ---------- */
-  @observable isDeleting = false;
+  @observable
+  isDeleting = false;
+
   /* ----------  Restore Wallet  ---------- */
-  @observable isRestoring = false;
+  @observable
+  isRestoring = false;
 
   /* ----------  Paper Wallet  ---------- */
-  @observable createPaperWalletCertificateStep = 0;
-  @observable walletCertificatePassword = null;
-  @observable walletCertificateAddress = null;
-  @observable walletCertificateRecoveryPhrase = null;
-  @observable generatingCertificateInProgress = false;
-  @observable generatingCertificateError: LocalizableError | null | undefined =
-    null;
-  @observable generatingRewardsCsvInProgress = false;
-  @observable generatingRewardsCsvError: LocalizableError | null | undefined =
-    null;
-  @observable certificateStep = null;
-  @observable certificateTemplate = null;
-  @observable additionalMnemonicWords = null;
+  @observable
+  createPaperWalletCertificateStep = 0;
+  @observable
+  walletCertificatePassword = null;
+  @observable
+  walletCertificateAddress = null;
+  @observable
+  walletCertificateRecoveryPhrase = null;
+  @observable
+  generatingCertificateInProgress = false;
+  @observable
+  generatingCertificateError: LocalizableError | null | undefined = null;
+  @observable
+  generatingRewardsCsvInProgress = false;
+  @observable
+  generatingRewardsCsvError: LocalizableError | null | undefined = null;
+  @observable
+  certificateStep = null;
+  @observable
+  certificateTemplate = null;
+  @observable
+  additionalMnemonicWords = null;
 
   /* ----------  Transfer Funds  ---------- */
-  @observable transferFundsSourceWalletId = '';
-  @observable transferFundsTargetWalletId = '';
-  @observable transferFundsStep = 0;
-  @observable transferFundsFee: BigNumber | null | undefined = null;
-  @observable transferFundsLeftovers: BigNumber | null | undefined = null;
+  @observable
+  transferFundsSourceWalletId = '';
+  @observable
+  transferFundsTargetWalletId = '';
+  @observable
+  transferFundsStep = 0;
+  @observable
+  transferFundsFee: BigNumber | null | undefined = null;
+  @observable
+  transferFundsLeftovers: BigNumber | null | undefined = null;
 
   /* ----------  Other  ---------- */
-
   _newWalletDetails: {
     name: string;
     mnemonic: string;
@@ -213,9 +260,7 @@ export default class WalletsStore extends Store {
 
   setup() {
     setInterval(this._pollRefresh, this.WALLET_REFRESH_INTERVAL);
-
     this.registerReactions([this._updateActiveWalletOnRouteChanges]);
-
     const {
       router,
       walletBackup,
@@ -223,7 +268,6 @@ export default class WalletsStore extends Store {
       app,
       networkStatus,
     } = this.actions;
-
     // Create Wallet Actions ---
     walletsActions.createWallet.listen(this._create);
     walletsActions.createWalletBegin.listen(this._createWalletBegin);
@@ -231,7 +275,6 @@ export default class WalletsStore extends Store {
     walletsActions.createWalletAbort.listen(this._createWalletAbort);
     walletsActions.createWalletClose.listen(this._createWalletClose);
     walletsActions.createHardwareWallet.listen(this._createHardwareWallet);
-
     // ---
     // Restore Wallet Actions ---
     walletsActions.restoreWallet.listen(this._restore);
@@ -259,7 +302,6 @@ export default class WalletsStore extends Store {
     walletsActions.chooseWalletExportType.listen(this._chooseWalletExportType);
     walletsActions.getAccountPublicKey.listen(this._getAccountPublicKey);
     walletsActions.getICOPublicKey.listen(this._getICOPublicKey);
-
     walletsActions.generateCertificate.listen(this._generateCertificate);
     walletsActions.generateAddressPDF.listen(this._generateAddressPDF);
     walletsActions.saveQRCodeImage.listen(this._saveQRCodeImage);
@@ -267,12 +309,10 @@ export default class WalletsStore extends Store {
     walletsActions.closeCertificateGeneration.listen(
       this._closeCertificateGeneration
     );
-
     walletsActions.generateCsv.listen(this._generateCsv);
     walletsActions.closeRewardsCsvGeneration.listen(
       this._closeRewardsCsvGeneration
     );
-
     walletsActions.setCertificateTemplate.listen(this._setCertificateTemplate);
     walletsActions.finishCertificate.listen(this._finishCertificate);
     walletsActions.finishRewardsCsv.listen(this._finishRewardsCsv);
@@ -297,7 +337,8 @@ export default class WalletsStore extends Store {
     );
   }
 
-  @action _getAccountPublicKey = async ({
+  @action
+  _getAccountPublicKey = async ({
     spendingPassword: passphrase,
   }: {
     spendingPassword: string;
@@ -324,8 +365,8 @@ export default class WalletsStore extends Store {
       throw error;
     }
   };
-
-  @action _getICOPublicKey = async ({
+  @action
+  _getICOPublicKey = async ({
     spendingPassword: passphrase,
   }: {
     spendingPassword: string;
@@ -338,6 +379,7 @@ export default class WalletsStore extends Store {
     const index = '0H';
     const format = 'extended';
     const purpose = '1854H';
+
     try {
       const icoPublicKey = await this.icoPublicKeyRequest.execute({
         walletId,
@@ -355,12 +397,13 @@ export default class WalletsStore extends Store {
       throw error;
     }
   };
-
   _create = async (params: { name: string; spendingPassword: string }) => {
     Object.assign(this._newWalletDetails, params);
+
     try {
       const recoveryPhrase: Array<string> | null | undefined =
         await this.getWalletRecoveryPhraseRequest.execute().promise;
+
       if (recoveryPhrase != null) {
         this.actions.walletBackup.initiateWalletBackup.trigger({
           recoveryPhrase,
@@ -370,87 +413,96 @@ export default class WalletsStore extends Store {
       throw error;
     }
   };
-
   // TODO: Remove once the new wallet creation process is ready
-  @action _togglecreateWalletUseNewProcess = () => {
+  @action
+  _togglecreateWalletUseNewProcess = () => {
     this.createWalletUseNewProcess = !this.createWalletUseNewProcess;
   };
-
-  @action _createWalletBegin = () => {
+  @action
+  _createWalletBegin = () => {
     this.createWalletStep = 0;
     this.createWalletShowAbortConfirmation = false;
   };
-
-  @action _createWalletChangeStep = (isBack = false) => {
-    const currrentCreateWalletStep = this.createWalletStep || 0;
+  @action
+  _createWalletChangeStep = (isBack = false) => {
+    const currentCreateWalletStep = this.createWalletStep || 0;
     this.createWalletStep =
       isBack === true
-        ? currrentCreateWalletStep - 1
-        : currrentCreateWalletStep + 1;
+        ? currentCreateWalletStep - 1
+        : currentCreateWalletStep + 1;
     this.createWalletShowAbortConfirmation = false;
   };
-
-  @action _createWalletClose = () => {
+  @action
+  _createWalletClose = () => {
     this.createWalletStep = null;
     this.createWalletShowAbortConfirmation = false;
   };
-
-  @action _createWalletAbort = () => {
+  @action
+  _createWalletAbort = () => {
     this.createWalletShowAbortConfirmation = true;
   };
-
-  @action _restoreWalletBegin = () => {
+  @action
+  _restoreWalletBegin = () => {
     this.restoreWalletStep = 0;
     this.restoreWalletShowAbortConfirmation = false;
   };
-
-  @action _restoreWalletEnd = async () => {
+  @action
+  _restoreWalletEnd = async () => {
     this._resumePolling();
+
     const { restoredWallet } = this;
+
     if (restoredWallet) {
       await this._patchWalletRequestWithNewWallet(restoredWallet);
       this.goToWalletRoute(restoredWallet.id);
       this.refreshWalletsData();
+
       this._restoreWalletResetRequests();
+
       this._restoreWalletResetData();
     }
   };
-
-  @action _restoreWalletChangeStep = (isBack = false) => {
+  @action
+  _restoreWalletChangeStep = (isBack = false) => {
     // Reset restore requests to clear previous errors
-    const currrentRestoreWalletStep = this.restoreWalletStep || 0;
+    const currentRestoreWalletStep = this.restoreWalletStep || 0;
+
     this._restoreWalletResetRequests();
+
     if (this.restoreWalletStep === null) {
       this._restoreWalletResetData();
     }
+
     this.restoreWalletStep =
       isBack === true
-        ? currrentRestoreWalletStep - 1
-        : currrentRestoreWalletStep + 1;
+        ? currentRestoreWalletStep - 1
+        : currentRestoreWalletStep + 1;
     this.restoreWalletShowAbortConfirmation = false;
   };
-
-  @action _restoreWalletClose = () => {
+  @action
+  _restoreWalletClose = () => {
     this._resumePolling();
+
     const { mnemonics, walletName, spendingPassword } = this;
     const shouldDisplayAbortAlert =
       (mnemonics.length || walletName.length || spendingPassword.length) &&
       this.restoreWalletStep !== null &&
       this.restoreWalletStep < RESTORE_WALLET_STEPS.length - 1;
+
     if (shouldDisplayAbortAlert && !this.restoreWalletShowAbortConfirmation) {
       this.restoreWalletShowAbortConfirmation = true;
     } else {
       this._restoreWalletResetRequests();
+
       this._restoreWalletResetData();
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
+
       this.actions.dialogs.closeActiveDialog.trigger();
     }
   };
-
-  @action _restoreWalletCancelClose = () => {
+  @action
+  _restoreWalletCancelClose = () => {
     this.restoreWalletShowAbortConfirmation = false;
   };
-
   _restoreWalletResetRequests = () => {
     this.restoreDaedalusRequest.reset();
     this.restoreByronIcarusWalletRequest.reset();
@@ -459,8 +511,8 @@ export default class WalletsStore extends Store {
     this.restoreByronTrezorWalletRequest.reset();
     this.getWalletRecoveryPhraseFromCertificateRequest.reset();
   };
-
-  @action _restoreWalletResetData = () => {
+  @action
+  _restoreWalletResetData = () => {
     this.restoreWalletStep = null;
     this.restoreWalletShowAbortConfirmation = false;
     this.restoredWallet = null;
@@ -473,8 +525,8 @@ export default class WalletsStore extends Store {
     this.spendingPassword = '';
     this.repeatPassword = '';
   };
-
-  @action _restoreWalletSetKind = ({
+  @action
+  _restoreWalletSetKind = ({
     param,
     kind,
   }: {
@@ -484,16 +536,16 @@ export default class WalletsStore extends Store {
     (this as any)[`walletKind${param || ''}`] = kind;
     this.mnemonics = [];
   };
-
-  @action _restoreWalletSetMnemonics = ({
+  @action
+  _restoreWalletSetMnemonics = ({
     mnemonics,
   }: {
     mnemonics: Array<string>;
   }) => {
     this.mnemonics = mnemonics;
   };
-
-  @action _restoreWalletSetConfig = ({
+  @action
+  _restoreWalletSetConfig = ({
     param,
     value,
   }: {
@@ -508,8 +560,8 @@ export default class WalletsStore extends Store {
       this.repeatPassword = value;
     }
   };
-
-  @action _createHardwareWallet = async (params: {
+  @action
+  _createHardwareWallet = async (params: {
     walletName: string;
     extendedPublicKey: HardwareWalletExtendedPublicKeyResponse;
     device: TransportDevice;
@@ -518,7 +570,6 @@ export default class WalletsStore extends Store {
     const { deviceId, deviceType, deviceModel, deviceName, path } = device;
     const accountPublicKey =
       extendedPublicKey.publicKeyHex + extendedPublicKey.chainCodeHex;
-
     logger.debug('[HW-DEBUG] HWStore - Execute HW create / restore', {
       deviceId,
       deviceType,
@@ -543,7 +594,6 @@ export default class WalletsStore extends Store {
           disconnected: false,
         },
       });
-
       await this.stores.hardwareWallets._setHardwareWalletDevice({
         deviceId,
         data: {
@@ -551,7 +601,8 @@ export default class WalletsStore extends Store {
           deviceModel,
           deviceName,
           path,
-          paired: wallet.id, // device paired with software wallet
+          paired: wallet.id,
+          // device paired with software wallet
           disconnected: false, // device physically disconnected
         },
       });
@@ -560,7 +611,6 @@ export default class WalletsStore extends Store {
         await this._patchWalletRequestWithNewWallet(wallet);
         this.goToWalletRoute(wallet.id);
         this.refreshWalletsData();
-        // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
         this.actions.dialogs.closeActiveDialog.trigger();
       }
     } catch (error) {
@@ -569,22 +619,20 @@ export default class WalletsStore extends Store {
       this._resumePolling();
     }
   };
-
   _finishWalletBackup = async () => {
     this._newWalletDetails.mnemonic =
       this.stores.walletBackup.recoveryPhrase.join(' ');
     const wallet = await this.createWalletRequest.execute(
       this._newWalletDetails
     ).promise;
+
     if (wallet) {
       await this._patchWalletRequestWithNewWallet(wallet);
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
       this.actions.dialogs.closeActiveDialog.trigger();
       this.goToWalletRoute(wallet.id);
       this.refreshWalletsData();
     }
   };
-
   _deleteWallet = async (params: { walletId: string; isLegacy: boolean }) => {
     // Pause polling in order to avoid fetching data for wallet we are about to delete
     runInAction('AdaWalletsStore::isDeleting set', () => {
@@ -592,12 +640,14 @@ export default class WalletsStore extends Store {
     });
     await this._pausePolling();
     const walletToDelete = this.getWalletById(params.walletId);
+
     if (!walletToDelete) {
       runInAction('AdaWalletsStore::isDeleting reset', () => {
         this.isDeleting = false;
       });
       return;
     }
+
     const indexOfWalletToDelete = this.all.indexOf(walletToDelete);
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.deleteWalletRequest.execute({
@@ -608,9 +658,9 @@ export default class WalletsStore extends Store {
     await this.walletsRequest.patch((result) => {
       result.splice(indexOfWalletToDelete, 1);
     });
-
     runInAction('AdaWalletsStore::_deleteWallet', () => {
       this.isDeleting = false;
+
       if (this.hasAnyWallets) {
         const nextIndexInList = Math.max(indexOfWalletToDelete - 1, 0);
         const nextWalletInList = this.all[nextIndexInList];
@@ -623,7 +673,6 @@ export default class WalletsStore extends Store {
         });
       }
     });
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
     this.actions.dialogs.closeActiveDialog.trigger();
     this.actions.walletsLocal.unsetWalletLocalData.trigger({
       walletId: params.walletId,
@@ -631,24 +680,30 @@ export default class WalletsStore extends Store {
     await this.stores.hardwareWallets._unsetHardwareWalletLocalData({
       walletId: params.walletId,
     });
+
     this._resumePolling();
+
     this.deleteWalletRequest.reset();
     this.refreshWalletsData();
   };
-
   _undelegateWallet = async (params: QuitStakePoolRequest) => {
     const { quitStakePoolRequest } = this.stores.staking;
     const { quitStakePool } = this.actions.staking;
     const walletToUndelegate = this.getWalletById(params.walletId);
+
     if (!walletToUndelegate) {
       return;
     }
+
     await quitStakePool.trigger(params);
-    this._setUndelegateWalletSubmissionSuccess({ result: true });
+
+    this._setUndelegateWalletSubmissionSuccess({
+      result: true,
+    });
+
     quitStakePoolRequest.reset();
     this.refreshWalletsData();
   };
-
   _setUndelegateWalletSubmissionSuccess = ({ result }: { result: boolean }) => {
     runInAction(
       'AdaWalletsStore::_setUndelegateWalletSubmissionSuccess',
@@ -657,33 +712,28 @@ export default class WalletsStore extends Store {
       }
     );
   };
-
   _getUnscrambledMnemonics = async (
     mnemonics: Array<string>
     // @ts-ignore ts-migrate(1064) FIXME: The return type of an async function or method mus... Remove this comment to see the full error message
   ): Array<string> => {
     // Split recovery phrase to 18 (scrambled mnemonics) + 9 (mnemonics seed) mnemonics
     const { passphrase, scrambledInput } = getScrambledInput(mnemonics);
-
     // Unscramble 18-word wallet certificate mnemonic to 12-word mnemonic
     const unscrambledRecoveryPhrase: Array<string> =
       await this.getWalletRecoveryPhraseFromCertificateRequest.execute({
         passphrase,
         scrambledInput,
       }).promise;
-
     this.getWalletRecoveryPhraseFromCertificateRequest.reset();
-
-    // @ts-ignore
     return unscrambledRecoveryPhrase;
   };
-
-  @action _restore = async () => {
+  @action
+  _restore = async () => {
     this.isRestoring = true;
-
     // Pause polling in order to avoid fetching data for wallet we are about to restore
     // so that we remain on the "Add wallet" screen until user closes the TADA screen
     await this._pausePolling();
+
     // Reset restore requests to clear previous errors
     this._restoreWalletResetRequests();
 
@@ -692,7 +742,6 @@ export default class WalletsStore extends Store {
       walletName: this.walletName,
       spendingPassword: this.spendingPassword,
     };
-
     const request = this.restoreRequest;
 
     if (
@@ -708,7 +757,6 @@ export default class WalletsStore extends Store {
       const restoredWallet = await request.execute(data).promise;
       if (!restoredWallet)
         throw new Error('Restored wallet was not received correctly');
-
       runInAction('set restoredWallet', () => {
         this.restoredWallet = restoredWallet;
         this.restoreWalletStep = 3;
@@ -719,19 +767,20 @@ export default class WalletsStore extends Store {
       });
     }
   };
-
   _sendMoney = async ({
     receiver,
     amount,
     passphrase,
     assets,
     assetsAmounts: assetsAmountsStr,
+    hasAssetsRemainingAfterTransaction,
   }: {
     receiver: string;
     amount: string;
     passphrase: string;
     assets?: Array<AssetToken>;
     assetsAmounts?: Array<string>;
+    hasAssetsRemainingAfterTransaction?: boolean;
   }) => {
     const assetsAmounts = assetsAmountsStr
       ? assetsAmountsStr.map((assetAmount) => new BigNumber(assetAmount))
@@ -747,7 +796,6 @@ export default class WalletsStore extends Store {
             })
           )
         : null;
-
     const wallet = this.active;
     if (!wallet) throw new Error('Active wallet required before sending.');
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
@@ -758,24 +806,26 @@ export default class WalletsStore extends Store {
       walletId: wallet.id,
       isLegacy: wallet.isLegacy,
       assets: formattedAssets,
+      hasAssetsRemainingAfterTransaction,
     });
     this.refreshWalletsData();
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
     this.actions.dialogs.closeActiveDialog.trigger();
     this.sendMoneyRequest.reset();
     this.goToWalletRoute(wallet.id);
   };
-
-  @action _transferFundsNextStep = async () => {
+  @action
+  _transferFundsNextStep = async () => {
     const {
       transferFundsStep,
       transferFundsSourceWalletId,
       transferFundsTargetWalletId,
     } = this;
     let nextStep = 0;
+
     if (transferFundsStep === 0 && transferFundsSourceWalletId) {
       nextStep = 1;
     }
+
     if (
       transferFundsStep === 1 &&
       transferFundsSourceWalletId &&
@@ -786,18 +836,19 @@ export default class WalletsStore extends Store {
       });
       nextStep = 2;
     }
+
     runInAction('update transfer funds step', () => {
       this.transferFundsStep = nextStep;
     });
   };
-
-  @action _transferFundsPrevStep = () => {
+  @action
+  _transferFundsPrevStep = () => {
     const { transferFundsStep } = this;
     const prevStep = transferFundsStep > 0 ? transferFundsStep - 1 : 0;
     this.transferFundsStep = prevStep;
   };
-
-  @action _transferFunds = async ({
+  @action
+  _transferFunds = async ({
     spendingPassword,
   }: {
     spendingPassword: string;
@@ -805,7 +856,9 @@ export default class WalletsStore extends Store {
     const { transferFundsSourceWalletId, transferFundsTargetWalletId } = this;
     const targetWalletAddresses = await this.getWalletAddressesRequest.execute({
       walletId: transferFundsTargetWalletId,
-      queryParams: { state: 'unused' },
+      queryParams: {
+        state: 'unused',
+      },
     }).promise;
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.transferFundsRequest.execute({
@@ -815,14 +868,15 @@ export default class WalletsStore extends Store {
         : null,
       passphrase: spendingPassword,
     });
-
     this.refreshWalletsData();
+
     this._transferFundsClose();
+
     this.transferFundsRequest.reset();
     this.goToWalletRoute(transferFundsSourceWalletId);
   };
-
-  @action _transferFundsSetSourceWalletId = ({
+  @action
+  _transferFundsSetSourceWalletId = ({
     sourceWalletId,
   }: {
     sourceWalletId: string;
@@ -834,27 +888,26 @@ export default class WalletsStore extends Store {
     // Sets to first step
     this.transferFundsStep = 1;
   };
-
-  @action _transferFundsSetTargetWalletId = ({
+  @action
+  _transferFundsSetTargetWalletId = ({
     targetWalletId,
   }: {
     targetWalletId: string;
   }) => {
     this.transferFundsTargetWalletId = targetWalletId;
   };
-
-  @action _transferFundsRedeem = () => {
-    this.transferFundsStep = 0;
-    // TODO: Call API method
+  @action
+  _transferFundsRedeem = () => {
+    this.transferFundsStep = 0; // TODO: Call API method
   };
-
-  @action _transferFundsClose = () => {
+  @action
+  _transferFundsClose = () => {
     this.transferFundsStep = 0;
     this.transferFundsFee = null;
     this.transferFundsCalculateFeeRequest.reset();
   };
-
-  @action _transferFundsCalculateFee = async ({
+  @action
+  _transferFundsCalculateFee = async ({
     sourceWalletId,
   }: {
     sourceWalletId: string;
@@ -874,68 +927,79 @@ export default class WalletsStore extends Store {
   };
 
   // =================== PUBLIC API ==================== //
-
   // GETTERS
-
-  @computed get hasActiveWallet(): boolean {
+  @computed
+  get hasActiveWallet(): boolean {
     return !!this.active;
   }
 
-  @computed get hasLoadedWallets(): boolean {
+  @computed
+  get hasLoadedWallets(): boolean {
     return this.walletsRequest.wasExecuted;
   }
 
-  @computed get hasAnyWallets(): boolean {
+  @computed
+  get hasAnyWallets(): boolean {
     if (this.walletsRequest.result == null) return false;
     return (
       this.walletsRequest.wasExecuted && this.walletsRequest.result.length > 0
     );
   }
 
-  @computed get hasRewardsWallets(): boolean {
+  @computed
+  get hasRewardsWallets(): boolean {
     return this.allWallets.length > 0;
   }
 
-  @computed get hasMaxWallets(): boolean {
+  @computed
+  get hasMaxWallets(): boolean {
     return this.all.length >= MAX_ADA_WALLETS_COUNT;
   }
 
-  @computed get all(): Array<Wallet> {
+  @computed
+  get all(): Array<Wallet> {
     return [...this.allWallets, ...this.allLegacyWallets];
   }
 
-  @computed get allWallets(): Array<Wallet> {
+  @computed
+  get allWallets(): Array<Wallet> {
     return this.walletsRequest.result
       ? this.walletsRequest.result.filter(({ isLegacy }: Wallet) => !isLegacy)
       : [];
   }
 
-  @computed get allLegacyWallets(): Array<Wallet> {
+  @computed
+  get allLegacyWallets(): Array<Wallet> {
     return this.walletsRequest.result
       ? this.walletsRequest.result.filter(({ isLegacy }: Wallet) => isLegacy)
       : [];
   }
 
-  @computed get first(): Wallet | null | undefined {
+  @computed
+  get first(): Wallet | null | undefined {
     return this.all.length > 0 ? this.all[0] : null;
   }
 
-  @computed get hasAnyLoaded(): boolean {
+  @computed
+  get hasAnyLoaded(): boolean {
     return this.all.length > 0;
   }
 
-  @computed get activeWalletRoute(): string | null | undefined {
+  @computed
+  get activeWalletRoute(): string | null | undefined {
     if (!this.active) return null;
     return this.getWalletRoute(this.active.id);
   }
 
-  @computed get isWalletRoute(): boolean {
+  @computed
+  get isWalletRoute(): boolean {
     const { currentRoute } = this.stores.app;
     return matchRoute(`${ROUTES.WALLETS.ROOT}(/*rest)`, currentRoute);
   }
 
+  @computed
   // @ts-ignore ts-migrate(2314) FIXME: Generic type 'LocalizedRequest<Result>' requires 1... Remove this comment to see the full error message
-  @computed get restoreRequest(): Request {
+  get restoreRequest(): Request {
     switch (this.walletKind) {
       case WALLET_KINDS.DAEDALUS:
         if (
@@ -944,17 +1008,23 @@ export default class WalletsStore extends Store {
         ) {
           return this.restoreDaedalusRequest;
         }
+
         return this.restoreByronRandomWalletRequest;
+
       case WALLET_KINDS.YOROI:
         if (this.walletKindYoroi === WALLET_YOROI_KINDS.BYRON_15_WORD) {
           return this.restoreByronIcarusWalletRequest;
         }
+
         return this.restoreDaedalusRequest;
+
       case WALLET_KINDS.HARDWARE:
         if (this.walletKindHardware === WALLET_HARDWARE_KINDS.LEDGER) {
           return this.restoreByronLedgerWalletRequest;
         }
+
         return this.restoreByronTrezorWalletRequest;
+
       default:
         return this.restoreDaedalusRequest;
     }
@@ -962,23 +1032,25 @@ export default class WalletsStore extends Store {
 
   getWalletById = (id: string): Wallet | null | undefined =>
     this.all.find((w) => w.id === id);
-
   getWalletByName = (name: string): Wallet | null | undefined =>
     this.all.find((w) => w.name === name);
-
   getWalletRoute = (walletId: string, page = 'summary'): string =>
-    buildRoute(ROUTES.WALLETS.PAGE, { id: walletId, page });
+    buildRoute(ROUTES.WALLETS.PAGE, {
+      id: walletId,
+      page,
+    });
 
   // ACTIONS
-
   goToWalletRoute(walletId: string) {
     const route = this.getWalletRoute(walletId);
-    this.actions.router.goToRoute.trigger({ route });
+    this.actions.router.goToRoute.trigger({
+      route,
+    });
   }
 
   // =================== PRIVATE API ==================== //
-
-  @computed get _canRedirectToWallet(): boolean {
+  @computed
+  get _canRedirectToWallet(): boolean {
     const { currentRoute } = this.stores.app;
     const isRootRoute = matchRoute(ROUTES.WALLETS.ROOT, currentRoute);
     const isAddWalletRoute = matchRoute(ROUTES.WALLETS.ADD, currentRoute);
@@ -989,12 +1061,17 @@ export default class WalletsStore extends Store {
     // Only add the new wallet if it does not exist yet in the result!
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     await this.walletsRequest.patch((result) => {
-      if (!find(result, { id: wallet.id })) {
+      if (
+        !find(result, {
+          id: wallet.id,
+        })
+      ) {
         if (wallet.isLegacy) {
           // Legacy wallets are always added to the end of the list!
           result.push(wallet);
         } else {
           const index = findIndex(result, 'isLegacy');
+
           if (index >= 0) {
             result.splice(index, 0, wallet);
           } else {
@@ -1004,12 +1081,10 @@ export default class WalletsStore extends Store {
       }
     });
   };
-
   _pollRefresh = async () => {
     const { isConnected } = this.stores.networkStatus;
     return isConnected && this.refreshWalletsData();
   };
-
   _updateActiveWalletOnRouteChanges = () => {
     const { currentRoute } = this.stores.app;
     const hasAnyWalletLoaded = this.hasAnyLoaded;
@@ -1022,29 +1097,38 @@ export default class WalletsStore extends Store {
         `${ROUTES.WALLETS.ROOT}/:id(*page)`,
         currentRoute
       );
+
       if (match) {
         // We have a route for a specific wallet -> let's try to find it
         const walletForCurrentRoute = this.all.find((w) => w.id === match.id);
+
         if (walletForCurrentRoute) {
           // The wallet exists, we are done
-          this._setActiveWallet({ walletId: walletForCurrentRoute.id });
+          this._setActiveWallet({
+            walletId: walletForCurrentRoute.id,
+          });
         } else if (hasAnyWalletLoaded) {
           // There is no wallet with given id -> pick first wallet
-          this._setActiveWallet({ walletId: this.all[0].id });
+          this._setActiveWallet({
+            walletId: this.all[0].id,
+          });
+
           if (this.active) this.goToWalletRoute(this.active.id);
         }
       } else if (this._canRedirectToWallet) {
         // The route does not specify any wallet -> pick first wallet
         if (!this.hasActiveWallet && hasAnyWalletLoaded) {
-          this._setActiveWallet({ walletId: this.all[0].id });
+          this._setActiveWallet({
+            walletId: this.all[0].id,
+          });
         }
+
         if (this.active) {
           this.goToWalletRoute(this.active.id);
         }
       }
     });
   };
-
   isValidAddress = async (address: string) => {
     const { network } = this.environment;
     const expectedNetworkTag = get(NetworkMagics, [network]);
@@ -1054,8 +1138,11 @@ export default class WalletsStore extends Store {
     if (!expectedNetworkTag) {
       throw new Error('Unexpected environment');
     }
+
     try {
-      const response = await introspectAddressChannel.send({ input: address });
+      const response = await introspectAddressChannel.send({
+        input: address,
+      });
 
       if (
         response === 'Invalid' ||
@@ -1083,11 +1170,10 @@ export default class WalletsStore extends Store {
       logger.error(error);
     }
   };
-
   isValidCertificateMnemonic = (mnemonic: string) =>
     this.api.ada.isValidCertificateMnemonic(mnemonic);
-
-  @action refreshWalletsData = async () => {
+  @action
+  refreshWalletsData = async () => {
     // Prevent wallets data refresh if polling is blocked
     if (this._pollingBlocked) return;
 
@@ -1100,25 +1186,25 @@ export default class WalletsStore extends Store {
             syncState.status !== WalletSyncStateStatuses.NOT_RESPONDING
         )
         .map((wallet: Wallet) => wallet.id);
-
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
       await this.actions.walletsLocal.refreshWalletsLocalData.trigger();
-
       runInAction('refresh active wallet', () => {
         if (this.active) {
-          this._setActiveWallet({ walletId: this.active.id });
+          this._setActiveWallet({
+            walletId: this.active.id,
+          });
         }
       });
       runInAction('refresh address data', () => {
-        // @ts-ignore ts-migrate(2322) FIXME: Type '{ walletId: string; allRequest: LocalizedCac... Remove this comment to see the full error message
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'WalletsS... Remove this comment to see the full error message
         this.stores.addresses.addressesRequests = walletIds.map((walletId) => ({
           walletId,
           allRequest: this.stores.addresses._getAddressesAllRequest(walletId),
         }));
+
         this.stores.addresses._refreshAddresses();
       });
       runInAction('refresh transaction data', () => {
-        // @ts-ignore ts-migrate(2322) FIXME: Type '{ walletId: string; recentRequest: Localized... Remove this comment to see the full error message
+        // @ts-ignore ts-migrate(2339) FIXME: Property 'stores' does not exist on type 'WalletsS... Remove this comment to see the full error message
         this.stores.transactions.transactionsRequests = walletIds.map(
           (walletId) => ({
             walletId,
@@ -1130,23 +1216,21 @@ export default class WalletsStore extends Store {
               this.stores.transactions._getWithdrawalsRequest(walletId),
           })
         );
+
         this.stores.transactions._refreshTransactionData();
       });
-      // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
       this.actions.wallets.refreshWalletsDataSuccess.trigger();
     }
   };
-
-  @action resetWalletsData = () => {
+  @action
+  resetWalletsData = () => {
     this.walletsRequest.reset();
     this.stores.addresses.addressesRequests = [];
     this.stores.transactions.transactionsRequests = [];
     this.isAddressFromSameWallet = false;
   };
-
-  @action _importWalletFromFile = async (
-    params: WalletImportFromFileParams
-  ) => {
+  @action
+  _importWalletFromFile = async (params: WalletImportFromFileParams) => {
     const { filePath, walletName, spendingPassword } = params;
     const importedWallet = await this.importFromFileRequest.execute({
       filePath,
@@ -1156,17 +1240,17 @@ export default class WalletsStore extends Store {
     if (!importedWallet)
       throw new Error('Imported wallet was not received correctly');
     await this._patchWalletRequestWithNewWallet(importedWallet);
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
     this.actions.dialogs.closeActiveDialog.trigger();
     this.importFromFileRequest.reset();
     this.goToWalletRoute(importedWallet.id);
     this.refreshWalletsData();
   };
-
-  @action _setActiveWallet = ({ walletId }: { walletId: string }) => {
+  @action
+  _setActiveWallet = ({ walletId }: { walletId: string }) => {
     if (this.hasAnyWallets) {
       const activeWalletId = this.active ? this.active.id : null;
       const newActiveWallet = this.all.find((wallet) => wallet.id === walletId);
+
       if (
         (!this.active || !this.active.isNotResponding) &&
         newActiveWallet &&
@@ -1174,18 +1258,25 @@ export default class WalletsStore extends Store {
       ) {
         this.actions.router.goToRoute.trigger({
           route: ROUTES.WALLETS.PAGE,
-          params: { id: newActiveWallet.id, page: 'summary' },
+          params: {
+            id: newActiveWallet.id,
+            page: 'summary',
+          },
         });
       }
+
       const hasActiveWalletBeenChanged = activeWalletId !== walletId;
       const hasActiveWalletBeenUpdated = !isEqual(this.active, newActiveWallet);
+
       if (hasActiveWalletBeenChanged) {
         // Active wallet has been replaced or removed
         this.active = newActiveWallet || null;
         this.stores.addresses.lastGeneratedAddress = null;
+
         if (this.active) {
           // @ts-ignore ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'BigNumber... Remove this comment to see the full error message
           this.activeValue = formattedWalletAmount(this.active.amount);
+
           if (this.active && this.active.isHardwareWallet) {
             const { hardwareWalletsConnectionData } =
               this.stores.hardwareWallets;
@@ -1193,6 +1284,7 @@ export default class WalletsStore extends Store {
               hardwareWalletsConnectionData,
               this.active.id
             );
+
             if (hardwareWalletConnectionData) {
               const { extendedPublicKey } = hardwareWalletConnectionData;
               const extendedPublicKeyHex = `${extendedPublicKey.publicKeyHex}${extendedPublicKey.chainCodeHex}`;
@@ -1211,16 +1303,16 @@ export default class WalletsStore extends Store {
       }
     }
   };
-
-  @action _unsetActiveWallet = () => {
+  @action
+  _unsetActiveWallet = () => {
     this.active = null;
     this.activeValue = null;
     this.activePublicKey = null;
     this.icoPublicKey = null;
     this.stores.addresses.lastGeneratedAddress = null;
   };
-
-  @action _onRouteChange = (options: {
+  @action
+  _onRouteChange = (options: {
     route: string;
     params: Record<string, any> | null | undefined;
   }) => {
@@ -1232,24 +1324,24 @@ export default class WalletsStore extends Store {
       this.isAddressFromSameWallet = false;
     }
   };
-
-  @action _chooseWalletExportType = (params: {
+  @action
+  _chooseWalletExportType = (params: {
     walletExportType: WalletExportTypeChoices;
   }) => {
     if (this.walletExportType !== params.walletExportType) {
       this.walletExportType = params.walletExportType;
     }
   };
-
-  @action _pausePolling = async () => {
+  @action
+  _pausePolling = async () => {
     // @ts-ignore ts-migrate(1320) FIXME: Type of 'await' operand must either be a valid pro... Remove this comment to see the full error message
     if (this.walletsRequest.isExecuting) await this.walletsRequest;
     runInAction('AdaWalletsStore::_pausePolling', () => {
       this._pollingBlocked = true;
     });
   };
-
-  @action _resumePolling = () => {
+  @action
+  _resumePolling = () => {
     this._pollingBlocked = false;
   };
 
@@ -1273,21 +1365,21 @@ export default class WalletsStore extends Store {
       this._updateCertificateCreationState(true);
 
       // Generate wallet recovery phrase
+
       const recoveryPhrase: Array<string> =
         yield this.getWalletRecoveryPhraseRequest.execute().promise;
-
       // Generate 9-words (additional) mnemonic
+
       const additionalMnemonicWords: Array<string> =
         yield this.getWalletCertificateAdditionalMnemonicsRequest.execute()
           .promise;
       this.additionalMnemonicWords = additionalMnemonicWords.join(' ');
-
       // Generate spending password from 9-word mnemonic and save to store
       // @ts-ignore ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
       const spendingPassword = mnemonicToSeedHex(this.additionalMnemonicWords);
       this.walletCertificatePassword = spendingPassword;
-
       // Generate paper wallet scrambled mnemonic
+
       const walletCertificateRecoveryPhrase: Array<string> =
         yield this.getWalletCertificateRecoveryPhraseRequest.execute({
           passphrase: spendingPassword,
@@ -1295,21 +1387,19 @@ export default class WalletsStore extends Store {
         }).promise;
       this.walletCertificateRecoveryPhrase =
         walletCertificateRecoveryPhrase.join(' ');
-
       // Create temporary wallet
       const walletData = {
         name: 'Paper Wallet',
         mnemonic: recoveryPhrase.join(' '),
       };
       const wallet = yield this.createWalletRequest.execute(walletData).promise;
-
       // Get temporary wallet address
       let walletAddresses;
+
       if (wallet) {
         walletAddresses = yield this.getWalletAddressesRequest.execute({
           walletId: wallet.id,
         }).promise;
-
         // delete temporary wallet
         yield this.deleteWalletRequest.execute({
           walletId: wallet.id,
@@ -1320,7 +1410,6 @@ export default class WalletsStore extends Store {
       // Set wallet certificate address
       const walletAddress = get(walletAddresses, ['0', 'id'], null);
       this.walletCertificateAddress = walletAddress;
-
       // download pdf certificate
       yield this._downloadCertificate(
         walletAddress,
@@ -1334,7 +1423,6 @@ export default class WalletsStore extends Store {
       this._resumePolling();
     }
   }).bind(this);
-
   _downloadCertificate = async (
     address: string,
     recoveryPhrase: Array<string>,
@@ -1344,8 +1432,11 @@ export default class WalletsStore extends Store {
     const locale = this.stores.profile.currentLocale;
     const intl = i18nContext(locale);
     const { isMainnet } = this.environment;
-    // @ts-ignore ts-migrate(2339) FIXME: Property 'buildLabel' does not exist on type 'type... Remove this comment to see the full error message
-    const { buildLabel } = global;
+    const {
+      // @ts-ignore ts-migrate(2339) FIXME: Property 'buildLabel' does not exist on type 'type... Remove this comment to see the full error message
+      buildLabel,
+    } = global;
+
     try {
       await paperWalletPdfGenerator({
         address,
@@ -1359,6 +1450,7 @@ export default class WalletsStore extends Store {
       runInAction('handle successful certificate download', () => {
         // Reset progress
         this._updateCertificateCreationState(false);
+
         // Update certificate generator step
         this._updateCertificateStep();
       });
@@ -1369,7 +1461,6 @@ export default class WalletsStore extends Store {
       });
     }
   };
-
   _generateAddressPDF = async ({
     note,
     address,
@@ -1383,6 +1474,7 @@ export default class WalletsStore extends Store {
       this.stores.profile;
     const { network, isMainnet } = this.environment;
     const intl = i18nContext(currentLocale);
+
     try {
       await addressPDFGenerator({
         address,
@@ -1396,12 +1488,13 @@ export default class WalletsStore extends Store {
         intl,
       });
       const walletAddress = ellipsis(address, 15, 15);
-      this.actions.wallets.generateAddressPDFSuccess.trigger({ walletAddress });
+      this.actions.wallets.generateAddressPDFSuccess.trigger({
+        walletAddress,
+      });
     } catch (error) {
       throw new Error(error);
     }
   };
-
   _saveQRCodeImage = async ({
     address,
     filePath,
@@ -1415,19 +1508,20 @@ export default class WalletsStore extends Store {
         filePath,
       });
       const walletAddress = ellipsis(address, 15, 15);
-      this.actions.wallets.saveQRCodeImageSuccess.trigger({ walletAddress });
+      this.actions.wallets.saveQRCodeImageSuccess.trigger({
+        walletAddress,
+      });
     } catch (error) {
       throw new Error(error);
     }
   };
-
   _updateCertificateCreationState = action(
     (state: boolean, error?: Record<string, any> | null | undefined) => {
       this.generatingCertificateInProgress = state;
+
       this._updateGeneratingCertificateError(error);
     }
   );
-
   _updateGeneratingCertificateError = action(
     (error?: Record<string, any> | null | undefined) => {
       if (error && error.syscall && error.syscall === 'open') {
@@ -1466,7 +1560,6 @@ export default class WalletsStore extends Store {
       this._resumePolling();
     }
   }).bind(this);
-
   _downloadRewardsCsv = async (
     fileContent: CsvFileContent,
     filePath: string
@@ -1485,14 +1578,13 @@ export default class WalletsStore extends Store {
       });
     }
   };
-
   _updateRewardsCsvCreationState = action(
     (state: boolean, error?: Record<string, any> | null | undefined) => {
       this.generatingRewardsCsvInProgress = state;
+
       this._updateGeneratingRewardsCsvError(error);
     }
   );
-
   _updateGeneratingRewardsCsvError = action(
     (error?: Record<string, any> | null | undefined) => {
       if (error && error.syscall && error.syscall === 'open') {
@@ -1503,54 +1595,60 @@ export default class WalletsStore extends Store {
       }
     }
   );
-
-  @action _setCertificateTemplate = (params: { selectedTemplate: string }) => {
+  @action
+  _setCertificateTemplate = (params: { selectedTemplate: string }) => {
     this.certificateTemplate = params.selectedTemplate;
+
     this._updateCertificateStep();
   };
-
-  @action _finishCertificate = () => {
+  @action
+  _finishCertificate = () => {
     this._updateGeneratingCertificateError();
+
     this._closeCertificateGeneration();
   };
-
-  @action _finishRewardsCsv = () => {
+  @action
+  _finishRewardsCsv = () => {
     this._updateGeneratingRewardsCsvError();
+
     this._closeRewardsCsvGeneration();
   };
-
-  @action _updateCertificateStep = (isBack = false) => {
+  @action
+  _updateCertificateStep = (isBack = false) => {
     this._updateGeneratingCertificateError();
-    const currrentCertificateStep = this.certificateStep || 0;
+
+    const currentCertificateStep = this.certificateStep || 0;
     this.certificateStep = isBack
-      ? currrentCertificateStep - 1
-      : currrentCertificateStep + 1;
+      ? currentCertificateStep - 1
+      : currentCertificateStep + 1;
   };
-
-  @action _closeCertificateGeneration = () => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
+  @action
+  _closeCertificateGeneration = () => {
     this.actions.dialogs.closeActiveDialog.trigger();
+
     this._resetCertificateData();
   };
-
-  @action _closeRewardsCsvGeneration = () => {
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
+  @action
+  _closeRewardsCsvGeneration = () => {
     this.actions.dialogs.closeActiveDialog.trigger();
+
     this._resetRewardsCsvData();
   };
-
-  @action _resetCertificateData = () => {
+  @action
+  _resetCertificateData = () => {
     this.walletCertificatePassword = null;
     this.walletCertificateAddress = null;
     this.walletCertificateRecoveryPhrase = null;
     this.generatingCertificateInProgress = false;
     this.certificateTemplate = false;
     this.certificateStep = null;
+
     this._updateGeneratingCertificateError();
   };
-
-  @action _resetRewardsCsvData = () => {
+  @action
+  _resetRewardsCsvData = () => {
     this.generatingRewardsCsvInProgress = false;
+
     this._updateGeneratingRewardsCsvError();
   };
 }
diff --git a/source/renderer/app/stores/index.ts b/source/renderer/app/stores/index.ts
index d1b37943e2..558067c87d 100644
--- a/source/renderer/app/stores/index.ts
+++ b/source/renderer/app/stores/index.ts
@@ -1,6 +1,7 @@
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'utility-types' or its correspo... Remove this comment to see the full error message
 import { Class } from 'utility-types';
 import { observable, action } from 'mobx';
+import { RouterStore } from 'mobx-react-router';
 import type Store from './lib/Store';
 import AddressesStore from './AddressesStore';
 import AppStore from './AppStore';
@@ -57,7 +58,7 @@ export type StoresMap = {
   networkStatus: NetworkStatusStore;
   newsFeed: NewsFeedStore;
   profile: ProfileStore;
-  router: Record<string, any>;
+  router: RouterStore;
   sidebar: SidebarStore;
   staking: StakingStore;
   transactions: TransactionsStore;
diff --git a/source/renderer/app/themes/daedalus.ts b/source/renderer/app/themes/daedalus.ts
index 6e6bfc0896..0caee5b6a5 100644
--- a/source/renderer/app/themes/daedalus.ts
+++ b/source/renderer/app/themes/daedalus.ts
@@ -1,42 +1,22 @@
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleAutocomplete from 'react-polymorph/lib/themes/simple/SimpleAutocomplete.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleBubble from 'react-polymorph/lib/themes/simple/SimpleBubble.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleButton from 'react-polymorph/lib/themes/simple/SimpleButton.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleCheckbox from 'react-polymorph/lib/themes/simple/SimpleCheckbox.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleDropdown from 'react-polymorph/lib/themes/simple/SimpleDropdown.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleFormField from 'react-polymorph/lib/themes/simple/SimpleFormField.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleInput from 'react-polymorph/lib/themes/simple/SimpleInput.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleLoadingSpinner from 'react-polymorph/lib/themes/simple/SimpleLoadingSpinner.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleModal from 'react-polymorph/lib/themes/simple/SimpleModal.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleOptions from 'react-polymorph/lib/themes/simple/SimpleOptions.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimplePasswordInput from 'react-polymorph/lib/themes/simple/SimplePasswordInput.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimplePopOver from 'react-polymorph/lib/themes/simple/SimplePopOver.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleRadio from 'react-polymorph/lib/themes/simple/SimpleRadio.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleScrollBar from 'react-polymorph/lib/themes/simple/SimpleScrollBar.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleSelect from 'react-polymorph/lib/themes/simple/SimpleSelect.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleStepper from 'react-polymorph/lib/themes/simple/SimpleStepper.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleSwitch from 'react-polymorph/lib/themes/simple/SimpleSwitch.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleTextArea from 'react-polymorph/lib/themes/simple/SimpleTextArea.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleTooltip from 'react-polymorph/lib/themes/simple/SimpleTooltip.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'react-polymorph/lib/themes/sim... Remove this comment to see the full error message
 import SimpleLink from 'react-polymorph/lib/themes/simple/SimpleLink.scss';
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
 
diff --git a/source/renderer/app/themes/daedalus/cardano.ts b/source/renderer/app/themes/daedalus/cardano.ts
index 30797d7d74..ba3d02ee9a 100644
--- a/source/renderer/app/themes/daedalus/cardano.ts
+++ b/source/renderer/app/themes/daedalus/cardano.ts
@@ -8,7 +8,7 @@ export const CARDANO_THEME_OUTPUT = {
       'rgba(233, 244, 254, 0.3)',
     '--theme-about-window-daedalus-icon-color': '#e9f4fe',
     '--theme-about-window-cardano-icon-color': '#e9f4fe',
-    '--theme-about-window-title-varsion-color': '#e9f4fe',
+    '--theme-about-window-title-version-color': '#e9f4fe',
     '--theme-about-window-title-stroke-color': '#e9f4fe',
     '--theme-about-window-content-color': '#ffffff',
     '--theme-about-window-content-text-color': 'rgba(255, 255, 255, 0.7)',
@@ -165,6 +165,7 @@ export const CARDANO_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(32, 34, 37, 1)',
     '--theme-connecting-text-color': '#fff',
     '--theme-connecting-description-color': 'rgba(255, 255, 255, 0.7)',
+    '--theme-connecting-sync-progress-color': '#fff',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#5e6066',
@@ -294,6 +295,7 @@ export const CARDANO_THEME_OUTPUT = {
     '--theme-dialog-fullsize-text-color': 'rgba(255, 255, 255, 0.7)',
     '--theme-dialog-fullsize-text-highlight-color': '#ffffff',
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
+    '--theme-dialog-fullsize-secondary-text-action-color': '255, 255, 255',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -638,7 +640,7 @@ export const CARDANO_THEME_OUTPUT = {
     '--rp-input-bg-color': '#ffffff',
     '--rp-input-bg-color-disabled': 'rgba(94, 96, 102, 0.05)',
     '--rp-input-border-color': 'rgba(94, 96, 102, 0.3)',
-    '--rp-input-border-color-disabled': 'rgba(94, 96, 102, 0.05)',
+    '--rp-input-border-color-disabled': 'transparent',
     '--rp-input-border-color-errored': '#ea4c5b',
     '--rp-input-border-color-focus': 'rgba(94, 96, 102, 0.7)',
     '--rp-input-line-height': '22px',
@@ -698,8 +700,10 @@ export const CARDANO_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(94, 96, 102, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(94, 96, 102, 0.7)',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(255, 255, 255, 0.05)',
     '--rp-select-input-border-color': 'rgba(94, 96, 102, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(94, 96, 102, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#5e6066',
     '--rp-select-input-placeholder-color': 'rgba(94, 96, 102, 0.5)',
   },
@@ -797,6 +801,8 @@ export const CARDANO_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#2cbb69',
     '--theme-sidebar-category-networkInfo-text-color': '#fff',
+    '--theme-sidebar-sort-button-background-color': '250, 251, 252',
+    '--theme-sidebar-search-field-border-color': '255, 255, 255',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(32, 34, 37, 0.96)',
@@ -867,7 +873,7 @@ export const CARDANO_THEME_OUTPUT = {
     '--theme-staking-stake-pool-tooltip-table-title-color': '#5e6066',
     '--theme-staking-stake-pool-tooltip-text-color': '#5e6066',
     '--theme-staking-stake-pools-search-button-color': '#5e6066',
-    '--theme-staking-stake-pools-search-icon-color': 'rgba(94, 96, 102, 1)',
+    '--theme-staking-stake-pools-search-icon-color': '#5e6066',
     '--theme-staking-stake-pools-search-clear-button-background-color':
       'rgba(32, 34, 37, 0.1)',
     '--theme-staking-stake-pools-search-clear-button-color': '#5e6066',
@@ -1016,6 +1022,10 @@ export const CARDANO_THEME_OUTPUT = {
       'rgba(32, 34, 37, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(32, 34, 37, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#5e6066',
diff --git a/source/renderer/app/themes/daedalus/dark-blue.ts b/source/renderer/app/themes/daedalus/dark-blue.ts
index 2aff859297..00f43cff9c 100644
--- a/source/renderer/app/themes/daedalus/dark-blue.ts
+++ b/source/renderer/app/themes/daedalus/dark-blue.ts
@@ -8,7 +8,7 @@ export const DARK_BLUE_THEME_OUTPUT = {
       'rgba(233, 244, 254, 0.3)',
     '--theme-about-window-daedalus-icon-color': '#e9f4fe',
     '--theme-about-window-cardano-icon-color': '#e9f4fe',
-    '--theme-about-window-title-varsion-color': '#e9f4fe',
+    '--theme-about-window-title-version-color': '#e9f4fe',
     '--theme-about-window-title-stroke-color': '#e9f4fe',
     '--theme-about-window-content-color': '#fafbfc',
     '--theme-about-window-content-text-color': 'rgba(250, 251, 252, 0.7)',
@@ -164,6 +164,7 @@ export const DARK_BLUE_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(38, 51, 69, 1)',
     '--theme-connecting-text-color': '#fff',
     '--theme-connecting-description-color': 'rgba(233, 244, 254, 0.7)',
+    '--theme-connecting-sync-progress-color': '#e9f4fe',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#e9f4fe',
@@ -295,6 +296,7 @@ export const DARK_BLUE_THEME_OUTPUT = {
     '--theme-dialog-fullsize-text-color': 'rgba(255, 255, 255, 0.7)',
     '--theme-dialog-fullsize-text-highlight-color': '#ffffff',
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
+    '--theme-dialog-fullsize-secondary-text-action-color': '233, 244, 254',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -700,8 +702,10 @@ export const DARK_BLUE_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(233, 244, 254, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(233, 244, 254, 1)',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(233, 244, 254, 0.05)',
     '--rp-select-input-border-color': 'rgba(233, 244, 254, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(233, 244, 254, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': 'rgba(233, 244, 254, 1)',
     '--rp-select-input-placeholder-color': 'rgba(233, 244, 254, 0.5)',
   },
@@ -800,6 +804,8 @@ export const DARK_BLUE_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#536370',
     '--theme-sidebar-category-networkInfo-text-color': '#e9f4fe',
+    '--theme-sidebar-sort-button-background-color': '250, 251, 252',
+    '--theme-sidebar-search-field-border-color': '233, 244, 254',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(38, 51, 69, 0.96)',
@@ -870,7 +876,7 @@ export const DARK_BLUE_THEME_OUTPUT = {
     '--theme-staking-stake-pool-tooltip-table-title-color': '#e9f4fe',
     '--theme-staking-stake-pool-tooltip-text-color': '#e9f4fe',
     '--theme-staking-stake-pools-search-button-color': '#e9f4fe',
-    '--theme-staking-stake-pools-search-icon-color': '#8793a1',
+    '--theme-staking-stake-pools-search-icon-color': '#e9f4fe',
     '--theme-staking-stake-pools-search-clear-button-background-color':
       'rgba(233, 244, 254, 0.1)',
     '--theme-staking-stake-pools-search-clear-button-color':
@@ -1021,6 +1027,10 @@ export const DARK_BLUE_THEME_OUTPUT = {
       'rgba(233, 244, 254, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(233, 244, 254, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#e9f4fe',
diff --git a/source/renderer/app/themes/daedalus/dark-cardano.ts b/source/renderer/app/themes/daedalus/dark-cardano.ts
index 4ce265b8f5..86bf01adff 100644
--- a/source/renderer/app/themes/daedalus/dark-cardano.ts
+++ b/source/renderer/app/themes/daedalus/dark-cardano.ts
@@ -7,7 +7,7 @@ export const DARK_CARDANO_THEME_OUTPUT = {
     '--theme-about-window-header-bottom-border-color': '#ffffff4d',
     '--theme-about-window-daedalus-icon-color': '#ffffff',
     '--theme-about-window-cardano-icon-color': '#ffffff',
-    '--theme-about-window-title-varsion-color': '#ffffff',
+    '--theme-about-window-title-version-color': '#ffffff',
     '--theme-about-window-title-stroke-color': '#ffffff',
     '--theme-about-window-content-color': '#ffffff',
     '--theme-about-window-content-text-color': '#ffffff',
@@ -156,6 +156,7 @@ export const DARK_CARDANO_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(54, 55, 77, 1)',
     '--theme-connecting-text-color': '#ffffff',
     '--theme-connecting-description-color': 'rgba(255, 255, 255, 0.7)',
+    '--theme-connecting-sync-progress-color': '#fff',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#ffffff',
@@ -279,6 +280,7 @@ export const DARK_CARDANO_THEME_OUTPUT = {
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
     '--theme-dialog-fullsize-button-label-color': '#000000',
     '--theme-dialog-fullsize-button-label-color-hover': '#000000',
+    '--theme-dialog-fullsize-secondary-text-action-color': '255, 255, 255',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -684,8 +686,10 @@ export const DARK_CARDANO_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(255, 255, 255, 0.7)',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(255, 255, 255, 0.05)',
     '--rp-select-input-border-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(255, 255, 255, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#ffffff',
     '--rp-select-input-placeholder-color': 'rgba(255, 255, 255, 0.5)',
   },
@@ -784,6 +788,8 @@ export const DARK_CARDANO_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#1fc1c3',
     '--theme-sidebar-category-networkInfo-text-color': '#121326',
+    '--theme-sidebar-sort-button-background-color': '250, 251, 252',
+    '--theme-sidebar-search-field-border-color': '255, 255, 255',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(42, 43, 60, 0.96)',
@@ -1009,6 +1015,10 @@ export const DARK_CARDANO_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(255, 255, 255, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#ffffff',
diff --git a/source/renderer/app/themes/daedalus/flight-candidate.ts b/source/renderer/app/themes/daedalus/flight-candidate.ts
index dbe94da95d..bed89525e1 100644
--- a/source/renderer/app/themes/daedalus/flight-candidate.ts
+++ b/source/renderer/app/themes/daedalus/flight-candidate.ts
@@ -7,7 +7,7 @@ export const FLIGHT_CANDIDATE_THEME_OUTPUT = {
     '--theme-about-window-header-bottom-border-color': '#ffffff4d',
     '--theme-about-window-daedalus-icon-color': '#ffffff',
     '--theme-about-window-cardano-icon-color': '#ffffff',
-    '--theme-about-window-title-varsion-color': '#ffffff',
+    '--theme-about-window-title-version-color': '#ffffff',
     '--theme-about-window-title-stroke-color': '#ffffff',
     '--theme-about-window-content-color': '#ffffff',
     '--theme-about-window-content-text-color': '#ffffff',
@@ -156,6 +156,7 @@ export const FLIGHT_CANDIDATE_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(54, 55, 77, 1)',
     '--theme-connecting-text-color': '#ffffff',
     '--theme-connecting-description-color': 'rgba(255, 255, 255, 0.7)',
+    '--theme-connecting-sync-progress-color': '#fff',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#ffffff',
@@ -279,6 +280,7 @@ export const FLIGHT_CANDIDATE_THEME_OUTPUT = {
     '--theme-dialog-fullsize-text-color': 'rgba(255, 255, 255, 0.7)',
     '--theme-dialog-fullsize-text-highlight-color': '#ffffff',
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
+    '--theme-dialog-fullsize-secondary-text-action-color': '255, 255, 255',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -682,8 +684,10 @@ export const FLIGHT_CANDIDATE_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(255, 255, 255, 0.7)',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(255, 255, 255, 0.05)',
     '--rp-select-input-border-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(255, 255, 255, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#ffffff',
     '--rp-select-input-placeholder-color': 'rgba(255, 255, 255, 0.5)',
   },
@@ -782,6 +786,8 @@ export const FLIGHT_CANDIDATE_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#ffb923',
     '--theme-sidebar-category-networkInfo-text-color': '#121326',
+    '--theme-sidebar-sort-button-background-color': '255, 255, 255',
+    '--theme-sidebar-search-field-border-color': '255, 255, 255',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(42, 43, 60, 0.96)',
@@ -1007,6 +1013,10 @@ export const FLIGHT_CANDIDATE_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(255, 255, 255, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#ffffff',
diff --git a/source/renderer/app/themes/daedalus/incentivized-testnet.ts b/source/renderer/app/themes/daedalus/incentivized-testnet.ts
index b243f44871..8ce56bef49 100644
--- a/source/renderer/app/themes/daedalus/incentivized-testnet.ts
+++ b/source/renderer/app/themes/daedalus/incentivized-testnet.ts
@@ -7,7 +7,7 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
     '--theme-about-window-header-bottom-border-color': '#ffffff4d',
     '--theme-about-window-daedalus-icon-color': '#ffffff',
     '--theme-about-window-cardano-icon-color': '#ffffff',
-    '--theme-about-window-title-varsion-color': '#ffffff',
+    '--theme-about-window-title-version-color': '#ffffff',
     '--theme-about-window-title-stroke-color': '#ffffff',
     '--theme-about-window-content-color': '#ffffff',
     '--theme-about-window-content-text-color': '#ffffff',
@@ -157,6 +157,7 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(42, 43, 60, 1)',
     '--theme-connecting-text-color': '#ffffff',
     '--theme-connecting-description-color': 'rgba(255, 255, 255, 0.7)',
+    '--theme-connecting-sync-progress-color': '#fff',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#ffffff',
@@ -280,6 +281,7 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
     '--theme-dialog-fullsize-text-color': 'rgba(255, 255, 255, 0.7)',
     '--theme-dialog-fullsize-text-highlight-color': '#ffffff',
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
+    '--theme-dialog-fullsize-secondary-text-action-color': '255, 255, 255',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -622,7 +624,7 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
     '--rp-input-bg-color': '#1e1f31',
     '--rp-input-bg-color-disabled': 'rgba(255, 255, 255, 0.05)',
     '--rp-input-border-color': 'rgba(255, 255, 255, 0.3)',
-    '--rp-input-border-color-disabled': 'rgba(255, 255, 255, 0.05)',
+    '--rp-input-border-color-disabled': 'transparent',
     '--rp-input-border-color-errored': '#ea4c5b',
     '--rp-input-border-color-focus': 'rgba(255, 255, 255, 0.7)',
     '--rp-input-line-height': '22px',
@@ -682,8 +684,10 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(255, 255, 255, 0.7)',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(255, 255, 255, 0.05)',
     '--rp-select-input-border-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(255, 255, 255, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#ffffff',
     '--rp-select-input-placeholder-color': 'rgba(255, 255, 255, 0.5)',
   },
@@ -784,6 +788,8 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#eb2256',
     '--theme-sidebar-category-networkInfo-text-color': '#121326',
+    '--theme-sidebar-sort-button-background-color': '255, 255, 255',
+    '--theme-sidebar-search-field-border-color': '255, 255, 255',
   },
   splash: {
     '--theme-splash-network-background-color': '#121326',
@@ -1010,6 +1016,10 @@ export const INCENTIVIZED_TESTNET_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(255, 255, 255, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#ffffff',
diff --git a/source/renderer/app/themes/daedalus/light-blue.ts b/source/renderer/app/themes/daedalus/light-blue.ts
index ce49b248eb..71c3abf722 100644
--- a/source/renderer/app/themes/daedalus/light-blue.ts
+++ b/source/renderer/app/themes/daedalus/light-blue.ts
@@ -8,7 +8,7 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
       'rgba(233, 244, 254, 0.3)',
     '--theme-about-window-daedalus-icon-color': '#e9f4fe',
     '--theme-about-window-cardano-icon-color': '#e9f4fe',
-    '--theme-about-window-title-varsion-color': '#e9f4fe',
+    '--theme-about-window-title-version-color': '#e9f4fe',
     '--theme-about-window-title-stroke-color': '#e9f4fe',
     '--theme-about-window-content-color': '#fafbfc',
     '--theme-about-window-content-text-color': 'rgba(250, 251, 252, 0.7)',
@@ -164,6 +164,7 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(28, 62, 101, 1)',
     '--theme-connecting-text-color': '#fff',
     '--theme-connecting-description-color': 'rgba(250, 251, 252, 0.7)',
+    '--theme-connecting-sync-progress-color': '#fafbfc',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#5e6066',
@@ -292,6 +293,7 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
     '--theme-dialog-fullsize-text-color': 'rgba(255, 255, 255, 0.7)',
     '--theme-dialog-fullsize-text-highlight-color': '#ffffff',
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
+    '--theme-dialog-fullsize-secondary-text-action-color': '250, 251, 252',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -635,7 +637,7 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
     '--rp-input-bg-color': '#fafbfc',
     '--rp-input-bg-color-disabled': 'rgba(94, 96, 102, 0.05)',
     '--rp-input-border-color': '#c6cdd6',
-    '--rp-input-border-color-disabled': 'rgba(94, 96, 102, 0.05)',
+    '--rp-input-border-color-disabled': 'transparent',
     '--rp-input-border-color-errored': '#ea4c5b',
     '--rp-input-border-color-focus': 'rgba(94, 96, 102, 0.7)',
     '--rp-input-line-height': '22px',
@@ -694,9 +696,11 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
   rpSelect: {
     '--rp-select-arrow-bg-color': 'rgba(94, 96, 102, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(94, 96, 102, 0.7)',
+    '--rp-select-input-bg-color-disabled': 'rgba(250, 251, 252, 0.05)',
     '--rp-select-input-bg-color': 'transparent',
     '--rp-select-input-border-color': 'rgba(94, 96, 102, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(94, 96, 102, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#5e6066',
     '--rp-select-input-placeholder-color': 'rgba(94, 96, 102, 0.5)',
   },
@@ -793,6 +797,8 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#fafbfc',
     '--theme-sidebar-category-networkInfo-text-color': '#5e6066',
+    '--theme-sidebar-sort-button-background-color': '250, 251, 252',
+    '--theme-sidebar-search-field-border-color': '250, 251, 252',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(36, 62, 98, 0.96)',
@@ -863,7 +869,7 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
     '--theme-staking-stake-pool-tooltip-table-title-color': '#5e6066',
     '--theme-staking-stake-pool-tooltip-text-color': '#5e6066',
     '--theme-staking-stake-pools-search-button-color': '#5e6066',
-    '--theme-staking-stake-pools-search-icon-color': 'rgba(94, 96, 102, 1)',
+    '--theme-staking-stake-pools-search-icon-color': '#5e6066',
     '--theme-staking-stake-pools-search-clear-button-background-color':
       'rgba(68, 91, 124, 0.1)',
     '--theme-staking-stake-pools-search-clear-button-color': '#5e6066',
@@ -1013,6 +1019,10 @@ export const LIGHT_BLUE_THEME_OUTPUT = {
       'rgba(68, 91, 124, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(68, 91, 124, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#5e6066',
diff --git a/source/renderer/app/themes/daedalus/shelley-testnet.ts b/source/renderer/app/themes/daedalus/shelley-testnet.ts
index efd940cf57..4017b6330a 100644
--- a/source/renderer/app/themes/daedalus/shelley-testnet.ts
+++ b/source/renderer/app/themes/daedalus/shelley-testnet.ts
@@ -7,7 +7,7 @@ export const SHELLEY_TESTNET_THEME_OUTPUT = {
     '--theme-about-window-header-bottom-border-color': '#ffffff4d',
     '--theme-about-window-daedalus-icon-color': '#ffffff',
     '--theme-about-window-cardano-icon-color': '#ffffff',
-    '--theme-about-window-title-varsion-color': '#ffffff',
+    '--theme-about-window-title-version-color': '#ffffff',
     '--theme-about-window-title-stroke-color': '#ffffff',
     '--theme-about-window-content-color': '#ffffff',
     '--theme-about-window-content-text-color': '#ffffff',
@@ -156,6 +156,7 @@ export const SHELLEY_TESTNET_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(54, 55, 77, 1)',
     '--theme-connecting-text-color': '#ffffff',
     '--theme-connecting-description-color': 'rgba(255, 255, 255, 0.7)',
+    '--theme-connecting-sync-progress-color': '#fff',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#ffffff',
@@ -279,6 +280,7 @@ export const SHELLEY_TESTNET_THEME_OUTPUT = {
     '--theme-dialog-fullsize-title-text-color': '#ffffff',
     '--theme-dialog-fullsize-field-background-color':
       'rgba(255, 255, 255, 0.07)',
+    '--theme-dialog-fullsize-secondary-text-action-color': '255, 255, 255',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -682,9 +684,11 @@ export const SHELLEY_TESTNET_THEME_OUTPUT = {
   rpSelect: {
     '--rp-select-arrow-bg-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(255, 255, 255, 0.7)',
+    '--rp-select-input-bg-color-disabled': 'rgba(255, 255, 255, 0.05)',
     '--rp-select-input-bg-color': 'transparent',
     '--rp-select-input-border-color': 'rgba(255, 255, 255, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(255, 255, 255, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#ffffff',
     '--rp-select-input-placeholder-color': 'rgba(255, 255, 255, 0.5)',
   },
@@ -783,6 +787,8 @@ export const SHELLEY_TESTNET_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#898ee6',
     '--theme-sidebar-category-networkInfo-text-color': '#121326',
+    '--theme-sidebar-sort-button-background-color': '255, 255, 255',
+    '--theme-sidebar-search-field-border-color': '255, 255, 255',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(42, 43, 60, 0.96)',
@@ -1007,6 +1013,10 @@ export const SHELLEY_TESTNET_THEME_OUTPUT = {
       'rgba(255, 255, 255, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(255, 255, 255, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#ffffff',
diff --git a/source/renderer/app/themes/daedalus/white.ts b/source/renderer/app/themes/daedalus/white.ts
index fce63a41b6..3e63b73bea 100644
--- a/source/renderer/app/themes/daedalus/white.ts
+++ b/source/renderer/app/themes/daedalus/white.ts
@@ -7,7 +7,7 @@ export const WHITE_THEME_OUTPUT = {
     '--theme-about-window-header-bottom-border-color': 'rgba(45, 45, 45, 0.2)',
     '--theme-about-window-daedalus-icon-color': '#29b595',
     '--theme-about-window-cardano-icon-color': '#29b595',
-    '--theme-about-window-title-varsion-color': '#2d2d2d',
+    '--theme-about-window-title-version-color': '#2d2d2d',
     '--theme-about-window-title-stroke-color': '#2d2d2d',
     '--theme-about-window-content-color': '#2d2d2d',
     '--theme-about-window-content-text-color': '#2d2d2d',
@@ -159,6 +159,7 @@ export const WHITE_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(249, 249, 249, 1)',
     '--theme-connecting-text-color': '#2d2d2d',
     '--theme-connecting-description-color': 'rgba(45, 45, 45, 0.7)',
+    '--theme-connecting-sync-progress-color': '#2d2d2d',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#2d2d2d',
@@ -280,6 +281,7 @@ export const WHITE_THEME_OUTPUT = {
     '--theme-dialog-fullsize-button-label-color': '#29b595',
     '--theme-dialog-fullsize-button-label-color-hover': '#fff',
     '--theme-dialog-fullsize-field-background-color': 'rgba(45, 45, 45, 0.07)',
+    '--theme-dialog-fullsize-secondary-text-action-color': '45, 45, 45',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -625,7 +627,7 @@ export const WHITE_THEME_OUTPUT = {
     '--rp-input-bg-color': '#fff',
     '--rp-input-bg-color-disabled': 'rgba(45, 45, 45, 0.05)',
     '--rp-input-border-color': 'rgba(45, 45, 45, 0.3)',
-    '--rp-input-border-color-disabled': 'rgba(45, 45, 45, 0.05)',
+    '--rp-input-border-color-disabled': 'transparent',
     '--rp-input-border-color-errored': '#ea4c5b',
     '--rp-input-border-color-focus': 'rgba(45, 45, 45, 0.7)',
     '--rp-input-line-height': '22px',
@@ -685,8 +687,10 @@ export const WHITE_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(45, 45, 45, 0.3)',
     '--rp-select-arrow-bg-color-open': 'rgba(45, 45, 45, 0.7)',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(45, 45, 45, 0.05)',
     '--rp-select-input-border-color': 'rgba(45, 45, 45, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(45, 45, 45, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#2d2d2d',
     '--rp-select-input-placeholder-color': 'rgba(45, 45, 45, 0.5)',
   },
@@ -787,6 +791,8 @@ export const WHITE_THEME_OUTPUT = {
       'rgba(45, 45, 45, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#29b595',
     '--theme-sidebar-category-networkInfo-text-color': '#fff',
+    '--theme-sidebar-sort-button-background-color': '45, 45, 45',
+    '--theme-sidebar-search-field-border-color': '45, 45, 45',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(255, 255, 255, 0.96)',
@@ -1008,6 +1014,10 @@ export const WHITE_THEME_OUTPUT = {
       'rgba(41, 181, 149, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(41, 181, 149, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#2d2d2d',
diff --git a/source/renderer/app/themes/daedalus/yellow.ts b/source/renderer/app/themes/daedalus/yellow.ts
index 13f60edbc4..ea12aa398a 100644
--- a/source/renderer/app/themes/daedalus/yellow.ts
+++ b/source/renderer/app/themes/daedalus/yellow.ts
@@ -7,7 +7,7 @@ export const YELLOW_THEME_OUTPUT = {
     '--theme-about-window-header-bottom-border-color': 'rgba(45, 45, 45, 0.2)',
     '--theme-about-window-daedalus-icon-color': '#2d2d2d',
     '--theme-about-window-cardano-icon-color': '#2d2d2d',
-    '--theme-about-window-title-varsion-color': '#2d2d2d',
+    '--theme-about-window-title-version-color': '#2d2d2d',
     '--theme-about-window-title-stroke-color': '#2d2d2d',
     '--theme-about-window-content-color': '#2d2d2d',
     '--theme-about-window-content-text-color': '#2d2d2d',
@@ -161,6 +161,7 @@ export const YELLOW_THEME_OUTPUT = {
     '--theme-connecting-background-color8': 'rgba(255, 185, 35, 1)',
     '--theme-connecting-text-color': '#2d2d2d',
     '--theme-connecting-description-color': 'rgba(45, 45, 45, 0.7)',
+    '--theme-connecting-sync-progress-color': '#2d2d2d',
   },
   dapps: {
     '--theme-dapp-transaction-request-separator': '#2d2d2d',
@@ -281,6 +282,7 @@ export const YELLOW_THEME_OUTPUT = {
     '--theme-dialog-fullsize-text-color': 'rgba(45, 45, 45, 0.7)',
     '--theme-dialog-fullsize-text-highlight-color': '#2d2d2d',
     '--theme-dialog-fullsize-title-text-color': 'rgba(45, 45, 45, 1)',
+    '--theme-dialog-fullsize-secondary-text-action-color': '45, 45, 45',
   },
   errors: {
     '--theme-color-error': '#ea4c5b',
@@ -620,7 +622,7 @@ export const YELLOW_THEME_OUTPUT = {
     '--rp-input-bg-color': '#ffffff',
     '--rp-input-bg-color-disabled': 'rgba(45, 45, 45, 0.05)',
     '--rp-input-border-color': 'rgba(45, 45, 45, 0.3)',
-    '--rp-input-border-color-disabled': 'rgba(45, 45, 45, 0.05)',
+    '--rp-input-border-color-disabled': 'transparent',
     '--rp-input-border-color-errored': '#ea4c5b',
     '--rp-input-border-color-focus': 'rgba(45, 45, 45, 0.7)',
     '--rp-input-line-height': '22px',
@@ -680,8 +682,10 @@ export const YELLOW_THEME_OUTPUT = {
     '--rp-select-arrow-bg-color': 'rgba(45, 45, 45, 0.2)',
     '--rp-select-arrow-bg-color-open': '#2d2d2d',
     '--rp-select-input-bg-color': 'transparent',
+    '--rp-select-input-bg-color-disabled': 'rgba(45, 45, 45, 0.05)',
     '--rp-select-input-border-color': 'rgba(45, 45, 45, 0.3)',
     '--rp-select-input-border-color-focus': 'rgba(45, 45, 45, 0.7)',
+    '--rp-select-input-border-color-disabled': 'transparent',
     '--rp-select-input-text-color': '#2d2d2d',
     '--rp-select-input-placeholder-color': 'rgba(45, 45, 45, 0.5)',
   },
@@ -784,6 +788,8 @@ export const YELLOW_THEME_OUTPUT = {
       'rgba(45, 45, 45, 0.5)',
     '--theme-sidebar-category-networkInfo-background-color': '#2d2d2d',
     '--theme-sidebar-category-networkInfo-text-color': '#fff',
+    '--theme-sidebar-sort-button-background-color': '45, 45, 45',
+    '--theme-sidebar-search-field-border-color': '45, 45, 45',
   },
   splash: {
     '--theme-splash-network-background-color': 'rgba(255, 185, 35, 0.96)',
@@ -1003,6 +1009,10 @@ export const YELLOW_THEME_OUTPUT = {
       'rgba(45, 45, 45, 0.05)',
     '--theme-tokens-list-header-expanded-background-color-hover':
       'rgba(45, 45, 45, 0.03)',
+    '--theme-tokens-picker-toolbar-box-shadow': 'rgba(0, 0, 0, 0.25)',
+    '--theme-tokens-picker-toolbar-border-bottom-color':
+      'rgba(94, 96, 102, 0.5)',
+    '--theme-tokens-picker-token-separator': 'rgba(94, 96, 102, 0.15)',
   },
   uploader: {
     '--theme-uploader-text-color': '#2d2d2d',
diff --git a/source/renderer/app/themes/mixins/layers.scss b/source/renderer/app/themes/mixins/layers.scss
new file mode 100644
index 0000000000..8d33339247
--- /dev/null
+++ b/source/renderer/app/themes/mixins/layers.scss
@@ -0,0 +1,5 @@
+$backdrop-z-index: 10000;
+$dialog-z-index: 10000;
+$loader-backdrop-z-index: 5;
+$back-to-top-z-index: 5;
+$sticky-header-z-index: 1;
diff --git a/source/renderer/app/themes/overrides/LinkOverrides.scss b/source/renderer/app/themes/overrides/LinkOverrides.scss
index e1653606a0..490e6d73aa 100644
--- a/source/renderer/app/themes/overrides/LinkOverrides.scss
+++ b/source/renderer/app/themes/overrides/LinkOverrides.scss
@@ -1,3 +1,3 @@
 .root {
-  // display: inline-block;
+  font-size: 14px;
 }
diff --git a/source/renderer/app/themes/overrides/ModalOverrides.scss b/source/renderer/app/themes/overrides/ModalOverrides.scss
index 7c0ab60c38..df00802366 100644
--- a/source/renderer/app/themes/overrides/ModalOverrides.scss
+++ b/source/renderer/app/themes/overrides/ModalOverrides.scss
@@ -1,9 +1,10 @@
 @import '../mixins/overlay-backdrop';
+@import '../mixins/layers.scss';
 
 .overlay {
   @include overlay-backrop;
   overflow: hidden;
-  z-index: 100;
+  z-index: $backdrop-z-index;
 }
 
 .modal {
diff --git a/source/renderer/app/themes/overrides/index.ts b/source/renderer/app/themes/overrides/index.ts
index 3faac8a186..a2f989f3c6 100644
--- a/source/renderer/app/themes/overrides/index.ts
+++ b/source/renderer/app/themes/overrides/index.ts
@@ -1,29 +1,16 @@
 import { IDENTIFIERS } from 'react-polymorph/lib/themes/API';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './AutocompleteOverrides.scss' ... Remove this comment to see the full error message
 import AutocompleteOverrides from './AutocompleteOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ButtonOverrides.scss' or its... Remove this comment to see the full error message
 import ButtonOverrides from './ButtonOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './CheckboxOverrides.scss' or i... Remove this comment to see the full error message
 import CheckboxOverrides from './CheckboxOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './InputOverrides.scss' or its ... Remove this comment to see the full error message
 import InputOverrides from './InputOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './LinkOverrides.scss' or its c... Remove this comment to see the full error message
 import LinkOverrides from './LinkOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ModalOverrides.scss' or its ... Remove this comment to see the full error message
 import ModalOverrides from './ModalOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './RadioOverrides.scss' or its ... Remove this comment to see the full error message
 import RadioOverrides from './RadioOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './ScrollbarOverrides.scss' or ... Remove this comment to see the full error message
 import ScrollbarOverrides from './ScrollbarOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './StepperOverrides.scss' or it... Remove this comment to see the full error message
 import StepperOverrides from './StepperOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SwitchOverrides.scss' or its... Remove this comment to see the full error message
 import SwitchOverrides from './SwitchOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './SelectOverrides.scss' or its... Remove this comment to see the full error message
 import SelectOverrides from './SelectOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './OptionsOverrides.scss' or it... Remove this comment to see the full error message
 import OptionsOverrides from './OptionsOverrides.scss';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module './PopOverOverrides.scss' or it... Remove this comment to see the full error message
 import PopOverOverrides from './PopOverOverrides.scss';
 
 const {
diff --git a/source/renderer/app/themes/utils/copyTheme.ts b/source/renderer/app/themes/utils/copyTheme.ts
index f6a7721ab4..e779bd9843 100644
--- a/source/renderer/app/themes/utils/copyTheme.ts
+++ b/source/renderer/app/themes/utils/copyTheme.ts
@@ -43,9 +43,11 @@ const copy = async () => {
     }
 
     fromPrefix = fromPrefix.trim();
-    ({ items: foundProperties, category: fromCategory } =
+    ({
+      items: foundProperties,
+      category: fromCategory,
       // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string | { aboutWindow: { '--the... Remove this comment to see the full error message
-      findPropertiesFromPrefix(firstTheme, fromPrefix));
+    } = findPropertiesFromPrefix(firstTheme, fromPrefix));
 
     // No properties found
     if (!foundProperties.length) {
@@ -113,9 +115,11 @@ const copy = async () => {
     }
 
     toPrefix = toPrefix.trim();
-    ({ items: existingProperties, category: toCategory } =
+    ({
+      items: existingProperties,
+      category: toCategory,
       // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string | { aboutWindow: { '--the... Remove this comment to see the full error message
-      findPropertiesFromPrefix(firstTheme, toPrefix));
+    } = findPropertiesFromPrefix(firstTheme, toPrefix));
     // Check existing properties with the given new prefix
     const conflictingProperties = existingProperties.filter(
       (existingProperty) => {
diff --git a/source/renderer/app/themes/utils/createTheme.ts b/source/renderer/app/themes/utils/createTheme.ts
index 0c24c638d0..3f8c5628db 100644
--- a/source/renderer/app/themes/utils/createTheme.ts
+++ b/source/renderer/app/themes/utils/createTheme.ts
@@ -259,7 +259,7 @@ export const createDaedalusComponentsTheme = (
       ).alpha(0.3)}`,
       '--theme-about-window-daedalus-icon-color': `${text.secondary}`,
       '--theme-about-window-cardano-icon-color': `${text.secondary}`,
-      '--theme-about-window-title-varsion-color': `${text.secondary}`,
+      '--theme-about-window-title-version-color': `${text.secondary}`,
       '--theme-about-window-title-stroke-color': `${text.secondary}`,
       '--theme-about-window-content-color': `${text.secondary}`,
       '--theme-about-window-content-text-color': `${text.secondary}`,
diff --git a/source/renderer/app/themes/utils/updateThemesCLI.ts b/source/renderer/app/themes/utils/updateThemesCLI.ts
index d1b79a037a..52f483e30c 100644
--- a/source/renderer/app/themes/utils/updateThemesCLI.ts
+++ b/source/renderer/app/themes/utils/updateThemesCLI.ts
@@ -21,7 +21,7 @@ export const runUpdateThemesCLI = (pendingUpdates: PendingThemesUpdates) => {
   rl.on('line', (line) => {
     switch (line.trim()) {
       case 'yes': {
-        logMsg(chalk`\n{cyan Upating themes...}\n`);
+        logMsg(chalk`\n{cyan Updating themes...}\n`);
         // combines pending theme updates with existing theme outputs
         const updatedThemes = updateThemes(pendingUpdates);
 
@@ -41,7 +41,7 @@ export const runUpdateThemesCLI = (pendingUpdates: PendingThemesUpdates) => {
           chalk`{cyan Prettier is now formatting the updated theme files.}`
         );
         logMsg(
-          chalk`{cyan Once Prettier finshes, please check the diff and commit the changes if all is correct.}`
+          chalk`{cyan Once Prettier finishes, please check the diff and commit the changes if all is correct.}`
         );
         logMsg(chalk`\n{cyan Prettier in progress...}\n`);
         process.exit(0);
diff --git a/source/renderer/app/types/applicationDialogTypes.ts b/source/renderer/app/types/applicationDialogTypes.ts
index da7916b9c3..90735c3c8b 100644
--- a/source/renderer/app/types/applicationDialogTypes.ts
+++ b/source/renderer/app/types/applicationDialogTypes.ts
@@ -1,4 +1,5 @@
 export type ApplicationDialog =
   | 'ABOUT_DIALOG'
   | 'DAEDALUS_DIAGNOSTICS_DIALOG'
+  | 'TOGGLE_RTS_FLAGS_MODE_DIALOG'
   | null;
diff --git a/source/renderer/app/types/i18nTypes.ts b/source/renderer/app/types/i18nTypes.ts
index 4e4b0bd373..ebd255b854 100644
--- a/source/renderer/app/types/i18nTypes.ts
+++ b/source/renderer/app/types/i18nTypes.ts
@@ -3,13 +3,10 @@ export type ReactIntlMessage = {
   defaultMessage: string;
   description: string;
 };
-// @ts-ignore ts-migrate(2456) FIXME: Type alias 'Record' circularly references itself.
-type Record<T, V> = Record<T, V>;
 type MessageFormatPrimitiveValue = string | number | boolean | null;
 export type Intl = {
   formatMessage: (
     message: ReactIntlMessage,
-    // @ts-ignore ts-migrate(2315) FIXME: Type 'Record' is not generic.
     values?: Record<string, MessageFormatPrimitiveValue>
   ) => string;
 };
diff --git a/source/renderer/app/types/sidebarTypes.ts b/source/renderer/app/types/sidebarTypes.ts
index 53eb1507de..b0c8355976 100644
--- a/source/renderer/app/types/sidebarTypes.ts
+++ b/source/renderer/app/types/sidebarTypes.ts
@@ -11,3 +11,22 @@ export type SidebarWalletType = {
   isNotResponding: boolean;
   hasNotification: boolean;
 };
+export type WalletSortByOptions = 'DATE' | 'BALANCE' | 'NAME' | 'NONE';
+export type WalletSortOrderOptions = 'asc' | 'desc';
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
+export const WalletSortBy: EnumMap<string, WalletSortByOptions> = {
+  Date: 'DATE',
+  Balance: 'BALANCE',
+  Name: 'NAME',
+  None: 'NONE',
+};
+// @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'EnumMap'.
+export const WalletSortOrder: EnumMap<string, WalletSortOrderOptions> =
+  Object.freeze({
+    Desc: 'desc',
+    Asc: 'asc',
+  });
+export type WalletSortConfig = {
+  sortBy: WalletSortByOptions;
+  sortOrder: WalletSortOrderOptions;
+};
diff --git a/source/renderer/app/types/systemInfoTypes.ts b/source/renderer/app/types/systemInfoTypes.ts
index 3148d348bb..31b5a71b0e 100644
--- a/source/renderer/app/types/systemInfoTypes.ts
+++ b/source/renderer/app/types/systemInfoTypes.ts
@@ -4,4 +4,6 @@ export type SystemInfo = {
   cpu: string;
   ram: string;
   availableDiskSpace: string;
+  hasMetHardwareRequirements: boolean;
+  isRTSFlagsModeEnabled: boolean;
 };
diff --git a/source/renderer/app/utils/ReactToolboxMobxForm.ts b/source/renderer/app/utils/ReactToolboxMobxForm.ts
index 66c5e4d9b8..59767272f0 100644
--- a/source/renderer/app/utils/ReactToolboxMobxForm.ts
+++ b/source/renderer/app/utils/ReactToolboxMobxForm.ts
@@ -1,7 +1,7 @@
 import MobxReactForm from 'mobx-react-form';
 import { waitForExist } from './waitForExist';
 
-export default class ReactToolboxMobxForm extends MobxReactForm {
+export default class ReactToolboxMobxForm<T> extends MobxReactForm<T> {
   bindings() {
     return {
       ReactToolbox: {
diff --git a/source/renderer/app/utils/assets.ts b/source/renderer/app/utils/assets.ts
index 23e424163b..2c94dca790 100644
--- a/source/renderer/app/utils/assets.ts
+++ b/source/renderer/app/utils/assets.ts
@@ -37,10 +37,12 @@ export const filterAssets = (
 export const getZeroToken = ({
   policyId,
   assetName,
+  assetNameASCII,
   uniqueId,
 }: Asset): Token => ({
   policyId,
   assetName,
+  assetNameASCII,
   uniqueId,
   quantity: new BigNumber(0),
 });
@@ -50,7 +52,7 @@ export const getZeroToken = ({
  * Then retrieves the token with the same uniqueId
  * @param asset - asset details
  * @param tokens - list of Tokens
- * See Asset/Token differences at the begining of this doc
+ * See Asset/Token differences at the beginning of this doc
  */
 export const getToken = (asset: Asset, tokens: Tokens) => {
   let token = tokens.find(({ uniqueId }) => uniqueId === asset.uniqueId);
@@ -67,12 +69,13 @@ export const getToken = (asset: Asset, tokens: Tokens) => {
  * then merges them into an AssetToken
  * @param asset - asset details
  * @param token - token details
- * See Asset/Token differences at the begining of this doc
+ * See Asset/Token differences at the beginning of this doc
  */
 export const getAssetToken = (
   {
     policyId,
     assetName,
+    assetNameASCII,
     fingerprint,
     metadata,
     decimals,
@@ -83,6 +86,7 @@ export const getAssetToken = (
 ): AssetToken => ({
   policyId,
   assetName,
+  assetNameASCII,
   quantity,
   address,
   fingerprint,
@@ -97,7 +101,7 @@ export const getAssetToken = (
  * then merges them into AssetTokens
  * @param assets - list of asset details
  * @param tokens - list of token details
- * See Asset/Token differences at the begining of this doc
+ * See Asset/Token differences at the beginning of this doc
  */
 export const getAssetTokens = (
   assets: Array<Asset>,
@@ -113,18 +117,19 @@ export const getAssetTokens = (
  * and combines with the data from the Asset
  * @param asset - asset details
  * @param getAsset - function that returns an asset
- * See Asset/Token differences at the begining of this doc
+ * See Asset/Token differences at the beginning of this doc
  */
 export const getAssetTokenFromToken = (
   asset: Token,
   getAsset: (...args: Array<any>) => any
 ): AssetToken => {
-  const { policyId, assetName, quantity, address } = asset;
+  const { policyId, assetName, assetNameASCII, quantity, address } = asset;
   const { fingerprint, metadata, decimals, recommendedDecimals, uniqueId } =
     getAsset(policyId, assetName) || {};
   return {
     policyId,
     assetName,
+    assetNameASCII,
     quantity,
     address,
     fingerprint,
@@ -261,11 +266,13 @@ export const searchAssets = (
   }
 
   return filter(assets, (asset) => {
-    const { policyId, assetName, fingerprint, metadata } = asset;
+    const { policyId, assetName, assetNameASCII, fingerprint, metadata } =
+      asset;
     const { name, ticker, description } = metadata || {};
     const checkList = [
       policyId,
       assetName,
+      assetNameASCII,
       fingerprint,
       metadata,
       name,
diff --git a/source/renderer/app/utils/buildSystemInfo.ts b/source/renderer/app/utils/buildSystemInfo.ts
new file mode 100644
index 0000000000..b42ad00995
--- /dev/null
+++ b/source/renderer/app/utils/buildSystemInfo.ts
@@ -0,0 +1,17 @@
+import type { SystemInfo } from '../types/systemInfoTypes';
+import { formattedBytesToSize } from './formatters';
+import type { Environment } from '../../../common/types/environment.types';
+import NetworkStatusStore from '../stores/NetworkStatusStore';
+
+export const buildSystemInfo = (
+  environment: Environment,
+  networkStatus: NetworkStatusStore
+): SystemInfo => ({
+  platform: environment.os,
+  platformVersion: environment.platformVersion,
+  cpu: Array.isArray(environment.cpu) ? environment.cpu[0].model : '',
+  ram: formattedBytesToSize(environment.ram),
+  hasMetHardwareRequirements: environment.hasMetHardwareRequirements,
+  availableDiskSpace: networkStatus.diskSpaceAvailable,
+  isRTSFlagsModeEnabled: networkStatus.isRTSFlagsModeEnabled,
+});
diff --git a/source/renderer/app/utils/formatCpuInfo.spec.ts b/source/renderer/app/utils/formatCpuInfo.spec.ts
new file mode 100644
index 0000000000..5e103086b0
--- /dev/null
+++ b/source/renderer/app/utils/formatCpuInfo.spec.ts
@@ -0,0 +1,80 @@
+import formatCpuInfo from './formatCpuInfo';
+
+describe('Formatters/formatCpuInfo', () => {
+  it('gives correct model name and clock speed for Intel format', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2741) FIXME: Property 'times' is missing in type '{ model: stri... Remove this comment to see the full error message
+        {
+          model: 'Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz',
+          speed: 2600,
+        },
+      ])
+    ).toEqual('Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz');
+  });
+  it('gives correct model name and clock speed for AMD format', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2741) FIXME: Property 'times' is missing in type '{ model: stri... Remove this comment to see the full error message
+        {
+          model: 'AMD Ryzen 7 3700U with Radeon Vega Mobile Gfx',
+          speed: 2400,
+        },
+      ])
+    ).toEqual('AMD Ryzen 7 3700U with Radeon Vega Mobile Gfx @ 2.40GHz');
+  });
+  it('removes all unnecessary whitespace characters', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2741) FIXME: Property 'times' is missing in type '{ model: stri... Remove this comment to see the full error message
+        {
+          model: ' Super Fast    NextGen\tProcessor ',
+          speed: 1000,
+        },
+      ])
+    ).toEqual('Super Fast NextGen Processor @ 1.00GHz');
+  });
+  it('returns empty string if there is no any thread data present', () => {
+    expect(formatCpuInfo([])).toEqual('');
+  });
+  it('returns empty string if there is no model property present', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2739) FIXME: Type '{ speed: number; }' is missing the following... Remove this comment to see the full error message
+        {
+          speed: 1000,
+        },
+      ])
+    ).toEqual('');
+  });
+  it('returns model name if there is no speed property present', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2739) FIXME: Type '{ model: string; }' is missing the following... Remove this comment to see the full error message
+        {
+          model: 'Model name',
+        },
+      ])
+    ).toEqual('Model name');
+  });
+  it('returns parsed model if there is no speed property present but the model property contains speed expressed in GHz', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2739) FIXME: Type '{ model: string; }' is missing the following... Remove this comment to see the full error message
+        {
+          model: 'Model name @ 0.5 GHz',
+        },
+      ])
+    ).toEqual('Model name @ 0.50GHz');
+  });
+  it('returns model name if there is no speed property present and neither speed correctly expressed in the model', () => {
+    expect(
+      formatCpuInfo([
+        // @ts-ignore ts-migrate(2739) FIXME: Type '{ model: string; }' is missing the following... Remove this comment to see the full error message
+        {
+          model: 'Model name @ 1 MHz',
+        },
+      ])
+    ).toEqual('Model name');
+  });
+});
diff --git a/source/renderer/app/utils/formatCpuInfo.ts b/source/renderer/app/utils/formatCpuInfo.ts
new file mode 100644
index 0000000000..04511145e5
--- /dev/null
+++ b/source/renderer/app/utils/formatCpuInfo.ts
@@ -0,0 +1,46 @@
+import type {
+  Cpu,
+  CpuThreadData,
+} from '../../../common/types/environment.types';
+import { formattedNumber } from './formatters';
+
+type FormatArgs = {
+  modelName: string;
+  speedValue: string;
+};
+
+const format = ({ modelName, speedValue }: FormatArgs) =>
+  `${modelName} @ ${speedValue}GHz`;
+
+const formatCpuInfo = (cpu: Cpu): string => {
+  const { model, speed } = cpu?.[0] || ({} as CpuThreadData);
+  if (!model) return '';
+  const [modelName, modelSpeedSection] = model
+    .split('@')
+    .map((stringPart) => stringPart.trim().replace(/\s+/g, ' '));
+
+  if (speed) {
+    const speedValue = formattedNumber(speed / 1000, 2);
+    return format({
+      modelName,
+      speedValue,
+    });
+  }
+
+  const modelSpeedSectionExpressedInGHz = !!modelSpeedSection?.match(/GHz/);
+
+  if (!modelSpeedSection && !modelSpeedSectionExpressedInGHz) {
+    return modelName;
+  }
+
+  const rawSpeedValue = modelSpeedSection.match(/([\d,.]+)\s*GHz/)?.[1];
+  const parsedSpeedValue = parseFloat(rawSpeedValue);
+  if (!parsedSpeedValue) return modelName;
+  const speedValue = formattedNumber(parsedSpeedValue, 2);
+  return format({
+    modelName,
+    speedValue,
+  });
+};
+
+export default formatCpuInfo;
diff --git a/source/renderer/app/utils/formatters.ts b/source/renderer/app/utils/formatters.ts
index 7dabf443b2..ee728c2739 100644
--- a/source/renderer/app/utils/formatters.ts
+++ b/source/renderer/app/utils/formatters.ts
@@ -19,11 +19,12 @@ export const formattedWalletAmount = (
   amount: BigNumber,
   withCurrency = true,
   long = true,
-  currency = 'ADA'
+  currency = 'ADA',
+  decimalPlaces: number = DECIMAL_PLACES_IN_ADA
 ): string => {
   let formattedAmount = long
-    ? new BigNumber(amount).toFormat(DECIMAL_PLACES_IN_ADA)
-    : shortNumber(amount);
+    ? new BigNumber(amount).toFormat(decimalPlaces)
+    : shortNumber(amount, decimalPlaces);
   // @ts-ignore ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
   const { decimalSeparator } = BigNumber.config().FORMAT;
 
@@ -114,7 +115,10 @@ export const formattedTokenDecimals = (
 // B        Billion             1.00E+09
 // T        Trillion            1.00E+12
 // Q        Quadrillion         1.00E+15
-export const shortNumber = (value: number | BigNumber): string => {
+export const shortNumber = (
+  value: number | BigNumber,
+  decimalPlaces: number = DECIMAL_PLACES_IN_ADA
+): string => {
   const amount = new BigNumber(value);
   let formattedAmount = '';
 
@@ -122,7 +126,7 @@ export const shortNumber = (value: number | BigNumber): string => {
     formattedAmount = '0';
   } else if (amount.isLessThan(1000)) {
     formattedAmount = `${amount.decimalPlaces(
-      DECIMAL_PLACES_IN_ADA,
+      decimalPlaces,
       BigNumber.ROUND_DOWN
     )}`;
   } else if (amount.isLessThan(1000000)) {
diff --git a/source/renderer/app/utils/hardwareWalletUtils.ts b/source/renderer/app/utils/hardwareWalletUtils.ts
index f506e7cabc..85307f8953 100644
--- a/source/renderer/app/utils/hardwareWalletUtils.ts
+++ b/source/renderer/app/utils/hardwareWalletUtils.ts
@@ -11,21 +11,23 @@ export type PathRoleIdentityType =
   | 'utxo_internal'
   | 'mutable_account'
   | 'multisig_script';
-
 // Constants
 export const CERTIFICATE_TYPE = {
-  register_reward_account: 0, // register_reward_account
-  quit_pool: 1, // quit_pool
+  register_reward_account: 0,
+  // register_reward_account
+  quit_pool: 1,
+  // quit_pool
   join_pool: 2, // join_pool
 };
-
 export const PATH_ROLE_IDENTITY = {
-  role0: 'utxo_external', // address
-  role1: 'utxo_internal', // change
-  role2: 'mutable_account', // stake
+  role0: 'utxo_external',
+  // address
+  role1: 'utxo_internal',
+  // change
+  role2: 'mutable_account',
+  // stake
   role3: 'multisig_script', // script
 };
-
 // See src/cardano.h in https://github.com/vacuumlabs/ledger-app-cardano-shelley
 export const MAX_HUMAN_ADDRESS_LENGTH = 150;
 // https://github.com/cardano-foundation/CIPs/blob/master/CIP-0005/CIP-0005.md
@@ -33,76 +35,76 @@ export const KEY_PREFIXES = {
   // ...add more keys if needed
   PUBLIC_KEY_WITH_CHAIN_CODE: 'acct_xvk', // Ed25519 public key with chain code
 };
-
 // Helpers
-
 const receiverAddressTypes: Set<AddressType> = new Set([
   0, 1, 2, 3, 4, 5, 6, 7, 8,
 ]);
-
 export const isReceiverAddressType = (addressType: AddressType) =>
   receiverAddressTypes.has(addressType);
-
 // [1852H, 1815H, 0H] => m/1852'/1815'/0'
 export const derivationPathToString = (derivationPath: Array<string>) => {
   let constructedPath = 'm';
+
   _.map(derivationPath, (chunk) => {
     constructedPath = `${constructedPath}/${chunk.replace('H', "'")}`;
   });
+
   return constructedPath;
 };
-
 // m/1852'/1815'/0' => 1852'/1815'/0'
 export const derivationPathToAddressPath = (derivationPath: Array<string>) => {
   const derivationPathString = derivationPathToString(derivationPath);
   const addressPath = derivationPathString.replace('m/', '');
   return addressPath;
 };
-
 // [1852H, 1815H, 0H] => [2147485500, 2147485463, 2147483648]
 export const derivationPathToLedgerPath = (derivationPath: Array<string>) => {
   const transformedPath = _.map(derivationPath, (chunk) =>
     chunk.replace('H', "'")
   );
+
   const constructedPath = _.join(transformedPath, '/');
+
   return utils.str_to_path(constructedPath);
 };
-
 export const getParamsFromPath = (derivationPath: Array<string>) => {
   const pathParams = _.takeRight(derivationPath, 2);
+
   return {
     role: pathParams[0],
     index: pathParams[1],
     roleIdentity: PATH_ROLE_IDENTITY[`role${pathParams[0]}`],
   };
 };
-
 // [2147485500, 2147485463, 2147483648] => 1852'/1815'/0'
 export const hardenedPathToString = (hardendedPath: Array<number>) => {
   const path = _.map(hardendedPath, (chunk) => `${chunk - HARDENED}H`);
+
   return derivationPathToString(path).replace('m/', '');
 };
-
 // [2147485500, 2147485463, 2147483648] => [1852H, 1815H, 0H, 0, 1]
 export const hardenedPathToDerivationPath = (hardendedPath: Array<number>) => {
   const derivationPath = [];
   const constructedDerivationPath = ['m'];
+
   _.map(hardendedPath, (chunk, index) => {
     let pathChunk = chunk.toString();
     let constructedPathChunk = chunk.toString();
+
     if (index <= 2) {
       pathChunk = `${chunk - HARDENED}H`;
       constructedPathChunk = `${chunk - HARDENED}'`;
     }
+
     derivationPath.push(pathChunk);
     constructedDerivationPath.push(constructedPathChunk);
   });
+
   return {
     derivationPath,
     constructed: constructedDerivationPath,
   };
 };
-
 export const bech32EncodePublicKey = (data: Buffer): string => {
   const data5bit = bech32.toWords(data);
   return bech32.encode(
@@ -111,17 +113,16 @@ export const bech32EncodePublicKey = (data: Buffer): string => {
     MAX_HUMAN_ADDRESS_LENGTH
   );
 };
-
 export const bech32DecodePublicKey = (data: string): Buffer => {
   const { words } = bech32.decode(data, 1000);
   return Buffer.from(bech32.fromWords(words));
 };
-
 export const groupTokensByPolicyId = (assets: CoinSelectionAssetsType) => {
   const compareStringsCanonically = (string1: string, string2: string) =>
     string1.length - string2.length || string1.localeCompare(string2);
 
   const groupedAssets = {};
+
   _(assets)
     .orderBy(['policyId', 'assetName'], ['asc', 'asc'])
     .groupBy(({ policyId }) => policyId)
@@ -146,5 +147,6 @@ export const groupTokensByPolicyId = (assets: CoinSelectionAssetsType) => {
       groupedAssets[sortedAssetsGroup.policyId] = sortedAssetsGroup.assets;
       return groupedAssets;
     });
+
   return groupedAssets;
 };
diff --git a/source/renderer/app/utils/mobx-features/hooks.ts b/source/renderer/app/utils/mobx-features/hooks.ts
index f7b020fc18..c0d66606b0 100644
--- a/source/renderer/app/utils/mobx-features/hooks.ts
+++ b/source/renderer/app/utils/mobx-features/hooks.ts
@@ -14,14 +14,12 @@ export const useFeature = (feature: Feature) => {
     // Start feature store before first render is done
     feature.start();
   }, []);
-  useEffect(
-    () =>
-      // Stop store on unmount
-      () => {
-        feature.stop();
-      },
-    []
-  );
+  useEffect(() => {
+    // Stop store on unmount
+    return () => {
+      feature.stop();
+    };
+  }, []);
 };
 
 /**
diff --git a/source/renderer/app/utils/numbers.ts b/source/renderer/app/utils/numbers.ts
index 221e5504f2..dce6f0ab6e 100644
--- a/source/renderer/app/utils/numbers.ts
+++ b/source/renderer/app/utils/numbers.ts
@@ -4,7 +4,9 @@ export const rangeMap = (
   stop1: number,
   start2: number,
   stop2: number
-): number => ((n - start1) / (stop1 - start1)) * (stop2 - start2) + start2;
+): number => {
+  return ((n - start1) / (stop1 - start1)) * (stop2 - start2) + start2;
+};
 export const closestNumber = (number: number, numbers: Array<number>) =>
   numbers.sort((a, b) => a - b).find((item) => item > number);
 export const randomInRange = (min: number, max: number) =>
diff --git a/source/renderer/app/utils/shelleyLedger.ts b/source/renderer/app/utils/shelleyLedger.ts
index 5e1f13ff9b..55aa38a9dd 100644
--- a/source/renderer/app/utils/shelleyLedger.ts
+++ b/source/renderer/app/utils/shelleyLedger.ts
@@ -242,27 +242,31 @@ export const ShelleyTxWithdrawal = (
     encodeCBOR,
   };
 };
-export const prepareLedgerCertificate = (cert: CoinSelectionCertificate) => ({
-  type: CERTIFICATE_TYPE[cert.certificateType],
-  params: {
-    stakeCredential: {
-      type: StakeCredentialParamsType.KEY_PATH,
-      keyPath: derivationPathToLedgerPath(cert.rewardAccountPath),
+export const prepareLedgerCertificate = (cert: CoinSelectionCertificate) => {
+  return {
+    type: CERTIFICATE_TYPE[cert.certificateType],
+    params: {
+      stakeCredential: {
+        type: StakeCredentialParamsType.KEY_PATH,
+        keyPath: derivationPathToLedgerPath(cert.rewardAccountPath),
+      },
+      poolKeyHashHex: cert.pool
+        ? utils.buf_to_hex(utils.bech32_decodeAddress(cert.pool))
+        : null,
     },
-    poolKeyHashHex: cert.pool
-      ? utils.buf_to_hex(utils.bech32_decodeAddress(cert.pool))
-      : null,
-  },
-});
+  };
+};
 export const prepareLedgerWithdrawal = (
   withdrawal: CoinSelectionWithdrawal
-) => ({
-  stakeCredential: {
-    type: StakeCredentialParamsType.KEY_PATH,
-    keyPath: derivationPathToLedgerPath(withdrawal.derivationPath),
-  },
-  amount: withdrawal.amount.quantity.toString(),
-});
+) => {
+  return {
+    stakeCredential: {
+      type: StakeCredentialParamsType.KEY_PATH,
+      keyPath: derivationPathToLedgerPath(withdrawal.derivationPath),
+    },
+    amount: withdrawal.amount.quantity.toString(),
+  };
+};
 export const ShelleyFee = (fee: number) => {
   function encodeCBOR(encoder: any) {
     return encoder.pushAny(fee);
@@ -409,12 +413,16 @@ export const CachedDeriveXpubFactory = (
   return deriveXpub;
 };
 // Helpers
-export const indexIsHardened = (index: number) => index >= HARDENED_THRESHOLD;
-export const prepareLedgerInput = (input: CoinSelectionInput) => ({
-  txHashHex: input.id,
-  outputIndex: input.index,
-  path: derivationPathToLedgerPath(input.derivationPath),
-});
+export const indexIsHardened = (index: number) => {
+  return index >= HARDENED_THRESHOLD;
+};
+export const prepareLedgerInput = (input: CoinSelectionInput) => {
+  return {
+    txHashHex: input.id,
+    outputIndex: input.index,
+    path: derivationPathToLedgerPath(input.derivationPath),
+  };
+};
 export const prepareLedgerOutput = (
   output: CoinSelectionOutput,
   addressStyle: AddressStyle
@@ -491,15 +499,17 @@ export const cborizeTxVotingRegistration = ({
   stakePubKey,
   rewardDestinationAddress,
   nonce,
-}: TxAuxiliaryData) => [
-  61284,
-  new Map<number, Buffer | number>([
-    [1, Buffer.from(votingPubKey, 'hex')],
-    [2, Buffer.from(stakePubKey, 'hex')],
-    [3, utils.bech32_decodeAddress(rewardDestinationAddress.address)],
-    [4, Number(nonce)],
-  ]),
-];
+}: TxAuxiliaryData) => {
+  return [
+    61284,
+    new Map<number, Buffer | number>([
+      [1, Buffer.from(votingPubKey, 'hex')],
+      [2, Buffer.from(stakePubKey, 'hex')],
+      [3, utils.bech32_decodeAddress(rewardDestinationAddress.address)],
+      [4, Number(nonce)],
+    ]),
+  ];
+};
 export const cborizeTxAuxiliaryVotingData = (
   txAuxiliaryData: TxAuxiliaryData,
   signatureHex: string
diff --git a/source/renderer/app/utils/shelleyTrezor.ts b/source/renderer/app/utils/shelleyTrezor.ts
index fb0271263d..4fab698a77 100644
--- a/source/renderer/app/utils/shelleyTrezor.ts
+++ b/source/renderer/app/utils/shelleyTrezor.ts
@@ -17,11 +17,13 @@ export const TrezorTransactionSigningMode = {
   ORDINARY_TRANSACTION: 0,
   POOL_REGISTRATION_AS_OWNER: 1,
 };
-export const prepareTrezorInput = (input: CoinSelectionInput) => ({
-  path: derivationPathToString(input.derivationPath),
-  prev_hash: input.id,
-  prev_index: input.index,
-});
+export const prepareTrezorInput = (input: CoinSelectionInput) => {
+  return {
+    path: derivationPathToString(input.derivationPath),
+    prev_hash: input.id,
+    prev_index: input.index,
+  };
+};
 export const prepareTrezorOutput = (output: CoinSelectionOutput) => {
   let tokenBundle = [];
 
@@ -65,10 +67,12 @@ export const prepareTrezorCertificate = (cert: CoinSelectionCertificate) => {
 };
 export const prepareTrezorWithdrawal = (
   withdrawal: CoinSelectionWithdrawal
-) => ({
-  path: derivationPathToString(withdrawal.derivationPath),
-  amount: withdrawal.amount.quantity.toString(),
-});
+) => {
+  return {
+    path: derivationPathToString(withdrawal.derivationPath),
+    amount: withdrawal.amount.quantity.toString(),
+  };
+};
 export type TrezorVotingDataType = {
   votingKey: string;
   nonce: string;
diff --git a/source/renderer/app/utils/transaction.tsx b/source/renderer/app/utils/transaction.tsx
index 01f3e472ab..de39d5fef8 100644
--- a/source/renderer/app/utils/transaction.tsx
+++ b/source/renderer/app/utils/transaction.tsx
@@ -300,9 +300,11 @@ export const thDataHexGenerator = (txData: CoinSelectionsResponse) => {
   const txDataHex = encodeTransaction(txData).toString('hex');
   return txDataHex;
 };
-export const encodeSignedTransaction = (
-  { txDataHex, witnesses }: ByronEncodeSignedTransactionRequest //  {
-) =>
+export const encodeSignedTransaction = ({
+  txDataHex,
+  witnesses,
+}: ByronEncodeSignedTransactionRequest) => {
+  //  {
   //    txDataHex: '01f54c866c778568c01b9e4c0a2cbab29e0af285623404e0ef922c6b63f9b222',
   //    witnesses: [
   //      {
@@ -314,13 +316,16 @@ export const encodeSignedTransaction = (
   //      }
   //    ]
   //  }
-  Buffer.concat([
+  return Buffer.concat([
     rawBuffer('82'),
     rawBuffer(txDataHex),
     cbor.encode(witnesses.map(encodeWitness)),
   ]).toString('hex');
+};
 
-const rawBuffer = (str) => Buffer.from(str, 'hex');
+const rawBuffer = (str) => {
+  return Buffer.from(str, 'hex');
+};
 
 const encodeWitness = ({
   signature,
@@ -333,25 +338,29 @@ const encodeWitness = ({
   return [0, new cbor.Tagged(24, cbor.encode(witness))];
 };
 
-const encodeTransaction = (data) =>
-  cbor.encode([
+const encodeTransaction = (data) => {
+  return cbor.encode([
     encodeTransactionInputs(data.inputs),
     encodeTransactionOutputs(data.outputs),
     {}, // always empty in Byron
   ]);
+};
 
-const encodeTransactionInputs = (inps) =>
-  new List(
+const encodeTransactionInputs = (inps) => {
+  return new List(
     inps.map((i) => [0, new cbor.Tagged(24, encodeTransactionInput(i))])
   );
+};
 
-const encodeTransactionInput = ({ id, index }) =>
-  cbor.encode([rawBuffer(id), index]);
+const encodeTransactionInput = ({ id, index }) => {
+  return cbor.encode([rawBuffer(id), index]);
+};
 
-const encodeTransactionOutputs = (outs) =>
-  new List(
+const encodeTransactionOutputs = (outs) => {
+  return new List(
     outs.map((o) => [encodeTransactionAddress(o.address), o.amount.quantity])
   );
+};
 
 const encodeTransactionAddress = (addr) => {
   const bytes = bs58.decode(addr);
diff --git a/source/renderer/app/utils/validations.ts b/source/renderer/app/utils/validations.ts
index b2fc8e5678..808d818357 100644
--- a/source/renderer/app/utils/validations.ts
+++ b/source/renderer/app/utils/validations.ts
@@ -56,11 +56,13 @@ export const isUnicaseString = (
 /**
  * Enforces passwords without spaces and a minimum of 10 characters and a maximum of 255 characters.
  */
-export const isValidSpendingPassword = (
-  password: string
-): boolean => // Should contain at least 10 characters
-  password.length >= MIN_PASSWORD_LENGTH &&
-  password.length <= MAX_PASSWORD_LENGTH;
+export const isValidSpendingPassword = (password: string): boolean => {
+  // Should contain at least 10 characters
+  return (
+    password.length >= MIN_PASSWORD_LENGTH &&
+    password.length <= MAX_PASSWORD_LENGTH
+  );
+};
 // eslint-disable-next-line max-len
 export const isValidRepeatPassword = (
   spendingPassword: string,
@@ -118,7 +120,8 @@ export function errorOrIncompleteMarker(error: string) {
 /**
  * Voting PIN code validation
  */
-export const isValidPinCode = (pinCode: string, length: number): boolean =>
-  pinCode.length === length;
+export const isValidPinCode = (pinCode: string, length: number): boolean => {
+  return pinCode.length === length;
+};
 export const isValidRepeatPinCode = (pinCode: string, repeatPinCode: string) =>
   pinCode === repeatPinCode;
diff --git a/source/renderer/app/utils/walletSorting.spec.ts b/source/renderer/app/utils/walletSorting.spec.ts
new file mode 100644
index 0000000000..8d48f13169
--- /dev/null
+++ b/source/renderer/app/utils/walletSorting.spec.ts
@@ -0,0 +1,138 @@
+import BigNumber from 'bignumber.js';
+import { WalletSortBy, WalletSortOrder } from '../types/sidebarTypes';
+import { sortWallets } from './walletSorting';
+
+describe('Wallet Sorting', () => {
+  const cases = [
+    // Sort wallets by DATE from ASC to DESC
+    [
+      WalletSortBy.Date,
+      WalletSortOrder.Desc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+    ], // // Sort wallets by DATE from ASC to DESC
+    [
+      WalletSortBy.Date,
+      WalletSortOrder.Asc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+    ], // Sort wallets by NAME from A-Z to Z-A
+    [
+      WalletSortBy.Name,
+      WalletSortOrder.Desc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+    ], // Sort wallets by NAME from Z-A to A-Z
+    [
+      WalletSortBy.Name,
+      WalletSortOrder.Asc,
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+    ], // Sort wallets by BALANCE from higher to lower
+    [
+      WalletSortBy.Balance,
+      WalletSortOrder.Desc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+    ], // Sort wallets by BALANCE from lower to higher
+    [
+      WalletSortBy.Balance,
+      WalletSortOrder.Asc,
+      [
+        ['2', 'Wallet B', 2],
+        ['1', 'Wallet A', 1],
+      ],
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 2],
+      ],
+    ], // Sort wallet with same NAME
+    [
+      WalletSortBy.Name,
+      WalletSortOrder.Asc,
+      [
+        ['2', 'Wallet A', 2],
+        ['1', 'Wallet A', 1],
+      ],
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet A', 2],
+      ],
+    ], // Sort wallet with same BALANCE
+    [
+      WalletSortBy.Balance,
+      WalletSortOrder.Asc,
+      [
+        ['2', 'Wallet B', 1],
+        ['1', 'Wallet A', 1],
+      ],
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet B', 1],
+      ],
+    ], // Sort wallets with same NAME & BALANCE
+    [
+      WalletSortBy.Balance,
+      WalletSortOrder.Desc,
+      [
+        ['1', 'Wallet A', 1],
+        ['2', 'Wallet A', 1],
+      ],
+      [
+        ['2', 'Wallet A', 1],
+        ['1', 'Wallet A', 1],
+      ],
+    ],
+  ];
+  test.each(cases)(
+    `should sort wallets from test case %# by %s on %s order`,
+    (sortBy, sortOrder, wallets, expected) => {
+      const sortedWallets = sortWallets({
+        wallets: wallets.map(([id, name, amount]) => ({
+          id,
+          name,
+          amount: new BigNumber(amount),
+        })),
+        sortBy,
+        sortOrder,
+      });
+      expect(sortedWallets).toEqual(
+        expected.map(([id, name, amount]) => ({
+          id,
+          name,
+          amount: new BigNumber(amount),
+        }))
+      );
+    }
+  );
+});
diff --git a/source/renderer/app/utils/walletSorting.ts b/source/renderer/app/utils/walletSorting.ts
new file mode 100644
index 0000000000..8ec1d5808f
--- /dev/null
+++ b/source/renderer/app/utils/walletSorting.ts
@@ -0,0 +1,89 @@
+import { orderBy } from 'lodash';
+import { WalletSortBy, WalletSortOrder } from '../types/sidebarTypes';
+import type {
+  WalletSortConfig,
+  WalletSortByOptions,
+} from '../types/sidebarTypes';
+import type Wallet from '../domains/Wallet';
+
+type IndexedWallet = {
+  wallet: Wallet;
+  index: number;
+  amount: number;
+  name: string;
+};
+type SortWalletsProps = {
+  wallets: Wallet[];
+} & WalletSortConfig;
+export function sortWallets({
+  wallets,
+  sortBy,
+  sortOrder,
+}: SortWalletsProps): Wallet[] {
+  const indexedWallets: IndexedWallet[] = wallets.map(
+    (w: Wallet, index: number) => ({
+      wallet: w,
+      index,
+      amount: w.amount.toNumber(),
+      name: w.name.toLowerCase(),
+    })
+  );
+
+  const doOrderBy = (fn: string[]) => {
+    return orderBy(
+      indexedWallets,
+      fn,
+      fn.map(() => sortOrder)
+    ).map(({ wallet }) => wallet);
+  };
+
+  switch (sortBy) {
+    case WalletSortBy.Date:
+      return doOrderBy(['index']);
+
+    case WalletSortBy.Balance:
+      return doOrderBy(['amount', 'name', 'index']);
+
+    case WalletSortBy.Name:
+      return doOrderBy(['name', 'amount', 'index']);
+
+    case WalletSortBy.None:
+    default:
+      return wallets;
+  }
+}
+const defaultSortOrderByType = {
+  [WalletSortBy.Name]: WalletSortOrder.Asc,
+  [WalletSortBy.Date]: WalletSortOrder.Asc,
+  [WalletSortBy.Balance]: WalletSortOrder.Desc,
+};
+type ChangeWalletSortingProps = {
+  currentSortBy: WalletSortByOptions;
+} & WalletSortConfig;
+export function changeWalletSorting({
+  currentSortBy,
+  sortBy,
+  sortOrder,
+}: ChangeWalletSortingProps) {
+  if (sortBy === currentSortBy) {
+    return reverseWalletSortOrder({
+      sortBy,
+      sortOrder,
+    });
+  }
+
+  return {
+    sortBy,
+    sortOrder: defaultSortOrderByType[sortBy],
+  };
+}
+
+function reverseWalletSortOrder({ sortBy, sortOrder }: WalletSortConfig) {
+  return {
+    sortBy,
+    sortOrder:
+      sortOrder === WalletSortOrder.Asc
+        ? WalletSortOrder.Desc
+        : WalletSortOrder.Asc,
+  };
+}
diff --git a/source/renderer/app/utils/walletsForStakePoolsRanking.ts b/source/renderer/app/utils/walletsForStakePoolsRanking.ts
index 6e46c97f03..c6474c2a19 100644
--- a/source/renderer/app/utils/walletsForStakePoolsRanking.ts
+++ b/source/renderer/app/utils/walletsForStakePoolsRanking.ts
@@ -2,12 +2,13 @@ import BigNumber from 'bignumber.js';
 import Wallet from '../domains/Wallet';
 import { MIN_DELEGATION_FUNDS } from '../config/stakingConfig';
 
-export const getFilteredWallets = (wallets: Array<Wallet>): Array<Wallet> =>
-  wallets.filter(
+export const getFilteredWallets = (wallets: Array<Wallet>): Array<Wallet> => {
+  return wallets.filter(
     (w: Wallet) =>
       w.amount.isGreaterThanOrEqualTo(new BigNumber(MIN_DELEGATION_FUNDS)) &&
       !w.isLegacy
   );
+};
 export const getAllAmounts = (wallets: Array<Wallet>): BigNumber => {
   const filteredWallets = getFilteredWallets(wallets);
 
diff --git a/source/renderer/declaration.d.ts b/source/renderer/declaration.d.ts
new file mode 100644
index 0000000000..8157e2eff1
--- /dev/null
+++ b/source/renderer/declaration.d.ts
@@ -0,0 +1,2 @@
+declare module '*.scss';
+declare module '*.inline.svg';
diff --git a/source/renderer/mobx-react-form.d.ts b/source/renderer/mobx-react-form.d.ts
new file mode 100644
index 0000000000..ee588fbe0c
--- /dev/null
+++ b/source/renderer/mobx-react-form.d.ts
@@ -0,0 +1,73 @@
+declare module 'mobx-react-form' {
+  export interface SubmitOptions {
+    onSuccess: (fieldset) => any;
+    onError: (fieldset) => any;
+  }
+
+  export interface Field {
+    onChange: (...args: any) => void;
+    onToggle: (value) => void;
+    onFocus: () => void;
+    onBlur: () => void;
+    onClear: (e) => void;
+    onReset: (e) => void;
+    bind: (opt?: { onChange?: any }) => Field;
+
+    debouncedValidation: {
+      cancel: () => void;
+    };
+
+    reset: () => void;
+    clear: () => void;
+    showErrors: (showMessage: boolean) => void;
+    validate: ({ showErrors: boolean }) => void;
+    set: (prop: any, value?: any) => void;
+    focus: () => void;
+
+    changed: boolean;
+    isValid: boolean;
+    value: any;
+    checked: boolean;
+    error: string;
+    name: string;
+    type: string;
+    id: string;
+    disabled: boolean;
+  }
+
+  export abstract class MobxReactForm<T> {
+    constructor(
+      fields: { fields: any },
+      config?: { hooks?: any; options: any; plugins: any }
+    );
+
+    validate(fieldName);
+
+    init(options);
+
+    $(fieldName: keyof T): Field;
+
+    isValid: boolean;
+    validating: boolean;
+
+    reset: () => void;
+    showErrors: (showMessage: boolean) => void;
+
+    each: (fn: (field: Field) => void) => void;
+    add: (field: { name: string; value: string; key: string }) => void;
+    del: (field: string) => void;
+    values: () => T;
+    select: (fieldName: string) => Field;
+    submit: (opt: {
+      onSuccess?: (form: MobxReactForm<T>) => void;
+      onError?: (form: MobxReactForm<T>) => void;
+    }) => void;
+    clear: () => void;
+    fields: {
+      get: (fieldName: keyof T) => Field;
+      toJSON(): T;
+    };
+  }
+
+  export default MobxReactForm;
+}
diff --git a/source/renderer/webpack.config.js b/source/renderer/webpack.config.js
index 3a1dd91d3c..ccea475ed0 100644
--- a/source/renderer/webpack.config.js
+++ b/source/renderer/webpack.config.js
@@ -43,6 +43,9 @@ module.exports = {
   optimization: {
     minimize: false,
   },
+  resolve: {
+    extensions: ['.tsx', '.ts', '.js', '.json'],
+  },
   devServer: {
     hot: true,
     static: {
diff --git a/storybook/addons.ts b/storybook/addons.ts
new file mode 100644
index 0000000000..8d6b378085
--- /dev/null
+++ b/storybook/addons.ts
@@ -0,0 +1,4 @@
+import '@storybook/addon-knobs/register';
+import '@storybook/addon-actions/register';
+import '@storybook/addon-links/register';
+import './addons/DaedalusMenu/register';
diff --git a/storybook/config.tsx b/storybook/config.tsx
new file mode 100644
index 0000000000..60509e0b5e
--- /dev/null
+++ b/storybook/config.tsx
@@ -0,0 +1,15 @@
+import './monkeyPatchDateTime';
+import React from 'react';
+import { configure, addDecorator } from '@storybook/react';
+import StoryWrapper from './stories/_support/StoryWrapper';
+import '!style-loader!css-loader!sass-loader!../source/renderer/app/themes/index.global.scss'; // eslint-disable-line
+
+addDecorator((story) => {
+  return <StoryWrapper>{story}</StoryWrapper>;
+});
+
+function loadStories() {
+  require('./stories');
+}
+
+configure(loadStories, module);
diff --git a/storybook/monkeyPatchDateTime.ts b/storybook/monkeyPatchDateTime.ts
new file mode 100644
index 0000000000..cc22b35948
--- /dev/null
+++ b/storybook/monkeyPatchDateTime.ts
@@ -0,0 +1,9 @@
+// freezing the date is required for producing consistent snapshots
+// for visual regression testing with Chromatic
+if (process.env.STORYBOOK_FREEZE_DATE === 'true') {
+  const timemachine = require('timemachine');
+
+  timemachine.config({
+    dateString: 'Sat, 01 Jan 2022 10:00:00 GMT',
+  });
+}
diff --git a/storybook/presets.ts b/storybook/presets.ts
new file mode 100644
index 0000000000..ba481f0ea5
--- /dev/null
+++ b/storybook/presets.ts
@@ -0,0 +1,5 @@
+import path from 'path';
+
+// This preset fixes loading DaedalusMenu addon
+// https://github.com/storybookjs/storybook/issues/7196#issuecomment-505858914
+export default [path.resolve(__dirname, './ts-preset')];
diff --git a/storybook/stories/_support/DiscreetModeToggleKnob.ts b/storybook/stories/_support/DiscreetModeToggleKnob.ts
index cd3e07f071..69aa5521aa 100644
--- a/storybook/stories/_support/DiscreetModeToggleKnob.ts
+++ b/storybook/stories/_support/DiscreetModeToggleKnob.ts
@@ -5,7 +5,7 @@ import { useDiscreetModeFeature } from '../../../source/renderer/app/features';
 
 export const DiscreetModeToggleKnob = observer(() => {
   const feature = useDiscreetModeFeature();
-  const knob = boolean('Toogle discreet mode', false, 'Dicreet Mode');
+  const knob = boolean('Toggle discreet mode', false, 'Dicreet Mode');
   useLayoutEffect(() => {
     if (knob !== feature.isDiscreetMode) {
       feature.toggleDiscreetMode();
diff --git a/storybook/stories/_support/StoryLayout.tsx b/storybook/stories/_support/StoryLayout.tsx
index 3891787306..93458a579c 100644
--- a/storybook/stories/_support/StoryLayout.tsx
+++ b/storybook/stories/_support/StoryLayout.tsx
@@ -26,6 +26,10 @@ import Wallet, {
 import NewsFeedIcon from '../../../source/renderer/app/components/widgets/NewsFeedIcon';
 import type { SidebarMenus } from '../../../source/renderer/app/components/sidebar/types';
 import type { SidebarWalletType } from '../../../source/renderer/app/types/sidebarTypes';
+import {
+  WalletSortBy,
+  WalletSortOrder,
+} from '../../../source/renderer/app/types/sidebarTypes';
 // Empty screen elements
 import TopBar from '../../../source/renderer/app/components/layout/TopBar';
 import Sidebar from '../../../source/renderer/app/components/sidebar/Sidebar';
@@ -34,7 +38,6 @@ import SidebarLayout from '../../../source/renderer/app/components/layout/Sideba
 import menuIconOpened from '../../../source/renderer/app/assets/images/menu-opened-ic.inline.svg';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../source/renderer/app/a... Remove this comment to see the full error message
 import menuIconClosed from '../../../source/renderer/app/assets/images/menu-ic.inline.svg';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../source/renderer/app/c... Remove this comment to see the full error message
 import topBarStyles from '../../../source/renderer/app/components/layout/TopBar.scss';
 
 export type StoriesProps = {
@@ -92,11 +95,12 @@ class StoryLayout extends Component<Props> {
         obj[option.label] = option.value;
         return obj;
       }, {}),
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ value: string; label: string; ... Remove this comment to see the full error message
       NUMBER_OPTIONS[0]
     );
     const FORMAT = {
       ...DEFAULT_NUMBER_FORMAT,
-      // @ts-ignore ts-migrate(2538) FIXME: Type '{ value: string; label: string; }' cannot be... Remove this comment to see the full error message
+      // @ts-ignore ts-migrate(2538) FIXME: Type 'PropertyKey[]' cannot be used as an index ty... Remove this comment to see the full error message
       ...NUMBER_FORMATS[currentNumberFormat],
     };
     BigNumber.config({
@@ -165,6 +169,13 @@ class StoryLayout extends Component<Props> {
       actions: {
         onAddWallet: action('toggleAddWallet'),
         onWalletItemClick: setActiveWalletId,
+        onWalletSortBy: action('sortWallet'),
+        onSearch: action('searchWallet'),
+      },
+      searchValue: '',
+      walletSortConfig: {
+        sortOrder: WalletSortOrder.Asc,
+        sortBy: WalletSortBy.Date,
       },
     },
   });
diff --git a/storybook/stories/_support/StoryProvider.tsx b/storybook/stories/_support/StoryProvider.tsx
index 268febcb88..47de79a7a5 100644
--- a/storybook/stories/_support/StoryProvider.tsx
+++ b/storybook/stories/_support/StoryProvider.tsx
@@ -13,7 +13,6 @@ import {
   BrowserLocalStorageBridge,
 } from '../../../source/renderer/app/features';
 import { DiscreetModeToggleKnob } from './DiscreetModeToggleKnob';
-import { DiscreetModeNotificationKnob } from './DiscreetModeNotificationKnob';
 
 type Props = {
   children: Node;
@@ -200,7 +199,6 @@ class StoryProvider extends Component<Props> {
             <>
               {this.props.children}
               <DiscreetModeToggleKnob />
-              <DiscreetModeNotificationKnob />
             </>
           </DiscreetModeFeatureProvider>
         </BrowserLocalStorageBridge>
diff --git a/storybook/stories/_support/utils.ts b/storybook/stories/_support/utils.ts
index d6203a6d92..c3d7ad6d3c 100644
--- a/storybook/stories/_support/utils.ts
+++ b/storybook/stories/_support/utils.ts
@@ -5,7 +5,7 @@ import moment from 'moment';
 import { get } from 'lodash';
 import BigNumber from 'bignumber.js';
 import seedrandom from 'seedrandom';
-
+import type { Reward } from '../../../source/renderer/app/api/staking/types';
 import Wallet, {
   WalletSyncStateStatuses,
 } from '../../../source/renderer/app/domains/Wallet';
@@ -32,11 +32,13 @@ import type {
   WalletTokens,
   AssetToken,
 } from '../../../source/renderer/app/api/assets/types';
+import { hexToString } from '../../../source/renderer/app/utils/strings';
 import type { SyncStateStatus } from '../../../source/renderer/app/api/wallets/types';
 import type { TransactionMetadata } from '../../../source/renderer/app/types/TransactionMetadata';
 
-const random = seedrandom('daedalus', { global: false });
-
+const random = seedrandom('daedalus', {
+  global: false,
+});
 export const EXAMPLE_METADATA = JSONBigInt.parse(`{
       "0": {
         "string": "some string"
@@ -82,10 +84,12 @@ export const EXAMPLE_METADATA = JSONBigInt.parse(`{
         ]
       }
     }`);
-export const generateHash = () =>
-  hash.sha512().update(random().toString()).digest('hex');
-export const generatePolicyIdHash = () =>
-  hash.sha224().update(random().toString()).digest('hex');
+export const generateHash = () => {
+  return hash.sha512().update(random().toString()).digest('hex');
+};
+export const generatePolicyIdHash = () => {
+  return hash.sha224().update(random().toString()).digest('hex');
+};
 
 const statusProgress = (status) =>
   status === WalletSyncStateStatuses.RESTORING
@@ -104,7 +108,7 @@ export const generateWallet = (
     available: [],
     total: [],
   },
-  reward = 0,
+  reward: string | number = 0,
   delegatedStakePool?: StakePool,
   hasPassword?: boolean,
   status: SyncStateStatus = WalletSyncStateStatuses.READY,
@@ -136,6 +140,17 @@ export const generateWallet = (
       RECOVERY_PHRASE_VERIFICATION_TYPES.NEVER_VERIFIED,
     delegatedStakePoolId: get(delegatedStakePool, 'id'),
   });
+export const generateRewardForWallet = (
+  wallet: Wallet,
+  unspent: string | number = '0'
+): Reward => ({
+  wallet: wallet.name,
+  total: wallet.reward,
+  unspent: new BigNumber(unspent).dividedBy(LOVELACES_PER_ADA),
+  isRestoring: wallet.isRestoring,
+  syncingProgress: 100,
+  rewardsAddress: 'stake_fake_address',
+});
 export const generateAssetDomain = (
   policyId: string,
   assetName = '',
@@ -163,6 +178,7 @@ export const generateAssetToken = (
 ): AssetToken => ({
   policyId,
   assetName,
+  assetNameASCII: hexToString(assetName),
   fingerprint,
   metadata,
   quantity: new BigNumber(quantity),
diff --git a/storybook/stories/assets/Asset.stories.tsx b/storybook/stories/assets/Asset.stories.tsx
index 48d217ca0e..c343ae8637 100644
--- a/storybook/stories/assets/Asset.stories.tsx
+++ b/storybook/stories/assets/Asset.stories.tsx
@@ -6,7 +6,7 @@ import { withKnobs, boolean, number, text } from '@storybook/addon-knobs';
 import StoryDecorator from '../_support/StoryDecorator';
 import Asset from '../../../source/renderer/app/components/assets/Asset';
 
-storiesOf('Assets/Asset pill', module)
+storiesOf('Assets|Asset pill', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
   .addDecorator(withKnobs) // ====== Stories ======
   .add('Default', () => {
diff --git a/storybook/stories/assets/AssetSettingsDialog.stories.tsx b/storybook/stories/assets/AssetSettingsDialog.stories.tsx
index c591da206f..e8d0480f98 100644
--- a/storybook/stories/assets/AssetSettingsDialog.stories.tsx
+++ b/storybook/stories/assets/AssetSettingsDialog.stories.tsx
@@ -14,11 +14,11 @@ const asset = {
     '6e8dc8b1f3591e8febcc47c51e9f2667c413a497aebd54cf389790866861707079636f696e',
   fingerprint: 'asset18v86ulgre52g4l7lvl5shl8h5cm4u3dmrjg2e8',
   quantity: new BigNumber(number('quantity', 1)),
-  decimals: 0,
+  decimals: undefined,
   recommendedDecimals: null,
   metadata: null,
 };
-storiesOf('Assets/AssetSettingsDialog', module)
+storiesOf('Assets|AssetSettingsDialog', module)
   .addDecorator((story) => (
     <StoryProvider>
       <StoryDecorator>{story()}</StoryDecorator>
@@ -38,12 +38,24 @@ storiesOf('Assets/AssetSettingsDialog', module)
     <AssetSettingsDialog
       asset={{
         ...asset,
-        recommendedDecimals: number('recommendedDecimals', 2),
+        recommendedDecimals: number('recommendedDecimals', 0),
+      }}
+      // @ts-ignore ts-migrate(2322) FIXME: Type '{ asset: { recommendedDecimals: number; poli... Remove this comment to see the full error message
+      assetAmount={new BigNumber(number('assetAmount', 500))}
+      onSubmit={action('onSubmit')}
+      onCancel={action('onCancel')}
+    />
+  ))
+  .add('With recommended decimal precision (non-zero)', () => (
+    <AssetSettingsDialog
+      asset={{
+        ...asset,
+        decimals: 2,
+        recommendedDecimals: number('recommendedDecimals', 1),
       }}
       // @ts-ignore ts-migrate(2322) FIXME: Type '{ asset: { recommendedDecimals: number; poli... Remove this comment to see the full error message
       assetAmount={new BigNumber(number('assetAmount', 500))}
       onSubmit={action('onSubmit')}
       onCancel={action('onCancel')}
-      recommendedDecimalPrecision={2}
     />
   ));
diff --git a/storybook/stories/common/ItemsDropdown.stories.tsx b/storybook/stories/common/ItemsDropdown.stories.tsx
index 8b98178b96..c8d0c7cbfa 100644
--- a/storybook/stories/common/ItemsDropdown.stories.tsx
+++ b/storybook/stories/common/ItemsDropdown.stories.tsx
@@ -79,7 +79,7 @@ const stakePoolsOptions = stakePoolsList.reduce((obj, pool) => {
   obj[`[${ticker}] ${name} - (${ranking})`] = pool;
   return obj;
 }, {});
-storiesOf('Common/ItemsDropdown', module)
+storiesOf('Common|ItemsDropdown', module)
   .addDecorator((story: any, context: any) => {
     if (context.name === 'CountdownWidget') {
       return story();
@@ -160,10 +160,11 @@ storiesOf('Common/ItemsDropdown', module)
           `${number('Amount', 1000000000, {}, 'First wallet')}`,
           undefined,
           undefined,
-          // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ relativeStake: number; cost: s... Remove this comment to see the full error message
+          // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'SelectTypeKnobValue' is not assi... Remove this comment to see the full error message
           select(
             'Stake pool',
             stakePoolsOptions,
+            // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ relativeStake: number; cost: s... Remove this comment to see the full error message
             STAKE_POOLS[0],
             'First wallet'
           ),
@@ -209,7 +210,7 @@ storiesOf('Common/ItemsDropdown', module)
       '1000000000',
       undefined,
       undefined,
-      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ relativeStake: number; cost: s... Remove this comment to see the full error message
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'SelectTypeKnobValue' is not assi... Remove this comment to see the full error message
       select('Wallet - Stake pool', stakePoolsOptions, STAKE_POOLS[0]),
       true,
       undefined,
@@ -246,17 +247,19 @@ storiesOf('Common/ItemsDropdown', module)
       {
         assetId: assets[0].fingerprint,
       },
-      (store) => (
-        <AssetsDropdown
-          assets={assets}
-          // @ts-ignore ts-migrate(2322) FIXME: Type '{ assets: AssetToken[]; value: string; onCha... Remove this comment to see the full error message
-          value={store.state.assetId}
-          onChange={(assetId) =>
-            store.set({
-              assetId,
-            })
-          }
-        />
-      )
+      (store) => {
+        return (
+          <AssetsDropdown
+            assets={assets}
+            // @ts-ignore ts-migrate(2322) FIXME: Type '{ assets: AssetToken[]; value: string; onCha... Remove this comment to see the full error message
+            value={store.state.assetId}
+            onChange={(assetId) =>
+              store.set({
+                assetId,
+              })
+            }
+          />
+        );
+      }
     )
   );
diff --git a/storybook/stories/common/Widgets.stories.tsx b/storybook/stories/common/Widgets.stories.tsx
index d9dd46012f..bf0c777339 100644
--- a/storybook/stories/common/Widgets.stories.tsx
+++ b/storybook/stories/common/Widgets.stories.tsx
@@ -79,7 +79,7 @@ const messages = defineMessages({
     description: 'Save description.',
   },
 });
-storiesOf('Common/Widgets', module)
+storiesOf('Common|Widgets', module)
   .addDecorator((story: any, context: any) => {
     if (context.name === 'CountdownWidget') {
       return story();
@@ -139,125 +139,92 @@ storiesOf('Common/Widgets', module)
       </div>
     </div>
   ))
-  .add(
-    'BigButtonForDialogs',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, props: { locale: strin... Remove this comment to see the full error message
-    (
-      _,
-      props: {
-        locale: string;
-      }
-    ) => {
-      console.log('_', _);
-      return (
-        <div>
-          <div
-            style={{
-              width: '300px',
-              height: '200px',
-              display: 'flex',
-            }}
-          >
-            <BigButtonForDialogs
-              description={intl[props.locale].formatMessage(
-                messages.createNewWallet
-              )}
-              label={intl[props.locale].formatMessage(messages.create)}
-              icon={createIcon}
-              onClick={() => {}}
-            />
-          </div>
-          <div
-            style={{
-              width: '300px',
-              height: '200px',
-              display: 'flex',
-            }}
-          >
-            <BigButtonForDialogs
-              description={intl[props.locale].formatMessage(
-                messages.joinSharedWallet
-              )}
-              label={intl[props.locale].formatMessage(messages.join)}
-              icon={joinSharedIcon}
-              onClick={() => {}}
-              isDisabled
-            />
-          </div>
-          <div
-            style={{
-              width: '300px',
-              height: '200px',
-              display: 'flex',
-            }}
-          >
-            <BigButtonForDialogs
-              description={intl[props.locale].formatMessage(
-                messages.importExistingWallet
-              )}
-              label={intl[props.locale].formatMessage(messages.import)}
-              icon={importIcon}
-              onClick={() => {}}
-            />
-          </div>
-        </div>
-      );
-    }
-  )
-  .add(
-    'MnemonicInputWidget - 9 words',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, props: { locale: strin... Remove this comment to see the full error message
-    (
-      _,
-      props: {
-        locale: string;
-      }
-    ) => {
-      const tokens = observable(['', '', '', '', '', '', '', '', '']);
-      return (
-        <div
-          style={{
-            padding: 20,
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    locale: string;}) =... Remove this comment to see the full error message
+  .add('BigButtonForDialogs', (props: { locale: string }) => (
+    <div>
+      <div
+        style={{
+          width: '300px',
+          height: '200px',
+          display: 'flex',
+        }}
+      >
+        <BigButtonForDialogs
+          description={intl[props.locale].formatMessage(
+            messages.createNewWallet
+          )}
+          label={intl[props.locale].formatMessage(messages.create)}
+          icon={createIcon}
+          onClick={() => {}}
+        />
+      </div>
+      <div
+        style={{
+          width: '300px',
+          height: '200px',
+          display: 'flex',
+        }}
+      >
+        <BigButtonForDialogs
+          description={intl[props.locale].formatMessage(
+            messages.joinSharedWallet
+          )}
+          label={intl[props.locale].formatMessage(messages.join)}
+          icon={joinSharedIcon}
+          onClick={() => {}}
+          isDisabled
+        />
+      </div>
+      <div
+        style={{
+          width: '300px',
+          height: '200px',
+          display: 'flex',
+        }}
+      >
+        <BigButtonForDialogs
+          description={intl[props.locale].formatMessage(
+            messages.importExistingWallet
+          )}
+          label={intl[props.locale].formatMessage(messages.import)}
+          icon={importIcon}
+          onClick={() => {}}
+        />
+      </div>
+    </div>
+  ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    locale: string;}) =... Remove this comment to see the full error message
+  .add('MnemonicInputWidget - 9 words', (props: { locale: string }) => {
+    const tokens = observable(['', '', '', '', '', '', '', '', '']);
+    return (
+      <div
+        style={{
+          padding: 20,
+        }}
+      >
+        <MnemonicInputWidget
+          label={intl[props.locale].formatMessage(messages.recoveryPhrase)}
+          tokens={tokens}
+          onTokenChanged={(index, token) => {
+            tokens[index] = token;
           }}
-        >
-          <MnemonicInputWidget
-            label={intl[props.locale].formatMessage(messages.recoveryPhrase)}
-            tokens={tokens}
-            onTokenChanged={(index, token) => {
-              tokens[index] = token;
-            }}
-          />
-        </div>
-      );
-    }
-  )
+        />
+      </div>
+    );
+  })
   .add('TinySwitch', () => <TinySwitch />)
-  .add(
-    'TinySwitch - short label',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, props: { locale: strin... Remove this comment to see the full error message
-    (
-      _,
-      props: {
-        locale: string;
-      }
-    ) => <TinySwitch label={intl[props.locale].formatMessage(messages.save)} />
-  )
-  .add(
-    'ButtonLink',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, props: { locale: strin... Remove this comment to see the full error message
-    (
-      _,
-      props: {
-        locale: string;
-      }
-    ) => (
-      <ButtonLink
-        label={intl[props.locale].formatMessage(messages.save)}
-        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-        onClick={action('onClick')}
-      />
-    )
-  )
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    locale: string;}) =... Remove this comment to see the full error message
+  .add('TinySwitch - short label', (props: { locale: string }) => (
+    <TinySwitch label={intl[props.locale].formatMessage(messages.save)} />
+  ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    locale: string;}) =... Remove this comment to see the full error message
+  .add('ButtonLink', (props: { locale: string }) => (
+    <ButtonLink
+      label={intl[props.locale].formatMessage(messages.save)}
+      // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+      onClick={action('onClick')}
+    />
+  ))
   .add('NormalSwitch', () => (
     <div>
       <NormalSwitch onChange={action('onChange')} />
diff --git a/storybook/stories/dapps/TransactionRequest.stories.tsx b/storybook/stories/dapps/TransactionRequest.stories.tsx
index 6a4330c3b1..0e6e2540ee 100644
--- a/storybook/stories/dapps/TransactionRequest.stories.tsx
+++ b/storybook/stories/dapps/TransactionRequest.stories.tsx
@@ -37,7 +37,7 @@ const allAssets = [
     }
   ),
 ];
-storiesOf('dApps/TransactionRequest', module)
+storiesOf('dApps|TransactionRequest', module)
   .addDecorator((story) => (
     <StoryProvider>
       <StoryDecorator>{story()}</StoryDecorator>
@@ -169,6 +169,7 @@ storiesOf('dApps/TransactionRequest', module)
       }
     )
   )
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
   .add('Notifications', ({ locale }: { locale: string }) => {
     let text1 = 'Opening transaction received via link...';
     let text2 = 'Transaction received via link';
diff --git a/storybook/stories/index.ts b/storybook/stories/index.ts
index c45c3c2919..5876f01bc8 100644
--- a/storybook/stories/index.ts
+++ b/storybook/stories/index.ts
@@ -1,3 +1,5 @@
+import '../../source/renderer/app/themes/index.global.scss';
+import './_support/environment';
 // Wallets
 import './wallets';
 // Nodes
diff --git a/storybook/stories/navigation/Sidebar.stories.tsx b/storybook/stories/navigation/Sidebar.stories.tsx
index 0b950d44d7..6b89507b5b 100644
--- a/storybook/stories/navigation/Sidebar.stories.tsx
+++ b/storybook/stories/navigation/Sidebar.stories.tsx
@@ -105,13 +105,14 @@ const sidebarMenusHardware = observable({
   },
 });
 let emptyMenus;
-storiesOf('Navigation/Sidebar', module)
+storiesOf('Navigation|Sidebar', module)
   .addDecorator((story) => (
     <StoryProvider>
       <StoryDecorator>{story()}</StoryDecorator>
     </StoryProvider>
   ))
   .addDecorator(withKnobs) // ====== Stories ======
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('No Category', (props: { currentTheme: string }) => (
     <Sidebar
       menus={emptyMenus}
@@ -129,6 +130,7 @@ storiesOf('Navigation/Sidebar', module)
       isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Wallets Category', (props: { currentTheme: string }) => (
     <Sidebar
       menus={emptyMenus}
@@ -146,10 +148,12 @@ storiesOf('Navigation/Sidebar', module)
       isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Wallet Selected', (props: { currentTheme: string }) => (
     <Sidebar
       categories={CATEGORIES_WITH_DELEGATION_COUNTDOWN}
       activeSidebarCategory={CATEGORIES_WITH_DELEGATION_COUNTDOWN[0].route}
+      // @ts-ignore ts-migrate(2322) FIXME: Type '{ wallets: { items: { id: string; title: str... Remove this comment to see the full error message
       menus={sidebarMenus}
       onActivateCategory={action('onActivateCategory')}
       isShowingSubMenus
@@ -164,6 +168,7 @@ storiesOf('Navigation/Sidebar', module)
       isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Hardware Wallet Selected', (props: { currentTheme: string }) => (
     <Sidebar
       categories={CATEGORIES_WITH_DELEGATION_COUNTDOWN}
@@ -182,6 +187,7 @@ storiesOf('Navigation/Sidebar', module)
       isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Delegation Category', (props: { currentTheme: string }) => (
     <Sidebar
       menus={emptyMenus}
@@ -201,6 +207,7 @@ storiesOf('Navigation/Sidebar', module)
   ))
   .add(
     'Decentralization Progress Category',
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
     (props: { currentTheme: string }) => (
       <Sidebar
         menus={emptyMenus}
@@ -219,6 +226,7 @@ storiesOf('Navigation/Sidebar', module)
       />
     )
   )
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Network label', (props: { currentTheme: string }) => (
     <Sidebar
       menus={emptyMenus}
diff --git a/storybook/stories/navigation/SidebarCategory.stories.tsx b/storybook/stories/navigation/SidebarCategory.stories.tsx
index 312c6af4ee..aed711ea4c 100644
--- a/storybook/stories/navigation/SidebarCategory.stories.tsx
+++ b/storybook/stories/navigation/SidebarCategory.stories.tsx
@@ -11,7 +11,7 @@ const category = {
   icon: walletsIcon,
   route: 'WALLETS',
 };
-storiesOf('Navigation/Sidebar', module)
+storiesOf('Navigation|Sidebar', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>) // ====== Stories ======
   .add('Inactive', () => (
     <SidebarCategory
diff --git a/storybook/stories/navigation/SidebarWalletsMenu.stories.tsx b/storybook/stories/navigation/SidebarWalletsMenu.stories.tsx
index 83e45e6431..6e08f57028 100644
--- a/storybook/stories/navigation/SidebarWalletsMenu.stories.tsx
+++ b/storybook/stories/navigation/SidebarWalletsMenu.stories.tsx
@@ -1,24 +1,87 @@
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
+import { withKnobs } from '@storybook/addon-knobs';
 import StoryDecorator from '../_support/StoryDecorator';
+import StoryProvider from '../_support/StoryProvider';
 import { isShelleyTestnetTheme } from '../_support/utils';
-import WalletsWrapper from '../wallets/_utils/WalletsWrapper';
+import {
+  WalletSortBy,
+  WalletSortOrder,
+} from '../../../source/renderer/app/types/sidebarTypes';
 import SidebarWalletsMenu from '../../../source/renderer/app/components/sidebar/wallets/SidebarWalletsMenu';
 
-storiesOf('Navigation/Wallets Menu', module)
+const wallets = [
+  {
+    id: '1',
+    title: 'Main wallet',
+    amount: 0,
+    isConnected: false,
+    isRestoreActive: false,
+    restoreProgress: 0,
+    isNotResponding: false,
+    isLegacy: false,
+    createdAt: new Date(),
+    recoveryPhraseVerificationDate: new Date(),
+    hasNotification: false,
+  },
+  {
+    id: '2',
+    title: 'House rent',
+    amount: 274912874.35,
+    isConnected: false,
+    isRestoreActive: false,
+    restoreProgress: 0,
+    isNotResponding: false,
+    isLegacy: false,
+    createdAt: new Date(),
+    recoveryPhraseVerificationDate: new Date(),
+    hasNotification: false,
+  },
+  {
+    id: '3',
+    title: 'Mining',
+    amount: 0.0004924712,
+    isConnected: false,
+    isRestoreActive: false,
+    restoreProgress: 0,
+    isNotResponding: false,
+    isLegacy: false,
+    createdAt: new Date(),
+    recoveryPhraseVerificationDate: new Date(),
+    hasNotification: false,
+  },
+  {
+    id: '4',
+    title: 'Shopping wallet',
+    amount: 0,
+    isConnected: false,
+    isRestoreActive: false,
+    restoreProgress: 0,
+    isNotResponding: false,
+    isLegacy: false,
+    createdAt: new Date(),
+    recoveryPhraseVerificationDate: new Date(),
+    hasNotification: false,
+  },
+];
+storiesOf('Navigation|Wallets Menu', module)
+  .addDecorator(withKnobs)
   .addDecorator((story) => (
     <StoryDecorator>
-      <div
-        style={{
-          width: '200px',
-        }}
-      >
-        {story()}
-      </div>
+      <StoryProvider>
+        <div
+          style={{
+            width: '100%',
+            height: '100%',
+          }}
+        >
+          {story()}
+        </div>
+      </StoryProvider>
     </StoryDecorator>
-  ))
-  .addDecorator(WalletsWrapper) // ====== Stories ======
+  )) // // ====== Stories ======
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Empty', (props: { currentTheme: string }) => (
     <SidebarWalletsMenu
       wallets={[]}
@@ -27,71 +90,59 @@ storiesOf('Navigation/Wallets Menu', module)
       isActiveWallet={() => false}
       isAddWalletButtonActive={false}
       isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
-      visible
+      visible={false}
+      sortBy={WalletSortBy.Date}
+      sortOrder={WalletSortOrder.Desc}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('With Wallets', (props: { currentTheme: string }) => (
-    // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-    <SidebarWalletsMenu
-      wallets={[
-        {
-          id: '1',
-          title: 'Main wallet',
-          amount: 0,
-          isConnected: false,
-          isRestoreActive: false,
-          restoreProgress: 0,
-          isNotResponding: false,
-          isLegacy: false,
-          createdAt: new Date(),
-          recoveryPhraseVerificationDate: new Date(),
-          hasNotification: false,
-        },
-        {
-          id: '2',
-          title: 'House rent',
-          amount: 274912874.35,
-          isConnected: false,
-          isRestoreActive: false,
-          restoreProgress: 0,
-          isNotResponding: false,
-          isLegacy: false,
-          createdAt: new Date(),
-          recoveryPhraseVerificationDate: new Date(),
-          hasNotification: false,
-        },
-        {
-          id: '3',
-          title: 'Mining',
-          amount: 0.0004924712,
-          isConnected: false,
-          isRestoreActive: false,
-          restoreProgress: 0,
-          isNotResponding: false,
-          isLegacy: false,
-          createdAt: new Date(),
-          recoveryPhraseVerificationDate: new Date(),
-          hasNotification: false,
-        },
-        {
-          id: '4',
-          title: 'Shopping wallet',
-          amount: 0,
-          isConnected: false,
-          isRestoreActive: false,
-          restoreProgress: 0,
-          isNotResponding: false,
-          isLegacy: false,
-          createdAt: new Date(),
-          recoveryPhraseVerificationDate: new Date(),
-          hasNotification: false,
-        },
-      ]}
-      isActiveWallet={(id) => id === '2'}
-      onWalletItemClick={action('walletItemClick')}
-      onAddWallet={action('addWallet')}
-      isAddWalletButtonActive={false}
-      isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
-      visible
-    />
+    <div
+      style={{
+        display: 'flex',
+        height: '100%',
+      }}
+    >
+      <div
+        style={{
+          position: 'relative',
+          height: '100%',
+          width: '196px',
+        }}
+      >
+        <SidebarWalletsMenu
+          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+          wallets={wallets}
+          isActiveWallet={(id) => id === '2'}
+          onWalletItemClick={action('walletItemClick')}
+          onAddWallet={action('addWallet')}
+          isAddWalletButtonActive={false}
+          isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
+          visible
+          sortBy={'DATE'}
+          sortOrder={WalletSortOrder.Asc}
+        />
+      </div>
+      <div
+        style={{
+          position: 'relative',
+          height: '100%',
+          width: '196px',
+        }}
+      >
+        <SidebarWalletsMenu
+          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+          wallets={wallets}
+          isActiveWallet={(id) => id === '2'}
+          onWalletItemClick={action('walletItemClick')}
+          onAddWallet={action('addWallet')}
+          isAddWalletButtonActive={false}
+          isShelleyActivated={isShelleyTestnetTheme(props.currentTheme)}
+          visible
+          sortBy={'DATE'}
+          sortOrder={WalletSortOrder.Asc}
+          searchValue="in"
+        />
+      </div>
+    </div>
   ));
diff --git a/storybook/stories/news/AlertsOverlay.stories.tsx b/storybook/stories/news/AlertsOverlay.stories.tsx
index 04b0e703a7..a85dcd043e 100644
--- a/storybook/stories/news/AlertsOverlay.stories.tsx
+++ b/storybook/stories/news/AlertsOverlay.stories.tsx
@@ -12,6 +12,7 @@ import {
   DATE_JAPANESE_OPTIONS,
 } from '../../../source/renderer/app/config/profileConfig';
 import AlertsOverlay from '../../../source/renderer/app/components/news/AlertsOverlay';
+import RTSFlagsRecommendationOverlay from '../../../source/renderer/app/components/knownIssues/RTSFlagsRecommendationOverlay/RTSFlagsRecommendationOverlay';
 
 const { intl: enIntl } = new IntlProvider({
   locale: 'en-US',
@@ -86,34 +87,32 @@ const getAlerts = (locale: string) => [
   }),
 ];
 
-storiesOf('News/Overlays', module)
+storiesOf('News|Overlays', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   ))
-  .add(
-    'Alerts',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, props: { locale: strin... Remove this comment to see the full error message
-    (
-      _,
-      props: {
-        locale: string;
-      }
-    ) => (
-      <AlertsOverlay
-        allAlertsCount={getAlerts(props.locale).length}
-        alerts={getAlerts(props.locale)}
-        onCloseOpenAlert={() => null}
-        onMarkNewsAsRead={action('onMarkNewsAsRead')}
-        onOpenExternalLink={action('onOpenExternalLink')}
-        onProceedNewsAction={action('onProceedNewsAction')}
-        currentDateFormat={select(
-          'currentDateFormat',
-          dateOptionsIntl[props.locale].reduce((obj, { label, value }) => {
-            obj[label] = value;
-            return obj;
-          }, {}),
-          dateOptionsIntl[props.locale][0].value
-        )}
-      />
-    )
-  );
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    locale: string;}) =... Remove this comment to see the full error message
+  .add('Alerts', (props: { locale: string }) => (
+    <AlertsOverlay
+      allAlertsCount={getAlerts(props.locale).length}
+      alerts={getAlerts(props.locale)}
+      onCloseOpenAlert={() => null}
+      onMarkNewsAsRead={action('onMarkNewsAsRead')}
+      onOpenExternalLink={action('onOpenExternalLink')}
+      onProceedNewsAction={action('onProceedNewsAction')}
+      currentDateFormat={select(
+        'currentDateFormat',
+        dateOptionsIntl[props.locale].reduce((obj, { label, value }) => {
+          obj[label] = value;
+          return obj;
+        }, {}),
+        dateOptionsIntl[props.locale][0].value
+      )}
+    />
+  ))
+  .add('RTS Recommendation', () => (
+    <RTSFlagsRecommendationOverlay
+      onConfirm={action('onConfirm')}
+      onClose={action('onClose')}
+    />
+  ));
diff --git a/storybook/stories/news/AppUpdateOverlay.stories.tsx b/storybook/stories/news/AppUpdateOverlay.stories.tsx
index db584e932f..03e8f5a76f 100644
--- a/storybook/stories/news/AppUpdateOverlay.stories.tsx
+++ b/storybook/stories/news/AppUpdateOverlay.stories.tsx
@@ -7,92 +7,82 @@ import AppUpdateOverlay from '../../../source/renderer/app/components/appUpdate/
 import { update, version, availableAppVersion } from './_utils/fakeDataUpdate';
 import { rangeMap } from '../../../source/renderer/app/utils/numbers';
 
-storiesOf('News/Overlays', module)
+storiesOf('News|Overlays', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
   .addDecorator(withKnobs)
-  .add(
-    'Update',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, { locale, }: { locale:... Remove this comment to see the full error message
-    (
-      _,
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+  .add('Update', ({ locale }: { locale: string }) => {
+    const scenario = radios(
+      'Scenario',
       {
-        locale,
-      }: {
-        locale: string;
-      }
-    ) => {
-      const scenario = radios(
-        'Scenario',
-        {
-          Downloading: 'downloading',
-          'Download complete': 'downloaded',
-          'Process failed': 'failed',
-        },
-        'downloading'
-      );
-      let isUpdateDownloaded = boolean('isUpdateDownloaded', true);
-      let isAutomaticUpdateFailed = false;
-      let isLinux = boolean('isLinux', false);
-      const isFlight = boolean('isFlight', false);
-      const isTestnet = boolean('isTestnet', false);
-      let isWaitingToQuitDaedalus = boolean('isWaitingToQuitDaedalus', false);
-      let installationProgress = 0;
+        Downloading: 'downloading',
+        'Download complete': 'downloaded',
+        'Process failed': 'failed',
+      },
+      'downloading'
+    );
+    let isUpdateDownloaded = boolean('isUpdateDownloaded', true);
+    let isAutomaticUpdateFailed = false;
+    let isLinux = boolean('isLinux', false);
+    const isFlight = boolean('isFlight', false);
+    const isTestnet = boolean('isTestnet', false);
+    let isWaitingToQuitDaedalus = boolean('isWaitingToQuitDaedalus', false);
+    let installationProgress = 0;
 
-      if (scenario === 'downloading') {
-        isUpdateDownloaded = false;
-      } else if (scenario === 'failed') {
-        isAutomaticUpdateFailed = true;
-      } else if (scenario === 'downloaded') {
-        isLinux = boolean('isLinux', false);
-        isWaitingToQuitDaedalus = boolean('isWaitingToQuitDaedalus', false);
-        if (isLinux && isWaitingToQuitDaedalus)
-          installationProgress = number('installationProgress', 30, {
+    if (scenario === 'downloading') {
+      isUpdateDownloaded = false;
+    } else if (scenario === 'failed') {
+      isAutomaticUpdateFailed = true;
+    } else if (scenario === 'downloaded') {
+      isLinux = boolean('isLinux', false);
+      isWaitingToQuitDaedalus = boolean('isWaitingToQuitDaedalus', false);
+      if (isLinux && isWaitingToQuitDaedalus)
+        installationProgress = number('installationProgress', 30, {
+          range: true,
+          min: 0,
+          max: 100,
+          step: 1,
+        });
+    }
+
+    const downloadProgress =
+      scenario === 'downloading'
+        ? number('downloadProgress', 30, {
             range: true,
             min: 0,
             max: 100,
             step: 1,
-          });
-      }
-
-      const downloadProgress =
-        scenario === 'downloading'
-          ? number('downloadProgress', 30, {
-              range: true,
-              min: 0,
-              max: 100,
-              step: 1,
-            })
-          : 0;
-      const timeLeftNumber = parseInt(
-        // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'number' is not assignable to par... Remove this comment to see the full error message
-        rangeMap(downloadProgress, 0, 100, 30, 1),
-        10
-      );
-      const downloadTimeLeft = {
-        'EN-US': `${timeLeftNumber} minutes`,
-        'JP-JP': `${timeLeftNumber}分`,
-      };
-      return (
-        <AppUpdateOverlay
-          update={update[locale]}
-          downloadTimeLeft={downloadTimeLeft[locale]}
-          totalDownloaded="10Mb"
-          totalDownloadSize="30Mb"
-          availableAppVersion={availableAppVersion}
-          currentAppVersion={version}
-          downloadProgress={downloadProgress}
-          isUpdateDownloaded={isUpdateDownloaded}
-          isAutomaticUpdateFailed={isAutomaticUpdateFailed}
-          onClose={action('onClose')}
-          onInstallUpdate={action('onInstallUpdate')}
-          onPostponeUpdate={action('onPostponeUpdate')}
-          onExternalLinkClick={action('onExternalLinkClick')}
-          isWaitingToQuitDaedalus={isWaitingToQuitDaedalus}
-          isLinux={isLinux}
-          isFlight={isFlight}
-          isTestnet={isTestnet}
-          installationProgress={installationProgress}
-        />
-      );
-    }
-  );
+          })
+        : 0;
+    const timeLeftNumber = parseInt(
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'number' is not assignable to par... Remove this comment to see the full error message
+      rangeMap(downloadProgress, 0, 100, 30, 1),
+      10
+    );
+    const downloadTimeLeft = {
+      'EN-US': `${timeLeftNumber} minutes`,
+      'JP-JP': `${timeLeftNumber}分`,
+    };
+    return (
+      <AppUpdateOverlay
+        update={update[locale]}
+        downloadTimeLeft={downloadTimeLeft[locale]}
+        totalDownloaded="10Mb"
+        totalDownloadSize="30Mb"
+        availableAppVersion={availableAppVersion}
+        currentAppVersion={version}
+        downloadProgress={downloadProgress}
+        isUpdateDownloaded={isUpdateDownloaded}
+        isAutomaticUpdateFailed={isAutomaticUpdateFailed}
+        onClose={action('onClose')}
+        onInstallUpdate={action('onInstallUpdate')}
+        onPostponeUpdate={action('onPostponeUpdate')}
+        onExternalLinkClick={action('onExternalLinkClick')}
+        isWaitingToQuitDaedalus={isWaitingToQuitDaedalus}
+        isLinux={isLinux}
+        isFlight={isFlight}
+        isTestnet={isTestnet}
+        installationProgress={installationProgress}
+      />
+    );
+  });
diff --git a/storybook/stories/news/IncidentOverlay.stories.tsx b/storybook/stories/news/IncidentOverlay.stories.tsx
index 65d6d50ff6..9c16397107 100644
--- a/storybook/stories/news/IncidentOverlay.stories.tsx
+++ b/storybook/stories/news/IncidentOverlay.stories.tsx
@@ -7,9 +7,10 @@ import IncidentOverlay from '../../../source/renderer/app/components/news/Incide
 import { dateOptions } from '../_support/profileSettings';
 import { DATE_ENGLISH_OPTIONS } from '../../../source/renderer/app/config/profileConfig';
 
-storiesOf('News/Overlays', module)
+storiesOf('News|Overlays', module)
   .addDecorator((story) => (
     <StoryDecorator>
+      {/* @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ action: { label: string; url: ... Remove this comment to see the full error message */}
       {story({
         action: {
           label: 'Read More',
@@ -28,7 +29,7 @@ storiesOf('News/Overlays', module)
     </StoryDecorator>
   ))
   .addDecorator(withKnobs)
-  .add('Incident Overlay', (_, props) => (
+  .add('Incident Overlay', (props) => (
     <IncidentOverlay
       incident={props}
       onOpenExternalLink={action('onOpenExternalLink')}
@@ -40,7 +41,7 @@ storiesOf('News/Overlays', module)
       )}
     />
   ))
-  .add('Incident - Themed', (_, props) => (
+  .add('Incident - Themed', (props) => (
     <IncidentOverlay
       incident={{ ...props, color: 'theme-default' }}
       onOpenExternalLink={action('onOpenExternalLink')}
@@ -52,7 +53,7 @@ storiesOf('News/Overlays', module)
       )}
     />
   ))
-  .add('Incident - Grey', (_, props) => (
+  .add('Incident - Grey', (props) => (
     <IncidentOverlay
       incident={{ ...props, color: 'grey' }}
       onOpenExternalLink={action('onOpenExternalLink')}
diff --git a/storybook/stories/news/NewsFeed.stories.tsx b/storybook/stories/news/NewsFeed.stories.tsx
index f403880228..9e8a1793f6 100644
--- a/storybook/stories/news/NewsFeed.stories.tsx
+++ b/storybook/stories/news/NewsFeed.stories.tsx
@@ -17,7 +17,7 @@ const updateDownloadProgressOptions = {
   max: 100,
   step: 1,
 };
-storiesOf('News/NewsFeed', module)
+storiesOf('News|NewsFeed', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   )) // ====== Stories ======
@@ -61,60 +61,47 @@ storiesOf('News/NewsFeed', module)
       />
     </div>
   ))
-  .add(
-    'Fetched',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, { locale, }: { locale:... Remove this comment to see the full error message
-    (
-      _,
-      {
-        locale,
-      }: {
-        locale: string;
-      }
-    ) => {
-      const displayAppUpdateNewsItem = boolean(
-        'displayAppUpdateNewsItem',
-        true
-      );
-      const updateDownloadProgress = displayAppUpdateNewsItem
-        ? number('updateDownloadProgress', 30, updateDownloadProgressOptions)
-        : 0;
-      const news = new News.NewsCollection([
-        getNewsItem(1, 'incident', locale),
-        getNewsItem(2, 'incident', locale, true),
-        getNewsItem(3, 'alert', locale),
-        getNewsItem(4, 'alert', locale, true),
-        getNewsItem(5, 'announcement', locale),
-        getNewsItem(6, 'announcement', locale, true),
-        getNewsItem(7, 'info', locale),
-        getNewsItem(8, 'info', locale, true),
-        getNewsItem(9, 'software-update', locale, true),
-      ]);
-      return (
-        <div>
-          <NewsFeed
-            // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-            onGoToRoute={action('onGoToRoute')}
-            isLoadingNews={false}
-            onMarkNewsAsRead={action('onMarkNewsAsRead')}
-            onNewsItemActionClick={action('onNewsItemActionClick')}
-            onClose={action('onClose')}
-            news={news}
-            isNewsFeedOpen={boolean('isNewsFeedOpen', true)}
-            onOpenExternalLink={action('onOpenExternalLink')}
-            onOpenAlert={action('onOpenAlert')}
-            onProceedNewsAction={action('onOpenExternalLink')}
-            displayAppUpdateNewsItem={displayAppUpdateNewsItem}
-            updateDownloadProgress={updateDownloadProgress}
-            onOpenAppUpdate={action('onOpenAppUpdate')}
-            currentDateFormat={select(
-              'currentDateFormat',
-              dateOptions,
-              DATE_ENGLISH_OPTIONS[0].value
-            )}
-            isUpdatePostponed={false}
-          />
-        </div>
-      );
-    }
-  );
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+  .add('Fetched', ({ locale }: { locale: string }) => {
+    const displayAppUpdateNewsItem = boolean('displayAppUpdateNewsItem', true);
+    const updateDownloadProgress = displayAppUpdateNewsItem
+      ? number('updateDownloadProgress', 30, updateDownloadProgressOptions)
+      : 0;
+    const news = new News.NewsCollection([
+      getNewsItem(1, 'incident', locale),
+      getNewsItem(2, 'incident', locale, true),
+      getNewsItem(3, 'alert', locale),
+      getNewsItem(4, 'alert', locale, true),
+      getNewsItem(5, 'announcement', locale),
+      getNewsItem(6, 'announcement', locale, true),
+      getNewsItem(7, 'info', locale),
+      getNewsItem(8, 'info', locale, true),
+      getNewsItem(9, 'software-update', locale, true),
+    ]);
+    return (
+      <div>
+        <NewsFeed
+          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+          onGoToRoute={action('onGoToRoute')}
+          isLoadingNews={false}
+          onMarkNewsAsRead={action('onMarkNewsAsRead')}
+          onNewsItemActionClick={action('onNewsItemActionClick')}
+          onClose={action('onClose')}
+          news={news}
+          isNewsFeedOpen={boolean('isNewsFeedOpen', true)}
+          onOpenExternalLink={action('onOpenExternalLink')}
+          onOpenAlert={action('onOpenAlert')}
+          onProceedNewsAction={action('onOpenExternalLink')}
+          displayAppUpdateNewsItem={displayAppUpdateNewsItem}
+          updateDownloadProgress={updateDownloadProgress}
+          onOpenAppUpdate={action('onOpenAppUpdate')}
+          currentDateFormat={select(
+            'currentDateFormat',
+            dateOptions,
+            DATE_ENGLISH_OPTIONS[0].value
+          )}
+          isUpdatePostponed={false}
+        />
+      </div>
+    );
+  });
diff --git a/storybook/stories/nodes/about/About.stories.tsx b/storybook/stories/nodes/about/About.stories.tsx
index fea7459d1a..901c3f639e 100644
--- a/storybook/stories/nodes/about/About.stories.tsx
+++ b/storybook/stories/nodes/about/About.stories.tsx
@@ -5,7 +5,7 @@ import StoryDecorator from '../../_support/StoryDecorator';
 import AboutDialog from '../../../../source/renderer/app/containers/static/AboutDialog';
 import { aboutDialogProps } from '../_utils/props';
 
-storiesOf('Nodes/About', module)
+storiesOf('Nodes|About', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   ))
diff --git a/storybook/stories/nodes/environment/TopBarEnvironment.stories.tsx b/storybook/stories/nodes/environment/TopBarEnvironment.stories.tsx
index 987a54d1a8..7f7faea52e 100644
--- a/storybook/stories/nodes/environment/TopBarEnvironment.stories.tsx
+++ b/storybook/stories/nodes/environment/TopBarEnvironment.stories.tsx
@@ -7,7 +7,6 @@ import StoryDecorator from '../../_support/StoryDecorator';
 import StoryProvider from '../../_support/StoryProvider';
 import SidebarLayout from '../../../../source/renderer/app/components/layout/SidebarLayout';
 import TopBar from '../../../../source/renderer/app/components/layout/TopBar';
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../../source/renderer/ap... Remove this comment to see the full error message
 import topBarStyles from '../../../../source/renderer/app/components/layout/TopBar.scss';
 import NodeSyncStatusIcon from '../../../../source/renderer/app/components/widgets/NodeSyncStatusIcon';
 import TadaButton from '../../../../source/renderer/app/components/widgets/TadaButton';
@@ -114,25 +113,28 @@ const topBarProductionEnv = (currentTheme) => (
   </TopBar>
 );
 
-storiesOf('Nodes/Environment', module)
+storiesOf('Nodes|Environment', module)
   .addDecorator((story) => (
     <StoryProvider>
       <StoryDecorator>{story()}</StoryDecorator>
     </StoryProvider>
   ))
   .addDecorator(withKnobs) // ====== Stories ======
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Testnet', (props: { currentTheme: string }) => (
     <SidebarLayout
       topbar={topBarTestEnv(props.currentTheme)}
       sidebar={<noscript />}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Staging', (props: { currentTheme: string }) => (
     <SidebarLayout
       topbar={topBarStagingEnv(props.currentTheme)}
       sidebar={<noscript />}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: {    currentTheme: strin... Remove this comment to see the full error message
   .add('Production', (props: { currentTheme: string }) => (
     <SidebarLayout
       topbar={topBarProductionEnv(props.currentTheme)}
diff --git a/storybook/stories/nodes/errors/Errors.stories.tsx b/storybook/stories/nodes/errors/Errors.stories.tsx
index a71701b163..566772ff91 100644
--- a/storybook/stories/nodes/errors/Errors.stories.tsx
+++ b/storybook/stories/nodes/errors/Errors.stories.tsx
@@ -6,10 +6,10 @@ import StoryDecorator from '../../_support/StoryDecorator';
 import { NoDiskSpaceErrorStory } from './NoDiskSpaceError.stories';
 import { SystemTimeErrorStory } from './SystemTimeError.stories';
 
-storiesOf('Nodes / Errors', module)
+storiesOf('Nodes | Errors', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   )) // ====== Stories ======
   .add('No Disk Space Error', NoDiskSpaceErrorStory)
-  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: any, { locale, }: { locale: ... Remove this comment to see the full error message
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
   .add('System Time Error', SystemTimeErrorStory);
diff --git a/storybook/stories/nodes/errors/SystemTimeError.stories.tsx b/storybook/stories/nodes/errors/SystemTimeError.stories.tsx
index 1db5fad6d0..deca9d3432 100644
--- a/storybook/stories/nodes/errors/SystemTimeError.stories.tsx
+++ b/storybook/stories/nodes/errors/SystemTimeError.stories.tsx
@@ -3,14 +3,7 @@ import { boolean, number } from '@storybook/addon-knobs';
 import { action } from '@storybook/addon-actions';
 import SystemTimeError from '../../../../source/renderer/app/components/loading/system-time-error/SystemTimeError';
 
-export const SystemTimeErrorStory = (
-  _: any,
-  {
-    locale,
-  }: {
-    locale: string;
-  }
-) => (
+export const SystemTimeErrorStory = ({ locale }: { locale: string }) => (
   <SystemTimeError
     localTimeDifference={number('localTimeDifference', 0)}
     currentLocale={locale}
diff --git a/storybook/stories/nodes/splash/Splash.stories.tsx b/storybook/stories/nodes/splash/Splash.stories.tsx
index b4e7031a42..00dbdde07d 100644
--- a/storybook/stories/nodes/splash/Splash.stories.tsx
+++ b/storybook/stories/nodes/splash/Splash.stories.tsx
@@ -3,7 +3,7 @@ import { storiesOf } from '@storybook/react';
 import SplashNetworkFlight from '../../../../source/renderer/app/components/splash/SplashNetworkFlight';
 import StoryDecorator from '../../_support/StoryDecorator';
 
-storiesOf('Nodes/Splash Network Info', module)
+storiesOf('Nodes|Splash Network Info', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
   .add('Flight', () => (
     <SplashNetworkFlight onClose={() => null} openExternalLink={() => null} />
diff --git a/storybook/stories/nodes/status/Diagnostics.stories.tsx b/storybook/stories/nodes/status/Diagnostics.stories.tsx
index 097c23b123..393865519f 100644
--- a/storybook/stories/nodes/status/Diagnostics.stories.tsx
+++ b/storybook/stories/nodes/status/Diagnostics.stories.tsx
@@ -12,6 +12,10 @@ const systemInfo = {
   cpu: 'Intel(R) Core(TM) i5-3210M CPU @ 2.50GHz',
   ram: '32.0 GB',
   availableDiskSpace: '500 GB',
+  // TODO add one more example with low-end device
+  // https://input-output.atlassian.net/browse/DDW-928e
+  hasMetHardwareRequirements: true,
+  isRTSFlagsModeEnabled: false,
 };
 const coreInfo = {
   daedalusVersion: '0.14.0',
@@ -28,7 +32,7 @@ const coreInfo = {
   daedalusStateDirectoryPath:
     '/Users/daedalus/Library/Application Support/Daedalus Demo',
 };
-storiesOf('Nodes/Status', module)
+storiesOf('Nodes|Status', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
   .addDecorator(withKnobs) // ====== Stories ======
   .add('Daedalus Diagnostics', () => (
diff --git a/storybook/stories/nodes/syncing/Syncing.stories.tsx b/storybook/stories/nodes/syncing/Syncing.stories.tsx
index 83a5c215dd..ab38f5663b 100644
--- a/storybook/stories/nodes/syncing/Syncing.stories.tsx
+++ b/storybook/stories/nodes/syncing/Syncing.stories.tsx
@@ -10,7 +10,7 @@ import {
   ConnectivityIssuesSyncingConnectingStory,
 } from './SyncingConnecting.stories';
 
-storiesOf('Nodes/Connecting and Loading', module)
+storiesOf('Nodes|Connecting and Loading', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   )) // ====== Stories ======
diff --git a/storybook/stories/nodes/syncing/SyncingConnecting.stories.tsx b/storybook/stories/nodes/syncing/SyncingConnecting.stories.tsx
index d4a1e767bc..79f983c4fd 100644
--- a/storybook/stories/nodes/syncing/SyncingConnecting.stories.tsx
+++ b/storybook/stories/nodes/syncing/SyncingConnecting.stories.tsx
@@ -1,15 +1,42 @@
 import React from 'react';
-import { boolean, radios } from '@storybook/addon-knobs';
+import { boolean, radios, number } from '@storybook/addon-knobs';
 import { linkTo } from '@storybook/addon-links';
 import { action } from '@storybook/addon-actions';
 import SyncingConnecting from '../../../../source/renderer/app/components/loading/syncing-connecting/SyncingConnecting';
-import { CardanoNodeStates } from '../../../../source/common/types/cardano-node.types';
+import {
+  BlockSyncType,
+  CardanoNodeStates,
+} from '../../../../source/common/types/cardano-node.types';
+
+const makeProgressValueKnob = ({ name, value }) =>
+  number(name, value, {
+    range: true,
+    min: 0,
+    max: 100,
+    step: 0.01,
+  });
+
+const makeBlockSyncProgress = () => ({
+  [BlockSyncType.validatingChunk]: makeProgressValueKnob({
+    name: 'Verifying on-disk blockchain state',
+    value: 100,
+  }),
+  [BlockSyncType.replayedBlock]: makeProgressValueKnob({
+    name: 'Replaying ledger from on-disk blockchain',
+    value: 99.9,
+  }),
+  [BlockSyncType.pushingLedger]: makeProgressValueKnob({
+    name: 'Syncing blockchain',
+    value: 0,
+  }),
+});
 
 export const DefaultSyncingConnectingStory = () => (
   <SyncingConnecting
     hasNotification={false}
     hasUpdate={false}
-    isVerifyingBlockchain={false}
+    isVerifyingBlockchain={boolean('isVerifyingBlockchain', false)}
+    // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
     verificationProgress={0}
     // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
     hasUnreadAlerts={false}
@@ -45,6 +72,7 @@ export const DefaultSyncingConnectingStory = () => (
     onStatusIconClick={linkTo('Diagnostics', () => 'default')}
     disableDownloadLogs={boolean('disableDownloadLogs', true)}
     showNewsFeedIcon
+    blockSyncProgress={makeBlockSyncProgress()}
   />
 );
 export const ConnectivityIssuesSyncingConnectingStory = () => (
@@ -52,7 +80,7 @@ export const ConnectivityIssuesSyncingConnectingStory = () => (
     hasNotification={false}
     hasUpdate={false}
     isVerifyingBlockchain={false}
-    verificationProgress={0}
+    blockSyncProgress={makeBlockSyncProgress()}
     // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
     hasUnreadAlerts={false}
     hasUnreadAnnouncements={false}
@@ -91,7 +119,7 @@ export const LoadingWalletDataSyncingConnectingStory = () => (
     hasNotification={false}
     hasUpdate={false}
     isVerifyingBlockchain={false}
-    verificationProgress={0}
+    blockSyncProgress={makeBlockSyncProgress()}
     // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
     hasUnreadAlerts={false}
     hasUnreadAnnouncements={false}
diff --git a/storybook/stories/nodes/updates/Updates.stories.tsx b/storybook/stories/nodes/updates/Updates.stories.tsx
index 118d118716..899252c413 100644
--- a/storybook/stories/nodes/updates/Updates.stories.tsx
+++ b/storybook/stories/nodes/updates/Updates.stories.tsx
@@ -6,7 +6,7 @@ import StoryDecorator from '../../_support/StoryDecorator';
 // Stories
 import { DataLayerMigrationStory } from './DataLayerMigration.stories';
 
-storiesOf('Nodes/Updates', module)
+storiesOf('Nodes|Updates', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   )) // ====== Stories ======
diff --git a/storybook/stories/notifications/Notifications.stories.tsx b/storybook/stories/notifications/Notifications.stories.tsx
index 89285fd599..162dc02389 100644
--- a/storybook/stories/notifications/Notifications.stories.tsx
+++ b/storybook/stories/notifications/Notifications.stories.tsx
@@ -14,7 +14,7 @@ import Notification from '../../../source/renderer/app/components/notifications/
 import InlineNotification from '../../../source/renderer/app/components/notifications/InlineNotification';
 import { NOTIFICATION_DEFAULT_DURATION } from '../../../source/renderer/app/config/timingConfig';
 
-storiesOf('Common/Notifications', module)
+storiesOf('Common|Notifications', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
   .addDecorator(withKnobs) // ====== Stories ======
   .add(
diff --git a/storybook/stories/settings/general/General.stories.tsx b/storybook/stories/settings/general/General.stories.tsx
index 5e7bb9b617..afd4b65ef8 100644
--- a/storybook/stories/settings/general/General.stories.tsx
+++ b/storybook/stories/settings/general/General.stories.tsx
@@ -37,7 +37,7 @@ const getParamName = (obj, itemName): any =>
   Object.entries(obj).find((entry: [any, any]) => itemName === entry[1]);
 
 /* eslint-disable consistent-return */
-storiesOf('Settings/General', module)
+storiesOf('Settings|General', module)
   .addDecorator(SettingsWrapper) // ====== Stories ======
   .add('General', () => (
     <ProfileSettingsForm
@@ -113,7 +113,7 @@ storiesOf('Settings/General', module)
       }}
     />
   ))
-  .add('Terms of Service', (_, props) => {
+  .add('Terms of Service', (props) => {
     const termsOfUseSource = require(`../../../../source/renderer/app/i18n/locales/terms-of-use/${props.locale}.md`);
 
     return (
diff --git a/storybook/stories/settings/language/Language.stories.tsx b/storybook/stories/settings/language/Language.stories.tsx
index 3cd4e81f08..e5c69afcf8 100644
--- a/storybook/stories/settings/language/Language.stories.tsx
+++ b/storybook/stories/settings/language/Language.stories.tsx
@@ -9,52 +9,32 @@ import {
   TIME_OPTIONS,
 } from '../../../../source/renderer/app/config/profileConfig';
 
-storiesOf('Settings/Language', module)
+storiesOf('Settings|Language', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>) // ====== Stories ======
-  .add(
-    'Select Language - initial',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, { locale, }: { locale:... Remove this comment to see the full error message
-    (
-      _,
-      {
-        locale,
-      }: {
-        locale: string;
-      }
-    ) => (
-      <div>
-        <InitialSettings
-          onSubmit={action('submit')}
-          onChangeItem={action('onChangeItem')}
-          currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
-          currentLocale={locale}
-          currentNumberFormat={NUMBER_OPTIONS[0].value}
-          currentTimeFormat={TIME_OPTIONS[0].value}
-        />
-      </div>
-    )
-  )
-  .add(
-    'Select Language - submitting',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, { locale, }: { locale:... Remove this comment to see the full error message
-    (
-      _,
-      {
-        locale,
-      }: {
-        locale: string;
-      }
-    ) => (
-      <div>
-        <InitialSettings
-          onSubmit={action('submit')}
-          onChangeItem={action('onChangeItem')}
-          currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
-          currentLocale={locale}
-          currentNumberFormat={NUMBER_OPTIONS[0].value}
-          currentTimeFormat={TIME_OPTIONS[0].value}
-          isSubmitting
-        />
-      </div>
-    )
-  );
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+  .add('Select Language - initial', ({ locale }: { locale: string }) => (
+    <div>
+      <InitialSettings
+        onSubmit={action('submit')}
+        onChangeItem={action('onChangeItem')}
+        currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
+        currentLocale={locale}
+        currentNumberFormat={NUMBER_OPTIONS[0].value}
+        currentTimeFormat={TIME_OPTIONS[0].value}
+      />
+    </div>
+  ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+  .add('Select Language - submitting', ({ locale }: { locale: string }) => (
+    <div>
+      <InitialSettings
+        onSubmit={action('submit')}
+        onChangeItem={action('onChangeItem')}
+        currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
+        currentLocale={locale}
+        currentNumberFormat={NUMBER_OPTIONS[0].value}
+        currentTimeFormat={TIME_OPTIONS[0].value}
+        isSubmitting
+      />
+    </div>
+  ));
diff --git a/storybook/stories/staking/CountdownParty.stories.tsx b/storybook/stories/staking/CountdownParty.stories.tsx
index 4dbf65b94b..62a5087645 100644
--- a/storybook/stories/staking/CountdownParty.stories.tsx
+++ b/storybook/stories/staking/CountdownParty.stories.tsx
@@ -9,13 +9,10 @@ import NodeSyncStatusIcon from '../../../source/renderer/app/components/widgets/
 import NewsFeedIcon from '../../../source/renderer/app/components/widgets/NewsFeedIcon';
 import TadaButton from '../../../source/renderer/app/components/widgets/TadaButton';
 
-const decorators = [
-  withKnobs,
-  (story) => <StoryDecorator>{story()}</StoryDecorator>,
-];
-storiesOf('Decentralization / Countdown', module).add(
-  'Countdown party',
-  () => {
+storiesOf('Decentralization | Countdown', module)
+  .addDecorator(withKnobs)
+  .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>) // ====== Stories ======
+  .add('Countdown party', () => {
     const isAlonzoActivated = boolean('isAlonzoActivated', false);
     const date = isAlonzoActivated
       ? new Date().getTime() - 100000000
@@ -70,8 +67,4 @@ storiesOf('Decentralization / Countdown', module).add(
         />
       </div>
     );
-  },
-  {
-    decorators,
-  }
-);
+  });
diff --git a/storybook/stories/staking/RedeemItnWallets.stories.tsx b/storybook/stories/staking/RedeemItnWallets.stories.tsx
index 22eb849e2b..fc6bf42c46 100644
--- a/storybook/stories/staking/RedeemItnWallets.stories.tsx
+++ b/storybook/stories/staking/RedeemItnWallets.stories.tsx
@@ -151,23 +151,29 @@ export const Step3SuccessDialogStory = () => {
     />
   );
 };
-export const Step3FailureDialogStory = () => (
-  <Step3FailureDialog onClose={action('onClose')} onBack={action('onBack')} />
-);
-export const NoWalletsDialogDialogStory = () => (
-  <NoWalletsDialog
-    onClose={action('onClose')}
-    onAddWallet={action('onAddWallet')}
-  />
-);
-export const RedemptionUnavailableDialogDialogStory = () => (
-  <RedemptionUnavailableDialog
-    onClose={action('onClose')}
-    syncPercentage={number('syncPercentage', 37, {
-      range: true,
-      min: 0,
-      max: 100,
-      step: 1,
-    })}
-  />
-);
+export const Step3FailureDialogStory = () => {
+  return (
+    <Step3FailureDialog onClose={action('onClose')} onBack={action('onBack')} />
+  );
+};
+export const NoWalletsDialogDialogStory = () => {
+  return (
+    <NoWalletsDialog
+      onClose={action('onClose')}
+      onAddWallet={action('onAddWallet')}
+    />
+  );
+};
+export const RedemptionUnavailableDialogDialogStory = () => {
+  return (
+    <RedemptionUnavailableDialog
+      onClose={action('onClose')}
+      syncPercentage={number('syncPercentage', 37, {
+        range: true,
+        min: 0,
+        max: 100,
+        step: 1,
+      })}
+    />
+  );
+};
diff --git a/storybook/stories/staking/Rewards.stories.tsx b/storybook/stories/staking/Rewards.stories.tsx
index bf033314cb..a09780a332 100644
--- a/storybook/stories/staking/Rewards.stories.tsx
+++ b/storybook/stories/staking/Rewards.stories.tsx
@@ -3,17 +3,20 @@ import { map } from 'lodash';
 import BigNumber from 'bignumber.js';
 import { action } from '@storybook/addon-actions';
 // Screens
-import StakingRewards from '../../../source/renderer/app/components/staking/rewards/StakingRewards';
+import { StakingRewards } from '../../../source/renderer/app/components/staking/rewards/StakingRewards';
 // Dummy data initialization
 import REWARDS from '../../../source/renderer/app/config/stakingRewards.dummy.json';
 
-const rewards = map(REWARDS, (reward) => ({
-  ...reward,
-  reward: new BigNumber(reward.reward),
-}));
+const rewards = map(REWARDS, (reward) => {
+  return {
+    ...reward,
+    total: new BigNumber(reward.total),
+    unspent: new BigNumber(reward.unspent),
+  };
+});
 export const StakingRewardsStory = () => (
   <StakingRewards
-    // @ts-ignore ts-migrate(2322) FIXME: Type '{ reward: BigNumber; date: string; wallet: s... Remove this comment to see the full error message
+    // @ts-ignore ts-migrate(2322) FIXME: Type '{ total: BigNumber; unspent: BigNumber; date... Remove this comment to see the full error message
     rewards={rewards}
     isLoading={false}
     isExporting={false}
diff --git a/storybook/stories/staking/Staking.stories.tsx b/storybook/stories/staking/Staking.stories.tsx
index d5f93fd24f..4b45cbbdc5 100644
--- a/storybook/stories/staking/Staking.stories.tsx
+++ b/storybook/stories/staking/Staking.stories.tsx
@@ -89,33 +89,31 @@ const decorator = (story, context) => {
   );
 };
 
-storiesOf('Decentralization / Countdown', module).add(
-  pageNames.countdown,
-  () => (
-    <div>
-      <StakingCountdown
-        startDateTime={startDateTimeKnob(
-          'Decentralization Start DateTime',
-          defaultStartDateTime
-        )}
-        onLearnMoreClick={action('onLearnMoreClick')}
-      />
-    </div>
-  ),
-  {
-    id: 'countdown',
-  },
-  // @ts-ignore ts-migrate(2554) FIXME: Expected 2-3 arguments, but got 4.
-  {
-    decorators: [decorator],
-  }
-);
-storiesOf('Decentralization / Staking', module)
+storiesOf('Decentralization | Countdown', module)
+  .addDecorator(decorator)
+  .add(
+    pageNames.countdown,
+    () => (
+      <div>
+        <StakingCountdown
+          startDateTime={startDateTimeKnob(
+            'Decentralization Start DateTime',
+            defaultStartDateTime
+          )}
+          onLearnMoreClick={action('onLearnMoreClick')}
+        />
+      </div>
+    ),
+    {
+      id: 'countdown',
+    }
+  );
+storiesOf('Decentralization | Staking', module)
   .addDecorator(decorator) // ====== Stories ======
   .add(
     pageNames['delegation-center'],
-    (_, props) => (
-      // @ts-ignore ts-migrate(2739) FIXME: Type '{ isEpochsInfoAvailable: true; componentId: ... Remove this comment to see the full error message
+    (props) => (
+      // @ts-ignore ts-migrate(2739) FIXME: Type '{ isEpochsInfoAvailable: true; id: string; n... Remove this comment to see the full error message
       <StakingDelegationCenterStory {...props} isEpochsInfoAvailable />
     ),
     {
@@ -124,7 +122,7 @@ storiesOf('Decentralization / Staking', module)
   )
   .add(
     'Delegation Center - Loading',
-    (_, props) => (
+    (props) => (
       // @ts-ignore ts-migrate(2739) FIXME: Type '{ isLoading: true; isEpochsInfoAvailable: tr... Remove this comment to see the full error message
       <StakingDelegationCenterStory
         {...props}
@@ -138,8 +136,8 @@ storiesOf('Decentralization / Staking', module)
   )
   .add(
     'Delegation Center - Not an Shelley era',
-    (_, props) => (
-      // @ts-ignore ts-migrate(2739) FIXME: Type '{ isEpochsInfoAvailable: false; componentId:... Remove this comment to see the full error message
+    (props) => (
+      // @ts-ignore ts-migrate(2739) FIXME: Type '{ isEpochsInfoAvailable: false; id: string; ... Remove this comment to see the full error message
       <StakingDelegationCenterStory {...props} isEpochsInfoAvailable={false} />
     ),
     {
@@ -152,17 +150,19 @@ storiesOf('Decentralization / Staking', module)
       minDelegationFunds={number('minDelegationFunds', 10)}
     />
   ))
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: Props) => JSX.Element' i... Remove this comment to see the full error message
   .add(pageNames['stake-pools'], StakePoolsStory, {
     id: 'stake-pools',
   })
   .add(
     `${pageNames['stake-pools']} - Loading`,
-    // @ts-ignore ts-migrate(2739) FIXME: Type '{ isLoading: true; componentId: string; titl... Remove this comment to see the full error message
-    (_, props) => <StakePoolsStory {...props} isLoading />,
+    // @ts-ignore ts-migrate(2739) FIXME: Type '{ isLoading: true; id: string; name: string;... Remove this comment to see the full error message
+    (props) => <StakePoolsStory {...props} isLoading />,
     {
       id: 'stake-pools-loading',
     }
   )
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: Props) => JSX.Element' i... Remove this comment to see the full error message
   .add(pageNames['stake-pools-table'], StakePoolsTableStory, {
     id: 'stake-pools-table',
   })
@@ -217,7 +217,7 @@ storiesOf('Decentralization / Staking', module)
   )
   .add(
     'Delegation Wizard',
-    (_, props) => {
+    (props) => {
       const oversaturationPercentage = number('Oversaturation Percentage', 0, {
         min: 0,
         max: 1000,
@@ -239,14 +239,14 @@ storiesOf('Decentralization / Staking', module)
   .add(
     'Delegation Wizard - Delegation Not Available',
     // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-    (_, props) => <StakingDelegationSteps {...props} isDisabled />,
+    (props) => <StakingDelegationSteps {...props} isDisabled />,
     {
       id: 'wizard',
     }
   )
   .add(
     'Undelegate Confirmation',
-    (_, props) => (
+    (props) => (
       <StakingUndelegateConfirmationStory
         {...props}
         isHardwareWallet={boolean('isHardwareWallet', false)}
@@ -258,7 +258,7 @@ storiesOf('Decentralization / Staking', module)
   )
   .add(
     'Undelegate Confirmation - unknownn stake pool',
-    (_, props) => (
+    (props) => (
       <StakingUndelegateConfirmationStory {...props} unknownStakePool />
     ),
     {
@@ -267,13 +267,13 @@ storiesOf('Decentralization / Staking', module)
   )
   .add(
     'Undelegate Confirmation Result',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: any, { locale, }: { locale: ... Remove this comment to see the full error message
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale, }: { locale: string; ... Remove this comment to see the full error message
     StakingUndelegateConfirmationResultStory,
     {
       id: 'undelegate-confirmation-result',
     }
   );
-storiesOf('Decentralization / Redeem ITN Rewards', module)
+storiesOf('Decentralization | Redeem ITN Rewards', module)
   .addDecorator(decorator) // ====== Stories ======
   .add('Step 1', Step1ConfigurationDialogStory, {
     id: 'redeem-itn-wallets-story',
diff --git a/storybook/stories/staking/StakingWrapper.tsx b/storybook/stories/staking/StakingWrapper.tsx
index 37ffe132a8..02324ab06c 100644
--- a/storybook/stories/staking/StakingWrapper.tsx
+++ b/storybook/stories/staking/StakingWrapper.tsx
@@ -45,7 +45,9 @@ export default (story, context) => {
             <StakingWithNavigation
               isActiveNavItem={(item) => item === getItemFromContext()}
               activeItem={getItemFromContext()}
-              onNavItemClick={linkTo(context.kind, (item) => pageNames[item])}
+              onNavItemClick={linkTo(context.kind, (item) => {
+                return pageNames[item];
+              })}
             >
               {storyWithKnobs}
             </StakingWithNavigation>
diff --git a/storybook/stories/staking/Undelegate.stories.tsx b/storybook/stories/staking/Undelegate.stories.tsx
index b9c5bd6103..c125113034 100644
--- a/storybook/stories/staking/Undelegate.stories.tsx
+++ b/storybook/stories/staking/Undelegate.stories.tsx
@@ -91,14 +91,11 @@ export const StakingUndelegateConfirmationStory = (props: {
     isTrezor={boolean('isTrezor', false)}
   />
 );
-export const StakingUndelegateConfirmationResultStory = (
-  _: any,
-  {
-    locale,
-  }: {
-    locale: string;
-  }
-) => (
+export const StakingUndelegateConfirmationResultStory = ({
+  locale,
+}: {
+  locale: string;
+}) => (
   <UndelegateWalletSuccessDialog
     walletName="Darko's ADA"
     // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
diff --git a/storybook/stories/voting/Voting.stories.tsx b/storybook/stories/voting/Voting.stories.tsx
index 4a6719e3e4..7e3acbcd93 100644
--- a/storybook/stories/voting/Voting.stories.tsx
+++ b/storybook/stories/voting/Voting.stories.tsx
@@ -11,7 +11,8 @@ import VotingRegistrationStepsConfirm from '../../../source/renderer/app/compone
 import VotingRegistrationStepsEnterPinCode from '../../../source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsEnterPinCode';
 import VotingRegistrationStepsQrCode from '../../../source/renderer/app/components/voting/voting-registration-wizard-steps/VotingRegistrationStepsQrCode';
 import VotingInfo from '../../../source/renderer/app/components/voting/voting-info/VotingInfo';
-import { FundPhases } from '../../../source/renderer/app/stores/VotingStore';
+import { FundPhase } from '../../../source/renderer/app/stores/VotingStore';
+import { CatalystFund } from '../../../source/renderer/app/api/voting/types';
 import { VotingFooterLinks } from '../../../source/renderer/app/components/voting/VotingFooterLinks';
 import {
   LANGUAGE_OPTIONS,
@@ -29,6 +30,22 @@ import {
 } from '../_support/utils';
 import { HwDeviceStatuses } from '../../../source/renderer/app/domains/Wallet';
 import VerticalFlexContainer from '../../../source/renderer/app/components/layout/VerticalFlexContainer';
+import { Locale } from '../../../source/common/types/locales.types';
+
+const mockFundInfo: CatalystFund = {
+  current: {
+    number: 7,
+    startTime: new Date('Jan 20, 2022, 11:00 UTC'),
+    endTime: new Date('Feb 3, 2022, 11:00 UTC'),
+    resultsTime: new Date('Feb 10, 2022'),
+    registrationSnapshotTime: new Date('Jan 6, 2022, 11:00 UTC'),
+  },
+  next: {
+    number: 8,
+    startTime: new Date('Jan 6, 2022, 11:00 UTC'),
+    registrationSnapshotTime: new Date('Apr 7, 2022, 11:00 UTC'),
+  },
+};
 
 const assets = {
   available: [
@@ -77,7 +94,17 @@ const WALLETS = [
   ),
 ];
 const stepsList = ['Wallet', 'Sign', 'Confirm', 'PIN code', 'QR code'];
-storiesOf('Voting/Voting Registration Wizard', module)
+
+const votingInfo = {
+  fundInfo: mockFundInfo,
+  currentLocale: LANGUAGE_OPTIONS[0].value as Locale,
+  currentDateFormat: DATE_ENGLISH_OPTIONS[0].value,
+  currentTimeFormat: TIME_OPTIONS[0].value,
+  onRegisterToVoteClick: action('onRegisterToVoteClick'),
+  onExternalLinkClick: action('onExternalLinkClick'),
+};
+
+storiesOf('Voting|Voting Registration Wizard', module)
   .addDecorator((story) => (
     <StoryProvider>
       <StoryDecorator>{story()}</StoryDecorator>
@@ -96,6 +123,7 @@ storiesOf('Voting/Voting Registration Wizard', module)
       selectedWalletId={WALLETS[0].id}
       isWalletAcceptable={action('isWalletAcceptable')}
       getStakePoolById={action('getStakePoolById')}
+      nextFundNumber={8}
     />
   ))
   .add('Voting Registration - Step 2', () => (
@@ -104,6 +132,7 @@ storiesOf('Voting/Voting Registration Wizard', module)
       onBack={action('onBack')}
       stepsList={stepsList}
       activeStep={2}
+      nextFundNumber={8}
       transactionFee={
         new BigNumber(
           number('transactionFee', 0.3, {
@@ -136,6 +165,7 @@ storiesOf('Voting/Voting Registration Wizard', module)
       onConfirm={action('onConfirm')}
       onRestart={action('onRestart')}
       transactionError={boolean('transactionError', false)}
+      nextFundNumber={8}
     />
   ))
   .add('Voting Registration - Step 4', () => (
@@ -144,6 +174,7 @@ storiesOf('Voting/Voting Registration Wizard', module)
       stepsList={stepsList}
       activeStep={4}
       onSetPinCode={action('onSetPinCode')}
+      nextFundNumber={8}
     />
   ))
   .add('Voting Registration - Step 5', () => (
@@ -153,22 +184,29 @@ storiesOf('Voting/Voting Registration Wizard', module)
       stepsList={stepsList}
       activeStep={2}
       qrCode="djkhfkwdjhfkwdhfkwjdhfkwdhf9wdyf9wdh9u3h03hd0f3hd0h30hf30dhf03dhf03dhf03dhf03dhf0u3dhf0u3dhf0u3dfh30uhfd30uh"
+      nextFundNumber={8}
     />
   ));
-storiesOf('Voting/Voting Info', module)
-  .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
+storiesOf('Voting|Voting Info', module)
+  .addDecorator((story) => (
+    <StoryDecorator>
+      <VerticalFlexContainer>
+        {story()}
+        <VotingFooterLinks />
+      </VerticalFlexContainer>
+    </StoryDecorator>
+  ))
   .addDecorator(withKnobs) // ====== Stories ======
-  .add('Voting Info', () => (
-    <VerticalFlexContainer>
-      <VotingInfo
-        // @ts-ignore ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'Locale'.
-        currentLocale={LANGUAGE_OPTIONS[0].value}
-        currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
-        currentTimeFormat={TIME_OPTIONS[0].value}
-        isRegistrationEnded={boolean('isRegistrationEnded', false)}
-        onRegisterToVoteClick={action('onRegisterToVoteClick')}
-        onExternalLinkClick={action('onExternalLinkClick')}
-      />
-      <VotingFooterLinks />
-    </VerticalFlexContainer>
-  ));
+  .add('Snapshot phase', () => (
+    <VotingInfo {...votingInfo} fundPhase={FundPhase.SNAPSHOT} />
+  ))
+  .add('Voting phase', () => (
+    <VotingInfo {...votingInfo} fundPhase={FundPhase.VOTING} />
+  ))
+  .add('Tallying phase', () => (
+    <VotingInfo {...votingInfo} fundPhase={FundPhase.TALLYING} />
+  ))
+  .add('Results phase', () => (
+    <VotingInfo {...votingInfo} fundPhase={FundPhase.RESULTS} />
+  ))
+  .add('API error', () => <VotingInfo {...votingInfo} fundPhase={null} />);
diff --git a/storybook/stories/wallets/_utils/HardwareWalletWithNavigationLayout.tsx b/storybook/stories/wallets/_utils/HardwareWalletWithNavigationLayout.tsx
index f2c3e5b9fc..644e7dd743 100644
--- a/storybook/stories/wallets/_utils/HardwareWalletWithNavigationLayout.tsx
+++ b/storybook/stories/wallets/_utils/HardwareWalletWithNavigationLayout.tsx
@@ -23,8 +23,9 @@ export default class WalletWithNavigationLayout extends Component<Props> {
     stores: null,
     storiesProps: null,
   };
-  getItemFromContext = (context: contextType) =>
-    context.kind.replace('Wallets|', '').toLocaleLowerCase();
+  getItemFromContext = (context: contextType) => {
+    return context.kind.replace('Wallets|', '').toLocaleLowerCase();
+  };
 
   render() {
     const { stores, context, children } = this.props;
diff --git a/storybook/stories/wallets/_utils/WalletWithNavigationLayout.tsx b/storybook/stories/wallets/_utils/WalletWithNavigationLayout.tsx
index 661dc04b17..0f31d99e15 100644
--- a/storybook/stories/wallets/_utils/WalletWithNavigationLayout.tsx
+++ b/storybook/stories/wallets/_utils/WalletWithNavigationLayout.tsx
@@ -12,12 +12,12 @@ type Props = {
   stores?: {} | null | undefined;
 };
 const walletStories = {
-  send: 'Wallets/Send',
-  receive: 'Wallets/Receive',
-  transactions: 'Wallets/Transactions',
-  tokens: 'Wallets/Tokens',
-  summary: 'Wallets/Summary',
-  settings: 'Wallets/Settings',
+  send: 'Wallets|Send',
+  receive: 'Wallets|Receive',
+  transactions: 'Wallets|Transactions',
+  tokens: 'Wallets|Tokens',
+  summary: 'Wallets|Summary',
+  settings: 'Wallets|Settings',
 };
 export default class WalletWithNavigationLayout extends Component<Props> {
   static defaultProps = {
@@ -25,7 +25,7 @@ export default class WalletWithNavigationLayout extends Component<Props> {
     storiesProps: null,
   };
   getItemFromContext = (context: contextType) => {
-    return context.kind.replace('Wallets/', '').toLocaleLowerCase();
+    return context.kind.replace('Wallets|', '').toLocaleLowerCase();
   };
 
   render() {
@@ -33,7 +33,7 @@ export default class WalletWithNavigationLayout extends Component<Props> {
     const activeWallet = get(stores, ['wallets', 'active']);
     const { hasPassword, isLegacy, isNotResponding } = activeWallet;
     const contextItem = context.kind
-      .replace('Wallets/', '')
+      .replace('Wallets|', '')
       .toLocaleLowerCase();
     return (
       <WalletWithNavigation
@@ -43,7 +43,7 @@ export default class WalletWithNavigationLayout extends Component<Props> {
         isLegacy={isLegacy}
         isNotResponding={isNotResponding}
         isSetWalletPasswordDialogOpen={false}
-        // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(item: any) => any' is not assig... Remove this comment to see the full error message
+        // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(item: any) => any' is not assigned... Remove this comment to see the full error message
         onWalletNavItemClick={linkTo((item) => walletStories[item])}
         onSetWalletPassword={() => {}}
         onOpenExternalLink={() => {}}
diff --git a/storybook/stories/wallets/_utils/WalletsWrapper.tsx b/storybook/stories/wallets/_utils/WalletsWrapper.tsx
index 493f64ddf6..384cdfbc18 100644
--- a/storybook/stories/wallets/_utils/WalletsWrapper.tsx
+++ b/storybook/stories/wallets/_utils/WalletsWrapper.tsx
@@ -1,20 +1,22 @@
 import React from 'react';
+import { withKnobs } from '@storybook/addon-knobs';
 import StoryLayout from '../../_support/StoryLayout';
 import StoryProvider from '../../_support/StoryProvider';
 import StoryDecorator from '../../_support/StoryDecorator';
 import WalletWithNavigationLayout from './WalletWithNavigationLayout';
 
 export default (story: any, context: any) => {
+  const storyWithKnobs = withKnobs(story, context);
   return (
     <StoryDecorator>
       <StoryProvider>
         <StoryLayout activeSidebarCategory="/wallets" {...context}>
           {context.story !== 'Empty' && context.story !== 'Wallet Add' ? (
             <WalletWithNavigationLayout context={context}>
-              {story()}
+              {storyWithKnobs}
             </WalletWithNavigationLayout>
           ) : (
-            story()
+            storyWithKnobs
           )}
         </StoryLayout>
       </StoryProvider>
diff --git a/storybook/stories/wallets/addWallet/Add.stories.tsx b/storybook/stories/wallets/addWallet/Add.stories.tsx
index 71628ff12f..a30879cc58 100644
--- a/storybook/stories/wallets/addWallet/Add.stories.tsx
+++ b/storybook/stories/wallets/addWallet/Add.stories.tsx
@@ -14,7 +14,7 @@ const wrapperStyles = {
 };
 
 /* eslint-disable consistent-return */
-storiesOf('Wallets/Add Wallet', module) // ====== Stories ======
+storiesOf('Wallets|Add Wallet', module) // ====== Stories ======
   .add('Add', () => (
     // @ts-ignore ts-migrate(2322) FIXME: Type '{ alignItems: string; backgroundColor: strin... Remove this comment to see the full error message
     <div style={wrapperStyles}>
diff --git a/storybook/stories/wallets/addWallet/Create.stories.tsx b/storybook/stories/wallets/addWallet/Create.stories.tsx
index 777c5ba772..6094a11adf 100644
--- a/storybook/stories/wallets/addWallet/Create.stories.tsx
+++ b/storybook/stories/wallets/addWallet/Create.stories.tsx
@@ -6,13 +6,16 @@ import WalletCreateDialog from '../../../../source/renderer/app/components/walle
 // Assets and helpers
 import WalletsWrapper from '../_utils/WalletsWrapper';
 
-storiesOf('Wallets/Add Wallet', module)
+storiesOf('Wallets|Add Wallet', module)
   .addDecorator(WalletsWrapper)
   .add('Create - New process', () => <CreateWalletScreens />)
-  .add('Create - Old process', ({ locale }: { locale: string }) => (
-    <WalletCreateDialog
-      onSubmit={action('onSubmit')}
-      onCancel={action('onCancel')}
-      currentLocale={locale}
-    />
-  ));
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+  .add('Create - Old process', ({ locale }: { locale: string }) => {
+    return (
+      <WalletCreateDialog
+        onSubmit={action('onSubmit')}
+        onCancel={action('onCancel')}
+        currentLocale={locale}
+      />
+    );
+  });
diff --git a/storybook/stories/wallets/addWallet/Import.stories.tsx b/storybook/stories/wallets/addWallet/Import.stories.tsx
index 68ce2129fb..c22ecd80e7 100644
--- a/storybook/stories/wallets/addWallet/Import.stories.tsx
+++ b/storybook/stories/wallets/addWallet/Import.stories.tsx
@@ -5,7 +5,7 @@ import { storiesOf } from '@storybook/react';
 import WalletsWrapper from '../_utils/WalletsWrapper';
 import WalletFileImportDialog from '../../../../source/renderer/app/components/wallet/file-import/WalletFileImportDialog';
 
-storiesOf('Wallets/Add Wallet', module)
+storiesOf('Wallets|Add Wallet', module)
   .addDecorator(WalletsWrapper)
   .add('Import', () => (
     <WalletFileImportDialog
diff --git a/storybook/stories/wallets/addWallet/Restore.stories.tsx b/storybook/stories/wallets/addWallet/Restore.stories.tsx
index adb96e5c4a..ecfe3dbf08 100644
--- a/storybook/stories/wallets/addWallet/Restore.stories.tsx
+++ b/storybook/stories/wallets/addWallet/Restore.stories.tsx
@@ -20,7 +20,7 @@ import SuccessDialog from '../../../../source/renderer/app/components/wallet/wal
 type Props = {
   locale: string;
 };
-storiesOf('Wallets/Add Wallet', module)
+storiesOf('Wallets|Add Wallet', module)
   .addDecorator(WalletsWrapper)
   .add('Restore - Step 1', () => {
     const walletKindSelect = select(
@@ -98,6 +98,7 @@ storiesOf('Wallets/Add Wallet', module)
       />
     );
   })
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: Props) => JSX.Element' i... Remove this comment to see the full error message
   .add('Restore - Step 3', (props: Props) => {
     const { locale } = props;
     return (
diff --git a/storybook/stories/wallets/addWallet/RestoreOld.stories.tsx b/storybook/stories/wallets/addWallet/RestoreOld.stories.tsx
index 62b1482079..699ba6c3a1 100644
--- a/storybook/stories/wallets/addWallet/RestoreOld.stories.tsx
+++ b/storybook/stories/wallets/addWallet/RestoreOld.stories.tsx
@@ -7,7 +7,7 @@ import WalletsWrapper from '../_utils/WalletsWrapper';
 // Screens
 import WalletRestoreDialog from '../../../../source/renderer/app/components/wallet/WalletRestoreDialog';
 
-storiesOf('Wallets/Add Wallet', module)
+storiesOf('Wallets|Add Wallet', module)
   .addDecorator(WalletsWrapper)
   .add('Restore - Old', () => (
     <WalletRestoreDialog
diff --git a/storybook/stories/wallets/export/WalletExportToFile.stories.tsx b/storybook/stories/wallets/export/WalletExportToFile.stories.tsx
index 58fc72934b..fcd43bc9ed 100644
--- a/storybook/stories/wallets/export/WalletExportToFile.stories.tsx
+++ b/storybook/stories/wallets/export/WalletExportToFile.stories.tsx
@@ -4,7 +4,7 @@ import { action } from '@storybook/addon-actions';
 import WalletsWrapper from '../_utils/WalletsWrapper';
 import ExportWalletToFileDialog from '../../../../source/renderer/app/components/wallet/settings/ExportWalletToFileDialog';
 
-storiesOf('Wallets/Export to File', module)
+storiesOf('Wallets|Export to File', module)
   .addDecorator(WalletsWrapper) // ====== Stories ======
   .add('default', () => (
     <div>
diff --git a/storybook/stories/wallets/hardwareWallets/HardwareWallets.stories.tsx b/storybook/stories/wallets/hardwareWallets/HardwareWallets.stories.tsx
index a3497cd9c8..33be972527 100644
--- a/storybook/stories/wallets/hardwareWallets/HardwareWallets.stories.tsx
+++ b/storybook/stories/wallets/hardwareWallets/HardwareWallets.stories.tsx
@@ -29,7 +29,7 @@ const trezorDevice = {
   path: null,
   firmwareVersion: MINIMAL_TREZOR_FIRMWARE_VERSION,
 };
-storiesOf('Wallets/Hardware Wallets', module)
+storiesOf('Wallets|Hardware Wallets', module)
   .addDecorator(HardwareWalletsWrapper) // ====== Stories ======
   .add('Hardware wallet connect Ledger step 1', () => (
     <WalletConnectDialog
diff --git a/storybook/stories/wallets/import/WalletImportFile.stories.tsx b/storybook/stories/wallets/import/WalletImportFile.stories.tsx
index 37bff74542..38c04af3fe 100644
--- a/storybook/stories/wallets/import/WalletImportFile.stories.tsx
+++ b/storybook/stories/wallets/import/WalletImportFile.stories.tsx
@@ -27,7 +27,7 @@ const getWallet = (
   },
 });
 
-storiesOf('Wallets/Import File', module)
+storiesOf('Wallets|Import File', module)
   .addDecorator(WalletsWrapper)
   .add('Step 1 - Import File', () => (
     <VerticalFlexContainer>
@@ -53,10 +53,10 @@ storiesOf('Wallets/Import File', module)
       WalletImportStatuses,
       WalletImportStatuses.PENDING
     );
-    const namedWallets = [...Array(number('Wallets with name', 5))].map(
+    const namedWallets = [
+      ...Array(number('Wallets with name', 5)),
       // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string' is not assignable to par... Remove this comment to see the full error message
-      (x, index: number) => getWallet(index, true, statusSelect)
-    );
+    ].map((x, index: number) => getWallet(index, true, statusSelect));
     const unnamedWallets = [...Array(number('Wallets with no name', 5))].map(
       (x, index: number) => getWallet(index, false)
     );
diff --git a/storybook/stories/wallets/index.ts b/storybook/stories/wallets/index.ts
index bb10062bfa..c8fc16ee9d 100644
--- a/storybook/stories/wallets/index.ts
+++ b/storybook/stories/wallets/index.ts
@@ -1,5 +1,6 @@
 // Screens sets
 import './summary/WalletSummary.stories';
+import './summary/WalletSummaryHeader.stories';
 import './send/WalletSend.stories';
 import './receive/WalletReceive.stories';
 import './transactions/TransactionsList.stories';
@@ -8,6 +9,7 @@ import './transactions/TransactionMetadata.stories';
 import './transactions/Utxo.stories';
 import './tokens/WalletTokens.stories';
 import './tokens/WalletTokensList.stories';
+import '../../../source/renderer/app/components/wallet/tokens/wallet-token-picker/WalletTokenPicker.stories';
 import './settings/WalletSettings.stories';
 import './addWallet/AddWallet.stories';
 import './import/WalletImportFile.stories';
diff --git a/storybook/stories/wallets/legacyWallets/LegacyNotification.stories.tsx b/storybook/stories/wallets/legacyWallets/LegacyNotification.stories.tsx
index a41a579cab..1be1528ab1 100644
--- a/storybook/stories/wallets/legacyWallets/LegacyNotification.stories.tsx
+++ b/storybook/stories/wallets/legacyWallets/LegacyNotification.stories.tsx
@@ -5,13 +5,10 @@ import { withKnobs, boolean, text } from '@storybook/addon-knobs';
 import StoryDecorator from '../../_support/StoryDecorator';
 import LegacyNotification from '../../../../source/renderer/app/components/notifications/LegacyNotification';
 
-const decorators = [
-  withKnobs,
-  (story) => <StoryDecorator>{story()}</StoryDecorator>,
-];
-storiesOf('Wallets/Legacy Wallets', module).add(
-  'Legacy Notification',
-  () => (
+storiesOf('Wallets|Legacy Wallets', module)
+  .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>)
+  .addDecorator(withKnobs) // ====== Stories ======
+  .add('Legacy Notification', () => (
     <div>
       <LegacyNotification
         activeWalletName={text('activeWalletName', 'Josephine')}
@@ -22,8 +19,4 @@ storiesOf('Wallets/Legacy Wallets', module).add(
         onWalletAdd={action('onWalletAdd')}
       />
     </div>
-  ),
-  {
-    decorators,
-  }
-);
+  ));
diff --git a/storybook/stories/wallets/legacyWallets/TransferFunds.stories.tsx b/storybook/stories/wallets/legacyWallets/TransferFunds.stories.tsx
index 248e180455..5e4ecf51b8 100644
--- a/storybook/stories/wallets/legacyWallets/TransferFunds.stories.tsx
+++ b/storybook/stories/wallets/legacyWallets/TransferFunds.stories.tsx
@@ -12,103 +12,91 @@ import { LOVELACES_PER_ADA } from '../../../../source/renderer/app/config/number
 // Helpers
 import WalletsWrapper from '../_utils/WalletsWrapper';
 
-const decorators = [withKnobs, WalletsWrapper];
-storiesOf('Wallets/Legacy Wallets', module)
-  .add(
-    'Transfer Funds - Step1',
-    () => {
-      const walletOptions = WALLETS_V2.reduce(
-        (options, wallet) => ({ ...options, ...set({}, wallet.name, wallet) }),
-        {}
-      );
-      const walletIdOptions = WALLETS_V2.reduce(
-        (options, wallet) => ({
-          ...options,
-          ...set({}, wallet.name, wallet.id),
-        }),
-        {}
-      );
-      const sourceWalletSelect = select(
-        'sourceWallet',
-        walletOptions,
-        WALLETS_V2[1]
-      );
+storiesOf('Wallets|Legacy Wallets', module)
+  .addDecorator(WalletsWrapper)
+  .addDecorator(withKnobs) // ====== Stories ======
+  .add('Transfer Funds - Step1', () => {
+    const walletOptions = WALLETS_V2.reduce(
+      (options, wallet) => ({ ...options, ...set({}, wallet.name, wallet) }),
+      {}
+    );
+    const walletIdOptions = WALLETS_V2.reduce(
+      (options, wallet) => ({ ...options, ...set({}, wallet.name, wallet.id) }),
+      {}
+    );
+    const sourceWalletSelect = select(
+      'sourceWallet',
+      walletOptions,
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ id: string; name: string; amou... Remove this comment to see the full error message
+      WALLETS_V2[1]
+    );
+    const sourceWallet = {
+      // @ts-ignore ts-migrate(2698) FIXME: Spread types may only be created from object types... Remove this comment to see the full error message
+      ...sourceWalletSelect,
       // @ts-ignore
-      const sourceWallet = {
-        ...sourceWalletSelect,
-        amount: new BigNumber(sourceWalletSelect.amount),
-      };
-      return (
-        <TransferFundsStep1Dialog
-          onClose={action('onClose')}
-          onContinue={action('onContinue')}
-          onSetSourceWallet={action('onSetSourceWallet')}
-          sourceWallet={sourceWallet}
-          targetWalletId={select(
-            'targetWalletId',
-            walletIdOptions,
-            WALLETS_V2[0].id
-          )}
-          wallets={WALLETS_V2}
-          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-          numberOfStakePools={STAKE_POOLS}
-          getStakePoolById={action('getStakePoolById')}
-          isSubmitting={false}
-          error={null}
-        />
-      );
-    },
-    {
-      decorators,
-    }
-  )
-  .add(
-    'Transfer Funds - Step2',
-    () => {
-      const feesNumber = number('fees', 1, {
-        range: true,
-        min: 1,
-        max: 5,
-        step: 1,
-      });
-      // @ts-ignore ts-migrate(2348) FIXME: Value of type 'typeof BigNumber' is not callable. ... Remove this comment to see the full error message
-      const feesAmount = BigNumber(feesNumber);
-      const leftoversNumber = number('leftovers (Lovelaces)', 0, {
-        range: true,
-        min: 0,
-        max: 10,
-        step: 1,
-      });
-      const leftoversAmount = new BigNumber(leftoversNumber).dividedBy(
-        LOVELACES_PER_ADA
-      );
-      const sourceWalletNumber = number('sourceWalletBalance', 50, {
-        range: true,
-        min: 10,
-        max: 3000,
-        step: 1,
-      });
-      // @ts-ignore ts-migrate(2348) FIXME: Value of type 'typeof BigNumber' is not callable. ... Remove this comment to see the full error message
-      const sourceWalletAmount = BigNumber(sourceWalletNumber);
-      return (
-        <TransferFundsStep2Dialog
-          feesAmount={feesAmount}
-          leftoversAmount={leftoversAmount}
-          sourceWalletAmount={sourceWalletAmount}
-          sourceWalletName="Source Wallet"
-          targetWalletName="Target Wallet"
-          onBack={action('onBack')}
-          onClose={action('onClose')}
-          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-          onContinue={action('onContinue')}
-          onDataChange={action('onDataChange')}
-          isSubmitting={boolean('isSubmitting', false)}
-          onFinish={action('onFinish')}
-          onOpenExternalLink={action('onOpenExternalLink')}
-        />
-      );
-    },
-    {
-      decorators,
-    }
-  );
+      amount: new BigNumber(sourceWalletSelect.amount),
+    };
+    return (
+      <TransferFundsStep1Dialog
+        onClose={action('onClose')}
+        onContinue={action('onContinue')}
+        onSetSourceWallet={action('onSetSourceWallet')}
+        sourceWallet={sourceWallet}
+        targetWalletId={select(
+          'targetWalletId',
+          walletIdOptions,
+          WALLETS_V2[0].id
+        )}
+        wallets={WALLETS_V2}
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+        numberOfStakePools={STAKE_POOLS}
+        getStakePoolById={action('getStakePoolById')}
+        isSubmitting={false}
+        error={null}
+      />
+    );
+  })
+  .add('Transfer Funds - Step2', () => {
+    const feesNumber = number('fees', 1, {
+      range: true,
+      min: 1,
+      max: 5,
+      step: 1,
+    });
+    // @ts-ignore ts-migrate(2348) FIXME: Value of type 'typeof BigNumber' is not callable. ... Remove this comment to see the full error message
+    const feesAmount = BigNumber(feesNumber);
+    const leftoversNumber = number('leftovers (Lovelaces)', 0, {
+      range: true,
+      min: 0,
+      max: 10,
+      step: 1,
+    });
+    const leftoversAmount = new BigNumber(leftoversNumber).dividedBy(
+      LOVELACES_PER_ADA
+    );
+    const sourceWalletNumber = number('sourceWalletBalance', 50, {
+      range: true,
+      min: 10,
+      max: 3000,
+      step: 1,
+    });
+    // @ts-ignore ts-migrate(2348) FIXME: Value of type 'typeof BigNumber' is not callable. ... Remove this comment to see the full error message
+    const sourceWalletAmount = BigNumber(sourceWalletNumber);
+    return (
+      <TransferFundsStep2Dialog
+        feesAmount={feesAmount}
+        leftoversAmount={leftoversAmount}
+        sourceWalletAmount={sourceWalletAmount}
+        sourceWalletName="Source Wallet"
+        targetWalletName="Target Wallet"
+        onBack={action('onBack')}
+        onClose={action('onClose')}
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+        onContinue={action('onContinue')}
+        onDataChange={action('onDataChange')}
+        isSubmitting={boolean('isSubmitting', false)}
+        onFinish={action('onFinish')}
+        onOpenExternalLink={action('onOpenExternalLink')}
+      />
+    );
+  });
diff --git a/storybook/stories/wallets/paperWallets/PaperWallets.stories.tsx b/storybook/stories/wallets/paperWallets/PaperWallets.stories.tsx
index 4b66222589..f39fca035e 100644
--- a/storybook/stories/wallets/paperWallets/PaperWallets.stories.tsx
+++ b/storybook/stories/wallets/paperWallets/PaperWallets.stories.tsx
@@ -9,7 +9,7 @@ import SecuringPasswordDialog from '../../../../source/renderer/app/components/w
 import VerificationDialog from '../../../../source/renderer/app/components/wallet/paper-wallet-certificate/VerificationDialog';
 import CompletionDialog from '../../../../source/renderer/app/components/wallet/paper-wallet-certificate/CompletionDialog';
 
-storiesOf('Wallets/Paper Wallets', module)
+storiesOf('Wallets|Paper Wallets', module)
   .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>) // ====== Stories ======
   .add('Instructions', () => (
     <div>
diff --git a/storybook/stories/wallets/receive/WalletReceive.stories.tsx b/storybook/stories/wallets/receive/WalletReceive.stories.tsx
index 80e77875e6..fab67c6065 100644
--- a/storybook/stories/wallets/receive/WalletReceive.stories.tsx
+++ b/storybook/stories/wallets/receive/WalletReceive.stories.tsx
@@ -16,8 +16,9 @@ const onToggleSubMenus = {
   listen: action('onToggleSubMenus:listen'),
   remove: action('onToggleSubMenus:remove'),
 };
-storiesOf('Wallets/Receive', module)
+storiesOf('Wallets|Receive', module)
   .addDecorator(WalletsWrapper)
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
   .add('Receive - sequential', ({ locale }: { locale: string }) => {
     const showDialog = boolean('showDialog', false);
     return (
@@ -63,52 +64,55 @@ storiesOf('Wallets/Receive', module)
   })
   .add(
     'Receive - sequential with address verification',
-    ({ locale }: { locale: string }) => (
-      <VerticalFlexContainer>
-        <WalletReceiveSequential
-          walletAddresses={[
-            ...Array.from(Array(number('Addresses (used)', 2))).map(() =>
-              generateAddress(true)
-            ),
-            ...Array.from(Array(number('Addresses', 10))).map(() =>
-              generateAddress()
-            ),
-          ]}
-          onShareAddress={action('onShareAddress')}
-          onCopyAddress={action('onCopyAddress')}
-          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-          isAddressValid={() => parseInt(Math.random() * 10, 10) > 3}
-          currentLocale={locale}
-          onToggleSubMenus={onToggleSubMenus}
-          isShowingSubMenus
-          onToggleUsedAddresses={action('onToggleUsedAddresses')}
-          showUsed={boolean('showUsed', false)}
-        />
-        <WalletReceiveDialog
-          address={generateAddress()}
-          onCopyAddress={action('onCopyAddress')}
-          onDownloadPDF={action('onDownloadPDF')}
-          onSaveQRCodeImage={action('onSaveQRCodeImage')}
-          onClose={action('onClose')}
-          hwDeviceStatus={select(
-            'Address verification state',
-            {
-              Verify: HwDeviceStatuses.VERIFYING_ADDRESS,
-              Verified: HwDeviceStatuses.VERIFYING_ADDRESS_SUCCEEDED,
-              Errored: HwDeviceStatuses.VERIFYING_ADDRESS_FAILED,
-            },
-            HwDeviceStatuses.VERIFYING_ADDRESS
-          )}
-          isHardwareWallet
-          walletName="Ledger Nano S"
-          isAddressDerived={false}
-          isAddressChecked={false}
-          onChangeVerificationStatus={action('onChangeVerificationStatus')}
-          onSupportRequestClick={action('onSupportRequestClick')}
-          isTrezor={boolean('isTrezor', false)}
-        />
-      </VerticalFlexContainer>
-    )
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+    ({ locale }: { locale: string }) => {
+      return (
+        <VerticalFlexContainer>
+          <WalletReceiveSequential
+            walletAddresses={[
+              ...Array.from(Array(number('Addresses (used)', 2))).map(() =>
+                generateAddress(true)
+              ),
+              ...Array.from(Array(number('Addresses', 10))).map(() =>
+                generateAddress()
+              ),
+            ]}
+            onShareAddress={action('onShareAddress')}
+            onCopyAddress={action('onCopyAddress')}
+            // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+            isAddressValid={() => parseInt(Math.random() * 10, 10) > 3}
+            currentLocale={locale}
+            onToggleSubMenus={onToggleSubMenus}
+            isShowingSubMenus
+            onToggleUsedAddresses={action('onToggleUsedAddresses')}
+            showUsed={boolean('showUsed', false)}
+          />
+          <WalletReceiveDialog
+            address={generateAddress()}
+            onCopyAddress={action('onCopyAddress')}
+            onDownloadPDF={action('onDownloadPDF')}
+            onSaveQRCodeImage={action('onSaveQRCodeImage')}
+            onClose={action('onClose')}
+            hwDeviceStatus={select(
+              'Address verification state',
+              {
+                Verify: HwDeviceStatuses.VERIFYING_ADDRESS,
+                Verified: HwDeviceStatuses.VERIFYING_ADDRESS_SUCCEEDED,
+                Errored: HwDeviceStatuses.VERIFYING_ADDRESS_FAILED,
+              },
+              HwDeviceStatuses.VERIFYING_ADDRESS
+            )}
+            isHardwareWallet
+            walletName="Ledger Nano S"
+            isAddressDerived={false}
+            isAddressChecked={false}
+            onChangeVerificationStatus={action('onChangeVerificationStatus')}
+            onSupportRequestClick={action('onSupportRequestClick')}
+            isTrezor={boolean('isTrezor', false)}
+          />
+        </VerticalFlexContainer>
+      );
+    }
   )
   .add('Receive - random', () => {
     const isSidebarExpanded = boolean('isSidebarExpanded', false);
diff --git a/storybook/stories/wallets/send/WalletSend.stories.tsx b/storybook/stories/wallets/send/WalletSend.stories.tsx
index b577256c94..88d2f47fc5 100644
--- a/storybook/stories/wallets/send/WalletSend.stories.tsx
+++ b/storybook/stories/wallets/send/WalletSend.stories.tsx
@@ -222,7 +222,7 @@ const sendFormAssetData = walletTokens.total.map((assetTotal) => {
         },
   };
 });
-storiesOf('Wallets/Send', module)
+storiesOf('Wallets|Send', module)
   .addDecorator(WalletsWrapper)
   .add('Send - No Assets', () => (
     <WalletSendForm
@@ -235,7 +235,7 @@ storiesOf('Wallets/Send', module)
       walletAmount={new BigNumber(123)}
       assets={sendFormAssetData}
       addressValidator={() => true}
-      onOpenDialogAction={action('onOpenDialogAction')}
+      onSubmit={action('onSubmit')}
       isDialogOpen={() => boolean('isDialogOpen', false)}
       isRestoreActive={boolean('isRestoreActive', false)}
       hwDeviceStatus={HwDeviceStatuses.READY}
@@ -246,6 +246,10 @@ storiesOf('Wallets/Send', module)
       selectedAsset={null}
       onUnsetActiveAsset={() => {}}
       isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)}
+      tokenFavorites={{}}
+      walletName="My wallet"
+      onTokenPickerDialogClose={action('onTokenPickerDialogClose')}
+      onTokenPickerDialogOpen={action('onTokenPickerDialogOpen')}
     />
   ))
   .add('Send - Hardware wallet verifying transaction', () => (
@@ -258,7 +262,7 @@ storiesOf('Wallets/Send', module)
       calculateTransactionFee={promise(true)}
       assets={sendFormAssetData}
       addressValidator={() => true}
-      onOpenDialogAction={action('onOpenDialogAction')}
+      onSubmit={action('onSubmit')}
       isDialogOpen={() => boolean('isDialogOpen', false)}
       isRestoreActive={boolean('isRestoreActive', false)}
       walletAmount={new BigNumber(123)}
@@ -270,6 +274,10 @@ storiesOf('Wallets/Send', module)
       selectedAsset={null}
       onUnsetActiveAsset={() => {}}
       isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)}
+      tokenFavorites={{}}
+      walletName="My wallet"
+      onTokenPickerDialogClose={action('onTokenPickerDialogClose')}
+      onTokenPickerDialogOpen={action('onTokenPickerDialogOpen')}
     />
   ))
   .add('Send - Hardware wallet verifying transaction succeeded', () => (
@@ -282,7 +290,7 @@ storiesOf('Wallets/Send', module)
       calculateTransactionFee={promise(true)}
       assets={sendFormAssetData}
       addressValidator={() => true}
-      onOpenDialogAction={action('onOpenDialogAction')}
+      onSubmit={action('onSubmit')}
       isDialogOpen={() => boolean('isDialogOpen', false)}
       isRestoreActive={boolean('isRestoreActive', false)}
       walletAmount={new BigNumber(123)}
@@ -294,6 +302,10 @@ storiesOf('Wallets/Send', module)
       selectedAsset={null}
       onUnsetActiveAsset={() => {}}
       isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)}
+      tokenFavorites={{}}
+      walletName="My wallet"
+      onTokenPickerDialogClose={action('onTokenPickerDialogClose')}
+      onTokenPickerDialogOpen={action('onTokenPickerDialogOpen')}
     />
   ))
   .add('Send - Hardware wallet verifying transaction failed', () => (
@@ -306,7 +318,7 @@ storiesOf('Wallets/Send', module)
       calculateTransactionFee={promise(true)}
       assets={sendFormAssetData}
       addressValidator={() => true}
-      onOpenDialogAction={action('onOpenDialogAction')}
+      onSubmit={action('onSubmit')}
       isDialogOpen={() => boolean('isDialogOpen', false)}
       isRestoreActive={boolean('isRestoreActive', false)}
       walletAmount={new BigNumber(123)}
@@ -318,6 +330,10 @@ storiesOf('Wallets/Send', module)
       selectedAsset={null}
       onUnsetActiveAsset={() => {}}
       isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)}
+      tokenFavorites={{}}
+      walletName="My wallet"
+      onTokenPickerDialogClose={action('onTokenPickerDialogClose')}
+      onTokenPickerDialogOpen={action('onTokenPickerDialogOpen')}
     />
   ))
   .add('Send - With Assets', () => (
@@ -332,7 +348,7 @@ storiesOf('Wallets/Send', module)
         minimumAda: new BigNumber(number('minimumAda', 1)),
       })}
       addressValidator={() => true}
-      onOpenDialogAction={action('onOpenDialogAction')}
+      onSubmit={action('onSubmit')}
       isDialogOpen={() => boolean('isDialogOpen', false)}
       isRestoreActive={boolean('isRestoreActive', false)}
       hwDeviceStatus={HwDeviceStatuses.READY}
@@ -345,6 +361,10 @@ storiesOf('Wallets/Send', module)
       selectedAsset={null}
       onUnsetActiveAsset={() => {}}
       isAddressFromSameWallet={boolean('isAddressFromSameWallet', false)}
+      tokenFavorites={{}}
+      walletName="My wallet"
+      onTokenPickerDialogClose={action('onTokenPickerDialogClose')}
+      onTokenPickerDialogOpen={action('onTokenPickerDialogOpen')}
     />
   ))
   .add('Wallet Send Confirmation Dialog With Assets', () => {
diff --git a/storybook/stories/wallets/setPassword/SetWalletPassword.stories.tsx b/storybook/stories/wallets/setPassword/SetWalletPassword.stories.tsx
index 880fdeecd0..4b3ac7031f 100644
--- a/storybook/stories/wallets/setPassword/SetWalletPassword.stories.tsx
+++ b/storybook/stories/wallets/setPassword/SetWalletPassword.stories.tsx
@@ -60,7 +60,7 @@ const WALLETS = [
 ];
 const activeWallet: Wallet = WALLETS[0];
 let walletPasswordIsOpen = false;
-storiesOf('Wallets/Set Password', module)
+storiesOf('Wallets|Set Password', module)
   .addDecorator((story, context) => (
     <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
   ))
diff --git a/storybook/stories/wallets/settings/PublicKeyQRCode.stories.tsx b/storybook/stories/wallets/settings/PublicKeyQRCode.stories.tsx
index da71e97579..49cdfebe38 100644
--- a/storybook/stories/wallets/settings/PublicKeyQRCode.stories.tsx
+++ b/storybook/stories/wallets/settings/PublicKeyQRCode.stories.tsx
@@ -5,18 +5,13 @@ import WalletsWrapper from '../_utils/WalletsWrapper';
 // Components
 import PublicKeyQRCodeDialog from '../../../../source/renderer/app/components/wallet/settings/ICOPublicKeyQRCodeDialog';
 
-const decorators = [WalletsWrapper];
-storiesOf('Wallets/Settings', module).add(
-  'Public Key - QR Code',
-  (_, props) => (
+storiesOf('Wallets|Settings', module)
+  .addDecorator(WalletsWrapper)
+  .add('Public Key - QR Code', (props) => (
     <PublicKeyQRCodeDialog
       {...props}
       walletName="Wallet Public Key"
       walletPublicKey="Wallet Public Key"
       onClose={() => null}
     />
-  ),
-  {
-    decorators,
-  }
-);
+  ));
diff --git a/storybook/stories/wallets/settings/WalletDelete.stories.tsx b/storybook/stories/wallets/settings/WalletDelete.stories.tsx
index f3fd218842..a6244bc4b2 100644
--- a/storybook/stories/wallets/settings/WalletDelete.stories.tsx
+++ b/storybook/stories/wallets/settings/WalletDelete.stories.tsx
@@ -39,97 +39,73 @@ const messages: WalletSettingRemoveMessages = defineMessages({
     description: 'Instruction for recovery word on delete wallet dialog',
   },
 });
-const decorators = [(story) => <StoryDecorator>{story()}</StoryDecorator>];
-storiesOf('Wallets/Settings', module)
-  .add(
-    'Delete - Countdown',
-    () => (
-      <div>
-        <WalletSettingsActionConfirmationDialog
-          walletName="My Wallet"
-          hasWalletFunds
-          countdownFn={() => 10}
-          isBackupNoticeAccepted={false}
-          messages={messages}
-          confirmationValue="babushka"
-          onAcceptBackupNotice={() => {}}
-          onContinue={() => {}}
-          onCancel={() => {}}
-          onConfirmationValueChange={() => {}}
-          isSubmitting={false}
-        />
-      </div>
-    ),
-    {
-      decorators,
-    }
-  )
-  .add(
-    'Delete - Accepted & filled incorrectly',
-    () => (
-      <div>
-        <WalletSettingsActionConfirmationDialog
-          walletName="My Wallet"
-          hasWalletFunds
-          countdownFn={() => 0}
-          isBackupNoticeAccepted
-          messages={messages}
-          confirmationValue="babushka"
-          onAcceptBackupNotice={() => {}}
-          onContinue={() => {}}
-          onCancel={() => {}}
-          onConfirmationValueChange={action('onRecoveryWordChange')}
-          isSubmitting={false}
-        />
-      </div>
-    ),
-    {
-      decorators,
-    }
-  )
-  .add(
-    'Delete - Accepted & filled correctly',
-    () => (
-      <div>
-        <WalletSettingsActionConfirmationDialog
-          walletName="My Wallet"
-          hasWalletFunds
-          countdownFn={() => 0}
-          isBackupNoticeAccepted
-          messages={messages}
-          confirmationValue="My Wallet"
-          onAcceptBackupNotice={() => {}}
-          onContinue={() => {}}
-          onCancel={() => {}}
-          onConfirmationValueChange={action('onRecoveryWordChange')}
-          isSubmitting={false}
-        />
-      </div>
-    ),
-    {
-      decorators,
-    }
-  )
-  .add(
-    'Delete - Accepted, filled correctly & submitting',
-    () => (
-      <div>
-        <WalletSettingsActionConfirmationDialog
-          walletName="My Wallet"
-          hasWalletFunds
-          countdownFn={() => 0}
-          isBackupNoticeAccepted
-          messages={messages}
-          confirmationValue="My Wallet"
-          onAcceptBackupNotice={() => {}}
-          onContinue={() => {}}
-          onCancel={() => {}}
-          onConfirmationValueChange={action('onRecoveryWordChange')}
-          isSubmitting
-        />
-      </div>
-    ),
-    {
-      decorators,
-    }
-  );
+storiesOf('Wallets|Settings', module)
+  .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>) // ====== Stories ======
+  .add('Delete - Countdown', () => (
+    <div>
+      <WalletSettingsActionConfirmationDialog
+        walletName="My Wallet"
+        hasWalletFunds
+        countdownFn={() => 10}
+        isBackupNoticeAccepted={false}
+        messages={messages}
+        confirmationValue="babushka"
+        onAcceptBackupNotice={() => {}}
+        onContinue={() => {}}
+        onCancel={() => {}}
+        onConfirmationValueChange={() => {}}
+        isSubmitting={false}
+      />
+    </div>
+  ))
+  .add('Delete - Accepted & filled incorrectly', () => (
+    <div>
+      <WalletSettingsActionConfirmationDialog
+        walletName="My Wallet"
+        hasWalletFunds
+        countdownFn={() => 0}
+        isBackupNoticeAccepted
+        messages={messages}
+        confirmationValue="babushka"
+        onAcceptBackupNotice={() => {}}
+        onContinue={() => {}}
+        onCancel={() => {}}
+        onConfirmationValueChange={action('onRecoveryWordChange')}
+        isSubmitting={false}
+      />
+    </div>
+  ))
+  .add('Delete - Accepted & filled correctly', () => (
+    <div>
+      <WalletSettingsActionConfirmationDialog
+        walletName="My Wallet"
+        hasWalletFunds
+        countdownFn={() => 0}
+        isBackupNoticeAccepted
+        messages={messages}
+        confirmationValue="My Wallet"
+        onAcceptBackupNotice={() => {}}
+        onContinue={() => {}}
+        onCancel={() => {}}
+        onConfirmationValueChange={action('onRecoveryWordChange')}
+        isSubmitting={false}
+      />
+    </div>
+  ))
+  .add('Delete - Accepted, filled correctly & submitting', () => (
+    <div>
+      <WalletSettingsActionConfirmationDialog
+        walletName="My Wallet"
+        hasWalletFunds
+        countdownFn={() => 0}
+        isBackupNoticeAccepted
+        messages={messages}
+        confirmationValue="My Wallet"
+        onAcceptBackupNotice={() => {}}
+        onContinue={() => {}}
+        onCancel={() => {}}
+        onConfirmationValueChange={action('onRecoveryWordChange')}
+        isSubmitting
+      />
+    </div>
+  ));
diff --git a/storybook/stories/wallets/settings/WalletPublicKey.stories.tsx b/storybook/stories/wallets/settings/WalletPublicKey.stories.tsx
index 005b4a7aaa..e9f4ecaedc 100644
--- a/storybook/stories/wallets/settings/WalletPublicKey.stories.tsx
+++ b/storybook/stories/wallets/settings/WalletPublicKey.stories.tsx
@@ -7,10 +7,10 @@ import WalletsWrapper from '../_utils/WalletsWrapper';
 // Components
 import WalletPublicKeyDialog from '../../../../source/renderer/app/components/wallet/settings/WalletPublicKeyDialog';
 
-const decorators = [withKnobs, WalletsWrapper];
-storiesOf('Wallets/Settings', module).add(
-  'Public Key - Spending Password',
-  () => (
+storiesOf('Wallets|Settings', module)
+  .addDecorator(WalletsWrapper)
+  .addDecorator(withKnobs)
+  .add('Public Key - Spending Password', () => (
     <WalletPublicKeyDialog
       onRevealPublicKey={action('onRevealPublicKey')}
       onClose={action('onCancel')}
@@ -19,8 +19,4 @@ storiesOf('Wallets/Settings', module).add(
       error={null}
       walletName={'Test Wallet'}
     />
-  ),
-  {
-    decorators,
-  }
-);
+  ));
diff --git a/storybook/stories/wallets/settings/WalletRecoveryPhraseVerification.stories.tsx b/storybook/stories/wallets/settings/WalletRecoveryPhraseVerification.stories.tsx
index d02ca99eac..0da81f58e9 100644
--- a/storybook/stories/wallets/settings/WalletRecoveryPhraseVerification.stories.tsx
+++ b/storybook/stories/wallets/settings/WalletRecoveryPhraseVerification.stories.tsx
@@ -19,91 +19,81 @@ import StoryDecorator from '../../_support/StoryDecorator';
 // Screens
 import WalletRecoveryPhraseVerificationWidget from '../../../../source/renderer/app/components/wallet/settings/WalletRecoveryPhraseVerificationWidget';
 
-const decorators = [
-  withKnobs,
-  (story) => <StoryDecorator>{story()}</StoryDecorator>,
-];
-storiesOf('Wallets/Settings', module).add(
-  'Recovery Prase Verification - Widget',
-  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, { locale, }: { locale:... Remove this comment to see the full error message
-  (
-    _,
-    {
-      locale,
-    }: {
-      locale: string;
+storiesOf('Wallets|Settings', module)
+  .addDecorator((story, context) => (
+    <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
+  )) // ====== Stories ======
+  .add(
+    'Recovery Prase Verification - Widget',
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
+    ({ locale }: { locale: string }) => {
+      const groupId = 'Recovery Phrase Verification';
+      const wordCount = options(
+        'Word count',
+        {
+          [WALLET_RECOVERY_PHRASE_WORD_COUNT]: `${WALLET_RECOVERY_PHRASE_WORD_COUNT}`,
+          [LEGACY_WALLET_RECOVERY_PHRASE_WORD_COUNT]: `${LEGACY_WALLET_RECOVERY_PHRASE_WORD_COUNT}`,
+        },
+        `${WALLET_RECOVERY_PHRASE_WORD_COUNT}`,
+        {
+          display: 'inline-radio',
+        },
+        groupId
+      );
+      const veriticationTimeOptions = {
+        '1 month ago': moment().subtract(30, 'days'),
+        '2 months': moment().subtract(30 * 2, 'days'),
+        '5 months ago': moment().subtract(30 * 5, 'days'),
+        '6+ months ago': moment().subtract(times.warning + 1, 'days'),
+        '1 year ago': moment().subtract(times.notification + 1, 'days'),
+      };
+      const creationTimeOptions = {
+        '1 month ago': moment().subtract(30, 'days'),
+        '2 months': moment().subtract(60, 'days'),
+        '3-5 months': moment().subtract(times.okFewMonths + 1, 'days'),
+        '5 months ago': moment().subtract(times.okFewWeeks + 1, 'days'),
+        '1 week left for 6 months': moment().subtract(
+          times.okFewDays + 1,
+          'days'
+        ),
+        '6+ months ago': moment().subtract(times.warning + 1, 'days'),
+        '1 year ago': moment().subtract(times.notification + 1, 'days'),
+      };
+      const wasAlreadyVerified = boolean('Already verified?', false, groupId);
+      const creationDate = !wasAlreadyVerified
+        ? select(
+            'Wallet creation date',
+            // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ '1 month ago': moment.Moment; ... Remove this comment to see the full error message
+            creationTimeOptions,
+            creationTimeOptions['1 month ago'],
+            groupId
+          )
+        : creationTimeOptions['1 month ago'];
+      const recoveryPhraseVerificationDate = wasAlreadyVerified
+        ? select(
+            'Last verification date',
+            // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ '1 month ago': moment.Moment; ... Remove this comment to see the full error message
+            veriticationTimeOptions,
+            veriticationTimeOptions['1 month ago'],
+            groupId
+          )
+        : null;
+      const containerStyle = object('Container Style', {
+        padding: 20,
+      });
+      return (
+        <div style={containerStyle} className="WalletSettings_component">
+          <WalletRecoveryPhraseVerificationWidget
+            // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+            creationDate={new Date(creationDate)}
+            locale={locale}
+            onVerify={action('onVerify')}
+            // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+            recoveryPhraseVerificationDate={recoveryPhraseVerificationDate}
+            wordCount={parseInt(wordCount, 10)}
+            isLegacy={boolean('isLegacy', true)}
+          />
+        </div>
+      );
     }
-  ) => {
-    const groupId = 'Recovery Phrase Verification';
-    const wordCount = options(
-      'Word count',
-      {
-        [WALLET_RECOVERY_PHRASE_WORD_COUNT]: `${WALLET_RECOVERY_PHRASE_WORD_COUNT}`,
-        [LEGACY_WALLET_RECOVERY_PHRASE_WORD_COUNT]: `${LEGACY_WALLET_RECOVERY_PHRASE_WORD_COUNT}`,
-      },
-      `${WALLET_RECOVERY_PHRASE_WORD_COUNT}`,
-      {
-        display: 'inline-radio',
-      },
-      groupId
-    );
-    const veriticationTimeOptions = {
-      '1 month ago': moment().subtract(30, 'days'),
-      '2 months': moment().subtract(30 * 2, 'days'),
-      '5 months ago': moment().subtract(30 * 5, 'days'),
-      '6+ months ago': moment().subtract(times.warning + 1, 'days'),
-      '1 year ago': moment().subtract(times.notification + 1, 'days'),
-    };
-    const creationTimeOptions = {
-      '1 month ago': moment().subtract(30, 'days'),
-      '2 months': moment().subtract(60, 'days'),
-      '3-5 months': moment().subtract(times.okFewMonths + 1, 'days'),
-      '5 months ago': moment().subtract(times.okFewWeeks + 1, 'days'),
-      '1 week left for 6 months': moment().subtract(
-        times.okFewDays + 1,
-        'days'
-      ),
-      '6+ months ago': moment().subtract(times.warning + 1, 'days'),
-      '1 year ago': moment().subtract(times.notification + 1, 'days'),
-    };
-    const wasAlreadyVerified = boolean('Already verified?', false, groupId);
-    const creationDate = !wasAlreadyVerified
-      ? select(
-          'Wallet creation date',
-          // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ '1 month ago': moment.Moment; ... Remove this comment to see the full error message
-          creationTimeOptions,
-          creationTimeOptions['1 month ago'],
-          groupId
-        )
-      : creationTimeOptions['1 month ago'];
-    const recoveryPhraseVerificationDate = wasAlreadyVerified
-      ? select(
-          'Last verification date',
-          // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ '1 month ago': moment.Moment; ... Remove this comment to see the full error message
-          veriticationTimeOptions,
-          veriticationTimeOptions['1 month ago'],
-          groupId
-        )
-      : null;
-    const containerStyle = object('Container Style', {
-      padding: 20,
-    });
-    return (
-      <div style={containerStyle} className="WalletSettings_component">
-        <WalletRecoveryPhraseVerificationWidget
-          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-          creationDate={new Date(creationDate)}
-          locale={locale}
-          onVerify={action('onVerify')}
-          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-          recoveryPhraseVerificationDate={recoveryPhraseVerificationDate}
-          wordCount={parseInt(wordCount, 10)}
-          isLegacy={boolean('isLegacy', true)}
-        />
-      </div>
-    );
-  },
-  {
-    decorators,
-  }
-);
+  );
diff --git a/storybook/stories/wallets/settings/WalletSettings.stories.tsx b/storybook/stories/wallets/settings/WalletSettings.stories.tsx
index 808cace4c3..b008bffa59 100644
--- a/storybook/stories/wallets/settings/WalletSettings.stories.tsx
+++ b/storybook/stories/wallets/settings/WalletSettings.stories.tsx
@@ -3,21 +3,15 @@ import { storiesOf } from '@storybook/react';
 // Helpers
 import WalletsWrapper from '../_utils/WalletsWrapper';
 // Screens
-import { WalletSettingsScreen } from './WalletSettingsScreen.stories';
+import WalletSettingsScreen from './WalletSettingsScreen.stories';
 import './WalletDelete.stories';
 import './WalletUnpair.stories';
 import './WalletRecoveryPhraseVerification.stories';
 import './WalletPublicKey.stories';
 import './PublicKeyQRCode.stories';
 
-const decorators = [WalletsWrapper];
-
 /* eslint-disable consistent-return */
-storiesOf('Wallets/Settings', module).add(
-  'Wallet Settings',
-  // @ts-ignore ts-migrate(2741) FIXME: Property 'locale' is missing in type '{ componentI... Remove this comment to see the full error message
-  (_, props) => <WalletSettingsScreen {...props} />,
-  {
-    decorators,
-  }
-);
+storiesOf('Wallets|Settings', module)
+  .addDecorator(WalletsWrapper)
+  // @ts-ignore ts-migrate(2741) FIXME: Property 'locale' is missing in type '{ id: string... Remove this comment to see the full error message
+  .add('Wallet Settings', (props) => <WalletSettingsScreen {...props} />);
diff --git a/storybook/stories/wallets/settings/WalletSettingsScreen.stories.tsx b/storybook/stories/wallets/settings/WalletSettingsScreen.stories.tsx
index d2a428de36..3900c9bc3e 100644
--- a/storybook/stories/wallets/settings/WalletSettingsScreen.stories.tsx
+++ b/storybook/stories/wallets/settings/WalletSettingsScreen.stories.tsx
@@ -136,12 +136,13 @@ const getWalletDates = (type: string, status: string) => {
   };
 };
 
-export const WalletSettingsScreen = (props: { locale: Locale }) => {
+export default (props: { locale: Locale }) => {
   const { locale } = props;
+  // @ts-ignore ts-migrate(2339) FIXME: Property 'type' does not exist on type 'SelectType... Remove this comment to see the full error message
   const { type, status } = select(
     'Wallet Recovery Phrase Verification',
+    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ 'Never Checked - Ok': { type: ... Remove this comment to see the full error message
     recoveryPhraseVerificationDateOptions,
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type 'string' is not assignable to par... Remove this comment to see the full error message
     'Already Checked - Ok',
     recoveryPhraseId
   );
@@ -234,7 +235,7 @@ export const WalletSettingsScreen = (props: { locale: Locale }) => {
       onStartEditing={() => {}}
       onStopEditing={() => {}}
       openDialogAction={() => {}}
-      walletId="walletid"
+      walletId="walletId"
       walletName={text('Wallet Name', 'Wallet Name', basicSettingsId)}
       delegationStakePoolStatus={delegationStakePoolStatus}
       lastDelegationStakePoolStatus={delegationStakePoolStatus}
diff --git a/storybook/stories/wallets/settings/WalletUnpair.stories.tsx b/storybook/stories/wallets/settings/WalletUnpair.stories.tsx
index c239549197..46f7f82bd3 100644
--- a/storybook/stories/wallets/settings/WalletUnpair.stories.tsx
+++ b/storybook/stories/wallets/settings/WalletUnpair.stories.tsx
@@ -27,53 +27,41 @@ const messages: WalletSettingRemoveMessages = defineMessages({
     description: 'Question if the user really wants to unpair the wallet.',
   },
 });
-const decorators = [(story) => <StoryDecorator>{story()}</StoryDecorator>];
-storiesOf('Wallets/Settings', module)
-  .add(
-    'Unpair - Accepted',
-    () => (
-      <div>
-        <WalletSettingsActionConfirmationDialog
-          walletName="My Wallet"
-          hasWalletFunds
-          countdownFn={() => 0}
-          isBackupNoticeAccepted
-          messages={messages}
-          confirmationValue="My Wallet"
-          onAcceptBackupNotice={() => {}}
-          onContinue={() => {}}
-          onCancel={() => {}}
-          isUnpair
-          onConfirmationValueChange={action('onRecoveryWordChange')}
-          isSubmitting={false}
-        />
-      </div>
-    ),
-    {
-      decorators,
-    }
-  )
-  .add(
-    'Unpair - Accepted & submitting',
-    () => (
-      <div>
-        <WalletSettingsActionConfirmationDialog
-          walletName="My Wallet"
-          hasWalletFunds
-          countdownFn={() => 0}
-          isBackupNoticeAccepted
-          messages={messages}
-          confirmationValue="My Wallet"
-          onAcceptBackupNotice={() => {}}
-          onContinue={() => {}}
-          onCancel={() => {}}
-          isUnpair
-          onConfirmationValueChange={action('onRecoveryWordChange')}
-          isSubmitting
-        />
-      </div>
-    ),
-    {
-      decorators,
-    }
-  );
+storiesOf('Wallets|Settings', module)
+  .addDecorator((story) => <StoryDecorator>{story()}</StoryDecorator>) // ====== Stories ======
+  .add('Unpair - Accepted', () => (
+    <div>
+      <WalletSettingsActionConfirmationDialog
+        walletName="My Wallet"
+        hasWalletFunds
+        countdownFn={() => 0}
+        isBackupNoticeAccepted
+        messages={messages}
+        confirmationValue="My Wallet"
+        onAcceptBackupNotice={() => {}}
+        onContinue={() => {}}
+        onCancel={() => {}}
+        isUnpair
+        onConfirmationValueChange={action('onRecoveryWordChange')}
+        isSubmitting={false}
+      />
+    </div>
+  ))
+  .add('Unpair - Accepted & submitting', () => (
+    <div>
+      <WalletSettingsActionConfirmationDialog
+        walletName="My Wallet"
+        hasWalletFunds
+        countdownFn={() => 0}
+        isBackupNoticeAccepted
+        messages={messages}
+        confirmationValue="My Wallet"
+        onAcceptBackupNotice={() => {}}
+        onContinue={() => {}}
+        onCancel={() => {}}
+        isUnpair
+        onConfirmationValueChange={action('onRecoveryWordChange')}
+        isSubmitting
+      />
+    </div>
+  ));
diff --git a/storybook/stories/wallets/summary/WalletSummary.stories.tsx b/storybook/stories/wallets/summary/WalletSummary.stories.tsx
index 8cce4f140d..81613091d6 100644
--- a/storybook/stories/wallets/summary/WalletSummary.stories.tsx
+++ b/storybook/stories/wallets/summary/WalletSummary.stories.tsx
@@ -7,6 +7,7 @@ import { action } from '@storybook/addon-actions';
 import {
   generateAssetToken,
   generateHash,
+  generateRewardForWallet,
   generateWallet,
 } from '../../_support/utils';
 import WalletsWrapper from '../_utils/WalletsWrapper';
@@ -162,8 +163,9 @@ const walletAssets = assets.total.map((assetTotal) => {
 });
 
 /* eslint-disable consistent-return */
-storiesOf('Wallets/Summary', module)
+storiesOf('Wallets|Summary', module)
   .addDecorator(WalletsWrapper)
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '({ locale }: { locale: string; }... Remove this comment to see the full error message
   .add('Wallet Summary', ({ locale }: { locale: string }) => {
     const currencyState = select(
       'Currency state',
@@ -188,19 +190,22 @@ storiesOf('Wallets/Summary', module)
 
     const currencySelected = select(
       'currencySelected',
+      // @ts-ignore ts-migrate(2345) FIXME: Argument of type '{ aed: { code: string; decimalDi... Remove this comment to see the full error message
       currenciesList,
       {
         id: 'uniswap-state-dollar',
         symbol: 'usd',
-        // @ts-ignore ts-migrate(2322) FIXME: Type 'string' is not assignable to type '{ "en-US"... Remove this comment to see the full error message
         name: 'unified Stable Dollar',
       },
       'Currency'
     );
+    const wallet = generateWallet('Wallet name', '45119903750165', assets);
+    const reward = generateRewardForWallet(wallet, '0');
     const [firstAsset] = walletAssets;
     return (
       <WalletSummary
-        wallet={generateWallet('Wallet name', '45119903750165', assets)}
+        wallet={wallet}
+        reward={reward}
         numberOfTransactions={number(
           'Number of transactions',
           100,
@@ -227,6 +232,7 @@ storiesOf('Wallets/Summary', module)
         currentLocale={locale}
         currencyIsFetchingRate={currencyIsFetchingRate}
         currencyIsActive={currencyIsActive}
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
         currencySelected={currencySelected}
         currencyRate={0.321}
         onToggleFavorite={action('onToggleFavorite')}
diff --git a/storybook/stories/wallets/summary/WalletSummaryHeader.stories.tsx b/storybook/stories/wallets/summary/WalletSummaryHeader.stories.tsx
new file mode 100644
index 0000000000..460c341d1f
--- /dev/null
+++ b/storybook/stories/wallets/summary/WalletSummaryHeader.stories.tsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { withKnobs, text, number, boolean } from '@storybook/addon-knobs';
+import { storiesOf } from '@storybook/react';
+import WalletSummaryHeader from '../../../../source/renderer/app/components/wallet/summary/WalletSummaryHeader';
+import StoryDecorator from '../../_support/StoryDecorator';
+import StoryProvider from '../../_support/StoryProvider';
+import { generateRewardForWallet, generateWallet } from '../../_support/utils';
+
+function WalletSummaryHeaderDecorator(story: any, context: any) {
+  const storyWithKnobs = withKnobs(story, context);
+  return (
+    <StoryDecorator>
+      <StoryProvider>{storyWithKnobs}</StoryProvider>
+    </StoryDecorator>
+  );
+}
+
+storiesOf('Wallets|Summary', module)
+  .addDecorator(WalletSummaryHeaderDecorator)
+  .add('Wallet Summary Header', () => {
+    const rewardsGroup = 'Rewards';
+    const wallet = generateWallet(
+      'Wallet name',
+      text('wallet total', '4564321263', rewardsGroup),
+      undefined,
+      text('rewards total', '4141123', rewardsGroup)
+    );
+    const reward = generateRewardForWallet(
+      wallet,
+      text('unspent rewards', '0', rewardsGroup)
+    );
+    return (
+      <WalletSummaryHeader
+        wallet={wallet}
+        reward={reward}
+        numberOfRecentTransactions={number(
+          'numberOfRecentTransactions',
+          0,
+          {},
+          rewardsGroup
+        )}
+        numberOfPendingTransactions={number(
+          'numberOfPendingTransactions',
+          0,
+          {},
+          rewardsGroup
+        )}
+        isLoadingTransactions={boolean(
+          'isLoadingTransactions',
+          false,
+          rewardsGroup
+        )}
+      />
+    );
+  });
diff --git a/storybook/stories/wallets/tokens/WalletTokens.stories.tsx b/storybook/stories/wallets/tokens/WalletTokens.stories.tsx
index 98a2368208..315e78062f 100644
--- a/storybook/stories/wallets/tokens/WalletTokens.stories.tsx
+++ b/storybook/stories/wallets/tokens/WalletTokens.stories.tsx
@@ -12,7 +12,7 @@ import {
 } from '../../_support/utils';
 import WalletsWrapper from '../_utils/WalletsWrapper';
 // Screens
-import WalletTokens from '../../../../source/renderer/app/components/wallet/tokens/WalletTokens';
+import WalletTokens from '../../../../source/renderer/app/components/wallet/tokens/wallet-tokens/WalletTokens';
 
 const assets = [
   // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
@@ -36,7 +36,7 @@ const assets = [
   // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 4.
   generateAssetToken(
     '65bc72542b0ca20391caaf66a4d4d7897d281f9c136cd3513136945b',
-    '',
+    '546f6b656e2077697468206c61726765206e616d65',
     'tokenb0ca20391caaf66a4d4d7897d281f9c136cd3513136945b2342',
     400
   ),
@@ -157,36 +157,35 @@ const walletTokens = {
     },
   ],
 };
-const decorators = [withKnobs, WalletsWrapper];
-storiesOf('Wallets/Tokens', module).add(
-  'WalletTokens',
-  withState(
-    {
-      favorites: {},
-    },
-    (store) => (
-      <WalletTokens
-        assets={boolean('Has Tokens', true) ? assets : []}
-        assetSettingsDialogWasOpened
-        currentLocale="en-US"
-        isLoadingAssets={boolean('isLoadingAssets', false)}
-        onAssetSettings={action('onAssetSettings')}
-        onCopyAssetParam={action('onCopyAssetParam')}
-        onOpenAssetSend={action('onOpenAssetSend')}
-        searchValue={text('searchValue', '')}
-        wallet={generateWallet('Wallet name', '45119903750165', walletTokens)}
-        onToggleFavorite={({ uniqueId }: { uniqueId: string }) => {
-          const { favorites } = store.state;
-          const newState = { ...favorites, [uniqueId]: !favorites[uniqueId] };
-          store.set({
-            favorites: newState,
-          });
-        }}
-        tokenFavorites={store.state.favorites}
-      />
+storiesOf('Wallets|Tokens', module)
+  .addDecorator(WalletsWrapper)
+  .addDecorator(withKnobs) // ====== Stories ======
+  .add(
+    'WalletTokens',
+    withState(
+      {
+        favorites: {},
+      },
+      (store) => (
+        <WalletTokens
+          assets={boolean('Has Tokens', true) ? assets : []}
+          assetSettingsDialogWasOpened
+          currentLocale="en-US"
+          isLoadingAssets={boolean('isLoadingAssets', false)}
+          onAssetSettings={action('onAssetSettings')}
+          onCopyAssetParam={action('onCopyAssetParam')}
+          onOpenAssetSend={action('onOpenAssetSend')}
+          searchValue={text('searchValue', '')}
+          wallet={generateWallet('Wallet name', '45119903750165', walletTokens)}
+          onToggleFavorite={({ uniqueId }: { uniqueId: string }) => {
+            const { favorites } = store.state;
+            const newState = { ...favorites, [uniqueId]: !favorites[uniqueId] };
+            store.set({
+              favorites: newState,
+            });
+          }}
+          tokenFavorites={store.state.favorites}
+        />
+      )
     )
-  ),
-  {
-    decorators,
-  }
-);
+  );
diff --git a/storybook/stories/wallets/tokens/WalletTokensList.stories.tsx b/storybook/stories/wallets/tokens/WalletTokensList.stories.tsx
index bbeee025e1..605dde1257 100644
--- a/storybook/stories/wallets/tokens/WalletTokensList.stories.tsx
+++ b/storybook/stories/wallets/tokens/WalletTokensList.stories.tsx
@@ -13,7 +13,7 @@ import {
 } from '../../_support/utils';
 import type { WalletTokens } from '../../../../source/renderer/app/api/assets/types';
 // Screens
-import WalletTokensList from '../../../../source/renderer/app/components/wallet/tokens/WalletTokensList';
+import WalletTokensList from '../../../../source/renderer/app/components/wallet/tokens/wallet-tokens-list/WalletTokensList';
 
 const assets = [
   // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
@@ -161,48 +161,44 @@ const walletTokens: WalletTokens = {
     },
   ],
 };
-const decorators = [
-  withKnobs,
-  (story) => (
+storiesOf('Wallets|Tokens', module)
+  .addDecorator((story) => (
     <StoryProvider>
       <StoryDecorator>{story()}</StoryDecorator>
     </StoryProvider>
-  ),
-];
-storiesOf('Wallets/Tokens', module).add(
-  'WalletTokensList',
-  withState(
-    {
-      favorites: {},
-    },
-    (store) => (
-      <WalletTokensList
-        assets={boolean('Has Tokens', true) ? assets : []}
-        assetSettingsDialogWasOpened
-        currentLocale="en-US"
-        isLoadingAssets={boolean('isLoadingAssets', false)}
-        onAssetSettings={action('onAssetSettings')}
-        onCopyAssetParam={action('onCopyAssetParam')}
-        onOpenAssetSend={action('onOpenAssetSend')}
-        onViewAllButtonClick={
-          boolean('Has View All button', false)
-            ? action('onViewAllButtonClick')
-            : null
-        }
-        title={text('Title', 'Tokens')}
-        wallet={generateWallet('Wallet name', '45119903750165', walletTokens)}
-        onToggleFavorite={({ uniqueId }: { uniqueId: string }) => {
-          const { favorites } = store.state;
-          const newState = { ...favorites, [uniqueId]: !favorites[uniqueId] };
-          store.set({
-            favorites: newState,
-          });
-        }}
-        tokenFavorites={store.state.favorites}
-      />
+  ))
+  .addDecorator(withKnobs) // ====== Stories ======
+  .add(
+    'WalletTokensList',
+    withState(
+      {
+        favorites: {},
+      },
+      (store) => (
+        <WalletTokensList
+          assets={boolean('Has Tokens', true) ? assets : []}
+          assetSettingsDialogWasOpened
+          currentLocale="en-US"
+          isLoadingAssets={boolean('isLoadingAssets', false)}
+          onAssetSettings={action('onAssetSettings')}
+          onCopyAssetParam={action('onCopyAssetParam')}
+          onOpenAssetSend={action('onOpenAssetSend')}
+          onViewAllButtonClick={
+            boolean('Has View All button', false)
+              ? action('onViewAllButtonClick')
+              : null
+          }
+          title={text('Title', 'Tokens')}
+          wallet={generateWallet('Wallet name', '45119903750165', walletTokens)}
+          onToggleFavorite={({ uniqueId }: { uniqueId: string }) => {
+            const { favorites } = store.state;
+            const newState = { ...favorites, [uniqueId]: !favorites[uniqueId] };
+            store.set({
+              favorites: newState,
+            });
+          }}
+          tokenFavorites={store.state.favorites}
+        />
+      )
     )
-  ),
-  {
-    decorators,
-  }
-);
+  );
diff --git a/storybook/stories/wallets/transactions/Transaction.stories.tsx b/storybook/stories/wallets/transactions/Transaction.stories.tsx
index 592c13b573..83462364e3 100644
--- a/storybook/stories/wallets/transactions/Transaction.stories.tsx
+++ b/storybook/stories/wallets/transactions/Transaction.stories.tsx
@@ -16,7 +16,7 @@ import StoryDecorator from '../../_support/StoryDecorator';
 import StoryProvider from '../../_support/StoryProvider';
 import {
   generateHash,
-  generatePolicyIdHash, // generat eAsset,
+  generatePolicyIdHash, // generate eAsset,
 } from '../../_support/utils';
 import {
   WalletTransaction,
@@ -106,19 +106,16 @@ const transactionTokens = [
     fingerprint: 'tokenb0ca10391caaf66a4d4d2897d281f3c136cd3513136945b2542',
   },
 ];
-const decorators = [
-  withKnobs,
-  (story) => (
-    <StoryProvider>
-      <StoryDecorator>{story()}</StoryDecorator>
-    </StoryProvider>
-  ),
-];
 
 /* eslint-disable consistent-return */
-storiesOf('Wallets/Transactions', module).add(
-  'Transaction',
-  () => {
+storiesOf('Wallets|Transactions', module)
+  .addDecorator(withKnobs)
+  .addDecorator((story, context) => (
+    <StoryProvider>
+      <StoryDecorator>{withKnobs(story, context)}</StoryDecorator>
+    </StoryProvider>
+  )) // ====== Stories ======
+  .add('Transaction', () => {
     const direction = select(
       'direction',
       {
@@ -213,8 +210,4 @@ storiesOf('Wallets/Transactions', module).add(
         onCopyAssetParam={action('onCopyAssetParam')}
       />
     );
-  },
-  {
-    decorators,
-  }
-);
+  });
diff --git a/storybook/stories/wallets/transactions/TransactionMetadata.stories.tsx b/storybook/stories/wallets/transactions/TransactionMetadata.stories.tsx
index 0a2c3fd9ad..2c497a98fc 100644
--- a/storybook/stories/wallets/transactions/TransactionMetadata.stories.tsx
+++ b/storybook/stories/wallets/transactions/TransactionMetadata.stories.tsx
@@ -3,5 +3,5 @@ import { storiesOf } from '@storybook/react';
 import { TransactionMetadataView } from '../../../../source/renderer/app/components/wallet/transactions/metadata/TransactionMetadataView';
 import { EXAMPLE_METADATA } from '../../_support/utils';
 
-storiesOf('Wallets/Transactions', module) // ====== Stories ======
+storiesOf('Wallets|Transactions', module) // ====== Stories ======
   .add('Metadata', () => <TransactionMetadataView data={EXAMPLE_METADATA} />);
diff --git a/storybook/stories/wallets/transactions/TransactionsList.stories.tsx b/storybook/stories/wallets/transactions/TransactionsList.stories.tsx
index f2bff45a05..cc9672b297 100644
--- a/storybook/stories/wallets/transactions/TransactionsList.stories.tsx
+++ b/storybook/stories/wallets/transactions/TransactionsList.stories.tsx
@@ -35,8 +35,8 @@ type Props = {
   totalAvailable: number;
 };
 const assetDetails = {
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
   '65bc72542b0ca20391caaf66a4d4e7897d282f9c136cd3513136945c':
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
     generateAssetToken(
       '65bc72542b0ca20391caaf66a4d4e7897d282f9c136cd3513136945c',
       '',
@@ -54,8 +54,8 @@ const assetDetails = {
         logo: '',
       }
     ),
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
   '65bc72542b0ca20391caaf66a4d4d7897d281f9c136cd3513136945b':
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
     generateAssetToken(
       '65bc72542b0ca20391caaf66a4d4d7897d281f9c136cd3513136945b',
       '',
@@ -73,8 +73,8 @@ const assetDetails = {
         logo: '',
       }
     ),
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
   '65ac82542b0ca20391caaf66a4d4d7897d281f9c136cd3513136945b':
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
     generateAssetToken(
       '65ac82542b0ca20391caaf66a4d4d7897d281f9c136cd3513136945b',
       '',
@@ -92,8 +92,8 @@ const assetDetails = {
         logo: '',
       }
     ),
+  // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
   '65cn72542b0ca10391caaf66a4d4d2897d281f3c136cd3513136945b':
-    // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 5.
     generateAssetToken(
       '65cn72542b0ca10391caaf66a4d4d2897d281f3c136cd3513136945b',
       '',
@@ -152,9 +152,10 @@ const getAsset = (
   assetName: string
 ): Asset | null | undefined => assetDetails[`${policyId}${assetName}`];
 
-const decorators = [
-  withKnobs,
-  (getStory, props) => {
+/* eslint-disable consistent-return */
+storiesOf('Wallets|Transactions', module)
+  .addDecorator(withKnobs)
+  .addDecorator((getStory, props) => {
     const transactionsOption = select(
       'Transactions',
       {
@@ -168,120 +169,99 @@ const decorators = [
       'groupedByDays'
     );
     return (
+      // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
       <WalletsTransactionsWrapper
         {...props}
         transactionsOption={transactionsOption}
         getStory={getStory}
       />
     );
-  },
-  WalletsWrapper,
-];
-
-/* eslint-disable consistent-return */
-storiesOf('Wallets/Transactions', module)
-  .add(
-    'Transactions List',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, context: Props) => Ele... Remove this comment to see the full error message
-    (_, context: Props) => {
-      const {
-        defaultFilterOptions,
-        filterOptions,
-        locale,
-        onFilter,
-        populatedFilterOptions,
-        transactions,
-        totalAvailable,
-      } = context;
-      return (
-        <>
-          <WalletTransactions
-            activeWallet={generateWallet(
-              'Wallet name',
-              '45119903750165',
-              assets
-            )}
-            currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
-            currentLocale={locale}
-            currentNumberFormat={NUMBER_OPTIONS[0].value}
-            currentTimeFormat={TIME_OPTIONS[0].value}
-            defaultFilterOptions={defaultFilterOptions}
-            filterOptions={filterOptions}
-            deletePendingTransaction={action('deletePendingTransaction')}
-            // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-            formattedWalletAmount={formattedWalletAmount}
-            getUrlByType={action('getUrlByType')}
-            hasMoreToLoad={false}
-            isInternalAddress={() => {
-              return true;
-            }}
-            isDeletingTransaction={false}
-            isLoadingTransactions={false}
-            onFilter={onFilter}
-            onLoadMore={action('onLoadMore')}
-            onOpenExternalLink={action('onOpenExternalLink')}
-            onRequestCSVFile={action('onRequestCSVFile')}
-            populatedFilterOptions={populatedFilterOptions}
-            totalAvailable={totalAvailable}
-            transactions={transactions}
-            hasAssetsEnabled={false}
-            getAsset={getAsset}
-            onCopyAssetParam={() => {}}
-          />
-        </>
-      );
-    },
-    {
-      decorators,
-    }
-  )
-  .add(
-    'Wallet Tokens Transactions List',
-    // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(_: Args, context: Props) => Ele... Remove this comment to see the full error message
-    (_, context: Props) => {
-      const {
-        defaultFilterOptions,
-        filterOptions,
-        locale,
-        onFilter,
-        populatedFilterOptions,
-        transactions,
-        totalAvailable,
-      } = context;
-      const hasAssetsEnabled = WALLET_ASSETS_ENABLED;
-      return (
-        <WalletTransactions
-          activeWallet={generateWallet('Wallet name', '45119903750165', assets)}
-          currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
-          currentLocale={locale}
-          currentNumberFormat={NUMBER_OPTIONS[0].value}
-          currentTimeFormat={TIME_OPTIONS[0].value}
-          defaultFilterOptions={defaultFilterOptions}
-          filterOptions={filterOptions}
-          deletePendingTransaction={action('deletePendingTransaction')}
-          // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
-          formattedWalletAmount={formattedWalletAmount}
-          getUrlByType={action('getUrlByType')}
-          hasMoreToLoad={false}
-          isInternalAddress={() => {
-            return true;
-          }}
-          isDeletingTransaction={false}
-          isLoadingTransactions={false}
-          onFilter={onFilter}
-          onLoadMore={action('onLoadMore')}
-          onOpenExternalLink={action('onOpenExternalLink')}
-          onRequestCSVFile={action('onRequestCSVFile')}
-          populatedFilterOptions={populatedFilterOptions}
-          totalAvailable={totalAvailable}
-          transactions={transactions}
-          hasAssetsEnabled={hasAssetsEnabled}
-          getAsset={getAsset}
-          onCopyAssetParam={() => {}}
-        />
-      );
-    },
-    {
-      decorators,
-    }
-  );
+  })
+  .addDecorator(WalletsWrapper) // ====== Stories ======
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: Props) => JSX.Element' i... Remove this comment to see the full error message
+  .add('Transactions List', (props: Props) => {
+    const {
+      defaultFilterOptions,
+      filterOptions,
+      locale,
+      onFilter,
+      populatedFilterOptions,
+      transactions,
+      totalAvailable,
+    } = props;
+    return (
+      <WalletTransactions
+        activeWallet={generateWallet('Wallet name', '45119903750165', assets)}
+        currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
+        currentLocale={locale}
+        currentNumberFormat={NUMBER_OPTIONS[0].value}
+        currentTimeFormat={TIME_OPTIONS[0].value}
+        defaultFilterOptions={defaultFilterOptions}
+        filterOptions={filterOptions}
+        deletePendingTransaction={action('deletePendingTransaction')}
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+        formattedWalletAmount={formattedWalletAmount}
+        getUrlByType={action('getUrlByType')}
+        hasMoreToLoad={false}
+        isInternalAddress={() => {
+          return true;
+        }}
+        isDeletingTransaction={false}
+        isLoadingTransactions={false}
+        onFilter={onFilter}
+        onLoadMore={action('onLoadMore')}
+        onOpenExternalLink={action('onOpenExternalLink')}
+        onRequestCSVFile={action('onRequestCSVFile')}
+        populatedFilterOptions={populatedFilterOptions}
+        totalAvailable={totalAvailable}
+        transactions={transactions}
+        hasAssetsEnabled={false}
+        getAsset={getAsset}
+        onCopyAssetParam={() => {}}
+      />
+    );
+  })
+  // @ts-ignore ts-migrate(2345) FIXME: Argument of type '(props: Props) => JSX.Element' i... Remove this comment to see the full error message
+  .add('Wallet Tokens Transactions List', (props: Props) => {
+    const {
+      defaultFilterOptions,
+      filterOptions,
+      locale,
+      onFilter,
+      populatedFilterOptions,
+      transactions,
+      totalAvailable,
+    } = props;
+    const hasAssetsEnabled = WALLET_ASSETS_ENABLED;
+    return (
+      <WalletTransactions
+        activeWallet={generateWallet('Wallet name', '45119903750165', assets)}
+        currentDateFormat={DATE_ENGLISH_OPTIONS[0].value}
+        currentLocale={locale}
+        currentNumberFormat={NUMBER_OPTIONS[0].value}
+        currentTimeFormat={TIME_OPTIONS[0].value}
+        defaultFilterOptions={defaultFilterOptions}
+        filterOptions={filterOptions}
+        deletePendingTransaction={action('deletePendingTransaction')}
+        // @ts-ignore ts-migrate(2769) FIXME: No overload matches this call.
+        formattedWalletAmount={formattedWalletAmount}
+        getUrlByType={action('getUrlByType')}
+        hasMoreToLoad={false}
+        isInternalAddress={() => {
+          return true;
+        }}
+        isDeletingTransaction={false}
+        isLoadingTransactions={false}
+        onFilter={onFilter}
+        onLoadMore={action('onLoadMore')}
+        onOpenExternalLink={action('onOpenExternalLink')}
+        onRequestCSVFile={action('onRequestCSVFile')}
+        populatedFilterOptions={populatedFilterOptions}
+        totalAvailable={totalAvailable}
+        transactions={transactions}
+        hasAssetsEnabled={hasAssetsEnabled}
+        getAsset={getAsset}
+        onCopyAssetParam={() => {}}
+      />
+    );
+  });
diff --git a/storybook/stories/wallets/transactions/Utxo.stories.tsx b/storybook/stories/wallets/transactions/Utxo.stories.tsx
index b37087e6ab..36d1d9c116 100644
--- a/storybook/stories/wallets/transactions/Utxo.stories.tsx
+++ b/storybook/stories/wallets/transactions/Utxo.stories.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { storiesOf } from '@storybook/react';
-import { number, withKnobs } from '@storybook/addon-knobs';
+import { number } from '@storybook/addon-knobs';
 import BigNumber from 'bignumber.js';
 // Assets and helpers
 import WalletsWrapper from '../_utils/WalletsWrapper';
@@ -14,12 +14,11 @@ const cfg = {
   min: 0,
   max: 20,
 };
-const decorators = [withKnobs, WalletsWrapper];
 
 /* eslint-disable consistent-return */
-storiesOf('Wallets/Transactions', module).add(
-  'UTXO Distribution',
-  () => (
+storiesOf('Wallets|Transactions', module)
+  .addDecorator(WalletsWrapper) // ====== Stories ======
+  .add('UTXO Distribution', () => (
     <WalletUtxo
       walletAmount={
         new BigNumber(
@@ -59,8 +58,4 @@ storiesOf('Wallets/Transactions', module).add(
       onExternalLinkClick={() => {}}
       pendingTxnsCount={0}
     />
-  ),
-  {
-    decorators,
-  }
-);
+  ));
diff --git a/storybook/ts-preset.ts b/storybook/ts-preset.ts
new file mode 100644
index 0000000000..1fba5c932b
--- /dev/null
+++ b/storybook/ts-preset.ts
@@ -0,0 +1,7 @@
+async function managerWebpack(baseConfig) {
+  baseConfig.resolve.extensions.push('.ts', '.tsx');
+  baseConfig.module.rules.push({ test: /\.tsx?$/, use: 'babel-loader' });
+  return baseConfig;
+}
+
+export default { managerWebpack };
diff --git a/storybook/webpack.config.js b/storybook/webpack.config.js
new file mode 100644
index 0000000000..3f6bbf82c0
--- /dev/null
+++ b/storybook/webpack.config.js
@@ -0,0 +1,134 @@
+const AutoDllPlugin = require('autodll-webpack-plugin');
+
+const isCi = process.env.CI && process.env.CI !== '';
+
+module.exports = async ({ config }) => {
+  const [jsxRule] = config.module.rules;
+  jsxRule.use.unshift('thread-loader');
+  // Use Auto DLL plugin for faster development builds
+  if (!isCi) {
+    const [htmlWebpackPlugin] = config.plugins;
+    const { templateParameters } = htmlWebpackPlugin.options;
+    htmlWebpackPlugin.options.templateParameters = (...args) =>
+      Object.assign(templateParameters.call(null, ...args), {
+        dlls: ['./vendor.dll.js'],
+      });
+    config.plugins.push(
+      new AutoDllPlugin({
+        inject: true,
+        filename: 'vendor.dll.js',
+        entry: {
+          vendor: [
+            '@storybook/addon-actions',
+            '@storybook/addon-knobs',
+            '@storybook/addon-links',
+            '@storybook/addons',
+            '@storybook/core',
+            '@storybook/react',
+            'aes-js',
+            'bignumber.js',
+            'bip39',
+            'blakejs',
+            'bs58',
+            'classnames',
+            'es6-error',
+            'faker',
+            'humanize-duration',
+            'lodash',
+            'mobx',
+            'mobx-react',
+            'mobx-react-form',
+            'mobx-react-router',
+            'moment',
+            'pbkdf2',
+            'qrcode.react',
+            'react',
+            'react-copy-to-clipboard',
+            'react-datetime',
+            'react-dom',
+            'react-router',
+            'react-svg-inline',
+            'recharts',
+            'route-parser',
+            'safe-buffer',
+            'unorm',
+            'validator',
+          ],
+        },
+      })
+    );
+  }
+  return {
+    ...config,
+    cache: !isCi,
+    devtool: isCi ? 'none' : config.devtool,
+    optimization: {
+      minimize: false,
+    },
+    resolve: {
+      extensions: ['.tsx', '.ts', '.js', '.json'],
+    },
+    module: {
+      rules: [
+        jsxRule,
+        {
+          test: /\.tsx?$/,
+          loader: 'babel-loader',
+          options: {
+            presets: [
+              '@babel/preset-env',
+              '@babel/preset-react',
+              '@babel/preset-typescript',
+            ],
+          },
+        },
+        {
+          test: /\.scss/,
+          use: [
+            {
+              loader: 'style-loader',
+            },
+            {
+              loader: 'css-loader',
+              options: {
+                sourceMap: !isCi,
+                modules: true,
+                localIdentName: '[name]_[local]',
+                importLoaders: true,
+              },
+            },
+            { loader: 'fast-sass-loader', options: { sourceMap: !isCi } },
+          ],
+        },
+        {
+          test: /\.css/,
+          use: [{ loader: 'css-loader', options: { sourceMap: !isCi } }],
+        },
+        {
+          test: /\.inline\.svg$/,
+          use: 'svg-inline-loader',
+        },
+        {
+          test: /\.(woff2?|eot|ttf|otf|png|jpe?g|gif|svg)(\?.*)?$/,
+          exclude: /\.inline\.svg$/,
+          use: {
+            loader: 'url-loader',
+            options: {
+              limit: 10000,
+            },
+          },
+        },
+        {
+          test: /\.md$/,
+          use: [
+            { loader: 'html-loader', options: { importLoaders: true } },
+            { loader: 'markdown-loader?gfm=false' },
+          ],
+        },
+      ],
+    },
+    node: {
+      fs: 'empty',
+    },
+  };
+};
diff --git a/tests/_utils/TestBed.tsx b/tests/_utils/TestBed.tsx
new file mode 100644
index 0000000000..eb0ff4b2b4
--- /dev/null
+++ b/tests/_utils/TestBed.tsx
@@ -0,0 +1,34 @@
+import React, { ReactElement } from 'react';
+import { IntlProvider } from 'react-intl';
+import { render } from "@testing-library/react";
+import { ThemeProvider } from 'react-polymorph/lib/components/ThemeProvider';
+import { SimpleSkins } from 'react-polymorph/lib/skins/simple';
+import { SimpleDefaults } from 'react-polymorph/lib/themes/simple';
+
+import { BrowserLocalStorageBridge, DiscreetModeFeatureProvider } from '../../source/renderer/app/features';
+import translations from '../../source/renderer/app/i18n/locales/en-US.json';
+import { daedalusTheme } from '../../source/renderer/app/themes/daedalus';
+import { themeOverrides } from '../../source/renderer/app/themes/overrides';
+
+const TestBed = ({ children }: { children: ReactElement }) => (
+  <ThemeProvider
+    theme={daedalusTheme}
+    skins={SimpleSkins}
+    variables={SimpleDefaults}
+    themeOverrides={themeOverrides}
+  >
+    <IntlProvider locale="en-US" messages={translations}>
+      <BrowserLocalStorageBridge>
+        <DiscreetModeFeatureProvider>
+          {children}
+        </DiscreetModeFeatureProvider>
+      </BrowserLocalStorageBridge>
+    </IntlProvider>
+  </ThemeProvider>
+);
+
+const createTestBed = (component: ReactElement) => {
+  return render(<TestBed>{component}</TestBed>);
+}
+
+export default createTestBed;
diff --git a/tests/_utils/TestDecorator.tsx b/tests/_utils/TestDecorator.tsx
new file mode 100644
index 0000000000..822945505e
--- /dev/null
+++ b/tests/_utils/TestDecorator.tsx
@@ -0,0 +1,24 @@
+import React, { Component, Children } from "react";
+// @ts-ignore ts-migrate(2305) FIXME: Module '"react"' has no exported member 'Node'.
+import type { Node } from "react";
+import { ThemeProvider } from "react-polymorph/lib/components/ThemeProvider";
+import { IntlProvider, addLocaleData } from "react-intl";
+import { SimpleSkins } from "react-polymorph/lib/skins/simple";
+import { SimpleDefaults } from "react-polymorph/lib/themes/simple";
+import en from "react-intl/locale-data/en";
+import { daedalusTheme } from "../../source/renderer/app/themes/daedalus";
+import { themeOverrides } from "../../source/renderer/app/themes/overrides";
+import translations from "../../source/renderer/app/i18n/locales/en-US.json";
+
+type Props = {
+  children: Node;
+};
+export function TestDecorator({
+  children
+}: Props) {
+  return <IntlProvider locale="en-US" messages={translations}>
+        <ThemeProvider theme={daedalusTheme} skins={SimpleSkins} variables={SimpleDefaults} themeOverrides={themeOverrides}>
+          {children}
+        </ThemeProvider>
+      </IntlProvider>;
+}
\ No newline at end of file
diff --git a/tests/addresses/e2e/steps/addresses.ts b/tests/addresses/e2e/steps/addresses.ts
index fd805daf5f..811bdb6e85 100644
--- a/tests/addresses/e2e/steps/addresses.ts
+++ b/tests/addresses/e2e/steps/addresses.ts
@@ -85,19 +85,19 @@ Then('I should see {int} addresses', async function (numberOfAddresses) {
     addresses = [addresses];
   }
 
-  
+  ;
   expect(addresses.length).to.equal(numberOfAddresses);
 });
 Then('I should see the following addresses:', async function (table) {
-  const expectedAdresses = table.hashes();
+  const expectedAddresses = table.hashes();
   let addresses;
   await this.client.waitUntil(async () => {
     addresses = await this.client.getAttribute(SELECTORS.ADDRESS_COMPONENT, 'class');
-    return addresses.length === expectedAdresses.length;
+    return addresses.length === expectedAddresses.length;
   });
 
   if (addresses) {
-    addresses.forEach((address, index) => expect(address).to.include(expectedAdresses[index].ClassName));
+    addresses.forEach((address, index) => expect(address).to.include(expectedAddresses[index].ClassName));
   }
 });
 Then('The active address should be the newest one', async function () {
@@ -135,4 +135,4 @@ Then(/^The active address belongs to "([^"]*)" wallet$/, async function (walletN
   const activeAddress = await this.client.getText('.WalletReceiveRandom_hash');
   const walletAddress = find(walletAddresses.value, address => address.id === activeAddress);
   expect(walletAddress.id).to.equal(activeAddress);
-});
\ No newline at end of file
+});
diff --git a/tests/app/e2e/features/app-update.feature b/tests/app/e2e/features/app-update.feature
index 42d7988cd2..81c703444d 100644
--- a/tests/app/e2e/features/app-update.feature
+++ b/tests/app/e2e/features/app-update.feature
@@ -68,7 +68,7 @@ Feature: App Update
 
   Scenario: 2.2.0 is installed
     Given I open the 2.0.0 build
-    Then I should not see the green dot in the beel
+    Then I should not see the green dot in the bell
     And I should not see the update item in the newsfeed
     And I should not see the update overlay
 
diff --git a/tests/assets/unit/assets.spec.ts b/tests/assets/unit/assets.spec.ts
index 7183b5910b..d002fed5b7 100644
--- a/tests/assets/unit/assets.spec.ts
+++ b/tests/assets/unit/assets.spec.ts
@@ -73,4 +73,4 @@ describe('Function hasTokenLeftAfterTransaction returns:', () => {
     const result = hasTokensLeftAfterTransaction(allAvailableTokens, initialSelectedAssets, selectedAssets);
     expect(result).toBe(true);
   });
-});
\ No newline at end of file
+});
diff --git a/tests/delegation/e2e/features/delegation.feature b/tests/delegation/e2e/features/delegation.feature
index d65eb8cc98..545aca8735 100644
--- a/tests/delegation/e2e/features/delegation.feature
+++ b/tests/delegation/e2e/features/delegation.feature
@@ -63,7 +63,7 @@ Feature: Wallet Delegation
     Then I should see a "This wallet does not contain the minimum amount of 10 ADA which is required for delegation to be available. Please select a wallet with " message
     Given I close the wizard
     And I send 11 ADA from the "Wallet Sender" wallet to the "Wallet Receiver" wallet
-    Then I sucessfully delegate my "Wallet Receiver" wallet
+    Then I successfully delegate my "Wallet Receiver" wallet
 
   Scenario: "Delegation" wizard is showing the correct error message if the user submits wrong spending password
     Given I have the following wallets:
diff --git a/tests/delegation/e2e/steps/delegation.ts b/tests/delegation/e2e/steps/delegation.ts
index 1eae4f20bc..29362a5a52 100644
--- a/tests/delegation/e2e/steps/delegation.ts
+++ b/tests/delegation/e2e/steps/delegation.ts
@@ -170,7 +170,7 @@ Then(/^The "([^"]*)" wallet option should display the correct Stake Pool ticker$
 Then('I close the delegation process dialog', async function () {
   await this.waitAndClick('.DialogCloseButton_component');
 });
-Given(/^I sucessfully delegate my "([^"]*)" wallet$/, {
+Given(/^I successfully delegate my "([^"]*)" wallet$/, {
   timeout: 60000
 }, async function (walletName) {
   const delegateActionSelector = `//div[@class="WalletRow_title" and text()="${walletName}"]//parent::div//parent::div//span[@class="WalletRow_actionDelegate"]`;
diff --git a/tests/delegation/e2e/steps/stake-pools.ts b/tests/delegation/e2e/steps/stake-pools.ts
index 8d6f26bace..1246cb1d4c 100644
--- a/tests/delegation/e2e/steps/stake-pools.ts
+++ b/tests/delegation/e2e/steps/stake-pools.ts
@@ -168,7 +168,7 @@ Then(/^I click on stake pools tab button/, async function () {
 Then(/^I am on the Staking pool screen/, async function () {
   await this.client.waitForVisible(STAKE_POOL_PAGE);
 });
-Then(/^I should't see loading message anymore/, function () {
+Then(/^I shouldn't see loading message anymore/, function () {
   return this.client.waitForVisible(LOADING_MESSAGE_SELECTOR, null, true);
 });
 Then(/^I should see stake pools listed/, async function () {
diff --git a/tests/lint.nix b/tests/lint.nix
deleted file mode 100644
index 860008bc83..0000000000
--- a/tests/lint.nix
+++ /dev/null
@@ -1,32 +0,0 @@
-let
-  localLib = import ./lib.nix;
-in
-{ system ? builtins.currentSystem
-, config ? {}
-, runCommand
-, source
-, rawapp
-, pkgs ? localLib.iohkNix.getPkgs { inherit system config; }
-}:
-let
-  nodejs = pkgs.nodejs-16_x;
-  yarn = pkgs.yarn.override { inherit nodejs; };
-  lint = runCommand "daedalus-lint-ci" { buildInputs = [ yarn ]; src = source; } ''
-    export NO_UPDATE_NOTIFIER=1
-    unpackPhase
-    cd $sourceRoot
-
-    ln -s ${rawapp.node_modules} node_modules
-    export PATH=$(realpath node_modules)/.bin:$PATH
-
-    mkdir /tmp/yarn-cache
-    yarn --offline --cache-folder /tmp/yarn-cache run lint
-    rm -r /tmp/yarn-cache
-    EXIT_CODE=$?
-    if [ $EXIT_CODE == 0 ]
-    then
-      echo $EXIT_CODE > $out
-      exit 0
-    fi
-  '';
-in lint
diff --git a/tests/mocks/asset.ts b/tests/mocks/asset.ts
new file mode 100644
index 0000000000..3afbde3919
--- /dev/null
+++ b/tests/mocks/asset.ts
@@ -0,0 +1,36 @@
+import BigNumber from 'bignumber.js';
+
+import { AssetToken, Token } from '../../source/renderer/app/api/assets/types';
+
+export const commonTokenProperties: Token = {
+  policyId: '6b8d07d69639e9413dd637a1a815a7323c69c86abbafb66dbfdb1aa7',
+  assetName: '',
+  quantity: new BigNumber(6),
+  uniqueId: '6b8d07d69639e9413dd637a1a815a7323c69c86abbafb66dbfdb1aa7',
+}
+
+export const zeroDecimalPlacesToken: AssetToken = {
+  ...commonTokenProperties,
+  fingerprint: 'asset1cvmyrfrc7lpht2hcjwr9lulzyyjv27uxh3kcz0',
+  metadata: {
+    url: 'https://developers.cardano.org/',
+    name: 'ZeroDecimalCoin',
+    ticker: 'ZDP',
+    description: 'Zero decimal coin.'
+  },
+  recommendedDecimals: 0,
+  decimals: undefined,
+}
+
+export const withDecimalPlacesToken: AssetToken = {
+  ...commonTokenProperties,
+  fingerprint: 'asset1cvmyrfrc7lpht2hcjwr9lulzyyjv27uxh3kcz1',
+  metadata: {
+    url: 'https://developers.cardano.org/',
+    name: 'Non-zero DecimalCoin',
+    ticker: 'nZDP',
+    description: 'Non zero decimal coin.'
+  },
+  recommendedDecimals: 1,
+  decimals: 2,
+}
diff --git a/tests/settings/e2e/features/accept-terms-of-use.feature b/tests/settings/e2e/features/accept-terms-of-use.feature
index 9dad994387..32cfd34217 100644
--- a/tests/settings/e2e/features/accept-terms-of-use.feature
+++ b/tests/settings/e2e/features/accept-terms-of-use.feature
@@ -2,7 +2,7 @@
 Feature: Accept "Terms of use"
 
   Background:
-    Given I didnt accept "Terms of use"
+    Given I didn't accept "Terms of use"
     And I have selected English language
 
   Scenario: User accepts "Terms of use"
diff --git a/tests/settings/e2e/steps/settings.ts b/tests/settings/e2e/steps/settings.ts
index 9509adc8e0..4c14fcaed0 100644
--- a/tests/settings/e2e/steps/settings.ts
+++ b/tests/settings/e2e/steps/settings.ts
@@ -1,7 +1,7 @@
 import { Given, When, Then } from "cucumber";
 import { expect } from "chai";
 import { navigateTo } from "../../../navigation/e2e/steps/helpers";
-import { waitUntilWaletNamesEqual } from "../../../wallets/e2e/steps/helpers";
+import { waitUntilWalletNamesEqual } from "../../../wallets/e2e/steps/helpers";
 
 Given(/^I am on the settings screen$/, async function () {
   await navigateTo.call(this, '/settings');
@@ -39,7 +39,7 @@ When(/^I click outside "name" input field$/, function () {
   return this.client.click('.WalletSettings_component');
 });
 Then(/^I should see new wallet name "([^"]*)"$/, async function (walletName) {
-  return waitUntilWaletNamesEqual.call(this, walletName);
+  return waitUntilWalletNamesEqual.call(this, walletName);
 });
 Then(/^I should see "([^"]*)" label in password field$/, function (label) {
   const selector = `.${label}Label`;
diff --git a/tests/settings/e2e/steps/terms-of-use.ts b/tests/settings/e2e/steps/terms-of-use.ts
index db48bb8ae9..fdf1f7ee60 100644
--- a/tests/settings/e2e/steps/terms-of-use.ts
+++ b/tests/settings/e2e/steps/terms-of-use.ts
@@ -9,7 +9,7 @@ const {
 Given(/^I have accepted "Terms of use"$/, async function () {
   await acceptTerms(this.client);
 });
-Given(/^I didnt accept "Terms of use"$/, async function () {
+Given(/^I didn't accept "Terms of use"$/, async function () {
   await this.client.execute(() => {
     // @ts-ignore ts-migrate(2304) FIXME: Cannot find name 'daedalus'.
     daedalus.reset();
diff --git a/tests/setup-e2e.ts b/tests/setup-e2e.ts
index 897c3b7285..b27acee028 100644
--- a/tests/setup-e2e.ts
+++ b/tests/setup-e2e.ts
@@ -1,6 +1,5 @@
 import path from "path";
 import fs from "fs";
-// @ts-ignore ts-migrate(2307) FIXME: Cannot find module 'spectron' or its corresponding... Remove this comment to see the full error message
 import { Application } from "spectron";
 import { BeforeAll, Before, After, AfterAll, setDefaultTimeout } from "cucumber";
 import electronPath from "electron";
@@ -34,6 +33,7 @@ const defaultWalletKeyFilePath = path.resolve(__dirname, './wallets/e2e/document
 
 const startApp = async () => {
   const app = new Application({
+    // @ts-ignore ts-migrate(2322) FIXME: Type 'typeof Electron' is not assignable to type '... Remove this comment to see the full error message
     path: electronPath,
     args: ['./dist/main/index.js'],
     requireName: 'spectronRequire',
diff --git a/tests/shellcheck.nix b/tests/shellcheck.nix
index bad29a79e7..536cfb35c1 100644
--- a/tests/shellcheck.nix
+++ b/tests/shellcheck.nix
@@ -13,7 +13,7 @@ EXIT_STATUS=0
 cd ${src'}
 while IFS= read -r -d ''' i
 do
-  if shellcheck -x -e 1008 -e 2148 "$i"
+  if shellcheck -x -e 1008 -e 2148 --source-path=SCRIPTDIR "$i"
   then
     echo "$i [ PASSED ]"
   else
diff --git a/tests/transactions/e2e/steps/transactions.ts b/tests/transactions/e2e/steps/transactions.ts
index d834b7a97c..30853a0529 100644
--- a/tests/transactions/e2e/steps/transactions.ts
+++ b/tests/transactions/e2e/steps/transactions.ts
@@ -184,7 +184,7 @@ Then(/^the latest transaction should show:$/, async function (table) {
   let transactionAmounts = await this.waitAndGetText('.Transaction_amount');
   transactionAmounts = [].concat(transactionAmounts);
   // Transaction amount includes transaction fees so we need to
-  // substract them in order to get a match with expectedData.amountWithoutFees.
+  // subtract them in order to get a match with expectedData.amountWithoutFees.
   // NOTE: we use "add()" as this is outgoing transaction and amount is a negative value!
   const transactionAmount = new BigNumber(transactionAmounts[0]);
   const transactionAmountWithoutFees = transactionAmount.plus(this.fees).toFormat(DECIMAL_PLACES_IN_ADA);
diff --git a/tests/wallets/e2e/features/transfer-funds-wizard.feature b/tests/wallets/e2e/features/transfer-funds-wizard.feature
index 03b6e68b49..829bba7587 100644
--- a/tests/wallets/e2e/features/transfer-funds-wizard.feature
+++ b/tests/wallets/e2e/features/transfer-funds-wizard.feature
@@ -4,8 +4,8 @@ Feature: Transfer funds wizard
   Background:
     Given I have completed the basic setup
 
-  Scenario: Successfully transfering funds from "Daedalus Byron" wallet to "Daedalus Shelley" wallet
-    Given I have a "Byron Wallet" byron wallet for transfering funds
+  Scenario: Successfully transferring funds from "Daedalus Byron" wallet to "Daedalus Shelley" wallet
+    Given I have a "Byron Wallet" byron wallet for transferring funds
     And I have a "Test Wallet" wallet with funds
     And I should see the restore status notification while restore is running
     And I should not see the restore status notification once restore is finished
diff --git a/tests/wallets/e2e/steps/helpers.ts b/tests/wallets/e2e/steps/helpers.ts
index 0c390ee8cb..9a3749f43b 100644
--- a/tests/wallets/e2e/steps/helpers.ts
+++ b/tests/wallets/e2e/steps/helpers.ts
@@ -10,7 +10,7 @@ const IMPORT_WALLET_BUTTON = '.importWalletButton';
 const IMPORT_WALLET_DIALOG = '.WalletFileImportDialog';
 const DEFAULT_LANGUAGE = 'en-US';
 let shelleyMnemonicsIndex = 0;
-export const noWalletsErrorMessage = `The byron wallet for funds transfering was already used and has no longer funds.
+export const noWalletsErrorMessage = `The byron wallet for funds transferring was already used and has no longer funds.
     Remove the "Daedalus Selfnode" directory and run \`nix:dev\` again.`;
 export const restoreWalletWithFunds = async (client: Record<string, any>, {
   walletName
@@ -197,7 +197,7 @@ export const waitUntilWalletIsLoaded = async function (walletName: string): Prom
   });
   return wallet;
 };
-export const waitUntilWaletNamesEqual = function (walletName: string) {
+export const waitUntilWalletNamesEqual = function (walletName: string) {
   const context = this;
   return context.client.waitUntil(async () => {
     const currentWalletName = await getNameOfActiveWalletInSidebar.call(context);
diff --git a/tests/wallets/e2e/steps/transfer-funds-wizard.ts b/tests/wallets/e2e/steps/transfer-funds-wizard.ts
index d0dec349ee..2741ff318c 100644
--- a/tests/wallets/e2e/steps/transfer-funds-wizard.ts
+++ b/tests/wallets/e2e/steps/transfer-funds-wizard.ts
@@ -49,7 +49,7 @@ Then(/^I should see "Transfer ada" wizard step 2 dialog$/, async function () {
 });
 Then(/^I should not see "Transfer ada" wizard step 2 wizard dialog anymore$/, {
   timeout: 60000
-}, // Transfering funds sometimes last more than "Default" test timeout
+}, // Transferring funds sometimes last more than "Default" test timeout
 function () {
   return this.client.waitForVisible('.TransferFundsStep2Dialog_dialog', null, true);
 });
diff --git a/tests/wallets/e2e/steps/wallets.ts b/tests/wallets/e2e/steps/wallets.ts
index 84c90ba2ff..bc2f2f861d 100644
--- a/tests/wallets/e2e/steps/wallets.ts
+++ b/tests/wallets/e2e/steps/wallets.ts
@@ -56,7 +56,7 @@ Given(/^I have a "([^"]*)" (byron )?wallet$/, async function (walletName, _type)
 
   await waitUntilWalletIsLoaded.call(this, walletName);
 });
-Given(/^I have a "([^"]*)" byron wallet for transfering funds$/, async function (walletName) {
+Given(/^I have a "([^"]*)" byron wallet for transferring funds$/, async function (walletName) {
   await restoreLegacyWallet(this.client, {
     walletName,
     hasFunds: true,
diff --git a/tsconfig.json b/tsconfig.json
index c2430cfcc8..32d7be2510 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -27,8 +27,10 @@
     "module": "commonjs",                                /* Specify what module code is generated. */
     // "rootDir": "./",                                  /* Specify the root folder within your source files. */
     "moduleResolution": "node",                          /* Specify how TypeScript looks up a file from a given module specifier. */
-    // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
-    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
+    "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
+    "paths": {
+      "tests/*": ["tests/*"]
+    },                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
     // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
     // "typeRoots": [],                                  /* Specify multiple folders that act like `./node_modules/@types`. */
     // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
diff --git a/utils/lockfile-checker/index.ts b/utils/lockfile-checker/index.ts
index 2cb124beac..eaa1f68ebe 100644
--- a/utils/lockfile-checker/index.ts
+++ b/utils/lockfile-checker/index.ts
@@ -28,9 +28,7 @@ const dependencyNamesToRemove = [
   'blake2b@https://github.com/BitGo/blake2b',
   '@types/aria-query',
   '@types/istanbul-lib-report',
-  '@types/micromatch',
-  '@types/glob-base',
-  'glob-base',
+  '@types/react-syntax-highlighter',
 ];
 const dependenciesToRemove = Object.keys(json.object).filter((key) =>
   dependencyNamesToRemove.find((name) => key.includes(name))
@@ -63,7 +61,7 @@ function check() {
     !blake2bGitRefDependency
   ) {
     console.log('\n \x1b[32m', 'All good, yarn.lock is clean!\n', '\x1b[0m');
-    return;
+    process.exit(0);
   }
 
   console.log(`\x1b[31myarn.lock is not VALID.`, '\x1b[0m');
@@ -110,6 +108,7 @@ function check() {
   }
 
   console.log('To FIX issues run: \x1b[36m yarn lockfile:fix\n', '\x1b[0m');
+  process.exit(1);
 }
 
 function fix() {
diff --git a/yarn.lock b/yarn.lock
index 5536b5de05..f733abfd15 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -144,11 +144,11 @@
     jsesc "^2.5.1"
     source-map "^0.5.0"
 
-"@babel/generator@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.16.7.tgz#b42bf46a3079fa65e1544135f32e7958f048adbb"
+"@babel/generator@^7.16.8":
+  version "7.16.8"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.16.8.tgz#359d44d966b8cd059d543250ce79596f792f2ebe"
   dependencies:
-    "@babel/types" "^7.16.7"
+    "@babel/types" "^7.16.8"
     jsesc "^2.5.1"
     source-map "^0.5.0"
 
@@ -217,8 +217,8 @@
     "@babel/helper-split-export-declaration" "^7.16.0"
 
 "@babel/helper-create-class-features-plugin@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.16.7.tgz#9c5b34b53a01f2097daf10678d65135c1b9f84ba"
+  version "7.16.10"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.16.10.tgz#8a6959b9cc818a88815ba3c5474619e9c0f2c21c"
   dependencies:
     "@babel/helper-annotate-as-pure" "^7.16.7"
     "@babel/helper-environment-visitor" "^7.16.7"
@@ -625,8 +625,8 @@
     js-tokens "^4.0.0"
 
 "@babel/highlight@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.7.tgz#81a01d7d675046f0d96f82450d9d9578bdfd6b0b"
+  version "7.16.10"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.10.tgz#744f2eb81579d6eea753c227b0f570ad785aba88"
   dependencies:
     "@babel/helper-validator-identifier" "^7.16.7"
     chalk "^2.0.0"
@@ -655,9 +655,9 @@
   version "7.16.6"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.16.6.tgz#8f194828193e8fa79166f34a4b4e52f3e769a314"
 
-"@babel/parser@^7.16.7", "@babel/parser@^7.7.0":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.16.7.tgz#d372dda9c89fcec340a82630a9f533f2fe15877e"
+"@babel/parser@^7.16.10", "@babel/parser@^7.16.7", "@babel/parser@^7.7.0":
+  version "7.16.12"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.16.12.tgz#9474794f9a650cf5e2f892444227f98e28cdf8b6"
 
 "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.16.2":
   version "7.16.2"
@@ -1965,17 +1965,17 @@
     globals "^11.1.0"
 
 "@babel/traverse@^7.16.7", "@babel/traverse@^7.7.0":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.16.7.tgz#dac01236a72c2560073658dd1a285fe4e0865d76"
+  version "7.16.10"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.16.10.tgz#448f940defbe95b5a8029975b051f75993e8239f"
   dependencies:
     "@babel/code-frame" "^7.16.7"
-    "@babel/generator" "^7.16.7"
+    "@babel/generator" "^7.16.8"
     "@babel/helper-environment-visitor" "^7.16.7"
     "@babel/helper-function-name" "^7.16.7"
     "@babel/helper-hoist-variables" "^7.16.7"
     "@babel/helper-split-export-declaration" "^7.16.7"
-    "@babel/parser" "^7.16.7"
-    "@babel/types" "^7.16.7"
+    "@babel/parser" "^7.16.10"
+    "@babel/types" "^7.16.8"
     debug "^4.1.0"
     globals "^11.1.0"
 
@@ -1994,9 +1994,9 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
-"@babel/types@^7.16.7", "@babel/types@^7.7.0":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.16.7.tgz#4ed19d51f840ed4bd5645be6ce40775fecf03159"
+"@babel/types@^7.16.7", "@babel/types@^7.16.8", "@babel/types@^7.7.0":
+  version "7.16.8"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.16.8.tgz#0ba5da91dd71e0a4e7781a30f22770831062e3c1"
   dependencies:
     "@babel/helper-validator-identifier" "^7.16.7"
     to-fast-properties "^2.0.0"
@@ -3657,6 +3657,13 @@
     jest-diff "^27.0.0"
     pretty-format "^27.0.0"
 
+"@types/jest@27.4.0":
+  version "27.4.0"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-27.4.0.tgz#037ab8b872067cae842a320841693080f9cb84ed"
+  dependencies:
+    jest-diff "^27.0.0"
+    pretty-format "^27.0.0"
+
 "@types/json-schema@*", "@types/json-schema@^7.0.4", "@types/json-schema@^7.0.8", "@types/json-schema@^7.0.9":
   version "7.0.9"
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.9.tgz#97edc9037ea0c38585320b28964dde3b39e4660d"
@@ -3708,9 +3715,9 @@
   version "11.11.6"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-11.11.6.tgz#df929d1bb2eee5afdda598a41930fe50b43eaa6a"
 
-"@types/node@17.0.7":
-  version "17.0.7"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.7.tgz#4a53d8332bb65a45470a2f9e2611f1ced637a5cb"
+"@types/node@17.0.12":
+  version "17.0.12"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.12.tgz#f7aa331b27f08244888c47b7df126184bc2339c5"
 
 "@types/node@>=13.7.0":
   version "16.11.12"
@@ -3874,13 +3881,13 @@
   dependencies:
     "@types/node" "*"
 
-"@typescript-eslint/eslint-plugin@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.9.0.tgz#382182d5cb062f52aac54434cfc47c28898c8006"
+"@typescript-eslint/eslint-plugin@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.10.1.tgz#870195d0f2146b36d11fc71131b75aba52354c69"
   dependencies:
-    "@typescript-eslint/experimental-utils" "5.9.0"
-    "@typescript-eslint/scope-manager" "5.9.0"
-    "@typescript-eslint/type-utils" "5.9.0"
+    "@typescript-eslint/scope-manager" "5.10.1"
+    "@typescript-eslint/type-utils" "5.10.1"
+    "@typescript-eslint/utils" "5.10.1"
     debug "^4.3.2"
     functional-red-black-tree "^1.0.1"
     ignore "^5.1.8"
@@ -3888,17 +3895,6 @@
     semver "^7.3.5"
     tsutils "^3.21.0"
 
-"@typescript-eslint/experimental-utils@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-5.9.0.tgz#652762d37d6565ef07af285021b8347b6c79a827"
-  dependencies:
-    "@types/json-schema" "^7.0.9"
-    "@typescript-eslint/scope-manager" "5.9.0"
-    "@typescript-eslint/types" "5.9.0"
-    "@typescript-eslint/typescript-estree" "5.9.0"
-    eslint-scope "^5.1.1"
-    eslint-utils "^3.0.0"
-
 "@typescript-eslint/experimental-utils@^5.0.0":
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-5.5.0.tgz#3fe2514dc2f3cd95562206e4058435ea51df609e"
@@ -3910,15 +3906,22 @@
     eslint-scope "^5.1.1"
     eslint-utils "^3.0.0"
 
-"@typescript-eslint/parser@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.9.0.tgz#fdbb08767a4caa6ca6ccfed5f9ffe9387f0c7d97"
+"@typescript-eslint/parser@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.10.1.tgz#4ce9633cc33fc70bc13786cb793c1a76fe5ad6bd"
   dependencies:
-    "@typescript-eslint/scope-manager" "5.9.0"
-    "@typescript-eslint/types" "5.9.0"
-    "@typescript-eslint/typescript-estree" "5.9.0"
+    "@typescript-eslint/scope-manager" "5.10.1"
+    "@typescript-eslint/types" "5.10.1"
+    "@typescript-eslint/typescript-estree" "5.10.1"
     debug "^4.3.2"
 
+"@typescript-eslint/scope-manager@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.10.1.tgz#f0539c73804d2423506db2475352a4dec36cd809"
+  dependencies:
+    "@typescript-eslint/types" "5.10.1"
+    "@typescript-eslint/visitor-keys" "5.10.1"
+
 "@typescript-eslint/scope-manager@5.5.0":
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.5.0.tgz#2b9f3672fa6cddcb4160e7e8b49ef1fd00f83c09"
@@ -3926,28 +3929,33 @@
     "@typescript-eslint/types" "5.5.0"
     "@typescript-eslint/visitor-keys" "5.5.0"
 
-"@typescript-eslint/scope-manager@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.9.0.tgz#02dfef920290c1dcd7b1999455a3eaae7a1a3117"
-  dependencies:
-    "@typescript-eslint/types" "5.9.0"
-    "@typescript-eslint/visitor-keys" "5.9.0"
-
-"@typescript-eslint/type-utils@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-5.9.0.tgz#fd5963ead04bc9b7af9c3a8e534d8d39f1ce5f93"
+"@typescript-eslint/type-utils@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-5.10.1.tgz#5e526c00142585e40ab1503e83f1ff608c367405"
   dependencies:
-    "@typescript-eslint/experimental-utils" "5.9.0"
+    "@typescript-eslint/utils" "5.10.1"
     debug "^4.3.2"
     tsutils "^3.21.0"
 
+"@typescript-eslint/types@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.10.1.tgz#dca9bd4cb8c067fc85304a31f38ec4766ba2d1ea"
+
 "@typescript-eslint/types@5.5.0":
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.5.0.tgz#fee61ae510e84ed950a53937a2b443e078107003"
 
-"@typescript-eslint/types@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.9.0.tgz#e5619803e39d24a03b3369506df196355736e1a3"
+"@typescript-eslint/typescript-estree@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.10.1.tgz#b268e67be0553f8790ba3fe87113282977adda15"
+  dependencies:
+    "@typescript-eslint/types" "5.10.1"
+    "@typescript-eslint/visitor-keys" "5.10.1"
+    debug "^4.3.2"
+    globby "^11.0.4"
+    is-glob "^4.0.3"
+    semver "^7.3.5"
+    tsutils "^3.21.0"
 
 "@typescript-eslint/typescript-estree@5.5.0":
   version "5.5.0"
@@ -3961,17 +3969,23 @@
     semver "^7.3.5"
     tsutils "^3.21.0"
 
-"@typescript-eslint/typescript-estree@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.9.0.tgz#0e5c6f03f982931abbfbc3c1b9df5fbf92a3490f"
+"@typescript-eslint/utils@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-5.10.1.tgz#fa682a33af47080ba2c4368ee0ad2128213a1196"
   dependencies:
-    "@typescript-eslint/types" "5.9.0"
-    "@typescript-eslint/visitor-keys" "5.9.0"
-    debug "^4.3.2"
-    globby "^11.0.4"
-    is-glob "^4.0.3"
-    semver "^7.3.5"
-    tsutils "^3.21.0"
+    "@types/json-schema" "^7.0.9"
+    "@typescript-eslint/scope-manager" "5.10.1"
+    "@typescript-eslint/types" "5.10.1"
+    "@typescript-eslint/typescript-estree" "5.10.1"
+    eslint-scope "^5.1.1"
+    eslint-utils "^3.0.0"
+
+"@typescript-eslint/visitor-keys@5.10.1":
+  version "5.10.1"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.10.1.tgz#29102de692f59d7d34ecc457ed59ab5fc558010b"
+  dependencies:
+    "@typescript-eslint/types" "5.10.1"
+    eslint-visitor-keys "^3.0.0"
 
 "@typescript-eslint/visitor-keys@5.5.0":
   version "5.5.0"
@@ -3980,13 +3994,6 @@
     "@typescript-eslint/types" "5.5.0"
     eslint-visitor-keys "^3.0.0"
 
-"@typescript-eslint/visitor-keys@5.9.0":
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.9.0.tgz#7585677732365e9d27f1878150fab3922784a1a6"
-  dependencies:
-    "@typescript-eslint/types" "5.9.0"
-    eslint-visitor-keys "^3.0.0"
-
 "@wdio/config@5.18.4":
   version "5.18.4"
   resolved "https://registry.yarnpkg.com/@wdio/config/-/config-5.18.4.tgz#cabbac2f42bb1f8ac768f79d0e7671976d97d30e"
@@ -4393,12 +4400,6 @@ ajv-errors@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/ajv-errors/-/ajv-errors-1.0.1.tgz#f35986aceb91afadec4102fbd85014950cefa64d"
 
-ajv-formats@^2.0.2:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/ajv-formats/-/ajv-formats-2.1.0.tgz#96eaf83e38d32108b66d82a9cb0cfa24886cdfeb"
-  dependencies:
-    ajv "^8.0.0"
-
 ajv-formats@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ajv-formats/-/ajv-formats-2.1.1.tgz#6e669400659eb74973bbf2e33327180a0996b520"
@@ -4433,7 +4434,7 @@ ajv@^6.10.0, ajv@^6.12.3, ajv@^6.12.4:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
-ajv@^8.0.0, ajv@^8.1.0:
+ajv@^8.0.0:
   version "8.6.1"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.6.1.tgz#ae65764bf1edde8cd861281cda5057852364a295"
   dependencies:
@@ -4451,6 +4452,15 @@ ajv@^8.0.1, ajv@^8.8.0:
     require-from-string "^2.0.2"
     uri-js "^4.2.2"
 
+ajv@^8.6.3:
+  version "8.11.0"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.11.0.tgz#977e91dd96ca669f54a11e23e378e33b884a565f"
+  dependencies:
+    fast-deep-equal "^3.1.1"
+    json-schema-traverse "^1.0.0"
+    require-from-string "^2.0.2"
+    uri-js "^4.2.2"
+
 amdefine@>=0.0.4:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
@@ -4515,6 +4525,10 @@ ansi-regex@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-6.0.1.tgz#3183e38fae9a65d7cb5e53945cd5897d0260a06a"
 
+ansi-styles@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
+
 ansi-styles@^3.2.0, ansi-styles@^3.2.1:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
@@ -4552,7 +4566,7 @@ anymatch@^2.0.0:
     micromatch "^3.1.4"
     normalize-path "^2.1.1"
 
-anymatch@^3.0.0, anymatch@^3.0.3, anymatch@~3.1.2:
+anymatch@^3.0.0, anymatch@^3.0.3, anymatch@~3.1.1, anymatch@~3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.2.tgz#c0557c096af32f106198f4f4e2a383537e378716"
   dependencies:
@@ -5992,15 +6006,15 @@ ccount@^1.0.0:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/ccount/-/ccount-1.0.5.tgz#ac82a944905a65ce204eb03023157edf29425c17"
 
-chai@4.2.0:
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/chai/-/chai-4.2.0.tgz#760aa72cf20e3795e84b12877ce0e83737aa29e5"
+chai@4.3.4:
+  version "4.3.4"
+  resolved "https://registry.yarnpkg.com/chai/-/chai-4.3.4.tgz#b55e655b31e1eac7099be4c08c21964fce2e6c49"
   dependencies:
     assertion-error "^1.1.0"
     check-error "^1.0.2"
     deep-eql "^3.0.1"
     get-func-name "^2.0.0"
-    pathval "^1.1.0"
+    pathval "^1.1.1"
     type-detect "^4.0.5"
 
 chalk@2.4.2, chalk@^2.0.0, chalk@^2.3.2, chalk@^2.4.1, chalk@^2.4.2:
@@ -6025,6 +6039,16 @@ chalk@4.1.2:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
+chalk@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
+  dependencies:
+    ansi-styles "^2.2.1"
+    escape-string-regexp "^1.0.2"
+    has-ansi "^2.0.0"
+    strip-ansi "^3.0.0"
+    supports-color "^2.0.0"
+
 chalk@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-3.0.0.tgz#3f73c2bf526591f574cc492c51e2456349f844e4"
@@ -6056,28 +6080,14 @@ chardet@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
 
-check-disk-space@3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/check-disk-space/-/check-disk-space-3.1.0.tgz#3a90e0b27533e06ddcfafd93b749f2514fc12d90"
+check-disk-space@3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/check-disk-space/-/check-disk-space-3.2.0.tgz#a65b44f7cad3fbe985499ba28284bf6ab253ee53"
 
 check-error@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/check-error/-/check-error-1.0.2.tgz#574d312edd88bb5dd8912e9286dd6c0aed4aac82"
 
-"chokidar@>=3.0.0 <4.0.0", chokidar@^3.4.1, chokidar@^3.4.2, chokidar@^3.5.0, chokidar@^3.5.2:
-  version "3.5.2"
-  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.2.tgz#dba3976fcadb016f66fd365021d91600d01c1e75"
-  dependencies:
-    anymatch "~3.1.2"
-    braces "~3.0.2"
-    glob-parent "~5.1.2"
-    is-binary-path "~2.1.0"
-    is-glob "~4.0.1"
-    normalize-path "~3.0.0"
-    readdirp "~3.6.0"
-  optionalDependencies:
-    fsevents "~2.3.2"
-
 chokidar@^2.0.0, chokidar@^2.1.8:
   version "2.1.8"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.1.8.tgz#804b3a7b6a99358c3c5c61e71d8728f041cff917"
@@ -6096,6 +6106,48 @@ chokidar@^2.0.0, chokidar@^2.1.8:
   optionalDependencies:
     fsevents "^1.2.7"
 
+chokidar@^3.3.0:
+  version "3.5.3"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd"
+  dependencies:
+    anymatch "~3.1.2"
+    braces "~3.0.2"
+    glob-parent "~5.1.2"
+    is-binary-path "~2.1.0"
+    is-glob "~4.0.1"
+    normalize-path "~3.0.0"
+    readdirp "~3.6.0"
+  optionalDependencies:
+    fsevents "~2.3.2"
+
+chokidar@^3.4.1:
+  version "3.4.2"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.2.tgz#38dc8e658dec3809741eb3ef7bb0a47fe424232d"
+  dependencies:
+    anymatch "~3.1.1"
+    braces "~3.0.2"
+    glob-parent "~5.1.0"
+    is-binary-path "~2.1.0"
+    is-glob "~4.0.1"
+    normalize-path "~3.0.0"
+    readdirp "~3.4.0"
+  optionalDependencies:
+    fsevents "~2.1.2"
+
+chokidar@^3.4.2, chokidar@^3.5.0, chokidar@^3.5.2:
+  version "3.5.2"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.2.tgz#dba3976fcadb016f66fd365021d91600d01c1e75"
+  dependencies:
+    anymatch "~3.1.2"
+    braces "~3.0.2"
+    glob-parent "~5.1.2"
+    is-binary-path "~2.1.0"
+    is-glob "~4.0.1"
+    normalize-path "~3.0.0"
+    readdirp "~3.6.0"
+  optionalDependencies:
+    fsevents "~2.3.2"
+
 chownr@^1.1.1:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.4.tgz#6fc9d7b42d32a583596337666e7d08084da2cc6b"
@@ -6240,6 +6292,15 @@ clone-buffer@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/clone-buffer/-/clone-buffer-1.0.0.tgz#e3e25b207ac4e701af721e2cb5a16792cac3dc58"
 
+clone-deep@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/clone-deep/-/clone-deep-2.0.2.tgz#00db3a1e173656730d1188c3d6aced6d7ea97713"
+  dependencies:
+    for-own "^1.0.0"
+    is-plain-object "^2.0.4"
+    kind-of "^6.0.0"
+    shallow-clone "^1.0.0"
+
 clone-deep@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/clone-deep/-/clone-deep-4.0.1.tgz#c19fd9bdbbf85942b4fd979c84dcf7d5f07c2387"
@@ -6475,12 +6536,12 @@ concurrently@5.3.0:
     tree-kill "^1.2.2"
     yargs "^13.3.0"
 
-conf@^10.0.0:
-  version "10.0.1"
-  resolved "https://registry.yarnpkg.com/conf/-/conf-10.0.1.tgz#038093e5cbddc0e59bc14f63382c4ce732a4781d"
+conf@^10.0.3:
+  version "10.1.1"
+  resolved "https://registry.yarnpkg.com/conf/-/conf-10.1.1.tgz#ff08046d5aeeee0eaff55d57f5b4319193c3dfda"
   dependencies:
-    ajv "^8.1.0"
-    ajv-formats "^2.0.2"
+    ajv "^8.6.3"
+    ajv-formats "^2.1.1"
     atomically "^1.7.0"
     debounce-fn "^4.0.0"
     dot-prop "^6.0.1"
@@ -6851,6 +6912,17 @@ css-loader@^5.0.1:
     schema-utils "^3.0.0"
     semver "^7.3.5"
 
+css-modules-loader-core@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz#5908668294a1becd261ae0a4ce21b0b551f21d16"
+  dependencies:
+    icss-replace-symbols "1.1.0"
+    postcss "6.0.1"
+    postcss-modules-extract-imports "1.1.0"
+    postcss-modules-local-by-default "1.2.0"
+    postcss-modules-scope "1.1.0"
+    postcss-modules-values "1.3.0"
+
 css-select@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/css-select/-/css-select-1.2.0.tgz#2b3a110539c5355f1cd8d314623e870b121ec858"
@@ -6870,6 +6942,13 @@ css-select@^4.1.3:
     domutils "^2.6.0"
     nth-check "^2.0.0"
 
+css-selector-tokenizer@^0.7.0:
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/css-selector-tokenizer/-/css-selector-tokenizer-0.7.3.tgz#735f26186e67c749aaf275783405cf0661fae8f1"
+  dependencies:
+    cssesc "^3.0.0"
+    fastparse "^1.1.2"
+
 css-value@^0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/css-value/-/css-value-0.0.1.tgz#5efd6c2eea5ea1fd6b6ac57ec0427b18452424ea"
@@ -7725,11 +7804,11 @@ electron-reloader@1.2.1:
     electron-is-dev "^1.2.0"
     find-up "^5.0.0"
 
-electron-store@8.0.0:
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/electron-store/-/electron-store-8.0.0.tgz#81a4e687958e2dae1c5c84cc099a8148be776337"
+electron-store@8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/electron-store/-/electron-store-8.0.1.tgz#9b598c1d2edeffebee9d8c1cd957ad368c528925"
   dependencies:
-    conf "^10.0.0"
+    conf "^10.0.3"
     type-fest "^1.0.2"
 
 electron-to-chromium@^1.3.564, electron-to-chromium@^1.4.17:
@@ -8317,8 +8396,8 @@ eslint-visitor-keys@^2.0.0, eslint-visitor-keys@^2.1.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303"
 
 eslint-visitor-keys@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.1.0.tgz#eee4acea891814cda67a7d8812d9647dd0179af2"
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.2.0.tgz#6fbb166a6798ee5991358bc2daa1ba76cc1254a1"
 
 eslint@7.32.0:
   version "7.32.0"
@@ -8712,6 +8791,16 @@ fast-glob@^3.1.1, fast-glob@^3.2.4:
     micromatch "^4.0.2"
     picomatch "^2.2.1"
 
+fast-glob@^3.2.9:
+  version "3.2.11"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.11.tgz#a1172ad95ceb8a16e20caa5c5e56480e5129c1d9"
+  dependencies:
+    "@nodelib/fs.stat" "^2.0.2"
+    "@nodelib/fs.walk" "^1.2.3"
+    glob-parent "^5.1.2"
+    merge2 "^1.3.0"
+    micromatch "^4.0.4"
+
 fast-json-parse@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/fast-json-parse/-/fast-json-parse-1.0.3.tgz#43e5c61ee4efa9265633046b770fb682a7577c4d"
@@ -8736,6 +8825,10 @@ fastest-levenshtein@^1.0.12:
   version "1.0.12"
   resolved "https://registry.yarnpkg.com/fastest-levenshtein/-/fastest-levenshtein-1.0.12.tgz#9990f7d3a88cc5a9ffd1f1745745251700d497e2"
 
+fastparse@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.2.tgz#91728c5a5942eced8531283c79441ee4122c35a9"
+
 fastq@^1.6.0:
   version "1.8.0"
   resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.8.0.tgz#550e1f9f59bbc65fe185cb6a9b4d95357107f481"
@@ -8872,9 +8965,11 @@ fill-range@^7.0.1:
   dependencies:
     to-regex-range "^5.0.1"
 
-filter-react-dom-props@0.0.2:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/filter-react-dom-props/-/filter-react-dom-props-0.0.2.tgz#d5c1e5a89c13534cebe3930a22afa9ae3238813b"
+filter-invalid-dom-props@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/filter-invalid-dom-props/-/filter-invalid-dom-props-2.1.0.tgz#7690bb72e9213a09e8429c07f3aea21468f43ee5"
+  dependencies:
+    html-attributes "1.1.0"
 
 finalhandler@~1.1.2:
   version "1.1.2"
@@ -8912,9 +9007,9 @@ find-cache-dir@^3.0.0, find-cache-dir@^3.3.1:
     make-dir "^3.0.2"
     pkg-dir "^4.1.0"
 
-find-process@1.4.4:
-  version "1.4.4"
-  resolved "https://registry.yarnpkg.com/find-process/-/find-process-1.4.4.tgz#52820561162fda0d1feef9aed5d56b3787f0fd6e"
+find-process@1.4.7:
+  version "1.4.7"
+  resolved "https://registry.yarnpkg.com/find-process/-/find-process-1.4.7.tgz#8c76962259216c381ef1099371465b5b439ea121"
   dependencies:
     chalk "^4.0.0"
     commander "^5.1.0"
@@ -9073,6 +9168,10 @@ fontkit@^1.0.0:
     unicode-properties "^1.2.2"
     unicode-trie "^0.3.0"
 
+for-in@^0.1.3:
+  version "0.1.8"
+  resolved "https://registry.yarnpkg.com/for-in/-/for-in-0.1.8.tgz#d8773908e31256109952b1fdb9b3fa867d2775e1"
+
 for-in@^1.0.1, for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
@@ -9267,6 +9366,10 @@ fsevents@^2.1.2, fsevents@^2.3.2, fsevents@~2.3.2:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
 
+fsevents@~2.1.2:
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.1.3.tgz#fb738703ae8d2f9fe900c33836ddebee8b97f23e"
+
 function-bind@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
@@ -9287,6 +9390,10 @@ functions-have-names@^1.2.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/functions-have-names/-/functions-have-names-1.2.1.tgz#a981ac397fa0c9964551402cdc5533d7a4d52f91"
 
+fuse.js@6.5.3:
+  version "6.5.3"
+  resolved "https://registry.yarnpkg.com/fuse.js/-/fuse.js-6.5.3.tgz#7446c0acbc4ab0ab36fa602e97499bdb69452b93"
+
 fuse.js@^3.6.1:
   version "3.6.1"
   resolved "https://registry.yarnpkg.com/fuse.js/-/fuse.js-3.6.1.tgz#7de85fdd6e1b3377c23ce010892656385fd9b10c"
@@ -9443,7 +9550,7 @@ glob-parent@^5.1.0:
   dependencies:
     is-glob "^4.0.1"
 
-glob-parent@^5.1.2, glob-parent@~5.1.2:
+glob-parent@^5.1.2, glob-parent@~5.1.0, glob-parent@~5.1.2:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4"
   dependencies:
@@ -9594,7 +9701,7 @@ globby@11.0.1, globby@^11.0.1:
     merge2 "^1.3.0"
     slash "^3.0.0"
 
-globby@^11.0.2, globby@^11.0.4:
+globby@^11.0.2:
   version "11.0.4"
   resolved "https://registry.yarnpkg.com/globby/-/globby-11.0.4.tgz#2cbaff77c2f2a62e71e9b2813a67b97a3a3001a5"
   dependencies:
@@ -9605,6 +9712,17 @@ globby@^11.0.2, globby@^11.0.4:
     merge2 "^1.3.0"
     slash "^3.0.0"
 
+globby@^11.0.4:
+  version "11.1.0"
+  resolved "https://registry.yarnpkg.com/globby/-/globby-11.1.0.tgz#bd4be98bb042f83d796f7e3811991fbe82a0d34b"
+  dependencies:
+    array-union "^2.1.0"
+    dir-glob "^3.0.1"
+    fast-glob "^3.2.9"
+    ignore "^5.2.0"
+    merge2 "^1.4.1"
+    slash "^3.0.0"
+
 globby@^6.1.0:
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/globby/-/globby-6.1.0.tgz#f5a6d70e8395e21c858fb0489d64df02424d506c"
@@ -9780,10 +9898,20 @@ harmony-reflect@^1.4.6:
   version "1.6.2"
   resolved "https://registry.yarnpkg.com/harmony-reflect/-/harmony-reflect-1.6.2.tgz#31ecbd32e648a34d030d86adb67d4d47547fe710"
 
+has-ansi@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
+  dependencies:
+    ansi-regex "^2.0.0"
+
 has-bigints@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
 
+has-flag@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-1.0.0.tgz#9d9e793165ce017a00f00418c43f942a7b1d11fa"
+
 has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
@@ -9943,6 +10071,10 @@ he@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
 
+highlight-words@1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/highlight-words/-/highlight-words-1.2.0.tgz#af52bc7fb767d0306012948f0bdd8b4185d73de6"
+
 highlight.js@^10.1.1, highlight.js@~10.2.0:
   version "10.2.1"
   resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-10.2.1.tgz#09784fe2e95612abbefd510948945d4fe6fa9668"
@@ -10011,6 +10143,10 @@ hpack.js@^2.1.6:
     readable-stream "^2.0.1"
     wbuf "^1.1.0"
 
+html-attributes@1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/html-attributes/-/html-attributes-1.1.0.tgz#82027a4fac7a6070ea6c18cc3886aea18d6dea09"
+
 html-encoding-sniffer@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-2.0.1.tgz#42a6dc4fd33f00281176e8b23759ca4e4fa185f3"
@@ -10262,7 +10398,7 @@ iconv-lite@^0.6.2:
   dependencies:
     safer-buffer ">= 2.1.2 < 3.0.0"
 
-icss-replace-symbols@^1.1.0:
+icss-replace-symbols@1.1.0, icss-replace-symbols@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz#06ea6f83679a7749e386cfe1fe812ae5db223ded"
 
@@ -10306,6 +10442,10 @@ ignore@^5.1.4, ignore@^5.1.8:
   version "5.1.8"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57"
 
+ignore@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.0.tgz#6d3bac8fa7fe0d45d9f9be7bac2fc279577e345a"
+
 immediate@~3.0.5:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
@@ -10314,10 +10454,6 @@ immer@8.0.1:
   version "8.0.1"
   resolved "https://registry.yarnpkg.com/immer/-/immer-8.0.1.tgz#9c73db683e2b3975c424fb0572af5889877ae656"
 
-immutable@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.0.0.tgz#b86f78de6adef3608395efb269a91462797e2c23"
-
 import-fresh@^3.0.0, import-fresh@^3.1.0, import-fresh@^3.2.1:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.2.1.tgz#633ff618506e793af5ac91bf48b72677e15cbe66"
@@ -11916,7 +12052,39 @@ loader-utils@2.0.0, loader-utils@^2.0.0:
     emojis-list "^3.0.0"
     json5 "^2.1.2"
 
-loader-utils@^1.0.2, loader-utils@^1.1.0, loader-utils@^1.2.3, loader-utils@^1.4.0:
+loader-utils@^1.0.1:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^3.0.0"
+    json5 "^1.0.1"
+
+loader-utils@^1.0.2:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^3.0.0"
+    json5 "^1.0.1"
+
+loader-utils@^1.1.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^3.0.0"
+    json5 "^1.0.1"
+
+loader-utils@^1.2.3:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^3.0.0"
+    json5 "^1.0.1"
+
+loader-utils@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
   dependencies:
@@ -12010,6 +12178,10 @@ lodash.merge@^4.6.1, lodash.merge@^4.6.2:
   version "4.6.2"
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
 
+lodash.tail@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/lodash.tail/-/lodash.tail-4.1.1.tgz#d2333a36d9e7717c8ad2f7cacafec7c32b444664"
+
 lodash.template@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-4.5.0.tgz#f976195cf3f347d0d5f52483569fe8031ccce8ab"
@@ -12400,7 +12572,7 @@ merge-stream@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
 
-merge2@^1.2.3, merge2@^1.3.0:
+merge2@^1.2.3, merge2@^1.3.0, merge2@^1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
 
@@ -12590,6 +12762,13 @@ mixin-deep@^1.2.0:
     for-in "^1.0.2"
     is-extendable "^1.0.1"
 
+mixin-object@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/mixin-object/-/mixin-object-2.0.1.tgz#4fb949441dab182540f1fe035ba60e1947a5e57e"
+  dependencies:
+    for-in "^0.1.3"
+    is-extendable "^0.1.1"
+
 mkdirp-classic@^0.5.2, mkdirp-classic@^0.5.3:
   version "0.5.3"
   resolved "https://registry.yarnpkg.com/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz#fa10c9115cc6d8865be221ba47ee9bed78601113"
@@ -12712,6 +12891,10 @@ nanoassert@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/nanoassert/-/nanoassert-1.1.0.tgz#4f3152e09540fde28c76f44b19bbcd1d5a42478d"
 
+nanoid@3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.2.0.tgz#62667522da6673971cca916a6d3eff3f415ff80c"
+
 nanoid@^3.1.23, nanoid@^3.1.30:
   version "3.1.30"
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.30.tgz#63f93cc548d2a113dc5dfbc63bfa09e2b9b64362"
@@ -12848,7 +13031,11 @@ node-fetch@^1.0.1:
     encoding "^0.1.11"
     is-stream "^1.0.1"
 
-node-forge@0.10.0, node-forge@^0.10.0:
+node-forge@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-1.0.0.tgz#a025e3beeeb90d9cee37dae34d25b968ec3e6f15"
+
+node-forge@^0.10.0:
   version "0.10.0"
   resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.10.0.tgz#32dea2afb3e9926f02ee5ce8794902691a676bf3"
 
@@ -13501,6 +13688,13 @@ parallel-transform@^1.1.0:
     inherits "^2.0.3"
     readable-stream "^2.1.5"
 
+param-case@^3.0.2, param-case@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.4.tgz#7d17fe4aa12bde34d4a77d91acfb6219caad01c5"
+  dependencies:
+    dot-case "^3.0.4"
+    tslib "^2.0.3"
+
 param-case@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.3.tgz#4be41f8399eff621c56eebb829a5e451d9801238"
@@ -13508,13 +13702,6 @@ param-case@^3.0.3:
     dot-case "^3.0.3"
     tslib "^1.10.0"
 
-param-case@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.4.tgz#7d17fe4aa12bde34d4a77d91acfb6219caad01c5"
-  dependencies:
-    dot-case "^3.0.4"
-    tslib "^2.0.3"
-
 parent-module@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
@@ -13717,9 +13904,16 @@ path-type@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
 
-pathval@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.0.tgz#b942e6d4bde653005ef6b71361def8727d0645e0"
+path@^0.12.7:
+  version "0.12.7"
+  resolved "https://registry.yarnpkg.com/path/-/path-0.12.7.tgz#d4dc2a506c4ce2197eb481ebfcd5b36c0140b10f"
+  dependencies:
+    process "^0.11.1"
+    util "^0.10.3"
+
+pathval@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.1.tgz#8534e77a77ce7ac5a2512ea21e0fdb8fcf6c3d8d"
 
 pbkdf2@3.1.2, pbkdf2@^3.0.17, pbkdf2@^3.0.3, pbkdf2@^3.0.9:
   version "3.1.2"
@@ -13759,7 +13953,11 @@ picomatch@^2.0.4, picomatch@^2.2.1:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
 
-picomatch@^2.2.3, picomatch@^2.3.0:
+picomatch@^2.2.3:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
+
+picomatch@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.0.tgz#f1f061de8f6a4bf022892e2d128234fb98302972"
 
@@ -13920,6 +14118,12 @@ postcss-media-query-parser@^0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244"
 
+postcss-modules-extract-imports@1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz#b614c9720be6816eaee35fb3a5faa1dba6a05ddb"
+  dependencies:
+    postcss "^6.0.1"
+
 postcss-modules-extract-imports@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-2.0.0.tgz#818719a1ae1da325f9832446b01136eeb493cd7e"
@@ -13930,6 +14134,13 @@ postcss-modules-extract-imports@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d"
 
+postcss-modules-local-by-default@1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz#f7d80c398c5a393fa7964466bd19500a7d61c069"
+  dependencies:
+    css-selector-tokenizer "^0.7.0"
+    postcss "^6.0.1"
+
 postcss-modules-local-by-default@^3.0.2:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-3.0.3.tgz#bb14e0cc78279d504dbdcbfd7e0ca28993ffbbb0"
@@ -13947,6 +14158,13 @@ postcss-modules-local-by-default@^4.0.0:
     postcss-selector-parser "^6.0.2"
     postcss-value-parser "^4.1.0"
 
+postcss-modules-scope@1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz#d6ea64994c79f97b62a72b426fbe6056a194bb90"
+  dependencies:
+    css-selector-tokenizer "^0.7.0"
+    postcss "^6.0.1"
+
 postcss-modules-scope@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-2.2.0.tgz#385cae013cc7743f5a7d7602d1073a89eaae62ee"
@@ -13960,6 +14178,13 @@ postcss-modules-scope@^3.0.0:
   dependencies:
     postcss-selector-parser "^6.0.4"
 
+postcss-modules-values@1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz#ecffa9d7e192518389f42ad0e83f72aec456ea20"
+  dependencies:
+    icss-replace-symbols "^1.1.0"
+    postcss "^6.0.1"
+
 postcss-modules-values@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-values/-/postcss-modules-values-3.0.0.tgz#5b5000d6ebae29b4255301b4a3a54574423e7f10"
@@ -14046,6 +14271,14 @@ postcss-value-parser@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.1.0.tgz#443f6a20ced6481a2bda4fa8532a6e55d789a2cb"
 
+postcss@6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.1.tgz#000dbd1f8eef217aa368b9a212c5fc40b2a8f3f2"
+  dependencies:
+    chalk "^1.1.3"
+    source-map "^0.5.6"
+    supports-color "^3.2.3"
+
 postcss@8.3.6:
   version "8.3.6"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.3.6.tgz#2730dd76a97969f37f53b9a6096197be311cc4ea"
@@ -14054,6 +14287,14 @@ postcss@8.3.6:
     nanoid "^3.1.23"
     source-map-js "^0.6.2"
 
+postcss@^6.0.1:
+  version "6.0.23"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
+  dependencies:
+    chalk "^2.4.1"
+    source-map "^0.6.1"
+    supports-color "^5.4.0"
+
 postcss@^7.0.14, postcss@^7.0.17, postcss@^7.0.2, postcss@^7.0.21, postcss@^7.0.26, postcss@^7.0.31, postcss@^7.0.32, postcss@^7.0.5, postcss@^7.0.6:
   version "7.0.35"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.35.tgz#d2be00b998f7f211d8a276974079f2e92b970e24"
@@ -14215,7 +14456,7 @@ process-nextick-args@^2.0.0, process-nextick-args@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
 
-process@0.11.10, process@^0.11.10:
+process@0.11.10, process@^0.11.1, process@^0.11.10:
   version "0.11.10"
   resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182"
 
@@ -14773,14 +15014,15 @@ react-modal@3.1.12:
     prop-types "^15.5.10"
     warning "^3.0.0"
 
-react-polymorph@1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/react-polymorph/-/react-polymorph-1.0.1.tgz#94e664e173b3b4a32c13953291e92fa34a05c8a7"
+react-polymorph@1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/react-polymorph/-/react-polymorph-1.0.3.tgz#d1eb5f7781b640fb749c1d637dffc70440dfefd7"
   dependencies:
     "@tippyjs/react" "4.2.1"
     create-react-context "0.2.2"
     fast-password-entropy "1.1.1"
-    filter-react-dom-props "0.0.2"
+    filter-invalid-dom-props "2.1.0"
+    html-attributes "1.1.0"
     popper.js "1.16.1"
     react-modal "3.1.12"
     react-scrollbars-custom "4.0.21"
@@ -15072,6 +15314,12 @@ readdirp@^2.2.1:
     micromatch "^3.1.10"
     readable-stream "^2.0.2"
 
+readdirp@~3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.4.0.tgz#9fdccdf9e9155805449221ac645e8303ab5b9ada"
+  dependencies:
+    picomatch "^2.2.1"
+
 readdirp@~3.6.0:
   version "3.6.0"
   resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7"
@@ -15477,6 +15725,10 @@ requires-port@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
 
+reserved-words@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/reserved-words/-/reserved-words-0.1.2.tgz#00a0940f98cd501aeaaac316411d9adc52b31ab1"
+
 resize-observer-polyfill@^1.5.0, resize-observer-polyfill@^1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"
@@ -15891,7 +16143,7 @@ semver@7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e"
 
-semver@7.3.5, semver@^7.1.3, semver@^7.2.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5:
+semver@7.3.5, semver@^7.1.3, semver@^7.3.4, semver@^7.3.5:
   version "7.3.5"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
   dependencies:
@@ -15901,6 +16153,10 @@ semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.2.0, semver@^6.3.0:
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
 
+semver@^7.2.1, semver@^7.3.2:
+  version "7.3.2"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.2.tgz#604962b052b81ed0786aae84389ffba70ffd3938"
+
 send@0.17.1:
   version "0.17.1"
   resolved "https://registry.yarnpkg.com/send/-/send-0.17.1.tgz#c1d8b059f7900f7466dd4938bdc44e11ddb376c8"
@@ -16022,6 +16278,14 @@ sha.js@^2.4.0, sha.js@^2.4.8, sha.js@~2.4.4:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
+shallow-clone@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-1.0.0.tgz#4480cd06e882ef68b2ad88a3ea54832e2c48b571"
+  dependencies:
+    is-extendable "^0.1.1"
+    kind-of "^5.0.0"
+    mixin-object "^2.0.1"
+
 shallow-clone@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-3.0.1.tgz#8f2981ad92531f55035b01fb230769a40e02efa3"
@@ -16832,6 +17096,16 @@ sumchecker@^3.0.1:
   dependencies:
     debug "^4.1.0"
 
+supports-color@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
+
+supports-color@^3.2.3:
+  version "3.2.3"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
+  dependencies:
+    has-flag "^1.0.0"
+
 supports-color@^5.3.0, supports-color@^5.5.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
@@ -16870,7 +17144,7 @@ sver-compat@^1.5.0:
     es6-iterator "^2.0.1"
     es6-symbol "^3.1.1"
 
-svg-inline-loader@^0.8.2:
+svg-inline-loader@0.8.2:
   version "0.8.2"
   resolved "https://registry.yarnpkg.com/svg-inline-loader/-/svg-inline-loader-0.8.2.tgz#9872414f9e4141601e04eb80cda748c9a50dae71"
   dependencies:
@@ -16916,6 +17190,10 @@ table@^6.0.9:
     string-width "^4.2.3"
     strip-ansi "^6.0.1"
 
+tail@2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/tail/-/tail-2.2.4.tgz#90dd4c5a174a3fa39dcb65a1df1950a4a0093a41"
+
 tapable@^0.1.8:
   version "0.1.10"
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-0.1.10.tgz#29c35707c2b70e50d07482b5d202e8ed446dafd4"
@@ -17524,6 +17802,21 @@ type@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/type/-/type-2.1.0.tgz#9bdc22c648cf8cf86dd23d32336a41cfb6475e3f"
 
+typed-scss-modules@5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/typed-scss-modules/-/typed-scss-modules-5.0.0.tgz#23ecaf2c6e2ab49e65a08f68f58b3ce5b6b120f1"
+  dependencies:
+    camelcase "^5.0.0"
+    chalk "^3.0.0"
+    chokidar "^3.3.0"
+    css-modules-loader-core "^1.1.0"
+    glob "^7.1.6"
+    param-case "^3.0.2"
+    path "^0.12.7"
+    reserved-words "^0.1.2"
+    slash "^3.0.0"
+    yargs "^15.0.2"
+
 typedarray-to-buffer@^3.1.5:
   version "3.1.5"
   resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080"
@@ -17968,6 +18261,12 @@ util@0.12.4:
     safe-buffer "^5.1.2"
     which-typed-array "^1.1.2"
 
+util@^0.10.3:
+  version "0.10.4"
+  resolved "https://registry.yarnpkg.com/util/-/util-0.10.4.tgz#3aa0125bfe668a4672de58857d3ace27ecb76901"
+  dependencies:
+    inherits "2.0.3"
+
 util@^0.11.0:
   version "0.11.1"
   resolved "https://registry.yarnpkg.com/util/-/util-0.11.1.tgz#3236733720ec64bb27f6e26f421aaa2e1b588d61"
@@ -18763,7 +19062,7 @@ yargs@^13.3.0:
     y18n "^4.0.0"
     yargs-parser "^13.1.2"
 
-yargs@^15.4.1:
+yargs@^15.0.2, yargs@^15.4.1:
   version "15.4.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-15.4.1.tgz#0d87a16de01aee9d8bec2bfbf74f67851730f4f8"
   dependencies:
@@ -18780,8 +19079,8 @@ yargs@^15.4.1:
     yargs-parser "^18.1.2"
 
 yargs@^7.1.0:
-  version "7.1.2"
-  resolved "https://registry.yarnpkg.com/yargs/-/yargs-7.1.2.tgz#63a0a5d42143879fdbb30370741374e0641d55db"
+  version "7.1.1"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-7.1.1.tgz#67f0ef52e228d4ee0d6311acede8850f53464df6"
   dependencies:
     camelcase "^3.0.0"
     cliui "^3.2.0"
@@ -18795,7 +19094,7 @@ yargs@^7.1.0:
     string-width "^1.0.2"
     which-module "^1.0.0"
     y18n "^3.2.1"
-    yargs-parser "^5.0.1"
+    yargs-parser "5.0.0-security.0"
 
 yarn-lockfile@1.1.1:
   version "1.1.1"