Migrate off of deprecated `Dimensions.removeEventListener`

[George Antonious]

As of React Native v0.65 Dimensions.removeEventListener has been deprecated and using it will emit warnings. This can add significant noise to the console if you have many restyle components unmounting. We have a couple of options for migration here:

Option 1) Leave our react-native peer dependency at >=0.59.0 and conditionally call deprecated API

With React Native v0.65 Dimensions.addEventListener has been updated to return a EventSubscription instead of void. We can check if a remove property exists on the returned value and if so use the new remove API else use the old Dimensions.removeEventListener.

Option 2) Bump our react-native peer dependency to >=0.61.0 and use the builtin useWindowDimensions API

This removes our need to interact with Dimensions and its deprecated APIs: https://reactnative.dev/docs/usewindowdimensions. Though this will bump our minimum supported react-native version potentially breaking compatibility for consumers.

Dimensions usage:

restyle/src/hooks/useDimensions.ts

Lines 6 to 22 in 22cd0d3

 const useDimensions = () => { 
   const [dimensions, setDimensions] = useState<DimensionsType>( 
     Dimensions.get('window'), 
   ); 
  
   const onChange = ({window}: {window: DimensionsType}) => { 
     setDimensions(window); 
   }; 
  
   useEffect(() => { 
     Dimensions.addEventListener('change', onChange); 
  
     return () => Dimensions.removeEventListener('change', onChange); 
   }, []); 
  
   return dimensions; 
 }; 

[Dejan Ranisavljevic]

I just upgraded to 0.65 and discovered this. Anyone looking into this, i can help with PR if needed.

[Naoufal ElYoussoufi]

Just published the version 1.5.0 with the fix.