wip: Improve UX

src/app/_layout/Nav.tsx

@@ -1,14 +1,13 @@
 "use client";
 
-import { useCallback, useState } from "react";
+import { useState } from "react";
 
 import Image from "next/image";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 
-import { walletApi } from "@/common/contracts";
 import useIsClient from "@/common/lib/useIsClient";
-import { Button } from "@/common/ui/components";
+import { SignInButton } from "@/modules/auth";
 import { useAuth } from "@/modules/auth/hooks/useAuth";
 import routesPath from "@/modules/core/routes";
 
@@ -37,26 +36,9 @@ const AuthButton = () => {
   const { isAuthenticated } = useAuth();
   const isClient = useIsClient();
 
-  const loginHandler = useCallback(() => {
-    walletApi.signInModal();
-  }, []);
-
   if (!isClient) return;
 
-  if (isAuthenticated) {
-    return <UserDropdown />;
-  }
-
-  return (
-    <Button
-      font="semibold"
-      variant="standard-filled"
-      onClick={loginHandler}
-      className="border-none bg-[#342823] shadow-none"
-    >
-      Sign In
-    </Button>
-  );
+  return isAuthenticated ? <UserDropdown /> : <SignInButton />;
 };
 
 const MobileMenuButton = ({ onClick }: { onClick: () => void }) => {

src/common/api/pagoda/hooks.ts

@@ -4,31 +4,55 @@ import { AccountId, ByAccountId } from "@/common/types";
 
 import { swrHooks } from "./generated";
 
+export const useNearAccountBalance = ({ accountId }: ByAccountId) => {
+  const queryResult = swrHooks.useGetAccountsAccountIdBalancesNEAR(
+    accountId,
+    undefined,
+    PAGODA_REQUEST_CONFIG,
+  );
+
+  return { ...queryResult, data: queryResult.data?.data };
+};
+
+export const useFtAccountBalances = ({ accountId }: ByAccountId) => {
+  const queryResult = swrHooks.useGetAccountsAccountIdBalancesFT(
+    accountId,
+    undefined,
+    PAGODA_REQUEST_CONFIG,
+  );
+
+  return { ...queryResult, data: queryResult.data?.data };
+};
+
 export type TokenMetadataInputs = {
   /**
    * Either "NEAR" or FT contract account id.
    */
   tokenId: "near" | AccountId;
+  disabled?: boolean;
 };
 
-export const useTokenMetadata = ({ tokenId }: TokenMetadataInputs) => {
+export const useTokenMetadata = ({
+  tokenId,
+  disabled = false,
+}: TokenMetadataInputs) => {
   const nearQueryResult = swrHooks.useGetAccountsAccountIdBalancesNEAR(
     walletApi.accountId ?? "unknown",
     undefined,
 
     {
       ...PAGODA_REQUEST_CONFIG,
-      swr: { enabled: tokenId === NEAR_TOKEN_DENOM },
+      swr: { enabled: !disabled && tokenId === NEAR_TOKEN_DENOM },
     },
   );
 
   const ftQueryResult = swrHooks.useGetNep141MetadataContractAccountId(
-    walletApi.accountId ?? "unknown",
+    tokenId,
     undefined,
 
     {
       ...PAGODA_REQUEST_CONFIG,
-      swr: { enabled: tokenId !== NEAR_TOKEN_DENOM },
+      swr: { enabled: !disabled && tokenId !== NEAR_TOKEN_DENOM },
     },
   );
 
@@ -41,23 +65,3 @@ export const useTokenMetadata = ({ tokenId }: TokenMetadataInputs) => {
         : ftQueryResult.data?.data.metadata,
   };
 };
-
-export const useNearAccountBalance = ({ accountId }: ByAccountId) => {
-  const queryResult = swrHooks.useGetAccountsAccountIdBalancesNEAR(
-    accountId,
-    undefined,
-    PAGODA_REQUEST_CONFIG,
-  );
-
-  return { ...queryResult, data: queryResult.data?.data };
-};
-
-export const useFtAccountBalances = ({ accountId }: ByAccountId) => {
-  const queryResult = swrHooks.useGetAccountsAccountIdBalancesFT(
-    accountId,
-    undefined,
-    PAGODA_REQUEST_CONFIG,
-  );
-
-  return { ...queryResult, data: queryResult.data?.data };
-};