Skip to content

Refactor connect wallet button #369

@Victor-Okenwa

Description

@Victor-Okenwa

Optimize connect wallet to maintain bet practices and add currency format for wallet balance.

Using a Promise so both the getBalance and getAddress will execute simultaneously.

FROM

 useEffect(() => {
    if (!signer) {
      return;
    }
    (async () => {
      const addr = await signer.getRecommendedAddress();
      setAddress(addr);
    })();

    (async () => {
      const capacity = await signer.getBalance();
      setBalance(ccc.fixedPointToString(capacity));
    })();

    return () => {

    };
  }, [signer]);

TO

useEffect(() => {
  if (!signer) return;
  
  let isMounted = true;
  
  (async () => {
    try {
      const [address, capacity] = await Promise.all([
        signer.getRecommendedAddress(),
        signer.getBalance()
      ]);
      
      if (isMounted) {
        setAddress(address);
        setBalance(ccc.fixedPointToString(capacity));
      }
    } catch (error) {
      console.error('Failed to fetch data:', error);
    }
  })();
  
  return () => { isMounted = false; };
}, [signer]);

Adding currency format to balance.

const formatter = new Intl.NumberFormat('en-US');
return (
  <h2 className="text-sm font-semibold">
      {formatter.format(balance)} CKB
  </h2>
)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions