Hide items rendered out-of-frame (once they have been rendered at least once)

diff --git a/app/javascript/flavours/glitch/components/intersection_observer_article.js b/app/javascript/flavours/glitch/components/intersection_observer_article.js
index 6eeca5598e391b0fd1e11504c8f6c84cbac541a7..03d8f17c6b207c029c9bc698760240cea1de00e0 100644 (file)
--- a/app/javascript/flavours/glitch/components/intersection_observer_article.js
+++ b/app/javascript/flavours/glitch/components/intersection_observer_article.js
@@ -63,7 +63,7 @@ export default class IntersectionObserverArticle extends ImmutablePureComponent
   }
 
   updateStateAfterIntersection = (prevState) => {
-    if (prevState.isIntersecting && !this.entry.isIntersecting) {
+    if (prevState.isIntersecting !== false && !this.entry.isIntersecting) {
       scheduleIdleTask(this.hideIfNotIntersecting);
     }
     return {
@@ -109,7 +109,7 @@ export default class IntersectionObserverArticle extends ImmutablePureComponent
           ref={this.handleRef}
           aria-posinset={index + 1}
           aria-setsize={listLength}
-          style={{ height: `${this.height || cachedHeight}px`, opacity: 0, overflow: 'hidden' }}
+          style={{ height: `${this.height || cachedHeight || 150}px`, opacity: 0, overflow: 'hidden' }}
           data-id={id}
           tabIndex='0'
         >