The original bug was that the WebOTP effect had [subView, triggerVerifyOtp]
as its dependency array. triggerVerifyOtp is a useCallback that depends on
[fetchProfile, onClose] - both of which can change reference during normal
re-renders. Each reference change caused React to re-run the effect, which
called AbortController.abort() on the still-pending OTP Promise. The user
would see the 'Allow' modal, click Allow, but the Promise was already aborted
so nothing happened.
Fix: use triggerVerifyOtpRef (a stable ref) so the WebOTP effect only depends
on [subView] / [step]. The ref is kept up-to-date via a dedicated sync effect.
Additional improvements:
- 400ms delay before auto-verify so user can see the filled boxes
- toEnglishDigits on otp.code to handle Persian numerals in the response
- Same fix applied to LoginModal (handleVerifyOtpWithCode -> verifyOtpRef)
1fd9a92dd0