Business logic to change TC rpc|node endpoints (#2370)

- [x] `useThorchainClientUrl`
- [x] State `ClientUrl`(in `service/thorchain`)
- [x] Remove deprecated `getClientUrl()` helper from `shared`
- [x] Update `IPCLedger{Send|Deposit}Params` to include `nodeUrl` (needed for Ledger RUNE)
- [x] Extend `HeaderNetStatus` to show RPC status
- [x] Extend `EXTERNALS_WHITELIST` to include rpc endpoints

src/main/api/ledger/thorchain/transaction.ts

@@ -9,7 +9,6 @@ import { MsgSend } from 'cosmos-client/x/bank'
 import * as E from 'fp-ts/Either'
 
 import { LedgerError, LedgerErrorId, Network } from '../../../../shared/api/types'
-import { getClientUrl } from '../../../../shared/thorchain/client'
 import { toClientNetwork } from '../../../../shared/utils/client'
 import { isError } from '../../../../shared/utils/guard'
 import { fromLedgerErrorType, getDerivationPath } from './common'
@@ -26,14 +25,17 @@ export const send = async ({
   amount,
   memo,
   recipient,
-  walletIndex
+  walletIndex,
+  nodeUrl
 }: {
   transport: Transport
   amount: BaseAmount
   network: Network
   recipient: Address
   memo?: string
   walletIndex: number
+  // Node endpoint for cosmos sdk client
+  nodeUrl: string
 }): Promise<E.Either<LedgerError, TxHash>> => {
   try {
     const clientNetwork = toClientNetwork(network)
@@ -49,8 +51,7 @@ export const send = async ({
         msg: `Getting 'bech32Address' or 'compressedPk' from Ledger THORChainApp failed`
       })
     }
-    // Node endpoint for cosmos sdk client
-    const nodeUrl = getClientUrl()[network].node
+
     const chainId = await getChainId(nodeUrl)
 
     const sdk = new CosmosSDK(nodeUrl, chainId)
@@ -159,13 +160,16 @@ export const deposit = async ({
   network,
   amount,
   memo,
-  walletIndex
+  walletIndex,
+  nodeUrl
 }: {
   transport: Transport
   amount: BaseAmount
   network: Network
   memo: string
   walletIndex: number
+  // Node endpoint for cosmos sdk client
+  nodeUrl: string
 }): Promise<E.Either<LedgerError, TxHash>> => {
   try {
     const clientNetwork = toClientNetwork(network)
@@ -181,8 +185,7 @@ export const deposit = async ({
         msg: `Getting 'bech32Address' or 'compressedPk' from Ledger THORChainApp failed`
       })
     }
-    // Node endpoint for cosmos sdk client
-    const nodeUrl = getClientUrl()[network].node
+
     const chainId = await getChainId(nodeUrl)
 
     const sdk = new CosmosSDK(nodeUrl, chainId)

src/main/api/ledger/transaction.ts

@@ -36,21 +36,30 @@ export const sendTx = async ({
   memo,
   feeRate,
   feeOption,
-  walletIndex
+  walletIndex,
+  nodeUrl
 }: IPCLedgerSendTxParams): Promise<E.Either<LedgerError, TxHash>> => {
   try {
     const transport = await TransportNodeHidSingleton.open()
     let res: E.Either<LedgerError, string>
     switch (chain) {
       case THORChain:
-        res = await THOR.send({
-          transport,
-          network,
-          recipient,
-          amount,
-          memo,
-          walletIndex
-        })
+        if (!nodeUrl) {
+          res = E.left({
+            errorId: LedgerErrorId.INVALID_DATA,
+            msg: `"nodeUrl" needs to be defined to send Ledger transaction on ${chainToString(chain)}`
+          })
+        } else {
+          res = await THOR.send({
+            transport,
+            network,
+            recipient,
+            amount,
+            memo,
+            walletIndex,
+            nodeUrl
+          })
+        }
         break
       case BNBChain:
         res = await BNB.send({
@@ -176,14 +185,22 @@ export const deposit = async ({
   amount,
   memo,
   walletIndex,
-  feeOption
+  feeOption,
+  nodeUrl
 }: IPCLedgerDepositTxParams): Promise<E.Either<LedgerError, TxHash>> => {
   try {
     const transport = await TransportNodeHidSingleton.open()
     let res: E.Either<LedgerError, string>
     switch (chain) {
       case THORChain:
-        res = await THOR.deposit({ transport, network, amount, memo, walletIndex })
+        if (!nodeUrl) {
+          res = E.left({
+            errorId: LedgerErrorId.INVALID_DATA,
+            msg: `"nodeUrl" needs to be defined to send Ledger transaction on ${chainToString(chain)}`
+          })
+        } else {
+          res = await THOR.deposit({ transport, network, amount, memo, walletIndex, nodeUrl })
+        }
         break
       case ETHChain:
         if (!router) {

src/main/api/url.ts

@@ -31,6 +31,9 @@ const EXTERNALS_WHITELIST = [
   'midgard.thorchain.info',
   'testnet.midgard.thorchain.info',
   'stagenet-midgard.ninerealms.com',
+  'testnet-rpc.ninerealms.com',
+  'stagenet-rpc.ninerealms.com',
+  'rpc.ninerealms.com',
   'thornode.thorchain.info',
   'testnet.thornode.thorchain.info',
   'stagenet-thornode.ninerealms.com',

src/renderer/components/header/Header.tsx

@@ -4,13 +4,13 @@ import * as RD from '@devexperts/remote-data-ts'
 import * as O from 'fp-ts/lib/Option'
 import { useObservableState } from 'observable-hooks'
 
-import { getClientUrl } from '../../../shared/thorchain/client'
 import { useMidgardContext } from '../../contexts/MidgardContext'
 import { useThorchainContext } from '../../contexts/ThorchainContext'
 import { useWalletContext } from '../../contexts/WalletContext'
 import { useNetwork } from '../../hooks/useNetwork'
 import { usePricePools } from '../../hooks/usePricePools'
 import { useRunePrice } from '../../hooks/useRunePrice'
+import { useThorchainClientUrl } from '../../hooks/useThorchainClientUrl'
 import { useVolume24Price } from '../../hooks/useVolume24Price'
 import { SelectedPricePoolAsset } from '../../services/midgard/types'
 import { HeaderComponent } from './HeaderComponent'
@@ -39,7 +39,7 @@ export const Header: React.FC = (): JSX.Element => {
   const inboundAddresses = useObservableState(inboundAddressesShared$, RD.initial)
 
   const midgardUrlRD = useObservableState(apiEndpoint$, RD.initial)
-  const thorchainUrl = getClientUrl()[network].node
+  const { node: thorchainNodeUrl, rpc: thorchainRpcUrl } = useThorchainClientUrl()
 
   return (
     <HeaderComponent
@@ -56,7 +56,8 @@ export const Header: React.FC = (): JSX.Element => {
       inboundAddresses={inboundAddresses}
       mimir={mimir}
       midgardUrl={midgardUrlRD}
-      thorchainUrl={thorchainUrl}
+      thorchainNodeUrl={thorchainNodeUrl}
+      thorchainRpcUrl={thorchainRpcUrl}
     />
   )
 }

src/renderer/components/header/HeaderComponent.stories.tsx

@@ -29,8 +29,9 @@ const meta: ComponentMeta<typeof Component> = {
     selectedPricePoolAsset: O.some(AssetRuneNative),
     inboundAddresses: RD.initial,
     mimir: RD.initial,
-    midgardUrl: RD.initial,
-    thorchainUrl: 'thorchain.info',
+    midgardUrl: RD.success('midgard-url'),
+    thorchainNodeUrl: 'thorchain-node-url',
+    thorchainRpcUrl: 'thorchain-rpc-url',
     network: 'mainnet'
   }
 }

src/renderer/components/header/HeaderComponent.tsx

@@ -58,7 +58,8 @@ export type Props = {
   inboundAddresses: InboundAddressRD
   mimir: MimirRD
   midgardUrl: MidgardUrlRD
-  thorchainUrl: string
+  thorchainNodeUrl: string
+  thorchainRpcUrl: string
 }
 
 export const HeaderComponent: React.FC<Props> = (props): JSX.Element => {
@@ -75,8 +76,9 @@ export const HeaderComponent: React.FC<Props> = (props): JSX.Element => {
     selectedPricePoolAsset: oSelectedPricePoolAsset,
     lockHandler,
     setSelectedPricePool,
-    midgardUrl,
-    thorchainUrl
+    midgardUrl: midgardUrlRD,
+    thorchainNodeUrl,
+    thorchainRpcUrl
   } = props
 
   const intl = useIntl()
@@ -251,11 +253,12 @@ export const HeaderComponent: React.FC<Props> = (props): JSX.Element => {
         isDesktopView={isDesktopView}
         midgardStatus={inboundAddressRD}
         mimirStatus={mimirRD}
-        midgardUrl={midgardUrl}
-        thorchainUrl={thorchainUrl}
+        midgardUrl={midgardUrlRD}
+        thorchainNodeUrl={thorchainNodeUrl}
+        thorchainRpcUrl={thorchainRpcUrl}
       />
     ),
-    [inboundAddressRD, isDesktopView, midgardUrl, mimirRD, thorchainUrl]
+    [inboundAddressRD, isDesktopView, midgardUrlRD, mimirRD, thorchainNodeUrl, thorchainRpcUrl]
   )
 
   const iconStyle = { fontSize: '1.5em', marginRight: '20px' }

src/renderer/components/header/netstatus/HeaderNetStatus.stories.tsx

@@ -13,8 +13,9 @@ const meta: ComponentMeta<typeof Component> = {
   args: {
     midgardStatus: RD.initial,
     mimirStatus: RD.initial,
-    midgardUrl: RD.initial,
-    thorchainUrl: 'thorchain-url',
+    midgardUrl: RD.success('midgard-url'),
+    thorchainNodeUrl: 'thorchain-node-url',
+    thorchainRpcUrl: 'thorchain-rpc-url',
     isDesktopView: false
   }
 }

src/renderer/components/header/netstatus/HeaderNetStatus.tsx

@@ -9,7 +9,7 @@ import { useIntl } from 'react-intl'
 
 import { useAppContext } from '../../../contexts/AppContext'
 import { OnlineStatus } from '../../../services/app/types'
-import { InboundAddressRD } from '../../../services/midgard/types'
+import { InboundAddressRD, MidgardUrlRD } from '../../../services/midgard/types'
 import { MimirRD } from '../../../services/thorchain/types'
 import { DownIcon } from '../../icons'
 import { ConnectionStatus } from '../../shared/icons/ConnectionStatus'
@@ -30,8 +30,9 @@ export type Props = {
   isDesktopView: boolean
   midgardStatus: InboundAddressRD
   mimirStatus: MimirRD
-  midgardUrl: RD.RemoteData<Error, string>
-  thorchainUrl: string
+  midgardUrl: MidgardUrlRD
+  thorchainNodeUrl: string
+  thorchainRpcUrl: string
 }
 
 export const HeaderNetStatus: React.FC<Props> = (props): JSX.Element => {
@@ -40,22 +41,11 @@ export const HeaderNetStatus: React.FC<Props> = (props): JSX.Element => {
     midgardStatus: midgardStatusRD,
     mimirStatus: mimirStatusRD,
     midgardUrl: midgardUrlRD,
-    thorchainUrl
+    thorchainNodeUrl,
+    thorchainRpcUrl
   } = props
   const intl = useIntl()
 
-  const midgardUrl = useMemo(() => {
-    return FP.pipe(
-      midgardUrlRD,
-      RD.fold(
-        () => '',
-        () => '',
-        () => '',
-        (url) => url
-      )
-    )
-  }, [midgardUrlRD])
-
   const prevMidgardStatus = useRef<OnlineStatus>(OnlineStatus.OFF)
   const midgardStatus: OnlineStatus = useMemo(
     () =>
@@ -108,6 +98,11 @@ export const HeaderNetStatus: React.FC<Props> = (props): JSX.Element => {
 
   const menuItems = useMemo((): MenuItem[] => {
     const notConnectedTxt = intl.formatMessage({ id: 'setting.notconnected' })
+    const midgardUrl = FP.pipe(
+      midgardUrlRD,
+      RD.getOrElse(() => '')
+    )
+
     return [
       {
         key: 'midgard',
@@ -124,17 +119,29 @@ export const HeaderNetStatus: React.FC<Props> = (props): JSX.Element => {
       {
         key: 'thorchain',
         headline: 'Thorchain API',
-        url: `${thorchainUrl}/thorchain/doc/`,
+        url: `${thorchainNodeUrl}/thorchain/doc/`,
+        subheadline: headerNetStatusSubheadline({
+          url: O.some(thorchainNodeUrl),
+          onlineStatus: onlineStatus,
+          clientStatus: thorchainStatus,
+          notConnectedTxt
+        }),
+        color: headerNetStatusColor({ onlineStatus: onlineStatus, clientStatus: thorchainStatus })
+      },
+      {
+        key: 'thorchain-rpc',
+        headline: 'Thorchain RPC',
+        url: `${thorchainRpcUrl}`,
         subheadline: headerNetStatusSubheadline({
-          url: O.some(thorchainUrl),
+          url: O.some(thorchainRpcUrl),
           onlineStatus: onlineStatus,
           clientStatus: thorchainStatus,
           notConnectedTxt
         }),
         color: headerNetStatusColor({ onlineStatus: onlineStatus, clientStatus: thorchainStatus })
       }
     ]
-  }, [intl, midgardStatus, midgardUrl, onlineStatus, thorchainStatus, thorchainUrl])
+  }, [intl, midgardUrlRD, thorchainNodeUrl, thorchainRpcUrl, onlineStatus, midgardStatus, thorchainStatus])
 
   const desktopMenu = useMemo(() => {
     return (
@@ -148,8 +155,8 @@ export const HeaderNetStatus: React.FC<Props> = (props): JSX.Element => {
                   <ConnectionStatus color={color} />
                 </Col>
                 <Col span={20}>
-                  <Styled.MenuItemHeadline>{headline}</Styled.MenuItemHeadline>
-                  <Styled.MenuItemSubHeadline>{subheadline}</Styled.MenuItemSubHeadline>
+                  <Styled.MenuItemHeadline nowrap>{headline}</Styled.MenuItemHeadline>
+                  <Styled.MenuItemSubHeadline nowrap>{subheadline}</Styled.MenuItemSubHeadline>
                 </Col>
               </Row>
             </Menu.Item>
@@ -169,8 +176,8 @@ export const HeaderNetStatus: React.FC<Props> = (props): JSX.Element => {
           </Row>
           <Row>
             <Col>
-              <Styled.MenuItemHeadline>{headline}</Styled.MenuItemHeadline>
-              <Styled.MenuItemSubHeadline>{subheadline}</Styled.MenuItemSubHeadline>
+              <Styled.MenuItemHeadline nowrap>{headline}</Styled.MenuItemHeadline>
+              <Styled.MenuItemSubHeadline nowrap>{subheadline}</Styled.MenuItemSubHeadline>
             </Col>
           </Row>
         </HeaderDrawerItem>

src/renderer/contexts/ThorchainContext.tsx

@@ -3,6 +3,8 @@ import React, { createContext, useContext } from 'react'
 import {
   client$,
   clientState$,
+  clientUrl$,
+  setClientUrl,
   address$,
   addressUI$,
   balances$,
@@ -27,6 +29,8 @@ import {
 export type ThorchainContextValue = {
   client$: typeof client$
   clientState$: typeof clientState$
+  clientUrl$: typeof clientUrl$
+  setClientUrl: typeof setClientUrl
   address$: typeof address$
   addressUI$: typeof addressUI$
   reloadBalances: typeof reloadBalances
@@ -51,6 +55,8 @@ export type ThorchainContextValue = {
 const initialContext: ThorchainContextValue = {
   client$,
   clientState$,
+  clientUrl$,
+  setClientUrl,
   address$,
   addressUI$,
   reloadBalances,