Page MenuHomePhabricator

[native] Migrate Tooltip component to Reanimated v2 API
ClosedPublic

Authored by angelika on Wed, Dec 11, 8:26 AM.
Tags
None
Referenced Files
F3493373: D14117.id46335.diff
Thu, Dec 19, 3:07 AM
F3492709: D14117.diff
Thu, Dec 19, 1:06 AM
F3488208: D14117.diff
Wed, Dec 18, 9:20 AM
Unknown Object (File)
Tue, Dec 17, 4:27 PM
Unknown Object (File)
Sun, Dec 15, 10:35 PM
Unknown Object (File)
Fri, Dec 13, 11:17 PM
Subscribers
None

Details

Summary

This diff migrates now functional Tooltip component to Reanimated V2 api. This includes:

  • using useAnimatedStyle instead of useMemo for animated styles
  • moving reanimated nodes and their interpolations into useAnimatedStyle worklet
  • migrating tooltipHorizontalOffset to shared value
  • using positionV2 instead of position
  • I passed opacityStyle and styles.backdrop as separate styles because you can’t merge those styles like they were originally merged, this shouldn’t have any impact though

Also I calculate getTooltipLocation(), getMargin() and getTooltipHeight() outside of a worklet. The reason is that I’d need to make them into worklets and they’re calling functions that I’d need to make into worklets too and those functions are calling some Map or Set operations that are not worklets so it’s a mess. And worklets are supposed to be small functions after all. The results of those functions are in useAnimatedStyle dependencies and they shouldn’t change much so it should be ok

Depends on D14113

Test Plan

Open up tooltips and verify they're animated correctly

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

angelika held this revision as a draft.
ashoat added inline comments.
native/tooltip/tooltip.react.js
505 ↗(On Diff #46335)

We usually wrap any prop like this (getting recreated on each render) with React.useMemo

This revision is now accepted and ready to land.Wed, Dec 11, 7:49 PM

Rebase and address feedback