Repository navigation
[Due for payment 2026-10-27] Migrate react-native-gesture-handler builder API to the 3.x hook API #102782
Description
Problem
Bump react-native-gesture-handler to 3.3.0 upgrades react-native-gesture-handler to 3.x but keeps App on the builder API (Gesture.Pan(), Gesture.Pinch(), GestureDetector, GestureType, and so on). Gesture Handler 3 marks that whole API as @deprecated in favor of the new hook-based API (usePanGesture, usePinchGesture, useTapGesture, ...).
To keep that PR a plain version bump, it renames the types to LegacyPanGesture, LegacyPinchGesture, LegacyTapGesture and LegacyComposedGesture and grandfathers 82 @typescript-eslint/no-deprecated violations across 24 files in config/eslint/eslint.seatbelt.tsv. Reviewers agreed to split the migration into a follow-up (review thread).
Solution
Migrate every gesture in App from the builder API to the Gesture Handler 3 hook API, then remove the matching no-deprecated entries from the seatbelt baseline. Split the work into more than one PR if that lowers regression risk, for example by feature area.
Files to migrate (from the seatbelt entries added in the bump PR):
Attachments and zoom
- src/components/Attachments/AttachmentCarousel/AttachmentCarouselView/index.tsx
- src/components/Attachments/AttachmentCarousel/Pager/index.tsx
- src/components/Attachments/AttachmentCarousel/Pager/types.ts
- src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.tsx
- src/components/MultiGestureCanvas/index.tsx
- src/components/MultiGestureCanvas/usePanGesture.ts
- src/components/MultiGestureCanvas/usePinchGesture.ts
- src/components/MultiGestureCanvas/useTapGestures.ts
Crop views and sliders
- src/components/AvatarCropModal/AvatarCropView.tsx
- src/components/AvatarCropModal/ImageCropView.tsx
- src/components/AvatarCropModal/Slider.tsx
- src/components/ReceiptCropView/index.tsx
- src/pages/iou/request/step/IOURequestStepGPSTripEdit/Slider.tsx
Video player
- src/components/VideoPlayer/VideoPlayerControls/ProgressBar/index.tsx
- src/components/VideoPlayer/VideoPlayerControls/VolumeButton/index.tsx
Charts
- src/components/Charts/hooks/useChartInteractions.ts
- src/components/Charts/PieChart/PieChartContent.tsx
Other
- src/components/Modal/ReanimatedModal/Container/GestureHandler.tsx (swipe-to-dismiss)
- src/components/GrowlNotification/GrowlNotificationContent.tsx (fling-to-dismiss)
- src/components/HTMLEngineProvider/HTMLRenderers/HTMLTableScroll/index.native.tsx
- src/components/ValidateCodeInput.tsx
- src/hooks/useNativeCamera.ts
- src/pages/inbox/report/ReportActionCompose/ComposerSendButton.tsx
- src/pages/iou/request/step/IOURequestStepScan/components/CameraViewport.tsx (tap-to-focus)
Done when
- No App code uses the deprecated Gesture Handler builder API or
Legacy*gesture types. - The
@typescript-eslint/no-deprecatedseatbelt entries for Gesture Handler symbols are removed. - Gestures behave the same on all platforms (attachment pinch / pan / double tap / swipe, crop views, sliders, video controls, modal and Growl dismiss, charts, camera tap-to-focus).
Related: Upgrade react-native-gesture-handler to 3.x before RN 0.88 bump
Requested by @mountiny in #102678 (comment)
Activity
QichenZhu commentedon Oct 6, 2026
The PR this issue is on hold for has been deployed to production.
[-][HOLD App#102678] Migrate react-native-gesture-handler builder API to the 3.x hook API[/-][+]Migrate react-native-gesture-handler builder API to the 3.x hook API[/+]mountiny commentedon Oct 7, 2026
@collectioneur will you work on this, or should we pull in someone else?
collectioneur commentedon Oct 8, 2026
Yeah, I'll work on this 👌
collectioneur commentedon Oct 15, 2026
Opened the PR for the pan gesture migration
cc: @QichenZhu
[-]Migrate react-native-gesture-handler builder API to the 3.x hook API[/-][+][Due for payment 2026-10-22] Migrate react-native-gesture-handler builder API to the 3.x hook API[/+]melvin-bot commentedon Oct 15, 2026
@QichenZhu
The solution for this issue has been 🚀 deployed to production 🚀 in version 9.5.9-4 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:
If no regressions arise, payment will be issued on 2026-10-22. 🎊
The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the Contributor+ Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]. If no checklist is needed for this issue, you can click: [no checklist button]
[-][Due for payment 2026-10-22] Migrate react-native-gesture-handler builder API to the 3.x hook API[/-][+][Due for payment 2026-10-27] Migrate react-native-gesture-handler builder API to the 3.x hook API[/+]melvin-bot commentedon Oct 20, 2026
@QichenZhu
The solution for this issue has been 🚀 deployed to production 🚀 in version 9.5.14-3 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:
If no regressions arise, payment will be issued on 2026-10-27. 🎊
The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the Contributor+ Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]. If no checklist is needed for this issue, you can click: [no checklist button]