about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/components/column.js
diff options
context:
space:
mode:
authorEugen Rochko <eugen@zeonfederated.com>2019-08-01 19:17:17 +0200
committerThibaut Girka <thib@sitedethib.com>2019-10-06 00:32:06 +0200
commit90bdbddbfe44be77de1d2cd88bb7f469f5d6132f (patch)
tree603ca399f375e0a8f25348510047a46345a0ed1c /app/javascript/flavours/glitch/components/column.js
parentfdadd520b184fbf8e0b99c25a19ef7f25ca651f6 (diff)
[Glitch] Fix scroll to top in single column UI
Port 2dee293c4c98486d387105224023fad02b8b0d96 to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours/glitch/components/column.js')
-rw-r--r--app/javascript/flavours/glitch/components/column.js15
1 files changed, 12 insertions, 3 deletions
diff --git a/app/javascript/flavours/glitch/components/column.js b/app/javascript/flavours/glitch/components/column.js
index dc87818a5..5819d5362 100644
--- a/app/javascript/flavours/glitch/components/column.js
+++ b/app/javascript/flavours/glitch/components/column.js
@@ -10,10 +10,11 @@ export default class Column extends React.PureComponent {
     extraClasses: PropTypes.string,
     name: PropTypes.string,
     label: PropTypes.string,
+    bindToDocument: PropTypes.bool,
   };
 
   scrollTop () {
-    const scrollable = this.node.querySelector('.scrollable');
+    const scrollable = this.props.bindToDocument ? document.scrollingElement : this.node.querySelector('.scrollable');
 
     if (!scrollable) {
       return;
@@ -35,11 +36,19 @@ export default class Column extends React.PureComponent {
   }
 
   componentDidMount () {
-    this.node.addEventListener('wheel', this.handleWheel,  detectPassiveEvents.hasSupport ? { passive: true } : false);
+    if (this.props.bindToDocument) {
+      document.addEventListener('wheel', this.handleWheel,  detectPassiveEvents.hasSupport ? { passive: true } : false);
+    } else {
+      this.node.addEventListener('wheel', this.handleWheel,  detectPassiveEvents.hasSupport ? { passive: true } : false);
+    }
   }
 
   componentWillUnmount () {
-    this.node.removeEventListener('wheel', this.handleWheel);
+    if (this.props.bindToDocument) {
+      document.removeEventListener('wheel', this.handleWheel);
+    } else {
+      this.node.removeEventListener('wheel', this.handleWheel);
+    }
   }
 
   render () {