Skip to content

Commit e09cd1c

Browse files
committed
fix: synchronize account text state with ref to avoid stale closure
1 parent 3a00d0e commit e09cd1c

File tree

1 file changed

+15
-7
lines changed

1 file changed

+15
-7
lines changed

ui/components/multichain/pages/gator-permissions/components/review-gator-permission-item.tsx

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -128,17 +128,22 @@ export const ReviewGatorPermissionItem = ({
128128
getInternalAccountByAddress(state, permissionAccount),
129129
);
130130

131+
const truncatedAddress = shortenAddress(permissionAccount);
131132
// Copy functionality with visual feedback
132-
const [accountText, setAccountText] = useState(
133-
shortenAddress(permissionAccount),
134-
);
133+
const [accountText, setAccountText] = useState(truncatedAddress);
135134
const [addressCopied, setAddressCopied] = useState(false);
136135
const [copyIcon, setCopyIcon] = useState(IconName.Copy);
137136
const [copyMessage, setCopyMessage] = useState(accountText);
138137

139138
const timeoutRef = useRef<number | null>(null);
139+
const accountTextRef = useRef(accountText);
140140
const [, handleCopy] = useCopyToClipboard();
141141

142+
// Keep ref in sync with state
143+
useEffect(() => {
144+
accountTextRef.current = accountText;
145+
}, [accountText]);
146+
142147
// Cleanup timeout when component unmounts
143148
useEffect(() => {
144149
return () => {
@@ -151,9 +156,11 @@ export const ReviewGatorPermissionItem = ({
151156

152157
useEffect(() => {
153158
if (internalAccount?.metadata?.name) {
154-
setAccountText(internalAccount?.metadata?.name);
159+
setAccountText(internalAccount.metadata.name);
160+
} else {
161+
setAccountText(truncatedAddress);
155162
}
156-
}, [internalAccount]);
163+
}, [internalAccount, truncatedAddress]);
157164

158165
// Update copy message when account changes
159166
useEffect(() => {
@@ -173,13 +180,14 @@ export const ReviewGatorPermissionItem = ({
173180
setCopyIcon(IconName.CopySuccess);
174181

175182
// Reset state after 1 second
183+
// Use ref to get the latest accountText value, avoiding stale closure
176184
timeoutRef.current = window.setTimeout(() => {
177-
setCopyMessage(accountText);
185+
setCopyMessage(accountTextRef.current);
178186
setCopyIcon(IconName.Copy);
179187
setAddressCopied(false);
180188
timeoutRef.current = null;
181189
}, 1000);
182-
}, [permissionAccount, accountText, handleCopy, t]);
190+
}, [permissionAccount, handleCopy, t]);
183191

184192
const tokenMetadata = useTokenMetadata(
185193
tokenAddress,

0 commit comments

Comments
 (0)