feat: integrating latest dappflow redirect feature for clicks on account (#10)

* feat: integrating latest dappflow redirect feature; RIP algoexplorer

* refactor: addressing pr comments

Author: aorumbayev

template_content/src/components/Account.tsx

@@ -1,18 +1,22 @@
 import { useWallet } from '@txnlab/use-wallet'
+import { useMemo } from 'react'
 import { ellipseAddress } from '../utils/ellipseAddress'
 import { getAlgodConfigFromViteEnvironment } from '../utils/network/getAlgoClientConfigs'
 
 const Account = () => {
   const { activeAddress } = useWallet()
   const algoConfig = getAlgodConfigFromViteEnvironment()
+
+  const dappFlowNetworkName = useMemo(() => {
+    return algoConfig.network === '' ? 'sandbox' : algoConfig.network.toLocaleLowerCase()
+  }, [algoConfig.network])
+
   return (
     <div>
       <a
         className="text-xl"
         target="_blank"
-        href={`https://${
-          ['mainnet', ''].includes(algoConfig.network.toLowerCase()) ? '' : `${algoConfig.network.toLowerCase()}.`
-        }algoexplorer.io/address/${activeAddress}`}
+        href={`https://app.dappflow.org/setnetwork?name=${dappFlowNetworkName}&redirect=explorer/account/${activeAddress}/`}
       >
         Address: {ellipseAddress(activeAddress)}
       </a>

tests_generated/test_all_default_parameters_off/src/components/Account.tsx

@@ -1,18 +1,22 @@
 import { useWallet } from '@txnlab/use-wallet'
+import { useMemo } from 'react'
 import { ellipseAddress } from '../utils/ellipseAddress'
 import { getAlgodConfigFromViteEnvironment } from '../utils/network/getAlgoClientConfigs'
 
 const Account = () => {
   const { activeAddress } = useWallet()
   const algoConfig = getAlgodConfigFromViteEnvironment()
+
+  const dappFlowNetworkName = useMemo(() => {
+    return algoConfig.network === '' ? 'sandbox' : algoConfig.network.toLocaleLowerCase()
+  }, [algoConfig.network])
+
   return (
     <div>
       <a
         className="text-xl"
         target="_blank"
-        href={`https://${
-          ['mainnet', ''].includes(algoConfig.network.toLowerCase()) ? '' : `${algoConfig.network.toLowerCase()}.`
-        }algoexplorer.io/address/${activeAddress}`}
+        href={`https://app.dappflow.org/setnetwork?name=${dappFlowNetworkName}&redirect=explorer/account/${activeAddress}/`}
       >
         Address: {ellipseAddress(activeAddress)}
       </a>

tests_generated/test_all_default_parameters_on_netlify/src/components/Account.tsx

@@ -1,18 +1,22 @@
 import { useWallet } from '@txnlab/use-wallet'
+import { useMemo } from 'react'
 import { ellipseAddress } from '../utils/ellipseAddress'
 import { getAlgodConfigFromViteEnvironment } from '../utils/network/getAlgoClientConfigs'
 
 const Account = () => {
   const { activeAddress } = useWallet()
   const algoConfig = getAlgodConfigFromViteEnvironment()
+
+  const dappFlowNetworkName = useMemo(() => {
+    return algoConfig.network === '' ? 'sandbox' : algoConfig.network.toLocaleLowerCase()
+  }, [algoConfig.network])
+
   return (
     <div>
       <a
         className="text-xl"
         target="_blank"
-        href={`https://${
-          ['mainnet', ''].includes(algoConfig.network.toLowerCase()) ? '' : `${algoConfig.network.toLowerCase()}.`
-        }algoexplorer.io/address/${activeAddress}`}
+        href={`https://app.dappflow.org/setnetwork?name=${dappFlowNetworkName}&redirect=explorer/account/${activeAddress}/`}
       >
         Address: {ellipseAddress(activeAddress)}
       </a>

tests_generated/test_all_default_parameters_on_vercel/src/components/Account.tsx

@@ -1,18 +1,22 @@
 import { useWallet } from '@txnlab/use-wallet'
+import { useMemo } from 'react'
 import { ellipseAddress } from '../utils/ellipseAddress'
 import { getAlgodConfigFromViteEnvironment } from '../utils/network/getAlgoClientConfigs'
 
 const Account = () => {
   const { activeAddress } = useWallet()
   const algoConfig = getAlgodConfigFromViteEnvironment()
+
+  const dappFlowNetworkName = useMemo(() => {
+    return algoConfig.network === '' ? 'sandbox' : algoConfig.network.toLocaleLowerCase()
+  }, [algoConfig.network])
+
   return (
     <div>
       <a
         className="text-xl"
         target="_blank"
-        href={`https://${
-          ['mainnet', ''].includes(algoConfig.network.toLowerCase()) ? '' : `${algoConfig.network.toLowerCase()}.`
-        }algoexplorer.io/address/${activeAddress}`}
+        href={`https://app.dappflow.org/setnetwork?name=${dappFlowNetworkName}&redirect=explorer/account/${activeAddress}/`}
       >
         Address: {ellipseAddress(activeAddress)}
       </a>