fix: default to port 8000 for devnet, closes #2174

Author: kyranjamie

src/app/common/hooks/use-stacks-explorer-link.ts

@@ -10,18 +10,21 @@ interface HandleOpenStacksTxLinkArgs {
   txid: string;
 }
 export function useStacksExplorerLink() {
-  const { mode, isNakamotoTestnet } = useCurrentNetworkState();
+  const { chain, isNakamotoTestnet } = useCurrentNetworkState();
 
   const handleOpenStacksTxLink = useCallback(
     ({ searchParams, txid }: HandleOpenStacksTxLinkArgs) => {
       openInNewTab(
-        makeStacksTxExplorerLink({ mode, searchParams, isNakamoto: isNakamotoTestnet, txid })
+        makeStacksTxExplorerLink({
+          mode: chain.bitcoin.mode,
+          searchParams,
+          isNakamoto: isNakamotoTestnet,
+          txid,
+        })
       );
     },
-    [mode, isNakamotoTestnet]
+    [chain.bitcoin.mode, isNakamotoTestnet]
   );
 
-  return {
-    handleOpenStacksTxLink,
-  };
+  return { handleOpenStacksTxLink };
 }

src/app/common/utils.ts

@@ -26,10 +26,9 @@ export function makeStacksTxExplorerLink({
   txid,
   isNakamoto = false,
 }: MakeStacksTxExplorerLinkArgs) {
+  if (mode === 'regtest') return 'http://localhost:8000/txid/' + txid;
   searchParams.append('chain', mode);
-  if (isNakamoto) {
-    searchParams.append('api', HIRO_API_BASE_URL_NAKAMOTO_TESTNET);
-  }
+  if (isNakamoto) searchParams.append('api', HIRO_API_BASE_URL_NAKAMOTO_TESTNET);
   return `${HIRO_EXPLORER_URL}/txid/${txid}?${searchParams.toString()}`;
 }
 

src/app/features/hiro-messages/in-app-messages.tsx

@@ -15,7 +15,7 @@ export function InAppMessages(props: FlexProps) {
   const location = useLocation();
   const messages = useRemoteLeatherMessages();
 
-  const { mode } = useCurrentNetworkState();
+  const { chain } = useCurrentNetworkState();
   const dismissMessage = useDismissMessage();
   const dismissedIds = useDismissedMessageIds();
 
@@ -25,7 +25,7 @@ export function InAppMessages(props: FlexProps) {
 
   if (!firstMessage) return null;
 
-  if (firstMessage.chainTarget !== 'all' && firstMessage.chainTarget !== mode) {
+  if (firstMessage.chainTarget !== 'all' && firstMessage.chainTarget !== chain.bitcoin.mode) {
     return null;
   }
 

src/app/features/stacks-transaction-request/principal-value.tsx

@@ -9,13 +9,17 @@ interface PrincipalValueProps {
 }
 export function PrincipalValue(props: PrincipalValueProps) {
   const { address } = props;
-  const { mode, isNakamotoTestnet } = useCurrentNetworkState();
+  const { chain, isNakamotoTestnet } = useCurrentNetworkState();
 
   return (
     <Link
       onClick={() =>
         openInNewTab(
-          makeStacksAddressExplorerLink({ mode, address, isNakamoto: isNakamotoTestnet })
+          makeStacksAddressExplorerLink({
+            mode: chain.bitcoin.mode,
+            address,
+            isNakamoto: isNakamotoTestnet,
+          })
         )
       }
       size="sm"

src/app/features/stacks-transaction-request/transaction-error/error-messages.tsx

@@ -113,7 +113,7 @@ export const NoContractErrorMessage = memo(props => {
       title="Contract not found"
       body={`The contract (${truncateMiddle(pendingTransaction.contractAddress)}.${
         pendingTransaction.contractName
-      }) that you are trying to call cannot be found on ${network.mode}.`}
+      }) that you are trying to call cannot be found on ${network.chain.bitcoin.mode}.`}
       {...props}
     />
   );

src/app/store/networks/networks.hooks.ts

@@ -12,7 +12,6 @@ import { StacksNetwork as StacksNetworkV6 } from '@stacks/network-v6';
 import { ChainID, TransactionVersion as TransactionVersionV6 } from '@stacks/transactions-v6';
 
 import {
-  type BitcoinNetworkModes,
   HIRO_API_BASE_URL_NAKAMOTO_TESTNET,
   bitcoinNetworkToNetworkMode,
 } from '@leather.io/models';
@@ -37,8 +36,7 @@ export function useCurrentNetworkState() {
     const isTestnet = currentNetwork.chain.stacks.chainId === ChainId.Testnet;
     const isNakamotoTestnet =
       currentNetwork.chain.stacks.url === HIRO_API_BASE_URL_NAKAMOTO_TESTNET;
-    const mode = (isTestnet ? 'testnet' : 'mainnet') as BitcoinNetworkModes;
-    return { ...currentNetwork, isTestnet, isNakamotoTestnet, mode };
+    return { ...currentNetwork, isTestnet, isNakamotoTestnet };
   }, [currentNetwork]);
 }