diff --git a/angular.json b/angular.json
index 92e612d..f916d4f 100644
--- a/angular.json
+++ b/angular.json
@@ -7,7 +7,8 @@
       "projectType": "application",
       "schematics": {
         "@schematics/angular:component": {
-          "style": "scss"
+          "style": "scss",
+          "changeDetection": "OnPush"
         }
       },
       "root": "",
diff --git a/package-lock.json b/package-lock.json
index e446ed9..af9f01a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -32,6 +32,7 @@
         "mocha": "^8.2.1",
         "moolb": "^0.1.0",
         "ng2-charts": "^2.4.2",
+        "ngx-logger": "^4.2.1",
         "openpgp": "^4.10.10",
         "popper.js": "^1.16.1",
         "rxjs": "~6.6.0",
@@ -307,18 +308,36 @@
       "dev": true
     },
     "node_modules/@angular-devkit/schematics": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-10.2.0.tgz",
-      "integrity": "sha512-TQI5NnE6iM3ChF5gZQ9qb+lZgMWa7aLoF5ksOyT3zrmOuICiQYJhA6SsjV95q7J4M55qYymwBib8KTqU/xuQww==",
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-10.2.3.tgz",
+      "integrity": "sha512-uCNeq5qH4QEiftgOud+EhTVvdriYQVBrYmX4f4BjVHkjnFhm73h30nfAgs6YuStIp8oxSI8jUGE9DAy331xvmA==",
       "dev": true,
       "dependencies": {
-        "@angular-devkit/core": "10.2.0",
+        "@angular-devkit/core": "10.2.3",
         "ora": "5.0.0",
         "rxjs": "6.6.2"
       },
       "engines": {
         "node": ">= 10.13.0",
-        "npm": ">= 6.11.0",
+        "npm": "^6.11.0 || ^7.5.6",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular-devkit/schematics/node_modules/@angular-devkit/core": {
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+      "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+      "dev": true,
+      "dependencies": {
+        "ajv": "6.12.4",
+        "fast-json-stable-stringify": "2.1.0",
+        "magic-string": "0.25.7",
+        "rxjs": "6.6.2",
+        "source-map": "0.7.3"
+      },
+      "engines": {
+        "node": ">= 10.13.0",
+        "npm": "^6.11.0 || ^7.5.6",
         "yarn": ">= 1.13.0"
       }
     },
@@ -366,21 +385,21 @@
       "optional": true
     },
     "node_modules/@angular/cli": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-10.2.0.tgz",
-      "integrity": "sha512-YBzwkFBmG6CdUJk8onsPXxHX/ByU5MERBQgYhLC873e2nZlXMUu+Ttq2Wai6apyskGvsXKxZNPOQSFZTGKXzXg==",
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-10.2.3.tgz",
+      "integrity": "sha512-LLt0AUgLpmaoWA1R7tnUxbJDNs37+WogjNCbNLfvf4YHI04PwKx3OXgx0d8IYNtjHEaGmGp9AQRynvQ2qfXkaA==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
-        "@angular-devkit/architect": "0.1002.0",
-        "@angular-devkit/core": "10.2.0",
-        "@angular-devkit/schematics": "10.2.0",
-        "@schematics/angular": "10.2.0",
-        "@schematics/update": "0.1002.0",
+        "@angular-devkit/architect": "0.1002.3",
+        "@angular-devkit/core": "10.2.3",
+        "@angular-devkit/schematics": "10.2.3",
+        "@schematics/angular": "10.2.3",
+        "@schematics/update": "0.1002.3",
         "@yarnpkg/lockfile": "1.1.0",
         "ansi-colors": "4.1.1",
         "debug": "4.1.1",
-        "ini": "1.3.5",
+        "ini": "1.3.6",
         "inquirer": "7.3.3",
         "npm-package-arg": "8.0.1",
         "npm-pick-manifest": "6.1.0",
@@ -398,7 +417,40 @@
       },
       "engines": {
         "node": ">= 10.13.0",
-        "npm": ">= 6.11.0",
+        "npm": "^6.11.0 || ^7.5.6",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular/cli/node_modules/@angular-devkit/architect": {
+      "version": "0.1002.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1002.3.tgz",
+      "integrity": "sha512-7ainXRNO1njZ6bBbJXGpMzCh0OYrzuIRe/+zRj0ncV1YfEsJb2yWBuiza0+y2Ljco7hdd4wr+7eJm7cfn+NvAw==",
+      "dev": true,
+      "dependencies": {
+        "@angular-devkit/core": "10.2.3",
+        "rxjs": "6.6.2"
+      },
+      "engines": {
+        "node": ">= 10.13.0",
+        "npm": "^6.11.0 || ^7.5.6",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular/cli/node_modules/@angular-devkit/core": {
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+      "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+      "dev": true,
+      "dependencies": {
+        "ajv": "6.12.4",
+        "fast-json-stable-stringify": "2.1.0",
+        "magic-string": "0.25.7",
+        "rxjs": "6.6.2",
+        "source-map": "0.7.3"
+      },
+      "engines": {
+        "node": ">= 10.13.0",
+        "npm": "^6.11.0 || ^7.5.6",
         "yarn": ">= 1.13.0"
       }
     },
@@ -421,14 +473,32 @@
       }
     },
     "node_modules/@angular/cli/node_modules/ini": {
-      "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-      "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.6.tgz",
+      "integrity": "sha512-IZUoxEjNjubzrmvzZU4lKP7OnYmX72XRl3sqkfJhBKweKi5rnGi5+IUdlj/H1M+Ip5JQ1WzaDMOBRY90Ajc5jg==",
       "dev": true,
       "engines": {
         "node": "*"
       }
     },
+    "node_modules/@angular/cli/node_modules/rxjs": {
+      "version": "6.6.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+      "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+      "dev": true,
+      "dependencies": {
+        "tslib": "^1.9.0"
+      },
+      "engines": {
+        "npm": ">=2.0.0"
+      }
+    },
+    "node_modules/@angular/cli/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+      "dev": true
+    },
     "node_modules/@angular/cli/node_modules/uuid": {
       "version": "8.3.0",
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.0.tgz",
@@ -2304,25 +2374,6 @@
         "elliptic": "6.5.4"
       }
     },
-    "node_modules/@ethersproject/signing-key/node_modules/bn.js": {
-      "version": "4.11.9",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.9.tgz",
-      "integrity": "sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw=="
-    },
-    "node_modules/@ethersproject/signing-key/node_modules/elliptic": {
-      "version": "6.5.4",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
-      "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
-      "dependencies": {
-        "bn.js": "^4.11.9",
-        "brorand": "^1.1.0",
-        "hash.js": "^1.0.0",
-        "hmac-drbg": "^1.0.1",
-        "inherits": "^2.0.4",
-        "minimalistic-assert": "^1.0.1",
-        "minimalistic-crypto-utils": "^1.0.1"
-      }
-    },
     "node_modules/@ethersproject/solidity": {
       "version": "5.0.9",
       "resolved": "https://registry.npmjs.org/@ethersproject/solidity/-/solidity-5.0.9.tgz",
@@ -2560,31 +2611,67 @@
       "integrity": "sha512-V3WyEc8ZyAuOQ2fpFuTuYYOd2tV4NePeSdxaHYgYAOs7ERLxlcFi2XsmgI5LJFdAUmJKXsg8jaIiVTkTHQygQw=="
     },
     "node_modules/@schematics/angular": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-10.2.0.tgz",
-      "integrity": "sha512-rJRTTTL8CMMFb3ebCvAVHKHxuNzRqy/HtbXhJ82l5Xo/jXcm74eV2Q0RBUrNo1yBKWFIR+FIwiXLJaGcC/R9Pw==",
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-10.2.3.tgz",
+      "integrity": "sha512-xcnfH5XMmGcs33VHm2cu0+4g3rkfSD+qpiKFjfg7KGC4lLoOKSED4ZnjzIYwcQ6QN4gTpAvlZKxI8zO7NkKv0A==",
       "dev": true,
       "dependencies": {
-        "@angular-devkit/core": "10.2.0",
-        "@angular-devkit/schematics": "10.2.0",
+        "@angular-devkit/core": "10.2.3",
+        "@angular-devkit/schematics": "10.2.3",
         "jsonc-parser": "2.3.0"
       },
       "engines": {
         "node": ">= 10.13.0",
-        "npm": ">= 6.11.0",
+        "npm": "^6.11.0 || ^7.5.6",
         "yarn": ">= 1.13.0"
       }
     },
-    "node_modules/@schematics/update": {
-      "version": "0.1002.0",
-      "resolved": "https://registry.npmjs.org/@schematics/update/-/update-0.1002.0.tgz",
-      "integrity": "sha512-g2bfJSAj3x/YL0GNhnHsDSQmO6DoxSnLxoFLqNN5+ukxK5jq7OZNDwMJGxZ3X6RcSMWKEkIKL/wlq9yhj2T/kw==",
+    "node_modules/@schematics/angular/node_modules/@angular-devkit/core": {
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+      "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
       "dev": true,
       "dependencies": {
-        "@angular-devkit/core": "10.2.0",
-        "@angular-devkit/schematics": "10.2.0",
+        "ajv": "6.12.4",
+        "fast-json-stable-stringify": "2.1.0",
+        "magic-string": "0.25.7",
+        "rxjs": "6.6.2",
+        "source-map": "0.7.3"
+      },
+      "engines": {
+        "node": ">= 10.13.0",
+        "npm": "^6.11.0 || ^7.5.6",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/rxjs": {
+      "version": "6.6.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+      "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+      "dev": true,
+      "dependencies": {
+        "tslib": "^1.9.0"
+      },
+      "engines": {
+        "npm": ">=2.0.0"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+      "dev": true
+    },
+    "node_modules/@schematics/update": {
+      "version": "0.1002.3",
+      "resolved": "https://registry.npmjs.org/@schematics/update/-/update-0.1002.3.tgz",
+      "integrity": "sha512-UnuMgRQtAOp/Pk9rSYW12medajXe9s5mW4a6foixC/B2UCFFlIAVbFBTiFpr69xbalfLlFcFx1MD+8/8njWtbQ==",
+      "dev": true,
+      "dependencies": {
+        "@angular-devkit/core": "10.2.3",
+        "@angular-devkit/schematics": "10.2.3",
         "@yarnpkg/lockfile": "1.1.0",
-        "ini": "1.3.5",
+        "ini": "1.3.6",
         "npm-package-arg": "^8.0.0",
         "pacote": "9.5.12",
         "semver": "7.3.2",
@@ -2592,19 +2679,55 @@
       },
       "engines": {
         "node": ">= 10.13.0",
-        "npm": ">= 6.11.0",
+        "npm": "^6.11.0 || ^7.5.6",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@schematics/update/node_modules/@angular-devkit/core": {
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+      "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+      "dev": true,
+      "dependencies": {
+        "ajv": "6.12.4",
+        "fast-json-stable-stringify": "2.1.0",
+        "magic-string": "0.25.7",
+        "rxjs": "6.6.2",
+        "source-map": "0.7.3"
+      },
+      "engines": {
+        "node": ">= 10.13.0",
+        "npm": "^6.11.0 || ^7.5.6",
         "yarn": ">= 1.13.0"
       }
     },
     "node_modules/@schematics/update/node_modules/ini": {
-      "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-      "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.6.tgz",
+      "integrity": "sha512-IZUoxEjNjubzrmvzZU4lKP7OnYmX72XRl3sqkfJhBKweKi5rnGi5+IUdlj/H1M+Ip5JQ1WzaDMOBRY90Ajc5jg==",
       "dev": true,
       "engines": {
         "node": "*"
       }
     },
+    "node_modules/@schematics/update/node_modules/rxjs": {
+      "version": "6.6.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+      "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+      "dev": true,
+      "dependencies": {
+        "tslib": "^1.9.0"
+      },
+      "engines": {
+        "npm": ">=2.0.0"
+      }
+    },
+    "node_modules/@schematics/update/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+      "dev": true
+    },
     "node_modules/@sindresorhus/is": {
       "version": "0.14.0",
       "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz",
@@ -6987,17 +7110,17 @@
       "integrity": "sha512-NB3DzrTzJFhWkUp+nl2KtUtoFzrfGXTir2S+BU4tXGyXH9vlluPuFpE3pTKeH7+PY460tHLjKzh6K2+TWwW+Ww=="
     },
     "node_modules/elliptic": {
-      "version": "6.5.3",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz",
-      "integrity": "sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==",
+      "version": "6.5.4",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
+      "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
       "dependencies": {
-        "bn.js": "^4.4.0",
-        "brorand": "^1.0.1",
+        "bn.js": "^4.11.9",
+        "brorand": "^1.1.0",
         "hash.js": "^1.0.0",
-        "hmac-drbg": "^1.0.0",
-        "inherits": "^2.0.1",
-        "minimalistic-assert": "^1.0.0",
-        "minimalistic-crypto-utils": "^1.0.0"
+        "hmac-drbg": "^1.0.1",
+        "inherits": "^2.0.4",
+        "minimalistic-assert": "^1.0.1",
+        "minimalistic-crypto-utils": "^1.0.1"
       }
     },
     "node_modules/elliptic/node_modules/bn.js": {
@@ -12413,6 +12536,25 @@
         "tslib": "^2.0.0"
       }
     },
+    "node_modules/ngx-logger": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/ngx-logger/-/ngx-logger-4.2.1.tgz",
+      "integrity": "sha512-Z4ZauhTXzTCITzZxCHgG/eM1Ad/3p9ZxRZQFbCskDOG2CS/LDe1nsTATU/K/IJv8jUDA9u3LJ1T+8Byb43OAKw==",
+      "dependencies": {
+        "tslib": "^1.9.0",
+        "vlq": "^1.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">6.0.0",
+        "@angular/core": ">6.0.0",
+        "rxjs": ">6.0.0"
+      }
+    },
+    "node_modules/ngx-logger/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
     "node_modules/nice-try": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
@@ -13240,6 +13382,9 @@
       },
       "engines": {
         "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/ora/node_modules/ansi-regex": {
@@ -13261,6 +13406,9 @@
       },
       "engines": {
         "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
     "node_modules/ora/node_modules/chalk": {
@@ -13274,6 +13422,9 @@
       },
       "engines": {
         "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
     "node_modules/ora/node_modules/color-convert": {
@@ -18585,6 +18736,11 @@
         "extsprintf": "^1.2.0"
       }
     },
+    "node_modules/vlq": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vlq/-/vlq-1.0.1.tgz",
+      "integrity": "sha512-gQpnTgkubC6hQgdIcRdYGDSDc+SaujOdyesZQMv6JlfQee/9Mp0Qhnys6WxDWvQnL5WZdT7o2Ul187aSt0Rq+w=="
+    },
     "node_modules/vm-browserify": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
@@ -20714,16 +20870,29 @@
       }
     },
     "@angular-devkit/schematics": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-10.2.0.tgz",
-      "integrity": "sha512-TQI5NnE6iM3ChF5gZQ9qb+lZgMWa7aLoF5ksOyT3zrmOuICiQYJhA6SsjV95q7J4M55qYymwBib8KTqU/xuQww==",
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-10.2.3.tgz",
+      "integrity": "sha512-uCNeq5qH4QEiftgOud+EhTVvdriYQVBrYmX4f4BjVHkjnFhm73h30nfAgs6YuStIp8oxSI8jUGE9DAy331xvmA==",
       "dev": true,
       "requires": {
-        "@angular-devkit/core": "10.2.0",
+        "@angular-devkit/core": "10.2.3",
         "ora": "5.0.0",
         "rxjs": "6.6.2"
       },
       "dependencies": {
+        "@angular-devkit/core": {
+          "version": "10.2.3",
+          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+          "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+          "dev": true,
+          "requires": {
+            "ajv": "6.12.4",
+            "fast-json-stable-stringify": "2.1.0",
+            "magic-string": "0.25.7",
+            "rxjs": "6.6.2",
+            "source-map": "0.7.3"
+          }
+        },
         "rxjs": {
           "version": "6.6.2",
           "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
@@ -20767,20 +20936,20 @@
       }
     },
     "@angular/cli": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-10.2.0.tgz",
-      "integrity": "sha512-YBzwkFBmG6CdUJk8onsPXxHX/ByU5MERBQgYhLC873e2nZlXMUu+Ttq2Wai6apyskGvsXKxZNPOQSFZTGKXzXg==",
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-10.2.3.tgz",
+      "integrity": "sha512-LLt0AUgLpmaoWA1R7tnUxbJDNs37+WogjNCbNLfvf4YHI04PwKx3OXgx0d8IYNtjHEaGmGp9AQRynvQ2qfXkaA==",
       "dev": true,
       "requires": {
-        "@angular-devkit/architect": "0.1002.0",
-        "@angular-devkit/core": "10.2.0",
-        "@angular-devkit/schematics": "10.2.0",
-        "@schematics/angular": "10.2.0",
-        "@schematics/update": "0.1002.0",
+        "@angular-devkit/architect": "0.1002.3",
+        "@angular-devkit/core": "10.2.3",
+        "@angular-devkit/schematics": "10.2.3",
+        "@schematics/angular": "10.2.3",
+        "@schematics/update": "0.1002.3",
         "@yarnpkg/lockfile": "1.1.0",
         "ansi-colors": "4.1.1",
         "debug": "4.1.1",
-        "ini": "1.3.5",
+        "ini": "1.3.6",
         "inquirer": "7.3.3",
         "npm-package-arg": "8.0.1",
         "npm-pick-manifest": "6.1.0",
@@ -20794,6 +20963,29 @@
         "uuid": "8.3.0"
       },
       "dependencies": {
+        "@angular-devkit/architect": {
+          "version": "0.1002.3",
+          "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1002.3.tgz",
+          "integrity": "sha512-7ainXRNO1njZ6bBbJXGpMzCh0OYrzuIRe/+zRj0ncV1YfEsJb2yWBuiza0+y2Ljco7hdd4wr+7eJm7cfn+NvAw==",
+          "dev": true,
+          "requires": {
+            "@angular-devkit/core": "10.2.3",
+            "rxjs": "6.6.2"
+          }
+        },
+        "@angular-devkit/core": {
+          "version": "10.2.3",
+          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+          "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+          "dev": true,
+          "requires": {
+            "ajv": "6.12.4",
+            "fast-json-stable-stringify": "2.1.0",
+            "magic-string": "0.25.7",
+            "rxjs": "6.6.2",
+            "source-map": "0.7.3"
+          }
+        },
         "ansi-colors": {
           "version": "4.1.1",
           "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.1.tgz",
@@ -20810,9 +21002,24 @@
           }
         },
         "ini": {
-          "version": "1.3.5",
-          "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-          "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+          "version": "1.3.6",
+          "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.6.tgz",
+          "integrity": "sha512-IZUoxEjNjubzrmvzZU4lKP7OnYmX72XRl3sqkfJhBKweKi5rnGi5+IUdlj/H1M+Ip5JQ1WzaDMOBRY90Ajc5jg==",
+          "dev": true
+        },
+        "rxjs": {
+          "version": "6.6.2",
+          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+          "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+          "dev": true,
+          "requires": {
+            "tslib": "^1.9.0"
+          }
+        },
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
           "dev": true
         },
         "uuid": {
@@ -22518,27 +22725,6 @@
         "@ethersproject/logger": "^5.0.8",
         "@ethersproject/properties": "^5.0.7",
         "elliptic": "6.5.4"
-      },
-      "dependencies": {
-        "bn.js": {
-          "version": "4.11.9",
-          "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.9.tgz",
-          "integrity": "sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw=="
-        },
-        "elliptic": {
-          "version": "6.5.4",
-          "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
-          "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
-          "requires": {
-            "bn.js": "^4.11.9",
-            "brorand": "^1.1.0",
-            "hash.js": "^1.0.0",
-            "hmac-drbg": "^1.0.1",
-            "inherits": "^2.0.4",
-            "minimalistic-assert": "^1.0.1",
-            "minimalistic-crypto-utils": "^1.0.1"
-          }
-        }
       }
     },
     "@ethersproject/solidity": {
@@ -22714,36 +22900,94 @@
       "integrity": "sha512-V3WyEc8ZyAuOQ2fpFuTuYYOd2tV4NePeSdxaHYgYAOs7ERLxlcFi2XsmgI5LJFdAUmJKXsg8jaIiVTkTHQygQw=="
     },
     "@schematics/angular": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-10.2.0.tgz",
-      "integrity": "sha512-rJRTTTL8CMMFb3ebCvAVHKHxuNzRqy/HtbXhJ82l5Xo/jXcm74eV2Q0RBUrNo1yBKWFIR+FIwiXLJaGcC/R9Pw==",
+      "version": "10.2.3",
+      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-10.2.3.tgz",
+      "integrity": "sha512-xcnfH5XMmGcs33VHm2cu0+4g3rkfSD+qpiKFjfg7KGC4lLoOKSED4ZnjzIYwcQ6QN4gTpAvlZKxI8zO7NkKv0A==",
       "dev": true,
       "requires": {
-        "@angular-devkit/core": "10.2.0",
-        "@angular-devkit/schematics": "10.2.0",
+        "@angular-devkit/core": "10.2.3",
+        "@angular-devkit/schematics": "10.2.3",
         "jsonc-parser": "2.3.0"
+      },
+      "dependencies": {
+        "@angular-devkit/core": {
+          "version": "10.2.3",
+          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+          "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+          "dev": true,
+          "requires": {
+            "ajv": "6.12.4",
+            "fast-json-stable-stringify": "2.1.0",
+            "magic-string": "0.25.7",
+            "rxjs": "6.6.2",
+            "source-map": "0.7.3"
+          }
+        },
+        "rxjs": {
+          "version": "6.6.2",
+          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+          "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+          "dev": true,
+          "requires": {
+            "tslib": "^1.9.0"
+          }
+        },
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+          "dev": true
+        }
       }
     },
     "@schematics/update": {
-      "version": "0.1002.0",
-      "resolved": "https://registry.npmjs.org/@schematics/update/-/update-0.1002.0.tgz",
-      "integrity": "sha512-g2bfJSAj3x/YL0GNhnHsDSQmO6DoxSnLxoFLqNN5+ukxK5jq7OZNDwMJGxZ3X6RcSMWKEkIKL/wlq9yhj2T/kw==",
+      "version": "0.1002.3",
+      "resolved": "https://registry.npmjs.org/@schematics/update/-/update-0.1002.3.tgz",
+      "integrity": "sha512-UnuMgRQtAOp/Pk9rSYW12medajXe9s5mW4a6foixC/B2UCFFlIAVbFBTiFpr69xbalfLlFcFx1MD+8/8njWtbQ==",
       "dev": true,
       "requires": {
-        "@angular-devkit/core": "10.2.0",
-        "@angular-devkit/schematics": "10.2.0",
+        "@angular-devkit/core": "10.2.3",
+        "@angular-devkit/schematics": "10.2.3",
         "@yarnpkg/lockfile": "1.1.0",
-        "ini": "1.3.5",
+        "ini": "1.3.6",
         "npm-package-arg": "^8.0.0",
         "pacote": "9.5.12",
         "semver": "7.3.2",
         "semver-intersect": "1.4.0"
       },
       "dependencies": {
+        "@angular-devkit/core": {
+          "version": "10.2.3",
+          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
+          "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+          "dev": true,
+          "requires": {
+            "ajv": "6.12.4",
+            "fast-json-stable-stringify": "2.1.0",
+            "magic-string": "0.25.7",
+            "rxjs": "6.6.2",
+            "source-map": "0.7.3"
+          }
+        },
         "ini": {
-          "version": "1.3.5",
-          "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-          "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+          "version": "1.3.6",
+          "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.6.tgz",
+          "integrity": "sha512-IZUoxEjNjubzrmvzZU4lKP7OnYmX72XRl3sqkfJhBKweKi5rnGi5+IUdlj/H1M+Ip5JQ1WzaDMOBRY90Ajc5jg==",
+          "dev": true
+        },
+        "rxjs": {
+          "version": "6.6.2",
+          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+          "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+          "dev": true,
+          "requires": {
+            "tslib": "^1.9.0"
+          }
+        },
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
           "dev": true
         }
       }
@@ -26503,17 +26747,17 @@
       "integrity": "sha512-NB3DzrTzJFhWkUp+nl2KtUtoFzrfGXTir2S+BU4tXGyXH9vlluPuFpE3pTKeH7+PY460tHLjKzh6K2+TWwW+Ww=="
     },
     "elliptic": {
-      "version": "6.5.3",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz",
-      "integrity": "sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==",
+      "version": "6.5.4",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
+      "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
       "requires": {
-        "bn.js": "^4.4.0",
-        "brorand": "^1.0.1",
+        "bn.js": "^4.11.9",
+        "brorand": "^1.1.0",
         "hash.js": "^1.0.0",
-        "hmac-drbg": "^1.0.0",
-        "inherits": "^2.0.1",
-        "minimalistic-assert": "^1.0.0",
-        "minimalistic-crypto-utils": "^1.0.0"
+        "hmac-drbg": "^1.0.1",
+        "inherits": "^2.0.4",
+        "minimalistic-assert": "^1.0.1",
+        "minimalistic-crypto-utils": "^1.0.1"
       },
       "dependencies": {
         "bn.js": {
@@ -30971,6 +31215,22 @@
         "tslib": "^2.0.0"
       }
     },
+    "ngx-logger": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/ngx-logger/-/ngx-logger-4.2.1.tgz",
+      "integrity": "sha512-Z4ZauhTXzTCITzZxCHgG/eM1Ad/3p9ZxRZQFbCskDOG2CS/LDe1nsTATU/K/IJv8jUDA9u3LJ1T+8Byb43OAKw==",
+      "requires": {
+        "tslib": "^1.9.0",
+        "vlq": "^1.0.0"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
     "nice-try": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
@@ -36206,6 +36466,11 @@
         "extsprintf": "^1.2.0"
       }
     },
+    "vlq": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vlq/-/vlq-1.0.1.tgz",
+      "integrity": "sha512-gQpnTgkubC6hQgdIcRdYGDSDc+SaujOdyesZQMv6JlfQee/9Mp0Qhnys6WxDWvQnL5WZdT7o2Ul187aSt0Rq+w=="
+    },
     "vm-browserify": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
diff --git a/package.json b/package.json
index 063650e..43681e8 100644
--- a/package.json
+++ b/package.json
@@ -36,6 +36,7 @@
     "mocha": "^8.2.1",
     "moolb": "^0.1.0",
     "ng2-charts": "^2.4.2",
+    "ngx-logger": "^4.2.1",
     "openpgp": "^4.10.10",
     "popper.js": "^1.16.1",
     "rxjs": "~6.6.0",
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index d139729..d478b98 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -1,5 +1,5 @@
 import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
+import {Routes, RouterModule, PreloadAllModules} from '@angular/router';
 import {AuthGuard} from '@app/_guards';
 
 const routes: Routes = [
@@ -9,7 +9,9 @@ const routes: Routes = [
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes)],
+  imports: [RouterModule.forRoot(routes, {
+    preloadingStrategy: PreloadAllModules
+  })],
   exports: [RouterModule]
 })
 export class AppRoutingModule { }
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 1620b02..cbf9dc1 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,11 +1,12 @@
-import {Component, HostListener} from '@angular/core';
-import {TokenService, TransactionService} from '@app/_services';
-import {AuthService} from '@app/_services';
+import {ChangeDetectionStrategy, Component, HostListener} from '@angular/core';
+import {AuthService, LoggingService, TokenService, TransactionService} from '@app/_services';
+import {NGXLogger} from 'ngx-logger';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss']
+  styleUrls: ['./app.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AppComponent {
   title = 'CICADA';
@@ -17,9 +18,11 @@ export class AppComponent {
     private authService: AuthService,
     private tokenService: TokenService,
     private transactionService: TransactionService,
+    private logger: NGXLogger,
+    private loggingService: LoggingService,
   ) {
     this.authService.mutableKeyStore.loadKeyring().then(r => this.authService.getPublicKeys().then());
-    this.tokenService.getTokens().then(async r => console.log('Tokens:', await r));
+    this.tokenService.getTokens().then(async r => loggingService.sendInfoLevelMessage(await r));
     this.mediaQuery.addListener(this.onResize);
     this.onResize(this.mediaQuery);
   }
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 2dd2efb..df1c4e0 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,15 +1,17 @@
-import { BrowserModule } from '@angular/platform-browser';
-import { NgModule } from '@angular/core';
+import {BrowserModule} from '@angular/platform-browser';
+import {ErrorHandler, NgModule} from '@angular/core';
 
-import { AppRoutingModule } from '@app/app-routing.module';
-import { AppComponent } from '@app/app.component';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import {AppRoutingModule} from '@app/app-routing.module';
+import {AppComponent} from '@app/app.component';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
-import {MutablePgpKeyStore, MockBackendProvider, ErrorInterceptor} from '@app/_helpers';
+import {ErrorInterceptor, GlobalErrorHandler, LoggingInterceptor, MockBackendProvider, MutablePgpKeyStore} from '@app/_helpers';
 import {DataTablesModule} from 'angular-datatables';
 import {SharedModule} from '@app/shared/shared.module';
 import {MatTableModule} from '@angular/material/table';
 import {AuthGuard} from '@app/_guards';
+import {LoggerModule} from 'ngx-logger';
+import {environment} from '@src/environments/environment';
 
 @NgModule({
   declarations: [
@@ -22,13 +24,22 @@ import {AuthGuard} from '@app/_guards';
     HttpClientModule,
     DataTablesModule,
     SharedModule,
-    MatTableModule
+    MatTableModule,
+    LoggerModule.forRoot({
+      level: environment.level,
+      serverLogLevel: environment.serverLogLevel,
+      serverLoggingUrl: `${environment.loggingUrl}/api/logs/`,
+      disableConsoleLogging: false
+    })
   ],
   providers: [
     AuthGuard,
     MutablePgpKeyStore,
     MockBackendProvider,
+    GlobalErrorHandler,
+    { provide: ErrorHandler, useClass: GlobalErrorHandler },
     { provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },
+    { provide: HTTP_INTERCEPTORS, useClass: LoggingInterceptor, multi: true },
   ],
   bootstrap: [AppComponent]
 })
diff --git a/src/app/auth/auth.component.ts b/src/app/auth/auth.component.ts
index d257849..e3fb8ee 100644
--- a/src/app/auth/auth.component.ts
+++ b/src/app/auth/auth.component.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {CustomErrorStateMatcher} from '@app/_helpers';
 import {AuthService} from '@app/_services';
@@ -7,7 +7,8 @@ import {Router} from '@angular/router';
 @Component({
   selector: 'app-auth',
   templateUrl: './auth.component.html',
-  styleUrls: ['./auth.component.scss']
+  styleUrls: ['./auth.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AuthComponent implements OnInit {
   keyForm: FormGroup;
diff --git a/src/app/pages/accounts/account-details/account-details.component.html b/src/app/pages/accounts/account-details/account-details.component.html
index a6299ea..7299813 100644
--- a/src/app/pages/accounts/account-details/account-details.component.html
+++ b/src/app/pages/accounts/account-details/account-details.component.html
@@ -28,19 +28,19 @@
           <span class="sr-only">Loading...</span>
         </div>
       </div>
-      <div *ngIf="account" class="card mt-3 mb-3">
-        <div class="card mb-3">
-          <div class="row card-body">
-            <h3>
-              <strong> {{account?.vcard?.fn[0].value}} </strong>
-            </h3>
-            <span class="ml-auto"><strong>Balance:</strong> {{accountBalance}} RCU</span>
-            <span class="ml-2"><strong>Created:</strong> {{account?.date_registered | date}}</span>
-            <span class="ml-2"><strong>Address:</strong><a href="{{bloxbergLink}}" target="_blank"> {{account?.identities.evm['bloxberg:8996']}} </a></span>
-          </div>
+      <div *ngIf="account" class="card mb-3">
+        <div class="row card-body">
+          <h3>
+            <strong> {{account?.vcard?.fn[0].value}} </strong>
+          </h3>
+          <span class="ml-auto"><strong>Balance:</strong> {{accountBalance}} SRF</span>
+          <span class="ml-2"><strong>Created:</strong> {{account?.date_registered | date}}</span>
+          <span class="ml-2"><strong>Address:</strong><a href="{{bloxbergLink}}" target="_blank"> {{account?.identities.evm['bloxberg:8996']}} </a></span>
         </div>
-        <app-disbursement *ngIf="isDisbursing" (cancelDisbursmentEvent)="addTransfer()" [account]="account">
-        </app-disbursement>
+      </div>
+      <app-disbursement *ngIf="isDisbursing" (cancelDisbursmentEvent)="addTransfer()" [account]="account">
+      </app-disbursement>
+      <div *ngIf="account" class="card mt-3 mb-3">
         <mat-card-title class="card-header">
           <div class="row">
             DETAILS
@@ -51,17 +51,17 @@
         <div class="card-body">
           <form [formGroup]="accountInfoForm" (ngSubmit)="saveInfo()">
             <div class="row form-inline">
-              <div class="col-md-6 col-lg-4">
-                <mat-form-field appearance="outline">
-                  <mat-label> STATUS </mat-label>
-                  <mat-select id="status" [(value)]="account.status" formControlName="status"
-                              [errorStateMatcher]="matcher">
-                    <mat-option value="blocked">Blocked</mat-option>
-                    <mat-option value="active">Active</mat-option>
-                  </mat-select>
-                  <mat-error *ngIf="submitted && accountInfoFormStub.status.errors">Status is required.</mat-error>
-                </mat-form-field>
-              </div>
+<!--              <div class="col-md-6 col-lg-4">-->
+<!--                <mat-form-field appearance="outline">-->
+<!--                  <mat-label> STATUS </mat-label>-->
+<!--                  <mat-select id="status" [(value)]="account.status" formControlName="status"-->
+<!--                              [errorStateMatcher]="matcher">-->
+<!--                    <mat-option value="blocked">Blocked</mat-option>-->
+<!--                    <mat-option value="active">Active</mat-option>-->
+<!--                  </mat-select>-->
+<!--                  <mat-error *ngIf="submitted && accountInfoFormStub.status.errors">Status is required.</mat-error>-->
+<!--                </mat-form-field>-->
+<!--              </div>-->
 
               <div class="col-md-6 col-lg-4">
                 <mat-form-field appearance="outline">
@@ -105,30 +105,30 @@
                 </mat-form-field>
               </div>
 
-              <div class="col-md-6 col-lg-4">
-                <mat-form-field appearance="outline">
-                  <mat-label> USER TOKEN: </mat-label>
-                  <mat-select id="token" [(value)]="account.token" formControlName="token"
-                              [errorStateMatcher]="matcher">
-                    <mat-option value="RSV"> RESERVE </mat-option>
-                    <mat-option value="ERN"> ERNIE </mat-option>
-                    <mat-option value="BRT"> BERT </mat-option>
-                  </mat-select>
-                  <mat-error *ngIf="submitted && accountInfoFormStub.token.errors">Token is required.</mat-error>
-                </mat-form-field>
-              </div>
+<!--              <div class="col-md-6 col-lg-4">-->
+<!--                <mat-form-field appearance="outline">-->
+<!--                  <mat-label> USER TOKEN: </mat-label>-->
+<!--                  <mat-select id="token" [(value)]="account.token" formControlName="token"-->
+<!--                              [errorStateMatcher]="matcher">-->
+<!--                    <mat-option value="RSV"> RESERVE </mat-option>-->
+<!--                    <mat-option value="ERN"> ERNIE </mat-option>-->
+<!--                    <mat-option value="BRT"> BERT </mat-option>-->
+<!--                  </mat-select>-->
+<!--                  <mat-error *ngIf="submitted && accountInfoFormStub.token.errors">Token is required.</mat-error>-->
+<!--                </mat-form-field>-->
+<!--              </div>-->
 
-              <div class="col-md-6 col-lg-4">
-                <mat-form-field appearance="outline">
-                  <mat-label>Failed Pin Attempts: </mat-label>
-                  <input matInput type="text" id="failedPinAttempts" placeholder="{{account?.failedPinAttempts}}"
-                         value="{{account?.failedPinAttempts}}" formControlName="failedPinAttempts" required
-                         [errorStateMatcher]="matcher">
-                  <mat-error *ngIf="submitted && accountInfoFormStub.failedPinAttempts.errors">
-                    Failed Pin Attempts is required.
-                  </mat-error>
-                </mat-form-field>
-              </div>
+<!--              <div class="col-md-6 col-lg-4">-->
+<!--                <mat-form-field appearance="outline">-->
+<!--                  <mat-label>Failed Pin Attempts: </mat-label>-->
+<!--                  <input matInput type="text" id="failedPinAttempts" placeholder="{{account?.failedPinAttempts}}"-->
+<!--                         value="{{account?.failedPinAttempts}}" formControlName="failedPinAttempts" required-->
+<!--                         [errorStateMatcher]="matcher">-->
+<!--                  <mat-error *ngIf="submitted && accountInfoFormStub.failedPinAttempts.errors">-->
+<!--                    Failed Pin Attempts is required.-->
+<!--                  </mat-error>-->
+<!--                </mat-form-field>-->
+<!--              </div>-->
 
               <div class="col-md-6 col-lg-4">
                 <mat-form-field appearance="outline">
@@ -190,11 +190,11 @@
                   <mat-label> LOCATION: </mat-label>
                   <mat-select id="location" [(value)]="account.location" formControlName="location"
                               [errorStateMatcher]="matcher">
-                    <div *ngFor="let county of locations">
-                      <div *ngFor="let district of county.districts">
-                        <mat-optgroup *ngFor="let location of district.locations" [label]="county.name + ' / ' +
+                    <div *ngFor="let county of locations; trackBy: trackByName">
+                      <div *ngFor="let district of county.districts; trackBy: trackByName">
+                        <mat-optgroup *ngFor="let location of district.locations; trackBy: trackByName" [label]="county.name + ' / ' +
                          district.name + ' / ' + location.name">
-                          <mat-option *ngFor="let village of location.villages" [value]="village">
+                          <mat-option *ngFor="let village of location.villages; trackBy: trackByName" [value]="village">
                             {{village}}
                           </mat-option>
                         </mat-optgroup>
@@ -219,14 +219,14 @@
                 </mat-form-field>
               </div>
 
-              <div class="col-md-6 col-lg-4">
-                <mat-form-field appearance="outline">
-                  <mat-label>Referred By: </mat-label>
-                  <input matInput type="text" id="referredBy" placeholder="{{account?.referrer}}" readonly
-                         value="{{account?.referrer}}" formControlName="referrer" [errorStateMatcher]="matcher">
-                  <mat-error *ngIf="submitted && accountInfoFormStub.referrer.errors">Referrer is required.</mat-error>
-                </mat-form-field>
-              </div>
+<!--              <div class="col-md-6 col-lg-4">-->
+<!--                <mat-form-field appearance="outline">-->
+<!--                  <mat-label>Referred By: </mat-label>-->
+<!--                  <input matInput type="text" id="referredBy" placeholder="{{account?.referrer}}" readonly-->
+<!--                         value="{{account?.referrer}}" formControlName="referrer" [errorStateMatcher]="matcher">-->
+<!--                  <mat-error *ngIf="submitted && accountInfoFormStub.referrer.errors">Referrer is required.</mat-error>-->
+<!--                </mat-form-field>-->
+<!--              </div>-->
 
               <div class="col-md-6 col-lg-4">
                 <button mat-raised-button color="primary" type="button" class="btn btn btn-outline-primary mb-3">
diff --git a/src/app/pages/accounts/account-details/account-details.component.ts b/src/app/pages/accounts/account-details/account-details.component.ts
index 3cd5696..895f660 100644
--- a/src/app/pages/accounts/account-details/account-details.component.ts
+++ b/src/app/pages/accounts/account-details/account-details.component.ts
@@ -1,9 +1,9 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core';
 import {MatTableDataSource} from '@angular/material/table';
 import {SelectionModel} from '@angular/cdk/collections';
 import {MatPaginator} from '@angular/material/paginator';
 import {MatSort} from '@angular/material/sort';
-import {LocationService, TokenService, TransactionService, UserService} from '@app/_services';
+import {LocationService, LoggingService, TokenService, TransactionService, UserService} from '@app/_services';
 import {ActivatedRoute, Params, Router} from '@angular/router';
 import {first} from 'rxjs/operators';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
@@ -14,7 +14,8 @@ const vCard = require('vcard-parser');
 @Component({
   selector: 'app-account-details',
   templateUrl: './account-details.component.html',
-  styleUrls: ['./account-details.component.scss']
+  styleUrls: ['./account-details.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AccountDetailsComponent implements OnInit {
   transactionsDataSource: MatTableDataSource<any>;
@@ -59,50 +60,50 @@ export class AccountDetailsComponent implements OnInit {
     private userService: UserService,
     private route: ActivatedRoute,
     private router: Router,
-    private tokenService: TokenService
+    private tokenService: TokenService,
+    private loggingService: LoggingService
   ) {
     this.accountInfoForm = this.formBuilder.group({
-      status: ['', Validators.required],
+      // status: ['', Validators.required],
       name: ['', Validators.required],
       phoneNumber: ['', Validators.required],
       age: ['', Validators.required],
       type: ['', Validators.required],
-      token: ['', Validators.required],
-      failedPinAttempts: ['', Validators.required],
+      // token: ['', Validators.required],
+      // failedPinAttempts: ['', Validators.required],
       bio: ['', Validators.required],
       gender: ['', Validators.required],
       businessCategory: ['', Validators.required],
       userLocation: ['', Validators.required],
       location: ['', Validators.required],
       locationType: ['', Validators.required],
-      referrer: ['', Validators.required]
+      // referrer: ['', Validators.required]
     });
     this.route.paramMap.subscribe(async (params: Params) => {
       this.userService.getAccountDetailsFromMeta(await User.toKey(params.get('id'))).pipe(first()).subscribe(res => {
-        this.metaAccount = Envelope.fromJSON(JSON.stringify(res)).unwrap();
+        this.metaAccount = Envelope.fromJSON(JSON.stringify(res.body)).unwrap();
         this.account = this.metaAccount.m.data;
         this.tokenService.getTokenBalance(this.account.identities.evm['bloxberg:8996'][0]).then(r => this.accountBalance = r);
         this.account.vcard = vCard.parse(atob(this.account.vcard));
-        console.log(this.account);
         this.accountInfoForm.patchValue({
-          status: this.account.status,
+          // status: this.account.status,
           name: this.account.vcard?.fn[0].value,
           phoneNumber: this.account.vcard?.tel[0].value,
           age: this.account.age,
           type: this.account.type,
-          token: this.account.token,
-          failedPinAttempts: this.account.failedPinAttempts,
-          bio: this.account.bio,
+          // token: this.account.token,
+          // failedPinAttempts: this.account.failedPinAttempts,
+          bio: this.account.products,
           gender: this.account.gender,
-          businessCategory: this.account.businessCategory,
+          businessCategory: this.account.category,
           userLocation: this.account.location.area_name,
-          location: this.account.location,
-          locationType: this.account.locationType,
-          referrer: this.account.referrer
+          location: this.account.location.area,
+          locationType: this.account.location.area_type,
+          // referrer: this.account.referrer
         });
         this.bloxbergLink = 'https://blockexplorer.bloxberg.org/address/' + this.account.identities.evm['bloxberg:8996'] + '/transactions';
-        this.userService.getHistoryByUser(params.get('id')).pipe(first()).subscribe(history => {
-          this.historyDataSource = new MatTableDataSource<any>(history);
+        this.userService.getHistoryByUser(params.get('id')).pipe(first()).subscribe(response => {
+          this.historyDataSource = new MatTableDataSource<any>(response.body);
           this.historyDataSource.paginator = this.historyTablePaginator;
           this.historyDataSource.sort = this.historyTableSort;
         });
@@ -166,21 +167,18 @@ export class AccountDetailsComponent implements OnInit {
     if (this.accountInfoForm.invalid) { return; }
     this.userService.changeAccountInfo(
       this.account.address,
-      this.accountInfoFormStub.status.value,
       this.accountInfoFormStub.name.value,
       this.accountInfoFormStub.phoneNumber.value,
       this.accountInfoFormStub.age.value,
       this.accountInfoFormStub.type.value,
-      this.accountInfoFormStub.token.value,
-      this.accountInfoFormStub.failedPinAttempts.value,
       this.accountInfoFormStub.bio.value,
       this.accountInfoFormStub.gender.value,
       this.accountInfoFormStub.businessCategory.value,
       this.accountInfoFormStub.userLocation.value,
       this.accountInfoFormStub.location.value,
       this.accountInfoFormStub.locationType.value,
-      this.accountInfoFormStub.referrer.value,
-    ).then(res => console.log(res));
+      this.metaAccount
+    ).then(res => this.loggingService.sendInfoLevelMessage(`Response: ${res}`));
     this.submitted = false;
   }
 
@@ -208,7 +206,11 @@ export class AccountDetailsComponent implements OnInit {
 
   resetPin(): void {
     this.userService.resetPin(this.account.phone).pipe(first()).subscribe(res => {
-      console.log(res);
+      this.loggingService.sendInfoLevelMessage(`Response: ${res.body}`);
     });
   }
+
+  public trackByName(index, item): string {
+    return item.name;
+  }
 }
diff --git a/src/app/pages/accounts/accounts.component.ts b/src/app/pages/accounts/accounts.component.ts
index 58efad0..e93d606 100644
--- a/src/app/pages/accounts/accounts.component.ts
+++ b/src/app/pages/accounts/accounts.component.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core';
 import {MatTableDataSource} from '@angular/material/table';
 import {SelectionModel} from '@angular/cdk/collections';
 import {MatPaginator} from '@angular/material/paginator';
@@ -9,7 +9,8 @@ import {Router} from '@angular/router';
 @Component({
   selector: 'app-accounts',
   templateUrl: './accounts.component.html',
-  styleUrls: ['./accounts.component.scss']
+  styleUrls: ['./accounts.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AccountsComponent implements OnInit {
   dataSource: MatTableDataSource<any>;
diff --git a/src/app/pages/accounts/create-account/create-account.component.html b/src/app/pages/accounts/create-account/create-account.component.html
index 5f6cc91..ca75dec 100644
--- a/src/app/pages/accounts/create-account/create-account.component.html
+++ b/src/app/pages/accounts/create-account/create-account.component.html
@@ -81,10 +81,10 @@
               <mat-form-field appearance="outline">
                 <mat-label>Location: </mat-label>
                 <mat-select id="location" formControlName="location" [errorStateMatcher]="matcher">
-                  <div *ngFor="let county of locations">
-                    <div *ngFor="let district of county.districts">
-                      <mat-optgroup *ngFor="let location of district.locations" [label]="county.name + ' / ' + district.name + ' / ' + location.name">
-                        <mat-option *ngFor="let village of location.villages" [value]="village">
+                  <div *ngFor="let county of locations; trackBy: trackByName">
+                    <div *ngFor="let district of county.districts; trackBy: trackByName">
+                      <mat-optgroup *ngFor="let location of district.locations; trackBy: trackByName" [label]="county.name + ' / ' + district.name + ' / ' + location.name">
+                        <mat-option *ngFor="let village of location.villages; trackBy: trackByName" [value]="village">
                           {{village}}
                         </mat-option>
                       </mat-optgroup>
diff --git a/src/app/pages/accounts/create-account/create-account.component.ts b/src/app/pages/accounts/create-account/create-account.component.ts
index f20e713..18f09ea 100644
--- a/src/app/pages/accounts/create-account/create-account.component.ts
+++ b/src/app/pages/accounts/create-account/create-account.component.ts
@@ -1,14 +1,14 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {Router} from '@angular/router';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {LocationService, UserService} from '@app/_services';
-import {first} from 'rxjs/operators';
 import {CustomErrorStateMatcher} from '@app/_helpers';
 
 @Component({
   selector: 'app-create-account',
   templateUrl: './create-account.component.html',
-  styleUrls: ['./create-account.component.scss']
+  styleUrls: ['./create-account.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class CreateAccountComponent implements OnInit {
   createForm: FormGroup;
@@ -64,4 +64,8 @@ export class CreateAccountComponent implements OnInit {
     // this.router.navigateByUrl(`/accounts`);
     this.submitted = false;
   }
+
+  public trackByName(index, item): string {
+    return item.name;
+  }
 }
diff --git a/src/app/pages/accounts/disbursement/disbursement.component.ts b/src/app/pages/accounts/disbursement/disbursement.component.ts
index 29969f0..123bbb3 100644
--- a/src/app/pages/accounts/disbursement/disbursement.component.ts
+++ b/src/app/pages/accounts/disbursement/disbursement.component.ts
@@ -1,13 +1,13 @@
-import {Component, OnInit, EventEmitter, Output, Input} from '@angular/core';
+import {Component, OnInit, EventEmitter, Output, Input, ChangeDetectionStrategy} from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {CustomErrorStateMatcher} from '@app/_helpers';
 import {TransactionService} from '@app/_services';
-import {first} from 'rxjs/operators';
 
 @Component({
   selector: 'app-disbursement',
   templateUrl: './disbursement.component.html',
-  styleUrls: ['./disbursement.component.scss']
+  styleUrls: ['./disbursement.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class DisbursementComponent implements OnInit {
   @Input() account;
@@ -42,7 +42,6 @@ export class DisbursementComponent implements OnInit {
         this.disbursementFormStub.amount.value
       );
     }
-    console.log(this.disbursementFormStub.transactionType.value);
     this.submitted = false;
   }
 
diff --git a/src/app/pages/accounts/export-accounts/export-accounts.component.ts b/src/app/pages/accounts/export-accounts/export-accounts.component.ts
index fa0533b..5e5c874 100644
--- a/src/app/pages/accounts/export-accounts/export-accounts.component.ts
+++ b/src/app/pages/accounts/export-accounts/export-accounts.component.ts
@@ -1,11 +1,12 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {CustomErrorStateMatcher} from '@app/_helpers';
 
 @Component({
   selector: 'app-export-accounts',
   templateUrl: './export-accounts.component.html',
-  styleUrls: ['./export-accounts.component.scss']
+  styleUrls: ['./export-accounts.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class ExportAccountsComponent implements OnInit {
   exportForm: FormGroup;
diff --git a/src/app/pages/admin/admin.component.ts b/src/app/pages/admin/admin.component.ts
index daec953..1dc5613 100644
--- a/src/app/pages/admin/admin.component.ts
+++ b/src/app/pages/admin/admin.component.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core';
 import {MatTableDataSource} from '@angular/material/table';
 import {MatPaginator} from '@angular/material/paginator';
 import {MatSort} from '@angular/material/sort';
@@ -10,6 +10,7 @@ import {first} from 'rxjs/operators';
   selector: 'app-admin',
   templateUrl: './admin.component.html',
   styleUrls: ['./admin.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
   animations: [
     trigger('detailExpand', [
       state('collapsed', style({height: '0px', minHeight: 0, visibility: 'hidden'})),
@@ -49,12 +50,12 @@ export class AdminComponent implements OnInit {
   }
 
   approveAction(action: any): void {
-    this.userService.approveAction(action.id).pipe(first()).subscribe(res => console.log(res));
+    this.userService.approveAction(action.id).pipe(first()).subscribe(res => console.log(res.body));
     this.userService.getActions();
   }
 
   revertAction(action: any): void {
-    this.userService.revokeAction(action.id).pipe(first()).subscribe(res => console.log(res));
+    this.userService.revokeAction(action.id).pipe(first()).subscribe(res => console.log(res.body));
     this.userService.getActions();
   }
 
diff --git a/src/app/pages/pages.component.html b/src/app/pages/pages.component.html
index 87344d4..b596f15 100644
--- a/src/app/pages/pages.component.html
+++ b/src/app/pages/pages.component.html
@@ -24,10 +24,10 @@
             <mat-form-field appearance="outline">
               <mat-label>Filter by location : </mat-label>
               <mat-select class="ml-2" id="filterUser">
-                <div *ngFor="let county of locations">
-                  <div *ngFor="let district of county.districts">
-                    <mat-optgroup *ngFor="let location of district.locations" [label]="county.name + ' / ' + district.name + ' / ' + location.name">
-                      <mat-option *ngFor="let village of location.villages" [value]="village">
+                <div *ngFor="let county of locations; trackBy: trackByName">
+                  <div *ngFor="let district of county.districts; trackBy: trackByName">
+                    <mat-optgroup *ngFor="let location of district.locations; trackBy: trackByName" [label]="county.name + ' / ' + district.name + ' / ' + location.name">
+                      <mat-option *ngFor="let village of location.villages; trackBy: trackByName" [value]="village">
                         {{village}}
                       </mat-option>
                     </mat-optgroup>
diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts
index d35f2e3..1766d38 100644
--- a/src/app/pages/pages.component.ts
+++ b/src/app/pages/pages.component.ts
@@ -1,13 +1,14 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {Color, Label} from 'ng2-charts';
 import {ChartDataSets, ChartOptions, ChartType} from 'chart.js';
 import {LocationService, UserService} from '@app/_services';
-import { ArraySum } from '@app/_helpers';
+import {ArraySum} from '@app/_helpers';
 
 @Component({
   selector: 'app-pages',
   templateUrl: './pages.component.html',
-  styleUrls: ['./pages.component.scss']
+  styleUrls: ['./pages.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class PagesComponent implements OnInit {
   disbursements: number = 0;
@@ -182,4 +183,8 @@ export class PagesComponent implements OnInit {
   public chartHovered({ event, active }: { event: MouseEvent, active: {}[] }): void {
     console.log(event, active);
   }
+
+  public trackByName(index, item): string {
+    return item.name;
+  }
 }
diff --git a/src/app/pages/settings/invite/invite.component.ts b/src/app/pages/settings/invite/invite.component.ts
index cc24bed..a3a0e04 100644
--- a/src/app/pages/settings/invite/invite.component.ts
+++ b/src/app/pages/settings/invite/invite.component.ts
@@ -1,11 +1,12 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {CustomErrorStateMatcher} from '@app/_helpers';
 
 @Component({
   selector: 'app-invite',
   templateUrl: './invite.component.html',
-  styleUrls: ['./invite.component.scss']
+  styleUrls: ['./invite.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class InviteComponent implements OnInit {
   inviteForm: FormGroup;
diff --git a/src/app/pages/settings/organization/organization.component.ts b/src/app/pages/settings/organization/organization.component.ts
index 7cf8e9b..b251adb 100644
--- a/src/app/pages/settings/organization/organization.component.ts
+++ b/src/app/pages/settings/organization/organization.component.ts
@@ -1,11 +1,12 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {CustomErrorStateMatcher} from '@app/_helpers';
 
 @Component({
   selector: 'app-organization',
   templateUrl: './organization.component.html',
-  styleUrls: ['./organization.component.scss']
+  styleUrls: ['./organization.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class OrganizationComponent implements OnInit {
   organizationForm: FormGroup;
diff --git a/src/app/pages/settings/settings.component.ts b/src/app/pages/settings/settings.component.ts
index a282c32..fb95121 100644
--- a/src/app/pages/settings/settings.component.ts
+++ b/src/app/pages/settings/settings.component.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core';
 import {MatTableDataSource} from '@angular/material/table';
 import {MatPaginator} from '@angular/material/paginator';
 import {MatSort} from '@angular/material/sort';
@@ -8,7 +8,8 @@ import {first} from 'rxjs/operators';
 @Component({
   selector: 'app-settings',
   templateUrl: './settings.component.html',
-  styleUrls: ['./settings.component.scss']
+  styleUrls: ['./settings.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SettingsComponent implements OnInit {
   date: string;
@@ -39,17 +40,17 @@ export class SettingsComponent implements OnInit {
   }
 
   activateStaff(id: string): void {
-    this.userService.activateStaff(id).pipe(first()).subscribe(res => console.log(res));
+    this.userService.activateStaff(id).pipe(first()).subscribe(res => console.log(res.body));
     this.userService.getStaff();
   }
 
   deactivateStaff(id: string): void {
-    this.userService.deactivateStaff(id).pipe(first()).subscribe(res => console.log(res));
+    this.userService.deactivateStaff(id).pipe(first()).subscribe(res => console.log(res.body));
     this.userService.getStaff();
   }
 
   changeStaffType(id: string, type: string): void {
-    this.userService.changeStaffType(id, type).pipe(first()).subscribe(res => console.log(res));
+    this.userService.changeStaffType(id, type).pipe(first()).subscribe(res => console.log(res.body));
     this.userService.getStaff();
   }
 }
diff --git a/src/app/pages/tokens/token-details/token-details.component.ts b/src/app/pages/tokens/token-details/token-details.component.ts
index db45bf2..63bc9a1 100644
--- a/src/app/pages/tokens/token-details/token-details.component.ts
+++ b/src/app/pages/tokens/token-details/token-details.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 import {ActivatedRoute, Params} from '@angular/router';
 import {TokenService} from '@app/_services';
 import {first} from 'rxjs/operators';
@@ -6,7 +6,8 @@ import {first} from 'rxjs/operators';
 @Component({
   selector: 'app-token-details',
   templateUrl: './token-details.component.html',
-  styleUrls: ['./token-details.component.scss']
+  styleUrls: ['./token-details.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TokenDetailsComponent implements OnInit {
   token: any;
@@ -16,8 +17,8 @@ export class TokenDetailsComponent implements OnInit {
     private tokenService: TokenService
   ) {
     this.route.paramMap.subscribe((params: Params) => {
-      this.tokenService.getTokenBySymbol(params.get('id')).pipe(first()).subscribe(token => {
-        this.token = token;
+      this.tokenService.getTokenBySymbol(params.get('id')).pipe(first()).subscribe(res => {
+        this.token = res.body;
       });
     });
   }
diff --git a/src/app/pages/tokens/tokens.component.ts b/src/app/pages/tokens/tokens.component.ts
index cda07ca..ad6cade 100644
--- a/src/app/pages/tokens/tokens.component.ts
+++ b/src/app/pages/tokens/tokens.component.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core';
 import {MatPaginator} from '@angular/material/paginator';
 import {MatSort} from '@angular/material/sort';
 import {TokenService} from '@app/_services';
@@ -8,7 +8,8 @@ import {Router} from '@angular/router';
 @Component({
   selector: 'app-tokens',
   templateUrl: './tokens.component.html',
-  styleUrls: ['./tokens.component.scss']
+  styleUrls: ['./tokens.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TokensComponent implements OnInit {
   dataSource: MatTableDataSource<any>;
diff --git a/src/app/pages/transactions/transaction-details/transaction-details.component.html b/src/app/pages/transactions/transaction-details/transaction-details.component.html
index 2b0c2b7..1f25a5f 100644
--- a/src/app/pages/transactions/transaction-details/transaction-details.component.html
+++ b/src/app/pages/transactions/transaction-details/transaction-details.component.html
@@ -1,4 +1,4 @@
-<div *ngIf="transaction" class="mb-3 mt-1">
+<div *ngIf="transaction | async" class="mb-3 mt-1">
   <div class="card text-center">
     <mat-card-title class="card-header">
       <div class="row">
diff --git a/src/app/pages/transactions/transaction-details/transaction-details.component.ts b/src/app/pages/transactions/transaction-details/transaction-details.component.ts
index 229f5b9..a6ba870 100644
--- a/src/app/pages/transactions/transaction-details/transaction-details.component.ts
+++ b/src/app/pages/transactions/transaction-details/transaction-details.component.ts
@@ -1,10 +1,11 @@
-import {Component, Input, OnInit} from '@angular/core';
+import {ChangeDetectionStrategy, Component, Input, OnInit} from '@angular/core';
 import {Router} from '@angular/router';
 
 @Component({
   selector: 'app-transaction-details',
   templateUrl: './transaction-details.component.html',
-  styleUrls: ['./transaction-details.component.scss']
+  styleUrls: ['./transaction-details.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TransactionDetailsComponent implements OnInit {
   @Input() transaction;
diff --git a/src/app/pages/transactions/transactions.component.ts b/src/app/pages/transactions/transactions.component.ts
index d98f5d6..02325e9 100644
--- a/src/app/pages/transactions/transactions.component.ts
+++ b/src/app/pages/transactions/transactions.component.ts
@@ -1,4 +1,4 @@
-import {AfterViewInit, Component, OnInit, ViewChild} from '@angular/core';
+import {AfterViewInit, ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core';
 import {BlockSyncService, TransactionService} from '@app/_services';
 import {MatTableDataSource} from '@angular/material/table';
 import {SelectionModel} from '@angular/cdk/collections';
@@ -8,7 +8,8 @@ import {MatSort} from '@angular/material/sort';
 @Component({
   selector: 'app-transactions',
   templateUrl: './transactions.component.html',
-  styleUrls: ['./transactions.component.scss']
+  styleUrls: ['./transactions.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TransactionsComponent implements OnInit, AfterViewInit {
   transactionDataSource: MatTableDataSource<any>;
diff --git a/src/app/shared/footer/footer.component.ts b/src/app/shared/footer/footer.component.ts
index c7a7ec5..928f079 100644
--- a/src/app/shared/footer/footer.component.ts
+++ b/src/app/shared/footer/footer.component.ts
@@ -1,9 +1,10 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 
 @Component({
   selector: 'app-footer',
   templateUrl: './footer.component.html',
-  styleUrls: ['./footer.component.scss']
+  styleUrls: ['./footer.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class FooterComponent implements OnInit {
 
diff --git a/src/app/shared/sidebar/sidebar.component.ts b/src/app/shared/sidebar/sidebar.component.ts
index f841d58..7874e24 100644
--- a/src/app/shared/sidebar/sidebar.component.ts
+++ b/src/app/shared/sidebar/sidebar.component.ts
@@ -1,9 +1,10 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 
 @Component({
   selector: 'app-sidebar',
   templateUrl: './sidebar.component.html',
-  styleUrls: ['./sidebar.component.scss']
+  styleUrls: ['./sidebar.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SidebarComponent implements OnInit {
 
diff --git a/src/app/shared/topbar/topbar.component.ts b/src/app/shared/topbar/topbar.component.ts
index 8b7ac44..ea3691e 100644
--- a/src/app/shared/topbar/topbar.component.ts
+++ b/src/app/shared/topbar/topbar.component.ts
@@ -1,9 +1,10 @@
-import { Component, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
 
 @Component({
   selector: 'app-topbar',
   templateUrl: './topbar.component.html',
-  styleUrls: ['./topbar.component.scss']
+  styleUrls: ['./topbar.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TopbarComponent implements OnInit {