diff --git a/.env.jungle b/.env.jungle index 1fc78235..5a8816ba 100644 --- a/.env.jungle +++ b/.env.jungle @@ -65,3 +65,4 @@ REACT_APP_EOS_USE_BP_JSON_ON_CHAIN=false REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE=producerjson +REACT_APP_TOKEN_SYMBOL=EOS \ No newline at end of file diff --git a/.env.lacchain b/.env.lacchain index b28dc07f..e4781885 100644 --- a/.env.lacchain +++ b/.env.lacchain @@ -69,3 +69,4 @@ REACT_APP_EOS_USE_BP_JSON_ON_CHAIN=false REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE=producerjson +REACT_APP_TOKEN_SYMBOL= \ No newline at end of file diff --git a/.env.local b/.env.local index e5939a16..1b7903da 100644 --- a/.env.local +++ b/.env.local @@ -62,3 +62,4 @@ REACT_APP_EOS_USE_BP_JSON_ON_CHAIN=false REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE=producerjson +REACT_APP_TOKEN_SYMBOL=EOS \ No newline at end of file diff --git a/.env.telostestnet b/.env.telostestnet index 3dccbe09..33a4f3e9 100644 --- a/.env.telostestnet +++ b/.env.telostestnet @@ -20,10 +20,11 @@ HASURA_GRAPHQL_ACTION_BASE_URL=http://hapi:9090 # hapi HAPI_EOS_API_ENDPOINT=https://telos-testnet.eosio.cr -HAPI_EOS_API_CHAIN_ID=2a02a0053e5a8cf73a56ba0fda11e4d92e0238a4a2aa74fccf46d5a910746840 +HAPI_EOS_API_CHAIN_ID=1eaa0824707c8c16bd25145493bf062aecddfeb56c736f6ba6397f3195f33c9f HAPI_EOS_BASE_ACCOUNT=eosmechatero HAPI_EOS_BASE_ACCOUNT_PASSWORD=PW... HAPI_EOS_MECHANICS_ACCOUNT=eosmechatero +# TODO: add value HAPI_EOS_MECHANICS_PASSWORD=PW... HAPI_EOS_WALLET_URL=http://localhost:9999 HAPI_EOS_EXCHANGE_RATE_API=https://api.coingecko.com/api/v3/simple/price?ids=telos&vs_currencies=usd @@ -39,6 +40,7 @@ HAPI_SYNC_PRODUCERS_INTERVAL=86400 HAPI_SYNC_PRODUCER_INFO_INTERVAL=1 HAPI_SYNC_PRODUCER_CPU_INTERVAL=6 HAPI_SYNC_EXCHANGE_RATE=86400 +HAPI_COINGECKO_API_TOKEN_ID=telos HAPI_SYNC_STATS_INTERVAL=60 #webapp @@ -66,4 +68,5 @@ REACT_APP_EOS_CHAIN_ID=1eaa0824707c8c16bd25145493bf062aecddfeb56c736f6ba6397f319 REACT_APP_EOS_USE_BP_JSON_ON_CHAIN=false REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT=producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE=producerjson -REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE=producerjson \ No newline at end of file +REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE=producerjson +REACT_APP_TOKEN_SYMBOL=TLOS \ No newline at end of file diff --git a/.github/workflows/push-dev-environment.yaml b/.github/workflows/push-dev-environment.yaml index 7b2aacde..e909b6bb 100644 --- a/.github/workflows/push-dev-environment.yaml +++ b/.github/workflows/push-dev-environment.yaml @@ -37,7 +37,7 @@ jobs: REACT_APP_NAME: $npm_package_name REACT_APP_TITLE: EOS Jungle Testnet Network Dashboard REACT_APP_DEFAULT_PRODUCER_LOGO: https://bloks.io/img/eosio.png - REACT_APP_FOOTER_LINKS: "" + REACT_APP_FOOTER_LINKS: '' REACT_APP_EOS_RATE_LINK: https://jungle.eosrate.io:8080 REACT_APP_USE_REWARDS: true REACT_APP_USE_VOTES: true @@ -55,6 +55,7 @@ jobs: REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: producerjson + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} - name: Build kubernetes files id: build_kubernetes_files @@ -72,7 +73,7 @@ jobs: REACT_APP_NAME: $npm_package_name REACT_APP_TITLE: EOS Jungle Testnet Network Dashboard REACT_APP_DEFAULT_PRODUCER_LOGO: https://bloks.io/img/eosio.png - REACT_APP_FOOTER_LINKS: "" + REACT_APP_FOOTER_LINKS: '' REACT_APP_EOS_RATE_LINK: https://jungle.eosrate.io:8080 REACT_APP_USE_REWARDS: true REACT_APP_USE_VOTES: true @@ -90,6 +91,7 @@ jobs: REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: producerjson + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} # postgres POSTGRES_USER: ${{ secrets.POSTGRES_USER }} POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }} @@ -105,11 +107,11 @@ jobs: HAPI_EOS_WALLET_URL: http://monitor-wallet:8888 HAPI_EOS_EXCHANGE_RATE_API: ${{ secrets.HAPI_EOS_EXCHANGE_RATE_API }} HAPI_EOS_BP_JSON_ON_CHAIN: false - HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: "" - HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: "" - HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: "" + HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: '' + HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: '' + HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: '' HAPI_HASURA_URL: http://monitor-hasura:8080/v1/graphql - HAPI_HASURA_ADMIN_SECRET: ${{ secrets.HAPI_HASURA_ADMIN_SECRET }} + HAPI_HASURA_ADMIN_SECRET: ${{ secrets.HAPI_HASURA_ADMIN_SECRET }} HAPI_SERVER_PORT: 9090 HAPI_SERVER_ADDRESS: '0.0.0.0' HAPI_SYNC_PRODUCERS_INTERVAL: 86400 diff --git a/.github/workflows/push-lacchain-environment.yaml b/.github/workflows/push-lacchain-environment.yaml index ff576aa7..971c8ca1 100644 --- a/.github/workflows/push-lacchain-environment.yaml +++ b/.github/workflows/push-lacchain-environment.yaml @@ -55,6 +55,7 @@ jobs: REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: 'producerjson' REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: 'producerjson' REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: 'producerjson' + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} - name: Build and deploy kubernetes files id: build_kubernetes_files @@ -90,6 +91,7 @@ jobs: REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: 'producerjson' REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: 'producerjson' REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: 'producerjson' + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} # postgres POSTGRES_USER: ${{ secrets.POSTGRES_USER }} POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }} diff --git a/.github/workflows/push-master-environment.yaml b/.github/workflows/push-master-environment.yaml index 2ce3cfcd..cda6c664 100644 --- a/.github/workflows/push-master-environment.yaml +++ b/.github/workflows/push-master-environment.yaml @@ -31,6 +31,7 @@ jobs: DOCKER_USERNAME: ${{ secrets.DOCKER_HUB_USER }} DOCKER_PASSWORD: ${{ secrets.DOCKER_HUB_PASSWORD }} # Webapp + PORT: "80" REACT_APP_TITLE: "EOS Mainnet Network Dashboard" REACT_APP_DEFAULT_PRODUCER_LOGO: "https://bloks.io/img/eosio.png" @@ -45,12 +46,13 @@ jobs: REACT_APP_EOS_CHAIN_ID: "aca376f206b8fc25a6ed44dbdc66547c36c6c33e3a119ffbeaef943642f0e906" REACT_APP_EOS_DEFAULT_EXCHANGE_RATE: "2.50" REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API: ${{ secrets.REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API }} - REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: "false" + REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: 'false' REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: ${{ secrets.REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT }} REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: ${{ secrets.REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE }} REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: ${{ secrets.REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE }} - REACT_APP_EOS_API_NETWORK_LABEL: "Mainnet" - REACT_APP_EOS_API_NETWORK_LOGO: "https://bloks.io/img/eosio.png" + REACT_APP_EOS_API_NETWORK_LABEL: 'Mainnet' + REACT_APP_EOS_API_NETWORK_LOGO: 'https://bloks.io/img/eosio.png' + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} - name: Build and deploy kubernetes files id: build_kubernetes_files @@ -63,6 +65,7 @@ jobs: INGRESS_HOST: mainnet.eosio.cr INGRESS_GRAPHQL_HOST: graphql-mainnet.eosio.cr # Webapp + PORT: "80" REACT_APP_TITLE: "EOS Mainnet Network Dashboard" REACT_APP_DEFAULT_PRODUCER_LOGO: "https://bloks.io/img/eosio.png" @@ -77,38 +80,39 @@ jobs: REACT_APP_EOS_CHAIN_ID: "aca376f206b8fc25a6ed44dbdc66547c36c6c33e3a119ffbeaef943642f0e906" REACT_APP_EOS_DEFAULT_EXCHANGE_RATE: "2.50" REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API: ${{ secrets.REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API }} - REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: "false" + REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: 'false' REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: ${{ secrets.REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT }} REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: ${{ secrets.REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE }} REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: ${{ secrets.REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE }} - REACT_APP_EOS_API_NETWORK_LABEL: "Mainnet" - REACT_APP_EOS_API_NETWORK_LOGO: "https://bloks.io/img/eosio.png" + REACT_APP_EOS_API_NETWORK_LABEL: 'Mainnet' + REACT_APP_EOS_API_NETWORK_LOGO: 'https://bloks.io/img/eosio.png' + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} # postgres POSTGRES_USER: ${{ secrets.POSTGRES_USER }} POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }} POSTGRES_DB: ${{ secrets.POSTGRES_DB }} POSTGRES_DATA: ${{ secrets.POSTGRES_DATA }} # hapi - HAPI_EOS_API_ENDPOINT: "https://api.eosio.cr" - HAPI_EOS_API_CHAIN_ID: "e70aaab8997e1dfce58fbfac80cbbb8fecec7b99cf982a9444273cbc64c41473" + HAPI_EOS_API_ENDPOINT: 'https://api.eosio.cr' + HAPI_EOS_API_CHAIN_ID: 'e70aaab8997e1dfce58fbfac80cbbb8fecec7b99cf982a9444273cbc64c41473' HAPI_EOS_BASE_ACCOUNT: ${{ secrets.HAPI_EOS_BASE_ACCOUNT }} HAPI_EOS_BASE_ACCOUNT_PASSWORD: ${{ secrets.HAPI_EOS_BASE_ACCOUNT_PASSWORD }} HAPI_EOS_MECHANICS_ACCOUNT: ${{ secrets.HAPI_EOS_MECHANICS_ACCOUNT }} HAPI_EOS_MECHANICS_PASSWORD: ${{ secrets.HAPI_EOS_MECHANICS_PASSWORD }} HAPI_EOS_WALLET_URL: http://monitor-wallet:8888 - HAPI_EOS_BP_JSON_ON_CHAIN: "false" - HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: "" - HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: "" - HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: "" - HAPI_HASURA_URL: "http://monitor-hasura:8080/v1/graphql" + HAPI_EOS_BP_JSON_ON_CHAIN: 'false' + HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: '' + HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: '' + HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: '' + HAPI_HASURA_URL: 'http://monitor-hasura:8080/v1/graphql' HAPI_HASURA_ADMIN_SECRET: ${{ secrets.HAPI_HASURA_ADMIN_SECRET }} - HAPI_SERVER_PORT: "9090" - HAPI_SERVER_ADDRESS: "0.0.0.0" - HAPI_SYNC_PRODUCERS_INTERVAL: "86400" - HAPI_SYNC_PRODUCER_INFO_INTERVAL: "1" - HAPI_SYNC_PRODUCER_CPU_INTERVAL: "6" + HAPI_SERVER_PORT: '9090' + HAPI_SERVER_ADDRESS: '0.0.0.0' + HAPI_SYNC_PRODUCERS_INTERVAL: '86400' + HAPI_SYNC_PRODUCER_INFO_INTERVAL: '1' + HAPI_SYNC_PRODUCER_CPU_INTERVAL: '6' # hasura - HASURA_GRAPHQL_ENABLE_CONSOLE: "true" + HASURA_GRAPHQL_ENABLE_CONSOLE: 'true' HASURA_GRAPHQL_DATABASE_URL: ${{ secrets.HASURA_GRAPHQL_DATABASE_URL }} HASURA_GRAPHQL_ADMIN_SECRET: ${{ secrets.HASURA_GRAPHQL_ADMIN_SECRET }} HASURA_GRAPHQL_UNAUTHORIZED_ROLE: ${{ secrets.HASURA_GRAPHQL_UNAUTHORIZED_ROLE }} diff --git a/.github/workflows/push-telos-environment.yaml b/.github/workflows/push-telos-environment.yaml index 6ffce18d..4a09e4b9 100644 --- a/.github/workflows/push-telos-environment.yaml +++ b/.github/workflows/push-telos-environment.yaml @@ -66,3 +66,91 @@ jobs: REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: producerjson REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: producerjson + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} + + - name: Build and deploy kubernetes files + id: build_kubernetes_files + run: | + make \ + build-kubernetes + env: + # general + NAMESPACE: telos-dashboard + INGRESS_HOST: telos.testnet.dashboard.eosio.cr + INGRESS_GRAPHQL_HOST: graphql-telos.dashboard.eosio.cr + # webapp + PORT: 80 + REACT_APP_VERSION: $npm_package_version + REACT_APP_NAME: $npm_package_name + REACT_APP_TITLE: Telos Testnet Network Dashboard + REACT_APP_DEFAULT_PRODUCER_LOGO: https://telos.bloks.io/img/chains/telos.png + REACT_APP_FOOTER_LINKS: + [ + { 'text': 'Website', 'src': '' }, + { 'text': 'Block Explorer', 'src': 'https://telos.bloks.io' }, + { + 'text': 'Developer Guidelines', + 'src': 'https://guide.eoscostarica.io' + }, + { + 'text': 'GitHub', + 'src': 'https://github.com/eoscostarica/eosio-dashboard' + } + ] + REACT_APP_EOS_RATE_LINK: '' + REACT_APP_USE_REWARDS: true + REACT_APP_USE_VOTES: true + REACT_APP_USE_CPU_BENCHMARK: true + REACT_APP_USE_BLOCK_PRODUCER_AGREEMENT_CONTRACT: true + REACT_APP_HASURA_URL: https://graphql-testnet.eosio.cr/v1/graphql + REACT_APP_EOS_API_NETWORK_NAME: telos + REACT_APP_EOS_API_NETWORK_LABEL: Telos + REACT_APP_EOS_API_NETWORK_LOGO: https://telos.bloks.io/img/chains/telos.png + REACT_APP_EOS_API_HOST: telos-testnet.eosio.cr + REACT_APP_EOS_API_PORT: 443 + REACT_APP_EOS_API_PROTOCOL: https + REACT_APP_EOS_CHAIN_ID: 1eaa0824707c8c16bd25145493bf062aecddfeb56c736f6ba6397f3195f33c9f + REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: false + REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: producerjson + REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: producerjson + REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: producerjson + REACT_APP_TOKEN_SYMBOL: ${{ secrets.REACT_APP_TOKEN_SYMBOL }} + # postgres + POSTGRES_USER: ${{ secrets.POSTGRES_USER }} + POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }} + POSTGRES_DB: ${{ secrets.POSTGRES_DB }} + POSTGRES_DATA: ${{ secrets.POSTGRES_DATA }} + # hapi + HAPI_EOS_API_ENDPOINT: https://telos-testnet.eosio.cr + HAPI_EOS_API_CHAIN_ID: 1eaa0824707c8c16bd25145493bf062aecddfeb56c736f6ba6397f3195f33c9f + HAPI_EOS_BASE_ACCOUNT: ${{ secrets.HAPI_EOS_BASE_ACCOUNT }} + HAPI_EOS_BASE_ACCOUNT_PASSWORD: ${{ secrets.HAPI_EOS_BASE_ACCOUNT_PASSWORD }} + HAPI_EOS_MECHANICS_ACCOUNT: ${{ secrets.HAPI_EOS_MECHANICS_ACCOUNT }} + HAPI_EOS_MECHANICS_PASSWORD: ${{ secrets.HAPI_EOS_MECHANICS_PASSWORD }} + HAPI_EOS_WALLET_URL: http://monitor-wallet:8888 + HAPI_EOS_BP_JSON_ON_CHAIN: 'false' + HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: producerjson + HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: producerjson + HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: producerjson + HAPI_HASURA_URL: 'http://monitor-hasura:8080/v1/graphql' + HAPI_HASURA_ADMIN_SECRET: ${{ secrets.HAPI_HASURA_ADMIN_SECRET }} + HAPI_SERVER_PORT: '9090' + HAPI_SERVER_ADDRESS: '127.0.0.1' + HAPI_SYNC_PRODUCERS_INTERVAL: '86400' + HAPI_SYNC_PRODUCER_INFO_INTERVAL: '1' + HAPI_SYNC_PRODUCER_CPU_INTERVAL: '6' + # hasura + HASURA_GRAPHQL_ENABLE_CONSOLE: 'true' + HASURA_GRAPHQL_DATABASE_URL: ${{ secrets.HASURA_GRAPHQL_DATABASE_URL }} + HASURA_GRAPHQL_ADMIN_SECRET: ${{ secrets.HASURA_GRAPHQL_ADMIN_SECRET }} + HASURA_GRAPHQL_UNAUTHORIZED_ROLE: ${{ secrets.HASURA_GRAPHQL_UNAUTHORIZED_ROLE }} + HASURA_GRAPHQL_MIGRATIONS_DIR: /hasura-migrations + + - name: Setup and deploy kubernetes environment + uses: steebchen/kubectl@master + env: + KUBE_CONFIG_DATA: ${{ secrets.KUBE_CONFIG_DATA }} + NAMESPACE: jungle-dashboard + K8S_BUILD_DIR: build_k8s + with: + args: version && make deploy-kubernetes diff --git a/docker-compose.yaml b/docker-compose.yaml index 98fd5bfe..98249f89 100644 --- a/docker-compose.yaml +++ b/docker-compose.yaml @@ -53,6 +53,7 @@ services: HAPI_SYNC_PRODUCERS_INTERVAL: '${HAPI_SYNC_PRODUCERS_INTERVAL}' HAPI_SYNC_PRODUCER_INFO_INTERVAL: '${HAPI_SYNC_PRODUCER_INFO_INTERVAL}' HAPI_SYNC_PRODUCER_CPU_INTERVAL: '${HAPI_SYNC_PRODUCER_CPU_INTERVAL}' + HAPI_COINGECKO_API_TOKEN_ID: '${HAPI_COINGECKO_API_TOKEN_ID}' HAPI_SYNC_STATS_INTERVAL: '${HAPI_SYNC_STATS_INTERVAL}' hasura: container_name: '${STAGE}-${APP_NAME}-hasura' @@ -102,3 +103,4 @@ services: REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: '${REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT}' REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: '${REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE}' REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: '${REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE}' + REACT_APP_TOKEN_SYMBOL: '${REACT_APP_TOKEN_SYMBOL}' diff --git a/hapi/src/config/eos.config.js b/hapi/src/config/eos.config.js index e22fcc92..430b3119 100644 --- a/hapi/src/config/eos.config.js +++ b/hapi/src/config/eos.config.js @@ -15,6 +15,7 @@ module.exports = { }, walletUrl: process.env.HAPI_EOS_WALLET_URL, exchangeRateApi: process.env.HAPI_EOS_EXCHANGE_RATE_API, + coingeckoApiTokenId: process.env.HAPI_COINGECKO_API_TOKEN_ID, bpJsonOnChain: process.env.HAPI_EOS_BP_JSON_ON_CHAIN === 'true', bpJsonOnChainContract: process.env.HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT, bpJsonOnChainTable: process.env.HAPI_EOS_BP_JSON_ON_CHAIN_TABLE, diff --git a/hapi/src/services/setting.service.js b/hapi/src/services/setting.service.js index fd81dcf1..dac00ef0 100644 --- a/hapi/src/services/setting.service.js +++ b/hapi/src/services/setting.service.js @@ -4,7 +4,7 @@ const { hasuraUtil, axiosUtil } = require('../utils') const UPSERT = ` mutation ($setting: setting_insert_input!) { - insert_setting(objects: [$setting], on_conflict: {constraint: setting_pkey, update_columns: [eos_price]}) { + insert_setting(objects: [$setting], on_conflict: {constraint: setting_pkey, update_columns: [token_price]}) { affected_rows } } @@ -18,12 +18,12 @@ const syncEOSPrice = async () => { const { data } = await axiosUtil.instance.get(eosConfig.exchangeRateApi) - if (!data || !data.success) { + if (!data) { return } await hasuraUtil.request(UPSERT, { - setting: { id: 1, eos_price: data.rates.EOS } + setting: { id: 1, token_price: data[eosConfig.coingeckoApiTokenId].usd } }) } catch (error) { console.error(error) diff --git a/hasura/metadata/tables.yaml b/hasura/metadata/tables.yaml index 1f1f97aa..26b19c41 100644 --- a/hasura/metadata/tables.yaml +++ b/hasura/metadata/tables.yaml @@ -22,83 +22,83 @@ schema: public name: cpu select_permissions: - - role: guest - permission: - columns: - - id - - usage - - created_at - - updated_at - - account - filter: {} + - role: guest + permission: + columns: + - id + - usage + - created_at + - updated_at + - account + filter: {} - table: schema: public name: missed_block select_permissions: - - role: guest - permission: - columns: - - id - - value - - created_at - - updated_at - - account - filter: {} + - role: guest + permission: + columns: + - id + - value + - created_at + - updated_at + - account + filter: {} - table: schema: public name: producer select_permissions: - - role: guest - permission: - columns: - - id - - owner - - total_votes - - producer_key - - is_active - - url - - unpaid_blocks - - last_claim_time - - location - - producer_authority - - bp_json - - server_version - - chain_id - - head_block_num - - last_irreversible_block_num - - last_irreversible_block_id - - head_block_id - - head_block_time - - head_block_producer - - virtual_block_cpu_limit - - virtual_block_net_limit - - block_cpu_limit - - block_net_limit - - server_version_string - - fork_db_head_block_num - - fork_db_head_block_id - - server_full_version_string - - ping - - total_votes_percent - - total_votes_eos - - block_rewards - - vote_rewards - - total_rewards - - created_at - - updated_at - - health_status - filter: {} - allow_aggregations: true + - role: guest + permission: + columns: + - id + - owner + - total_votes + - producer_key + - is_active + - url + - unpaid_blocks + - last_claim_time + - location + - producer_authority + - bp_json + - server_version + - chain_id + - head_block_num + - last_irreversible_block_num + - last_irreversible_block_id + - head_block_id + - head_block_time + - head_block_producer + - virtual_block_cpu_limit + - virtual_block_net_limit + - block_cpu_limit + - block_net_limit + - server_version_string + - fork_db_head_block_num + - fork_db_head_block_id + - server_full_version_string + - ping + - total_votes_percent + - total_votes_eos + - block_rewards + - vote_rewards + - total_rewards + - created_at + - updated_at + - health_status + filter: {} + allow_aggregations: true - table: schema: public name: setting select_permissions: - - role: guest - permission: - columns: - - id - - eos_price - filter: {} + - role: guest + permission: + columns: + - id + - token_price + filter: {} - table: schema: public name: stat diff --git a/hasura/migrations/1618439325029_alter_table_public_setting_alter_column_eos_price/down.sql b/hasura/migrations/1618439325029_alter_table_public_setting_alter_column_eos_price/down.sql new file mode 100644 index 00000000..db1d8eca --- /dev/null +++ b/hasura/migrations/1618439325029_alter_table_public_setting_alter_column_eos_price/down.sql @@ -0,0 +1 @@ +alter table "public"."setting" rename column "eos_price" to "token_price"; diff --git a/hasura/migrations/1618439325029_alter_table_public_setting_alter_column_eos_price/up.sql b/hasura/migrations/1618439325029_alter_table_public_setting_alter_column_eos_price/up.sql new file mode 100644 index 00000000..db1d8eca --- /dev/null +++ b/hasura/migrations/1618439325029_alter_table_public_setting_alter_column_eos_price/up.sql @@ -0,0 +1 @@ +alter table "public"."setting" rename column "eos_price" to "token_price"; diff --git a/kubernetes/configmap-dashboard.yaml b/kubernetes/configmap-dashboard.yaml index f43b7d43..9f6a96fa 100644 --- a/kubernetes/configmap-dashboard.yaml +++ b/kubernetes/configmap-dashboard.yaml @@ -18,14 +18,15 @@ data: REACT_APP_EOS_API_PROTOCOL: "${REACT_APP_EOS_API_PROTOCOL}" REACT_APP_EOS_CHAIN_ID: "${REACT_APP_EOS_CHAIN_ID}" REACT_APP_EOS_INCLUDE_TRANSACTION: '${REACT_APP_EOS_INCLUDE_TRANSACTION}' - REACT_APP_EOS_DEFAULT_EXCHANGE_RATE: "${REACT_APP_EOS_DEFAULT_EXCHANGE_RATE}" - REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API: "${REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API}" - REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: "${REACT_APP_EOS_USE_BP_JSON_ON_CHAIN}" - REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: "${REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT}" - REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: "${REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE}" - REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: "${REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE}" - REACT_APP_EOS_API_NETWORK_LABEL: "${REACT_APP_EOS_API_NETWORK_LABEL}" - REACT_APP_EOS_API_NETWORK_LOGO: "${REACT_APP_EOS_API_NETWORK_LOGO}" + REACT_APP_EOS_DEFAULT_EXCHANGE_RATE: '${REACT_APP_EOS_DEFAULT_EXCHANGE_RATE}' + REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API: '${REACT_APP_EOS_DEFAULT_EXCHANGE_RATE_API}' + REACT_APP_EOS_USE_BP_JSON_ON_CHAIN: '${REACT_APP_EOS_USE_BP_JSON_ON_CHAIN}' + REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT: '${REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT}' + REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE: '${REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE}' + REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE: '${REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE}' + REACT_APP_EOS_API_NETWORK_LABEL: '${REACT_APP_EOS_API_NETWORK_LABEL}' + REACT_APP_EOS_API_NETWORK_LOGO: '${REACT_APP_EOS_API_NETWORK_LOGO}' + REACT_APP_TOKEN_SYMBOL: '${REACT_APP_TOKEN_SYMBOL}' --- apiVersion: v1 kind: ConfigMap @@ -33,10 +34,10 @@ metadata: name: monitor-postgres-config data: # postgres - POSTGRES_USER: "${POSTGRES_USER}" - POSTGRES_PASSWORD: "${POSTGRES_PASSWORD}" - POSTGRES_DB: "${POSTGRES_DB}" - POSTGRES_DATA: "${POSTGRES_DATA}" + POSTGRES_USER: '${POSTGRES_USER}' + POSTGRES_PASSWORD: '${POSTGRES_PASSWORD}' + POSTGRES_DB: '${POSTGRES_DB}' + POSTGRES_DATA: '${POSTGRES_DATA}' --- apiVersion: v1 kind: ConfigMap @@ -44,28 +45,28 @@ metadata: name: monitor-hapi-config data: # hapi - HAPI_EOS_API_ENDPOINT: "${HAPI_EOS_API_ENDPOINT}" - HAPI_EOS_STATE_HISTORY_PLUGIN_ENDPOINT: "${HAPI_EOS_STATE_HISTORY_PLUGIN_ENDPOINT}" - HAPI_EOS_API_NETWORK_NAME: "${HAPI_EOS_API_NETWORK_NAME}" - HAPI_EOS_API_CHAIN_ID: "${HAPI_EOS_API_CHAIN_ID}" - HAPI_EOS_BASE_ACCOUNT: "${HAPI_EOS_BASE_ACCOUNT}" - HAPI_EOS_BASE_ACCOUNT_PASSWORD: "${HAPI_EOS_BASE_ACCOUNT_PASSWORD}" - HAPI_EOS_MECHANICS_ACCOUNT: "${HAPI_EOS_MECHANICS_ACCOUNT}" - HAPI_EOS_MECHANICS_PASSWORD: "${HAPI_EOS_MECHANICS_PASSWORD}" + HAPI_EOS_API_ENDPOINT: '${HAPI_EOS_API_ENDPOINT}' + HAPI_EOS_STATE_HISTORY_PLUGIN_ENDPOINT: '${HAPI_EOS_STATE_HISTORY_PLUGIN_ENDPOINT}' + HAPI_EOS_API_NETWORK_NAME: '${HAPI_EOS_API_NETWORK_NAME}' + HAPI_EOS_API_CHAIN_ID: '${HAPI_EOS_API_CHAIN_ID}' + HAPI_EOS_BASE_ACCOUNT: '${HAPI_EOS_BASE_ACCOUNT}' + HAPI_EOS_BASE_ACCOUNT_PASSWORD: '${HAPI_EOS_BASE_ACCOUNT_PASSWORD}' + HAPI_EOS_MECHANICS_ACCOUNT: '${HAPI_EOS_MECHANICS_ACCOUNT}' + HAPI_EOS_MECHANICS_PASSWORD: '${HAPI_EOS_MECHANICS_PASSWORD}' HAPI_EOS_MECHANICS_INCLUDE_TRANSACTION: '${HAPI_EOS_MECHANICS_INCLUDE_TRANSACTION}' - HAPI_EOS_WALLET_URL: "${HAPI_EOS_WALLET_URL}" - HAPI_EOS_BP_JSON_ON_CHAIN: "${HAPI_EOS_BP_JSON_ON_CHAIN}" - HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: "${HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT}" - HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: "${HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT}" - HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: "${HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE}" - HAPI_HASURA_URL: "${HAPI_HASURA_URL}" - HAPI_HASURA_ADMIN_SECRET: "${HAPI_HASURA_ADMIN_SECRET}" - HAPI_SERVER_PORT: "${HAPI_SERVER_PORT}" - HAPI_SERVER_ADDRESS: "${HAPI_SERVER_ADDRESS}" - HAPI_SYNC_PRODUCERS_INTERVAL: "${HAPI_SYNC_PRODUCERS_INTERVAL}" - HAPI_SYNC_PRODUCER_INFO_INTERVAL: "${HAPI_SYNC_PRODUCER_INFO_INTERVAL}" - HAPI_SYNC_PRODUCER_CPU_INTERVAL: "${HAPI_SYNC_PRODUCER_CPU_INTERVAL}" - HAPI_SYNC_STATS_INTERVAL: "${HAPI_SYNC_STATS_INTERVAL}" + HAPI_EOS_WALLET_URL: '${HAPI_EOS_WALLET_URL}' + HAPI_EOS_BP_JSON_ON_CHAIN: '${HAPI_EOS_BP_JSON_ON_CHAIN}' + HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT: '${HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT}' + HAPI_EOS_BP_JSON_ON_CHAIN_TABLE: '${HAPI_EOS_BP_JSON_ON_CHAIN_CONTRACT}' + HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE: '${HAPI_EOS_BP_JSON_ON_CHAIN_SCOPE}' + HAPI_HASURA_URL: '${HAPI_HASURA_URL}' + HAPI_HASURA_ADMIN_SECRET: '${HAPI_HASURA_ADMIN_SECRET}' + HAPI_SERVER_PORT: '${HAPI_SERVER_PORT}' + HAPI_SERVER_ADDRESS: '${HAPI_SERVER_ADDRESS}' + HAPI_SYNC_PRODUCERS_INTERVAL: '${HAPI_SYNC_PRODUCERS_INTERVAL}' + HAPI_SYNC_PRODUCER_INFO_INTERVAL: '${HAPI_SYNC_PRODUCER_INFO_INTERVAL}' + HAPI_SYNC_PRODUCER_CPU_INTERVAL: '${HAPI_SYNC_PRODUCER_CPU_INTERVAL}' + HAPI_SYNC_STATS_INTERVAL: '${HAPI_SYNC_STATS_INTERVAL}' --- apiVersion: v1 kind: ConfigMap @@ -73,8 +74,8 @@ metadata: name: monitor-hasura-config data: # hasura - HASURA_GRAPHQL_ENABLE_CONSOLE: "${HASURA_GRAPHQL_ENABLE_CONSOLE}" - HASURA_GRAPHQL_DATABASE_URL: "${HASURA_GRAPHQL_DATABASE_URL}" - HASURA_GRAPHQL_ADMIN_SECRET: "${HASURA_GRAPHQL_ADMIN_SECRET}" - HASURA_GRAPHQL_UNAUTHORIZED_ROLE: "${HASURA_GRAPHQL_UNAUTHORIZED_ROLE}" - HASURA_GRAPHQL_ACTION_BASE_URL: "${HASURA_GRAPHQL_ACTION_BASE_URL}" + HASURA_GRAPHQL_ENABLE_CONSOLE: '${HASURA_GRAPHQL_ENABLE_CONSOLE}' + HASURA_GRAPHQL_DATABASE_URL: '${HASURA_GRAPHQL_DATABASE_URL}' + HASURA_GRAPHQL_ADMIN_SECRET: '${HASURA_GRAPHQL_ADMIN_SECRET}' + HASURA_GRAPHQL_UNAUTHORIZED_ROLE: '${HASURA_GRAPHQL_UNAUTHORIZED_ROLE}' + HASURA_GRAPHQL_ACTION_BASE_URL: '${HASURA_GRAPHQL_ACTION_BASE_URL}' diff --git a/webapp/Dockerfile b/webapp/Dockerfile index 31657a7e..385f26e4 100644 --- a/webapp/Dockerfile +++ b/webapp/Dockerfile @@ -21,6 +21,7 @@ ARG react_app_eos_use_bp_json_on_chain ARG react_app_eos_bp_json_on_chain_contract ARG react_app_eos_bp_json_on_chain_table ARG react_app_eos_bp_json_on_chain_scope +ARG react_app_token_symbol ENV WORK_DIR /usr/src/app ENV PATH $WORK_DIR/node_modules/.bin:$PATH @@ -47,6 +48,7 @@ ENV REACT_APP_EOS_USE_BP_JSON_ON_CHAIN $react_app_eos_use_bp_json_on_chain ENV REACT_APP_EOS_BP_JSON_ON_CHAIN_CONTRACT $react_app_eos_bp_json_on_chain_contract ENV REACT_APP_EOS_BP_JSON_ON_CHAIN_TABLE $react_app_eos_bp_json_on_chain_table ENV REACT_APP_EOS_BP_JSON_ON_CHAIN_SCOPE $react_app_eos_bp_json_on_chain_scope +ENV REACT_APP_TOKEN_SYMBOL $react_app_token_symbol RUN mkdir -p $WORK_DIR WORKDIR $WORK_DIR diff --git a/webapp/src/components/InformationCard/index.js b/webapp/src/components/InformationCard/index.js new file mode 100644 index 00000000..fc7af5d0 --- /dev/null +++ b/webapp/src/components/InformationCard/index.js @@ -0,0 +1,205 @@ +import React, { memo, useState, useEffect } from 'react' +import PropTypes from 'prop-types' +import { makeStyles, useTheme } from '@material-ui/core/styles' +import Card from '@material-ui/core/Card' +import CardHeader from '@material-ui/core/CardHeader' +import CardActions from '@material-ui/core/CardActions' +import Collapse from '@material-ui/core/Collapse' +import { useTranslation } from 'react-i18next' +import Box from '@material-ui/core/Box' +import Typography from '@material-ui/core/Typography' +import InfoOutlinedIcon from '@material-ui/icons/InfoOutlined' +import Link from '@material-ui/core/Link' +import Button from '@material-ui/core/Button' +import useMediaQuery from '@material-ui/core/useMediaQuery' + +import moment from 'moment' +import 'flag-icon-css/css/flag-icon.min.css' + +import { onImgError } from '../../utils' +import { generalConfig } from '../../config' +import CountryFlag from '../CountryFlag' +import ProducerSocialLinks from '../ProducerSocialLinks' +import ProducerHealthIndicators from '../ProducerHealthIndicators' + +import styles from './styles' + +const useStyles = makeStyles(styles) + +const InformationCard = ({ producer, rank, onNodeClick }) => { + const classes = useStyles() + const theme = useTheme() + const { t } = useTranslation('producerCardComponent') + + const matches = useMediaQuery(theme.breakpoints.up('lg')) + const [expanded, setExpanded] = useState(false) + const [producerOrg, setProducerOrg] = useState({}) + const [producerNodes, setProducerNodes] = useState([]) + + const handleExpandClick = () => { + setExpanded(!expanded) + } + + useEffect(() => { + setProducerOrg(producer.bp_json?.org || {}) + setProducerNodes(producer.bp_json?.nodes || []) + }, [producer]) + + return ( + + + + + avatar + + {producerOrg.candidate_name || + producerOrg.organization_name || + producer.owner} + + 12letteracco + + + + + Info + + Location:{` ${producerOrg.location?.name || 'N/A'} `} + + + + Website:{' '} + + {producerOrg.website} + + + + Email:{' '} + {producerOrg.email ? ( + + {producerOrg.email} + + ) : ( + 'N/A' + )} + + + Onwership Disclosure:{' '} + {producerOrg.chain_resources ? ( + + {producerOrg.ownership_disclosure} + + ) : ( + 'N/A' + )} + + + Chain Resources:{' '} + {producerOrg.chain_resources ? ( + + {producerOrg.chain_resources} + + ) : ( + 'N/A' + )} + + + + + Stats + Votes: N/A + Rewards: 0 eos + + Last Checked: + {` ${moment(new Date()).diff( + moment(producer.updated_at), + 'seconds' + )} ${t('secondsAgo')}`} + + + Missed Blocks:{' '} + {(producer.missed_blocks || []).reduce( + (result, current) => result + current.value, + 0 + )} + + + + {t('nodes')} + + {producerNodes.length > 0 && ( + <> + {producerNodes.map((node, i) => ( + + {node.node_name || node.node_type}{' '} + + + ))} + + )} + + + + + + Health Social + + + + Social + + + + + + + + + + + + + + + ) +} + +InformationCard.propTypes = { + producer: PropTypes.any, + rank: PropTypes.number, + onNodeClick: PropTypes.func +} + +InformationCard.defaultProps = { + producer: {}, + rank: 0, + onNodeClick: () => {} +} + +export default memo(InformationCard) diff --git a/webapp/src/components/InformationCard/styles.js b/webapp/src/components/InformationCard/styles.js new file mode 100644 index 00000000..b154a4aa --- /dev/null +++ b/webapp/src/components/InformationCard/styles.js @@ -0,0 +1,149 @@ +export default (theme) => ({ + root: { + width: '100%', + marginBottom: theme.spacing(2), + paddingBottom: 0, + [theme.breakpoints.up('sm')]: { + width: 300 + }, + [theme.breakpoints.up('lg')]: { + width: '100%', + paddingBottom: theme.spacing(2) + } + }, + wrapper: { + display: 'flex', + flexDirection: 'column', + padding: theme.spacing(4), + '& .bodyWrapper': { + display: 'flex', + flexDirection: 'column' + }, + [theme.breakpoints.up('lg')]: { + flexDirection: 'row', + '& .bodyWrapper': { + flexDirection: 'row' + } + } + }, + media: { + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + padding: 0, + '& img': { + width: 82, + height: 82, + borderRadius: 40 + }, + '& .bpName': { + fontSize: 28, + lineHeight: '34px', + letterSpacing: '-0.233333px', + marginBottom: theme.spacing(1), + textAlign: 'center' + }, + [theme.breakpoints.up('lg')]: { + padding: theme.spacing(0, 6) + } + }, + expand: { + transform: 'rotate(0deg)', + marginLeft: 'auto', + transition: theme.transitions.create('transform', { + duration: theme.transitions.duration.shortest + }) + }, + expandOpen: { + transform: 'rotate(180deg)' + }, + expandMore: { + width: '100%', + display: 'flex', + justifyContent: 'center', + '& .MuiButtonBase-root': { + textTransform: 'capitalize' + } + }, + info: { + borderLeft: 'none', + marginBottom: theme.spacing(3), + '& .MuiTypography-body1': { + margin: theme.spacing(1, 0), + whiteSpace: 'nowrap', + textOverflow: 'ellipsis', + overflow: 'hidden', + maxWidth: 350 + }, + [theme.breakpoints.up('lg')]: { + borderLeft: '1px solid rgba(0, 0, 0, 0.2)', + + padding: theme.spacing(0, 2), + marginBottom: 0 + } + }, + twoBoxes: { + marginBottom: theme.spacing(3), + borderLeft: 'none', + display: 'flex', + justifyContent: 'space-between', + '& .MuiTypography-body1': { + margin: theme.spacing(1, 0), + display: 'flex', + whiteSpace: 'nowrap', + textOverflow: 'ellipsis', + overflow: 'hidden' + }, + '& .nodes': { + borderLeft: 'none', + width: 100, + '& .MuiSvgIcon-root': { + marginLeft: theme.spacing(1), + fontSize: 20 + } + }, + '& .healthStatus': { + '& .MuiSvgIcon-root': { + marginLeft: theme.spacing(1), + fontSize: 20 + } + }, + '& .social': { + borderLeft: 'none', + width: 100, + '& a': { + display: 'flex' + }, + '& svg': { + marginRight: theme.spacing(1) + } + }, + '& .success': { + color: theme.palette.success.main + }, + '& .error': { + color: theme.palette.error.main + }, + '& .warning': { + color: theme.palette.warning.main + }, + [theme.breakpoints.up('lg')]: { + padding: theme.spacing(0, 2), + marginBottom: 0, + borderLeft: '1px solid rgba(0, 0, 0, 0.2)', + + '& .nodes, .social': { + borderLeft: '1px solid rgba(0, 0, 0, 0.2)', + + paddingLeft: theme.spacing(1), + marginRight: theme.spacing(2) + } + } + }, + cardActions: { + display: 'flex', + [theme.breakpoints.up('lg')]: { + display: 'none' + } + } +}) diff --git a/webapp/src/components/ProducerHealthIndicators.js b/webapp/src/components/ProducerHealthIndicators.js index 3695ad9d..c9d04739 100644 --- a/webapp/src/components/ProducerHealthIndicators.js +++ b/webapp/src/components/ProducerHealthIndicators.js @@ -4,24 +4,14 @@ import PropTypes from 'prop-types' import { makeStyles } from '@material-ui/styles' import Tooltip from '@material-ui/core/Tooltip' import { useTranslation } from 'react-i18next' -import WarningIcon from '@material-ui/icons/Warning' - -import DoneAllIcon from '@material-ui/icons/DoneAll' +import DoneOutlinedIcon from '@material-ui/icons/DoneOutlined' +import ReportProblemOutlinedIcon from '@material-ui/icons/ReportProblemOutlined' import { Box, Typography } from '@material-ui/core' const useStyles = makeStyles(() => ({ wrapper: { display: 'flex', - justifyContent: 'space-between' - }, - valid: { - color: 'green' - }, - error: { - color: 'orange' - }, - warning: { - color: 'yellow' + alignItems: 'center' } })) @@ -39,8 +29,8 @@ const ProducerHealthIndicators = ({ producer }) => { > {t(`hs_${item.name}`)} - {item.valid && } - {!item.valid && } + {item.valid && } + {!item.valid && } ))} diff --git a/webapp/src/components/TransactionsLineChart.js b/webapp/src/components/TransactionsLineChart.js index abf9f8d3..fe2c6964 100644 --- a/webapp/src/components/TransactionsLineChart.js +++ b/webapp/src/components/TransactionsLineChart.js @@ -1,152 +1,41 @@ import React from 'react' -import Typography from '@material-ui/core/Typography' -import Box from '@material-ui/core/Box' -import { makeStyles } from '@material-ui/styles' -import { useTheme } from '@material-ui/core/styles' -import Divider from '@material-ui/core/Divider' -import { useTranslation } from 'react-i18next' -import Skeleton from '@material-ui/lab/Skeleton' +import HighchartsReact from 'highcharts-react-official' import PropTypes from 'prop-types' -import { - LineChart, - Line, - YAxis, - Tooltip, - Legend, - ResponsiveContainer -} from 'recharts' +import Highcharts from 'highcharts' +import Box from '@material-ui/core/Box' -const useStyles = makeStyles((theme) => ({ - wrapper: { - backgroundColor: theme.palette.white, - padding: theme.spacing(2), - borderRadius: theme.spacing(1), - boxShadow: theme.shadows[8] - }, - description: { - fontWeight: 'normal' - }, - graphSkeleton: { - width: '100%', - margin: theme.spacing(1), - '& .MuiSkeleton-rect': { - width: '100%', - height: 300 +const LineChart = ({ data, xAxisProps, title }) => { + const options = { + title: { + text: title + }, + chart: { + animation: false, + type: 'spline' }, - '& .MuiBox-root': { - display: 'flex', - justifyContent: 'center', - '& .MuiSkeleton-text': { - margin: theme.spacing(0, 1) - } - } + xAxis: xAxisProps } -})) - -const GraphSkeleton = () => { - const classes = useStyles() return ( - - - - - - + + ) } -const CustomTooltip = ({ active, payload }) => { - const classes = useStyles() - const { t } = useTranslation('transactionsChartComponent') - - if (active && payload && payload?.length > 0) { - return ( - - {t('transactions')} - - {t('perSecond')} - - {t('amount')}:{' '} - {payload[0].payload.tps} - - - {t('blocks')}:{' '} - - {' '} - {payload[0].payload.blocks.tps.join(', ')} - - - {t('perBlock')} - - {t('amount')}:{' '} - {payload[0].payload.tpb} - - - {t('blocks')}:{' '} - - {' '} - {payload[0].payload.blocks.tpb.join(', ')} - - - - ) - } - - return null -} - -CustomTooltip.propTypes = { - active: PropTypes.bool, - payload: PropTypes.array -} - -const TransactionsChart = ({ data, loading }) => { - const theme = useTheme() - const { t } = useTranslation('transactionsChartComponent') - - if (loading) return - - return ( - - - - } /> - - - - - - ) +LineChart.propTypes = { + data: PropTypes.array, + xAxisProps: PropTypes.object, + title: PropTypes.string } -TransactionsChart.propTypes = { - data: PropTypes.array, - loading: PropTypes.bool +LineChart.defaultProps = { + data: [], + xAxisProps: { xAxisVisible: false }, + title: '' } -export default TransactionsChart +export default LineChart diff --git a/webapp/src/config/eos.config.js b/webapp/src/config/eos.config.js index b84d9fe4..620aa6e6 100644 --- a/webapp/src/config/eos.config.js +++ b/webapp/src/config/eos.config.js @@ -15,6 +15,7 @@ export const bpJsonOnChainScope = export const networkName = process.env.REACT_APP_EOS_API_NETWORK_NAME export const networkLabel = process.env.REACT_APP_EOS_API_NETWORK_LABEL export const networkLogo = process.env.REACT_APP_EOS_API_NETWORK_LOGO +export const tokenSymbol = process.env.REACT_APP_TOKEN_SYMBOL let _nodeTypes = null diff --git a/webapp/src/gql/setting.gql.js b/webapp/src/gql/setting.gql.js index 9d389708..c58fe233 100644 --- a/webapp/src/gql/setting.gql.js +++ b/webapp/src/gql/setting.gql.js @@ -4,7 +4,7 @@ export const SETTING_QUERY = gql` query setting { setting: setting_by_pk(id: 1) { id - eos_price + token_price } } ` diff --git a/webapp/src/routes/BlockProducers.js b/webapp/src/routes/BlockProducers.js index 97299ee6..433135e7 100644 --- a/webapp/src/routes/BlockProducers.js +++ b/webapp/src/routes/BlockProducers.js @@ -11,9 +11,9 @@ import queryString from 'query-string' import { PRODUCERS_QUERY } from '../gql' import ProducerSearch from '../components/ProducerSearch' -import ProducerCard from '../components/ProducerCard' import Tooltip from '../components/Tooltip' import NodeCard from '../components/NodeCard' +import InformationCard from '../components/InformationCard' const useStyles = makeStyles((theme) => ({ searchWrapper: { @@ -122,17 +122,10 @@ const Producers = () => { {loading && } - + {(producers || []).map((producer, index) => ( - - + { useEffect(() => { const majorLength = tps.length > tpb.length ? tps.length : tpb.length - const dataModeled = [] + const trxPerSecond = [] + const trxPerBlock = [] if (!majorLength || pause || option !== '0') return for (let index = 0; index < majorLength; index++) { - dataModeled.push({ - tps: tps[index] ? tps[index].transactions : 0, - tpb: tpb[index] ? tpb[index].transactions : 0, - blocks: { - tps: tps[index] ? tps[index].blocks : [0], - tpb: tpb[index] ? tpb[index].blocks : [0] - } - }) + const labelBlockPS = `Blocks:[${(tps[index] + ? tps[index].blocks + : [''] + ).join()}]` + const labelBlockPB = `Blocks:[${(tpb[index] + ? tpb[index].blocks + : [] + ).join()}]` + + trxPerSecond.push([ + labelBlockPS, + tps[index] ? tps[index].transactions : 0 + ]) + trxPerBlock.push([labelBlockPB, tpb[index] ? tpb[index].transactions : 0]) } - setGraphicData(dataModeled) + setGraphicData([ + { + name: 'Transactions per Second', + color: theme.palette.secondary.main, + data: trxPerSecond + }, + { + name: 'Transactions per Block', + color: '#00C853', + data: trxPerBlock + } + ]) + // eslint-disable-next-line }, [tps, tpb]) useEffect(() => { @@ -74,11 +93,12 @@ const TransactionInfo = ({ t, classes }) => { }, [option, getTransactionHistory]) useEffect(() => { - const dataModeled = [] + const trxPerSecond = [] + const trxPerBlock = [] if (option !== '0') { if (!trxHistory?.block_history?.length) { - setGraphicData(dataModeled) + setGraphicData([]) return } @@ -87,20 +107,26 @@ const TransactionInfo = ({ t, classes }) => { const item = trxHistory.block_history[i] || baseValues const prevItem = trxHistory.block_history[i - 1] || baseValues const trxPer = item.transaction_length + prevItem.transaction_length - const blocks = [item.block_num, prevItem.block_num] - - dataModeled.push({ - tps: trxPer, - tpb: trxPer, - blocks: { - tps: blocks, - tpb: blocks - } - }) + const blocks = `Blocks:[${item.block_num}, ${prevItem.block_num}]` + + trxPerSecond.push([blocks, trxPer]) + trxPerBlock.push([blocks, trxPer]) } - setGraphicData(dataModeled) + setGraphicData([ + { + name: 'Transactions per Second', + color: theme.palette.secondary.main, + data: trxPerSecond + }, + { + name: 'Transactions per Block', + color: '#00C853', + data: trxPerBlock + } + ]) } + // eslint-disable-next-line }, [trxHistoryLoading, trxHistory]) return ( @@ -154,10 +180,7 @@ const TransactionInfo = ({ t, classes }) => { - + diff --git a/webapp/src/routes/NetworkInfo.js b/webapp/src/routes/NetworkInfo.js index f77c6112..fd757eaa 100644 --- a/webapp/src/routes/NetworkInfo.js +++ b/webapp/src/routes/NetworkInfo.js @@ -1,5 +1,5 @@ /* eslint camelcase: 0 */ -import React, { useEffect } from 'react' +import React, { useEffect, useState } from 'react' import { useDispatch } from 'react-redux' import { useQuery } from '@apollo/react-hooks' import { makeStyles } from '@material-ui/styles' @@ -8,9 +8,11 @@ import Card from '@material-ui/core/Card' import CardHeader from '@material-ui/core/CardHeader' import CardContent from '@material-ui/core/CardContent' import CardActions from '@material-ui/core/CardActions' +import moment from 'moment' import { useTranslation } from 'react-i18next' -import MultiLineChart from '../components/MultiLineChart' +import TransactionsLineChart from '../components/TransactionsLineChart' + import { NETWORK_STATS } from '../gql' import { generalConfig } from '../config' @@ -34,18 +36,73 @@ const Network = () => { const dispatch = useDispatch() const classes = useStyles() const { t } = useTranslation('networkInfoRoute') + const [missedBlock, setMissedBlock] = useState({}) + const [cpuData, setCpuData] = useState({}) const { data: stats } = useQuery(NETWORK_STATS) + const getDataModeled = (items = [], valueName) => { + if (!items.length) return { data: [], firstDate: null, lastDate: null } + + const itemsSorted = items + .map((block) => ({ + ...block, + value: block[valueName], + time: moment(block.created_at).unix() + })) + .sort((blockA, blockB) => blockA.time - blockB.time) + + const firstDate = itemsSorted[0].time + const lastDate = itemsSorted[itemsSorted.length - 1].time + + const itemsData = itemsSorted.reduce((acc, current) => { + const timeFormat = moment.unix(current.time).format('HH:mm') + + if (!acc.length) { + return [ + { + name: current.account, + data: [[timeFormat, current.value]] + } + ] + } + + const dataIndex = acc.findIndex((item) => item.name === current.account) + + if (dataIndex >= 0) { + acc[dataIndex].data.push([timeFormat, current.value]) + + return acc + } + + return [ + ...acc, + { + name: current.account, + data: [[timeFormat, current.value]] + } + ] + }, []) + + return { data: itemsData, firstDate, lastDate } + } + useEffect(() => { dispatch.eos.startTrackingInfo({ interval: 0 }) - }, [dispatch]) - useEffect(() => { return () => { dispatch.eos.stopTrackingInfo() } }, [dispatch]) + useEffect(() => { + if (stats) { + const { cpu, missed_block } = stats + + setCpuData(getDataModeled(cpu, 'usage')) + setMissedBlock(getDataModeled(missed_block, 'value')) + } + }, [stats]) + return ( {generalConfig.useCpuBenchmark && ( @@ -53,11 +110,7 @@ const Network = () => { - `${value}us`} - /> + @@ -67,11 +120,7 @@ const Network = () => { - `${value} ${t('missedBlocks')}`} - /> + diff --git a/webapp/src/routes/RewardsDistribution.js b/webapp/src/routes/RewardsDistribution.js index 0fae3dac..fc097165 100644 --- a/webapp/src/routes/RewardsDistribution.js +++ b/webapp/src/routes/RewardsDistribution.js @@ -26,6 +26,7 @@ import { countries } from '../utils/countries' import { PRODUCERS_QUERY, SETTING_QUERY } from '../gql' import CountryFlag from '../components/CountryFlag' import Tooltip from '../components/Tooltip' +import { eosConfig } from '../config' const lowestRewardsColor = '#B6EBF3' const highestRewardsColor = '#265F63' @@ -236,7 +237,8 @@ const RewardsDistribution = () => { {t('rewards')}: - {formatWithThousandSeparator(currentNode?.rewards, 2)} EOS + {formatWithThousandSeparator(currentNode?.rewards, 2)}{' '} + {eosConfig.tokenSymbol} @@ -255,7 +257,8 @@ const RewardsDistribution = () => { {producer?.bp_json?.org?.candidate_name || producer.owner}
- {formatWithThousandSeparator(producer.total_rewards, 2)} EOS + {formatWithThousandSeparator(producer.total_rewards, 2)}{' '} + {eosConfig.tokenSymbol} ))} @@ -273,7 +276,8 @@ const RewardsDistribution = () => { )} {nodes.length > 0 && ( - {formatWithThousandSeparator(summary.daylyRewars, 2)} EOS + {formatWithThousandSeparator(summary.daylyRewars, 2)}{' '} + {eosConfig.tokenSymbol} )} @@ -281,11 +285,11 @@ const RewardsDistribution = () => { {!nodes.length > 0 && ( )} - {nodes.length > 0 && setting?.eos_price && ( + {nodes.length > 0 && setting?.token_price && ( $ {formatWithThousandSeparator( - summary.daylyRewars * setting?.eos_price, + summary.daylyRewars * setting?.token_price, 0 )}{' '} USD @@ -317,15 +321,16 @@ const RewardsDistribution = () => { {!nodes.length > 0 && ( )} - {nodes.length > 0 && setting?.eos_price && ( + {nodes.length > 0 && setting?.token_price && ( <> {formatWithThousandSeparator( summary.topCountryByRewards.rewards, 0 )}{' '} - EOS / $ + {eosConfig.tokenSymbol} / $ {formatWithThousandSeparator( - summary.topCountryByRewards.rewards * setting?.eos_price, + summary.topCountryByRewards.rewards * + setting?.token_price, 0 )}{' '} USD @@ -379,12 +384,12 @@ const RewardsDistribution = () => { - {setting?.eos_price && ( + {setting?.token_price && ( {t('exchangeRate')}:{' '} {' '} - ${formatWithThousandSeparator(setting.eos_price, 2)} + ${formatWithThousandSeparator(setting.token_price, 2)} )}