Merge pull request #1186 from blockscout/governance-token

add governance token symbol

configs/app/chain.ts

@@ -11,6 +11,9 @@ const chain = Object.freeze({
     symbol: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL),
     decimals: Number(getEnvValue(process.env.NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS)) || DEFAULT_CURRENCY_DECIMALS,
   },
+  governanceToken: {
+    symbol: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_GOVERNANCE_TOKEN_SYMBOL),
+  },
   rpcUrl: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_RPC_URL),
   isTestnet: getEnvValue(process.env.NEXT_PUBLIC_IS_TESTNET) === 'true',
   verificationType: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE) || 'mining',

docs/ENVS.md

@@ -61,6 +61,7 @@ The app instance could be customized by passing following variables to NodeJS en
 | NEXT_PUBLIC_NETWORK_CURRENCY_NAME | `string` | Network currency name | - | - | `Ether` |
 | NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL | `string` | Network currency symbol | - | - | `ETH` |
 | NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS | `string` | Network currency decimals | - | `18` | `6` |
+| NEXT_PUBLIC_NETWORK_GOVERNANCE_TOKEN_SYMBOL | `string` | Network governance token symbol | - | - | `GNO` |
 | NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE | `validation` or `mining` | Verification type in the network | - | `mining` | `validation` |
 | NEXT_PUBLIC_IS_TESTNET | `boolean`| Set to true if network is testnet | - | `false` | `true` |
 

types/envs.ts

@@ -12,6 +12,7 @@ export type NextPublicEnvs = {
   NEXT_PUBLIC_NETWORK_CURRENCY_NAME?: string;
   NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL?: string;
   NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS?: string;
+  NEXT_PUBLIC_NETWORK_GOVERNANCE_TOKEN_SYMBOL?: string;
   NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE?: 'validation' | 'mining';
   NEXT_PUBLIC_IS_TESTNET?: 'true' | '';
 

ui/home/indicators/utils/indicators.tsx

@@ -36,17 +36,17 @@ const nativeTokenData = {
 
 const coinPriceIndicator: TChainIndicator<'homepage_chart_market'> = {
   id: 'coin_price',
-  title: `${ config.chain.currency.symbol } price`,
+  title: `${ config.chain.governanceToken.symbol || config.chain.currency.symbol } price`,
   value: (stats) => '$' + Number(stats.coin_price).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }),
   icon: <TokenEntity.Icon token={ nativeTokenData } boxSize={ 6 } marginRight={ 0 }/>,
-  hint: `${ config.chain.currency.symbol } token daily price in USD.`,
+  hint: `${ config.chain.governanceToken.symbol || config.chain.currency.symbol } token daily price in USD.`,
   api: {
     resourceName: 'homepage_chart_market',
     dataFn: (response) => ([ {
       items: response.chart_data
         .map((item) => ({ date: new Date(item.date), value: Number(item.closing_price) }))
         .sort(sortByDateDesc),
-      name: `${ config.chain.currency.symbol } price`,
+      name: `${ config.chain.governanceToken.symbol || config.chain.currency.symbol } price`,
       valueFormatter: (x: number) => '$' + x.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }),
     } ]),
   },