In hooks/useAccount.ts around line 13:
const addressObject = {
address: '',
displayName: '',
};
const addressToHistoricObject = (address: string) => {
addressObject.address = address;
addressObject.displayName = address.slice(0, 4) + '...' + address.slice(-4);
return addressObject
};A single addressObject is created at module scope. Every call mutates and returns the same object reference. React uses referential equality for shallow comparison. Since the returned object is always the same reference, components that depend on this value (WalletData, EscrowPanel) will not re-render when the address actually changes.
The comment says "returning the same object identity every time avoids unnecessary re-renders" but this is backwards. It prevents necessary re-renders. If a user connects a different wallet, the UI keeps showing the old address.
This is high severity. The function needs to return a new object each time so React detects the change. Use useMemo in the hook if referential stability is needed only when the value hasn't changed.
Relevant file is hooks/useAccount.ts (lines 13-20).
Before submitting your PR, make sure all checks pass locally and the build succeeds. Each issue will be thoroughly reviewed and only merged if it fully meets the requirements. In your PR, specify the issue number and title. You can optionally provide a screenshot showing the fix working. On the issue, comment tagging the author to let them know you're working on it. On the PR, tag the maintainer to notify that review is ready.
In hooks/useAccount.ts around line 13:
A single addressObject is created at module scope. Every call mutates and returns the same object reference. React uses referential equality for shallow comparison. Since the returned object is always the same reference, components that depend on this value (WalletData, EscrowPanel) will not re-render when the address actually changes.
The comment says "returning the same object identity every time avoids unnecessary re-renders" but this is backwards. It prevents necessary re-renders. If a user connects a different wallet, the UI keeps showing the old address.
This is high severity. The function needs to return a new object each time so React detects the change. Use useMemo in the hook if referential stability is needed only when the value hasn't changed.
Relevant file is hooks/useAccount.ts (lines 13-20).
Before submitting your PR, make sure all checks pass locally and the build succeeds. Each issue will be thoroughly reviewed and only merged if it fully meets the requirements. In your PR, specify the issue number and title. You can optionally provide a screenshot showing the fix working. On the issue, comment tagging the author to let them know you're working on it. On the PR, tag the maintainer to notify that review is ready.