Unobserve status on unmount (#3851)

diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index 7ca898c3958786bea2cdc8c94eabe555241e2a63..3b8f88bf791a6b2c49fb90b9100fc0cb1430b1ab 100644 (file)
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -88,6 +88,16 @@ class Status extends ImmutablePureComponent {
     );
   }
 
+  componentWillUnmount () {
+    if (!this.props.intersectionObserverWrapper) {
+      // TODO: enable IntersectionObserver optimization for notification statuses.
+      // These are managed in notifications/index.js rather than status_list.js
+      return;
+    }
+
+    this.props.intersectionObserverWrapper.unobserve(this.props.id, this.node);
+  }
+
   handleIntersection = (entry) => {
     // Edge 15 doesn't support isIntersecting, but we can infer it
     // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/12156111/

diff --git a/app/javascript/mastodon/features/ui/util/intersection_observer_wrapper.js b/app/javascript/mastodon/features/ui/util/intersection_observer_wrapper.js
index 0e959f9ae8e9f4955d090c38ce8e3ef2f9c6c41d..b15f8b9ef55649051bcc2fa579b66e9d746831c9 100644 (file)
--- a/app/javascript/mastodon/features/ui/util/intersection_observer_wrapper.js
+++ b/app/javascript/mastodon/features/ui/util/intersection_observer_wrapper.js
@@ -37,6 +37,13 @@ class IntersectionObserverWrapper {
     }
   }
 
+  unobserve (id, node) {
+    if (this.observer) {
+      delete this.callbacks[id];
+      this.observer.unobserve(node);
+    }
+  }
+
   disconnect () {
     if (this.observer) {
       this.observer.disconnect();