From 04ef7a6f4971285201c056a8375e50b1f557ce0a Mon Sep 17 00:00:00 2001
From: pseudozach <git@pseudozach.com>
Date: Mon, 11 Sep 2023 22:18:17 +0000
Subject: [PATCH] add NEXT_PUBLIC_NETWORK env var

---
 README.md                   | 5 ++++-
 components/card.tsx         | 2 +-
 components/reverseSwaps.tsx | 2 +-
 components/swaps.tsx        | 2 +-
 pages/index.tsx             | 3 ++-
 5 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index be0c1d2..7a87c84 100644
--- a/README.md
+++ b/README.md
@@ -31,7 +31,10 @@ Open [http://localhost:3000](http://localhost:3000) with your browser to see the
 ### Optimizations & Requirements
 
 * To avoid error: `System limit for number of file watchers reached`  
->echo fs.inotify.max_user_watches= 131070 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
+>echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
 
 * if you're running dashboard on a VM, you probably want to set below in your ~/.bashrc replace IP:port with your own providerUrl
 > export NEXT_PUBLIC_BACKEND_URL="http://34.132.87.225:9008"  
+
+* if you're running on testnet, set below env var so links resolve to correct explorers.
+> export NEXT_PUBLIC_NETWORK="testnet" 
diff --git a/components/card.tsx b/components/card.tsx
index 17cb224..3aee10c 100644
--- a/components/card.tsx
+++ b/components/card.tsx
@@ -16,7 +16,7 @@ const Card = (props: any) => {
       {props.address &&
         <a
           className="inline-flex items-center h-8 px-4 text-sm text-indigo-100 transition-colors duration-150 bg-indigo-700 rounded-lg focus:shadow-outline hover:bg-indigo-800"
-          href={"https://explorer.stacks.co/address/" + props.address}
+          href={"https://explorer.stacks.co/address/" + props.address + "?chain=" + props.network}
           target="_blank" rel="noreferrer">Explorer</a>
       }
     </div>
diff --git a/components/reverseSwaps.tsx b/components/reverseSwaps.tsx
index eeeb307..dc427d2 100644
--- a/components/reverseSwaps.tsx
+++ b/components/reverseSwaps.tsx
@@ -87,7 +87,7 @@ const ReverseSwaps = (props: any) => {
     },
     {
       name: 'Transaction Id',
-      cell: (row: ReverseSwapProps) => row.transactionId ? <a className="inline-flex items-center h-8 px-4 m-2 text-sm text-indigo-100 transition-colors duration-150 bg-indigo-700 rounded-lg focus:shadow-outline hover:bg-indigo-800" href={"https://explorer.stacks.co/txid/" + row.transactionId} target="_blank" rel="noreferrer">{row.transactionId.substring(0, 7) + "..."}</a> : null,
+      cell: (row: ReverseSwapProps) => row.transactionId ? <a className="inline-flex items-center h-8 px-4 m-2 text-sm text-indigo-100 transition-colors duration-150 bg-indigo-700 rounded-lg focus:shadow-outline hover:bg-indigo-800" href={`https://explorer.stacks.co/txid/${row.transactionId}?chain=${process.env.NEXT_PUBLIC_NETWORK || 'mainnet'}`} target="_blank" rel="noreferrer">{row.transactionId.substring(0, 7) + "..."}</a> : null,
       maxWidth: '500px',
       minWidth: '200px',
       sortable: true,
diff --git a/components/swaps.tsx b/components/swaps.tsx
index 50baa1c..2e75b5a 100644
--- a/components/swaps.tsx
+++ b/components/swaps.tsx
@@ -83,7 +83,7 @@ const Swaps = (props : { swaps: SwapProps[] }) => {
     },
     {
       name: 'Transaction Id',
-      cell: (row: SwapProps) => row.lockupTransactionId ? <a className="inline-flex items-center h-8 px-4 m-2 text-sm text-indigo-100 transition-colors duration-150 bg-indigo-700 rounded-lg focus:shadow-outline hover:bg-indigo-800" href={(row.lockupTransactionId?.startsWith('0x') ? "https://explorer.stacks.co/txid/" : "https://mempool.space/tx/") + row.lockupTransactionId} target="_blank" rel="noreferrer">{row.lockupTransactionId.substring(0, 7) + "..."}</a> : null,
+      cell: (row: SwapProps) => row.lockupTransactionId ? <a className="inline-flex items-center h-8 px-4 m-2 text-sm text-indigo-100 transition-colors duration-150 bg-indigo-700 rounded-lg focus:shadow-outline hover:bg-indigo-800" href={(row.lockupTransactionId?.startsWith('0x') ? `https://explorer.stacks.co/txid/${row.lockupTransactionId}?chain=${process.env.NEXT_PUBLIC_NETWORK || 'mainnet'}` : `https://mempool.space${process.env.NEXT_PUBLIC_NETWORK || 'mainnet' === 'mainnet' ? '' : '/testnet'}/tx/${row.lockupTransactionId}`)} target="_blank" rel="noreferrer">{row.lockupTransactionId.substring(0, 7) + "..."}</a> : null,
       maxWidth: '500px',
       minWidth: '200px',
       sortable: true,
diff --git a/pages/index.tsx b/pages/index.tsx
index b8a4a40..b741bee 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -43,6 +43,7 @@ const Home: NextPage = () => {
   const [pairId, setPairId] = useState('BTC/STX');
   const [amount, setAmount] = useState(0);
   const [apiurl, setApiurl] = useState(process.env.NEXT_PUBLIC_BACKEND_URL);
+  const [network, setNetwork] = useState(process.env.NEXT_PUBLIC_NETWORK || 'mainnet');
 
   const triggerBalance = async () => {
     const auth = 'Basic ' + Buffer.from(username + ':' + password).toString('base64');
@@ -345,7 +346,7 @@ const Home: NextPage = () => {
                     {
                       dashboardData.stacksWalletBalance ?
                         dashboardData.stacksWalletBalance.map(item => {
-                          return <Card key={item.walletName} before={item.walletName === 'STX' ? Number(dashboardData.stacksWalletBalanceBefore)/10**6 : ''} status={Number(item.value)/10**6} name={item.walletName} address={item.address}/>
+                          return <Card key={item.walletName} before={item.walletName === 'STX' ? Number(dashboardData.stacksWalletBalanceBefore)/10**6 : ''} status={Number(item.value)/10**6} name={item.walletName} address={item.address} network={network}/>
                         })
                       : null
                     }