diff --git a/src/App.tsx b/src/App.tsx index bdd4e37..f42b4dd 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,13 +1,10 @@ import { DeflyWalletConnect } from '@blockshake/defly-connect' import { DaffiWalletConnect } from '@daffiwallet/connect' import { PeraWalletConnect } from '@perawallet/connect' -import { PROVIDER_ID, ProvidersArray, WalletProvider, useInitializeProviders, useWallet } from '@txnlab/use-wallet' +import { PROVIDER_ID, ProvidersArray, WalletProvider, useInitializeProviders } from '@txnlab/use-wallet' import algosdk from 'algosdk' import { SnackbarProvider } from 'notistack' -import { useState } from 'react' -import Gallery from './components/Gallery' -import Hero from './components/Hero' -import { Navbar } from './components/Navbar' +import ActiveTab from './pages/ActiveTab' import { getAlgodConfigFromViteEnvironment, getKmdConfigFromViteEnvironment } from './utils/network/getAlgoClientConfigs' let providersArray: ProvidersArray @@ -37,10 +34,6 @@ if (import.meta.env.VITE_ALGOD_NETWORK === '') { } export default function App() { - const [activeTab, setActiveTab] = useState(0) // 0 = Mint; 1 = Gallery - - const { activeAddress } = useWallet() - const algodConfig = getAlgodConfigFromViteEnvironment() const walletProviders = useInitializeProviders({ @@ -57,15 +50,7 @@ export default function App() { return ( - {activeAddress ? ( -
- - {activeTab === 0 && } - {activeTab === 1 && } -
- ) : ( - - )} +
) diff --git a/src/components/Account.tsx b/src/components/Account.tsx index 6a6345e..ed0e9c4 100644 --- a/src/components/Account.tsx +++ b/src/components/Account.tsx @@ -14,13 +14,13 @@ const Account = () => { return (
Address: {ellipseAddress(activeAddress)} -
Network: {algoConfig.network === '' ? 'localnet' : algoConfig.network}
+
Network: {algoConfig.network === '' ? 'localnet' : algoConfig.network}
) } diff --git a/src/components/ConnectWallet.tsx b/src/components/ConnectWallet.tsx index c4225bc..03bd7f1 100644 --- a/src/components/ConnectWallet.tsx +++ b/src/components/ConnectWallet.tsx @@ -14,7 +14,7 @@ const ConnectWallet = ({ openModal, closeModal }: ConnectWalletInterface) => { return (
-

Select wallet provider

+

Select wallet provider

{activeAddress && ( diff --git a/src/pages/ActiveTab.tsx b/src/pages/ActiveTab.tsx new file mode 100644 index 0000000..a2c5b68 --- /dev/null +++ b/src/pages/ActiveTab.tsx @@ -0,0 +1,27 @@ +import { useWallet } from '@txnlab/use-wallet' +import { useState } from 'react' +import Gallery from '../components/Gallery' +import Hero from '../components/Hero' +import { Navbar } from '../components/Navbar' + +const ActiveTab = () => { + const [activeTab, setActiveTab] = useState(0) // 0 = Mint; 1 = Gallery + + const { activeAddress } = useWallet() + + return ( +
+ {activeAddress ? ( +
+ + {activeTab === 0 && } + {activeTab === 1 && } +
+ ) : ( + + )} +
+ ) +} + +export default ActiveTab