about summary refs log tree commit diff
path: root/app
diff options
context:
space:
mode:
authorNolan Lawson <nolan@nolanlawson.com>2017-05-28 07:26:35 -0700
committerEugen Rochko <eugen@zeonfederated.com>2017-05-28 16:26:35 +0200
commit28cbfb9f10a7e9f136bcf287404958d83d3c4a6a (patch)
tree150b58d42c3c29fa55bbf763c08fb602c2d576f2 /app
parent189a06d2a27808f64497102a08ce93bfb375f14a (diff)
Simplify isIntersecting in status_list.js (#3371)
Diffstat (limited to 'app')
-rw-r--r--app/javascript/mastodon/components/status_list.js27
1 files changed, 22 insertions, 5 deletions
diff --git a/app/javascript/mastodon/components/status_list.js b/app/javascript/mastodon/components/status_list.js
index b82c63a84..59089ad92 100644
--- a/app/javascript/mastodon/components/status_list.js
+++ b/app/javascript/mastodon/components/status_list.js
@@ -27,7 +27,8 @@ class StatusList extends ImmutablePureComponent {
   };
 
   state = {
-    isIntersecting: [{ }],
+    isIntersecting: {},
+    intersectionCount: 0,
   }
 
   statusRefQueue = []
@@ -65,15 +66,31 @@ class StatusList extends ImmutablePureComponent {
   attachIntersectionObserver () {
     const onIntersection = (entries) => {
       this.setState(state => {
-        const isIntersecting = { };
 
         entries.forEach(entry => {
           const statusId = entry.target.getAttribute('data-id');
 
-          state.isIntersecting[0][statusId] = entry.isIntersecting;
+          state.isIntersecting[statusId] = entry.isIntersecting;
         });
 
-        return { isIntersecting: [state.isIntersecting[0]] };
+        // isIntersecting is a map of DOM data-id's to booleans (true for
+        // intersecting, false for non-intersecting).
+        //
+        // We always want to return true in shouldComponentUpdate() if
+        // this object changes, because onIntersection() is only called if
+        // something has changed.
+        //
+        // Now, we *could* use an immutable map or some other structure to
+        // diff the full map, but that would be pointless because the browser
+        // has already informed us that something has changed. So we can just
+        // use a regular object, which will be diffed by ImmutablePureComponent
+        // based on reference equality (i.e. it's always "unchanged") and
+        // then we just increment intersectionCount to force a change.
+
+        return {
+          isIntersecting: state.isIntersecting,
+          intersectionCount: state.intersectionCount + 1,
+        };
       });
     };
 
@@ -122,7 +139,7 @@ class StatusList extends ImmutablePureComponent {
 
   render () {
     const { statusIds, onScrollToBottom, scrollKey, shouldUpdateScroll, isLoading, isUnread, hasMore, prepend, emptyMessage } = this.props;
-    const isIntersecting = this.state.isIntersecting[0];
+    const { isIntersecting } = this.state;
 
     let loadMore       = null;
     let scrollableArea = null;