[0.65.x] Deprecated Dimensions event listeners

[efstathiosntonas]

Since react-native 0.65.x handling listeners has changed, here's a patch-package file to temp fix only ToastView.js:

diff --git a/node_modules/react-native-smart-tip/toast/ToastView.js b/node_modules/react-native-smart-tip/toast/ToastView.js
index 348e3a4..27f36e7 100644
--- a/node_modules/react-native-smart-tip/toast/ToastView.js
+++ b/node_modules/react-native-smart-tip/toast/ToastView.js
@@ -25,7 +25,7 @@ export default class ToastView extends Component{
         }
 
         // React after 17
-        Dimensions.addEventListener('change', this.onWindowChange);
+       this.dimensionsSubscription = Dimensions.addEventListener('change', this.onWindowChange);
     }
 
     componentDidMount() {
@@ -37,7 +37,7 @@ export default class ToastView extends Component{
             this.liftCycleAnimated.stop()
             this.liftCycleAnimated = undefined
         }
-        Dimensions.removeEventListener('change', this.onWindowChange);
+        this.dimensionsSubscription?.remove();
     }
 
     render() {

@mochixuan for backwards compatibility you could add:

import React from 'react';
const ReactNativeVersion = require('react-native/Libraries/Core/ReactNativeVersion');


constructor(props) {
    super(props);

    const { width, height } = Dimensions.get("window");

    this.state = {
      deviceWidth: width,
      deviceHeight: height,
      animatedValue1: new Animated.Value(0),
      animatedValue2: new Animated.Value(0.2)
    };

    // React after 17
    if (v >= 65) {
      this.dimensionsSubscription = Dimensions.addEventListener(
        "change",
        this.onWindowChange
      );
    } else {
      Dimensions.addEventListener("change", this.onWindowChange);
    }
  }

  componentWillUnmount() {
    if (this.liftCycleAnimated) {
      this.liftCycleAnimated.stop();
      this.liftCycleAnimated = undefined;
    }

    const v = parseInt(
      ReactNativeVersion.version.major + ReactNativeVersion.version.minor,
      10
    );

    if (v >= 65) {
      this.dimensionsSubscription?.remove();
    } else {
      Dimensions.removeEventListener("change", this.onWindowChange);
    }
  }

not tested ^^, just a suggestion, this should apply to all Views, not only ToastView 😄

[mochixuan]

Thank you very much for your suggestion, if there is a compatibility problem, I will make it compatible in the future

[YongZL]

@efstathiosntonas Thank you for solving my problem

[flyskywhy]

Because no official new version for years, I have to create @flyskywhy/react-native-smart-tip to solve this issue.

[tosebikan]

hi @mochixuan thanks for this package, i just opened a PR to fix the issue as the package is used across multiple projects of mine, and it would help other devs who come across it, thanks again.