fixes and coc balance

pages/auth.tsx

@@ -14,7 +14,7 @@ const Home: React.FC = () => {
             const params = new URLSearchParams(window.location.search);
             const requestIdFromUrl = params.get('request_id');
 
-            if(!result.includes('privy')){
+            if (!result.includes('privy')) {
                 return;
             }
             try {
@@ -55,17 +55,21 @@ const Home: React.FC = () => {
     return (
         <div className='flex items-center justify-center bg-black h-screen text-white'>
             {user && ready ? (
-                <div className='justify-center grid-flow-row grid items-center flex-col '>
+                <div className='justify-center flex flex-col items-center'>
                     <h1 className='neon-text mb-4 text-3xl'>Login Success. You may close this now.</h1>
                     <Link href="/dashboard">
-                        <div className='bg-purple-700 w-36 items-center justify-center flex rounded-xl h-10'>Dashboard</div>
+                        <div className='bg-purple-700 px-10 py-2 items-center justify-center flex rounded-full '>Go to Dashboard</div>
                     </Link>
                 </div>
 
             ) : (
                 <>
-                    <h1 className='neon-text mb-4 text-3xl'>Complete W3B Wallet Login</h1>
+                    <div className="flex flex-col items-center justify-center">
-                    <button className='bg-green-700 rounded-full p-1 px-4 text-lg m-5' onClick={login}>Login</button>
+                        <h1 className="neon-text mb-4 text-3xl">Complete W3B Wallet Login</h1>
+                        <button className="bg-green-700 rounded-full p-1 px-10 text-lg m-5 py-2" onClick={login}>Login</button>
+                    </div>
+
+
                 </>
             )}
         </div>

pages/dashboard.tsx

@@ -28,12 +28,19 @@ export default function DashboardPage() {
 
   const { ready, authenticated, user, logout,exportWallet, linkWallet,unlinkWallet, linkDiscord, unlinkDiscord, linkTwitter, unlinkTwitter,linkGoogle, unlinkGoogle } = usePrivy();
   const { wallets } = useWallets();
+
+  const [activeWallet, setActiveWallet] = useState(user?.wallet?.address);
+
   const { data: balanceData } =  useBalance({
-    address: user?.wallet?.address as `0x${string}`,
+    address: activeWallet as `0x${string}`,
+    token: "0x22b6c31c2beb8f2d0d5373146eed41ab9ede3caf"
   });
+
+
   const balance = balanceData?.formatted;
   const token = balanceData?.symbol;
 
+
   useEffect(() => {
     if (ready && !authenticated) {
       router.push("/");
@@ -74,8 +81,20 @@ export default function DashboardPage() {
 
     fetchUsername();
     fetchVaultData();
+
   }, [ready]);
 
+  useEffect(()=>{
+    setActiveWallet(getEmbeddedConnectedWallet(wallets)?.address);
+
+    wallets.map((wallet)=>{
+      if(activeWallet == wallet.address){
+        if(!wallet.linked){
+        }
+      }
+    });
+  },[wallets])
+
   const numAccounts = user?.linkedAccounts?.length || 0;
   const canRemoveAccount = numAccounts > 1;
 
@@ -87,6 +106,7 @@ export default function DashboardPage() {
   const twitterSubject = user?.twitter?.subject || null;
   const discordSubject = user?.discord?.subject || null;
 
+
   function ToggleDiscord(){
     if(user?.discord){
       unlinkDiscord(user?.discord.subject);
@@ -135,8 +155,8 @@ export default function DashboardPage() {
                 <h1 className="text-4xl flex justify-center">{vaultData.vc || "0"} VC</h1>
               </div>
               <div className="items-center justify-center p-20">
-                {/* <h1 className="text-xs">{user?.wallet?.address}</h1>
+                 <h1 className="text-xs">{activeWallet}</h1>
-                <h1 className="text-4xl flex justify-center">{balance || 0} {token}</h1> */}
+                <h1 className="text-4xl flex justify-center">{balance || 0} {token}</h1> 
               </div>
               <div className="items-center justify-center p-20">
                 <h1 className="text-s">Pre-hunt Points</h1>
@@ -191,7 +211,7 @@ export default function DashboardPage() {
                 <h1 className="text-xl flex justify-center mb-5">Wallets</h1>
                 <div>
                   <div>
-                    <div className={`grid grid-cols-6 bg-gray-600 rounded-full py-2 px-20 items-center h-20`}>
+                    <div className={`grid grid-cols-6 ${activeWallet == getEmbeddedConnectedWallet(wallets)?.address ? "bg-gray-600" : "bg-gray-800"} rounded-full py-2 px-20 items-center h-20`} onClick={()=>{setActiveWallet(getEmbeddedConnectedWallet(wallets)?.address)}}>
                       <button className="w-12">
                         <FontAwesomeIcon icon={faLink}/>
                       </button>
@@ -215,9 +235,10 @@ export default function DashboardPage() {
                   {
                     wallets.map((wallet)=>{
                       if(wallet.connectorType == "embedded"){return "";}
+                      const address = wallet.address;
                       return (
                         <div>
-                          <div className={`grid grid-cols-6 ${wallet.linked ? "bg-gray-800" : "bg-gray-900 bg-opacity-30 text-gray-600"} rounded-full py-2 px-20 items-center h-20`}>
+                          <div className={`grid grid-cols-6 ${wallet.linked ? (address == activeWallet ? "bg-gray-600" :"bg-gray-800") : "bg-gray-900 bg-opacity-30 text-gray-600"} rounded-full py-2 px-20 items-center h-20`} onClick={()=>{setActiveWallet(address)}}>
                             <button className="w-8">
                               <FontAwesomeIcon icon={faWallet}/>
                             </button>