Merge testnet into mainnet

src/components/Dropdown/ChainType/index.tsx

@@ -1,7 +1,6 @@
-import { isMainnet } from '../../../utils/chain'
 import { ChainTypePanel } from './styled'
 import SimpleButton from '../../SimpleButton'
-import { ChainName, MAINNET_URL, TESTNET_URL } from '../../../constants/common'
+import { IS_MAINNET, MAINNET_URL, TESTNET_URL } from '../../../constants/common'
 
 export default ({ setShow, left, top }: { setShow: Function; left: number; top: number }) => {
   const hideDropdown = () => {
@@ -10,12 +9,12 @@ export default ({ setShow, left, top }: { setShow: Function; left: number; top:
 
   return (
     <ChainTypePanel left={left} top={top} onMouseLeave={hideDropdown}>
-      <SimpleButton className={`chainType${isMainnet() ? 'Selected' : 'Normal'}`} onClick={hideDropdown}>
-        <a href={MAINNET_URL}>{`${ChainName.Mainnet} mainnet`}</a>
+      <SimpleButton className={`chainType${IS_MAINNET ? 'Selected' : 'Normal'}`} onClick={hideDropdown}>
+        <a href={MAINNET_URL}>mainnet</a>
       </SimpleButton>
       <div className="chainTypeSeparate" />
-      <SimpleButton className={`chainType${!isMainnet() ? 'Selected' : 'Normal'}`} onClick={hideDropdown}>
-        <a href={TESTNET_URL}>{`${ChainName.Testnet} testnet`}</a>
+      <SimpleButton className={`chainType${!IS_MAINNET ? 'Selected' : 'Normal'}`} onClick={hideDropdown}>
+        <a href={TESTNET_URL}>testnet</a>
       </SimpleButton>
     </ChainTypePanel>
   )

src/components/Header/BlockchainComp/index.tsx

@@ -7,9 +7,10 @@ import GreenDropUpIcon from '../../../assets/green_drop_up.png'
 import { HeaderBlockchainPanel, MobileSubMenuPanel } from './styled'
 import SimpleButton from '../../SimpleButton'
 import ChainDropdown from '../../Dropdown/ChainType'
-import { ChainName, MAINNET_URL, ONE_DAY_MILLISECOND, TESTNET_URL } from '../../../constants/common'
+import { MAINNET_URL, ONE_DAY_MILLISECOND, TESTNET_URL } from '../../../constants/common'
 import { explorerService } from '../../../services/ExplorerService'
 import { cacheService } from '../../../services/CacheService'
+import { useChainName } from '../../../hooks/useCKBNode'
 
 const getDropdownIcon = (showDropdown: boolean) => {
   if (!showDropdown) return WhiteDropdownIcon
@@ -28,6 +29,8 @@ const BlockchainDropdown: FC<{ nodeVersion: string }> = ({ nodeVersion }) => {
   const [chainTypeLeft, setChainTypeLeft] = useState(0)
   const [chainTypeTop, setChainTypeTop] = useState(0)
 
+  const chainName = useChainName()
+
   useLayoutEffect(() => {
     if (showChainType) {
       const chainDropdownComp = document.getElementById('header__blockchain__panel')
@@ -60,7 +63,7 @@ const BlockchainDropdown: FC<{ nodeVersion: string }> = ({ nodeVersion }) => {
               textTransform: 'uppercase',
             }}
           >
-            {isMainnet() ? ChainName.Mainnet : ChainName.Testnet}
+            {chainName}
           </div>
           <img src={getDropdownIcon(showChainType)} alt="dropdown icon" />
         </div>
@@ -74,6 +77,8 @@ const BlockchainDropdown: FC<{ nodeVersion: string }> = ({ nodeVersion }) => {
 const BlockchainMenu: FC<{ nodeVersion: string }> = ({ nodeVersion }) => {
   const [showSubMenu, setShowSubMenu] = useState(false)
 
+  const chainName = useChainName()
+
   const chainTypeIcon = () => {
     if (!showSubMenu) {
       return WhiteDropdownIcon
@@ -95,18 +100,18 @@ const BlockchainMenu: FC<{ nodeVersion: string }> = ({ nodeVersion }) => {
             textTransform: 'uppercase',
           }}
         >
-          {isMainnet() ? ChainName.Mainnet : ChainName.Testnet}
+          {chainName}
         </div>
         <img className="mobileMenusMainItemIcon" alt="mobile chain type icon" src={chainTypeIcon()} />
       </SimpleButton>
       <div className="blockchainMobileNodeVersion">{handleVersion(nodeVersion)}</div>
       {showSubMenu && (
         <>
           <a className="mobileMenusSubItem" href={MAINNET_URL}>
-            {`${ChainName.Mainnet} mainnet`}
+            mainnet
           </a>
           <a className="mobileMenusSubItem" href={TESTNET_URL}>
-            {`${ChainName.Testnet} testnet`}
+            testnet
           </a>
         </>
       )}

src/constants/common.ts

@@ -153,6 +153,13 @@ export enum ChainName {
   Testnet = 'pudge',
 }
 
+export const CKB2023 = {
+  // https://github.com/nervosnetwork/ckb/pull/4665/files#diff-c8efd953833c9bb20a6c41b66cfb4823e87e072aa1a3bde2c9b5f62c0ea847d9R14
+  TESTNET_EPOCH: 9690,
+  // https://github.com/nervosnetwork/rfcs/blob/3a6ae4fa5d59b6e33fa7bd563d336706d135c0d8/rfcs/0053-ckb-hardfork/0053-ckb-hardfork.md#naming-convention
+  CHAIN_NAME: 'MEEPO',
+}
+
 export enum LayoutLiteProfessional {
   Lite = 'lite',
   Professional = 'professional',
@@ -165,7 +172,7 @@ export enum HashType {
 }
 
 export const MAINNET_URL = `https://${config.BASE_URL}`
-export const TESTNET_URL = `https://${ChainName.Testnet}.${config.BASE_URL}`
+export const TESTNET_URL = `https://testnet.${config.BASE_URL}`
 
 export const TYPE_ID_CODE_HASH = '0x00000000000000000000000000000000000000000000000000545950455f4944'
 

src/hooks/useCKBNode.tsx

@@ -2,6 +2,8 @@ import { useContext, createContext, useState, PropsWithChildren } from 'react'
 import { useTranslation } from 'react-i18next'
 import { isMainnet } from '../utils/chain'
 import { NodeService } from '../services/NodeService'
+import { useStatistics } from '../services/ExplorerService'
+import { ChainName, CKB2023, IS_MAINNET } from '../constants/common'
 
 const NODE_CONNECT_MODE_KEY = 'node_connect_mode'
 const NODE_CONNECTED_ENDPOINT = 'node_connected_endpoint'
@@ -132,3 +134,13 @@ export const CKBNodeProvider = ({ children, defaultEndpoint }: PropsWithChildren
     </CKBNodeContext.Provider>
   )
 }
+
+export function useChainName() {
+  const statistics = useStatistics()
+  if (IS_MAINNET) return `${ChainName.Mainnet} Mainnet`
+
+  if (!+statistics.epochInfo.epochNumber) return 'Testnet'
+
+  const chainName = +statistics.epochInfo.epochNumber >= CKB2023.TESTNET_EPOCH ? CKB2023.CHAIN_NAME : ChainName.Testnet
+  return `${chainName} Testnet`
+}

yarn.lock

@@ -11401,9 +11401,9 @@ http-proxy-agent@^4.0.1:
     debug "4"
 
 http-proxy-middleware@^2.0.3:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-2.0.6.tgz#e1a4dd6979572c7ab5a4e4b55095d1f32a74963f"
-  integrity sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw==
+  version "2.0.7"
+  resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-2.0.7.tgz#915f236d92ae98ef48278a95dedf17e991936ec6"
+  integrity sha512-fgVY8AV7qU7z/MmXJ/rxwbrtQH4jBQ9m7kp3llF0liB7glmFeVZFBepQb32T3y8n8k2+AEYuMPCpinYW+/CuRA==
   dependencies:
     "@types/http-proxy" "^1.17.8"
     http-proxy "^1.18.1"
@@ -13239,9 +13239,9 @@ map-or-similar@^1.5.0:
   integrity sha512-0aF7ZmVon1igznGI4VS30yugpduQW3y3GkcgGJOp7d8x8QrizhigUxjI/m2UojsXXto+jLAH3KSz+xOJTiORjg==
 
 markdown-to-jsx@^7.1.8:
-  version "7.3.2"
-  resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.3.2.tgz#f286b4d112dad3028acc1e77dfe1f653b347e131"
-  integrity sha512-B+28F5ucp83aQm+OxNrPkS8z0tMKaeHiy0lHJs3LqCyDQFtWuenaIrkaVTgAm1pf1AU85LXltva86hlaT17i8Q==
+  version "7.5.0"
+  resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.5.0.tgz#42ece0c71e842560a7d8bd9f81e7a34515c72150"
+  integrity sha512-RrBNcMHiFPcz/iqIj0n3wclzHXjwS7mzjBNWecKKVhNTIxQepIix6Il/wZCn2Cg5Y1ow2Qi84+eJrryFRWBEWw==
 
 mathml-tag-names@^2.1.3:
   version "2.1.3"