From 086a6be2e331dfc13eeffe171816922e545cfdb3 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Gr=C3=A9goire=20Aubert?= <gregoire.aubert@sonarsource.com>
Date: Wed, 4 Oct 2017 15:46:28 +0200
Subject: [PATCH] SONAR-9792 Fix position of issues sidebar when there is a
 background task notification

---
 .../common/ScreenPositionHelper.tsx           | 32 ++++++++-----------
 1 file changed, 14 insertions(+), 18 deletions(-)

diff --git a/server/sonar-web/src/main/js/components/common/ScreenPositionHelper.tsx b/server/sonar-web/src/main/js/components/common/ScreenPositionHelper.tsx
index 00f8f375766..a3e9d99d0e2 100644
--- a/server/sonar-web/src/main/js/components/common/ScreenPositionHelper.tsx
+++ b/server/sonar-web/src/main/js/components/common/ScreenPositionHelper.tsx
@@ -18,41 +18,37 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
-import { throttle } from 'lodash';
+import { debounce } from 'lodash';
 
 interface Props {
   className?: string;
   children: (position: { top: number; left: number }) => React.ReactElement<any>;
 }
 
-interface State {
-  position: { top: number; left: number };
-}
-
-export default class ScreenPositionHelper extends React.PureComponent<Props, State> {
+export default class ScreenPositionHelper extends React.PureComponent<Props> {
   container: HTMLDivElement;
-  throttledUpdatePosition: () => void;
+  debouncedOnResize: () => void;
 
   constructor(props: Props) {
     super(props);
-    this.state = { position: { top: 0, left: 0 } };
-    this.throttledUpdatePosition = throttle(this.updatePosition, 100);
+    this.debouncedOnResize = debounce(() => this.forceUpdate(), 250);
   }
 
   componentDidMount() {
-    this.updatePosition();
-    window.addEventListener('resize', this.throttledUpdatePosition);
+    this.forceUpdate();
+    window.addEventListener('resize', this.debouncedOnResize);
   }
 
   componentWillUnmount() {
-    window.removeEventListener('resize', this.throttledUpdatePosition);
+    window.removeEventListener('resize', this.debouncedOnResize);
   }
 
-  updatePosition = () => {
-    const containerPos = this.container.getBoundingClientRect();
-    this.setState({
-      position: { top: window.scrollY + containerPos.top, left: window.scrollX + containerPos.left }
-    });
+  getPosition = () => {
+    const containerPos = this.container && this.container.getBoundingClientRect();
+    if (!containerPos) {
+      return { top: 0, left: 0 };
+    }
+    return { top: window.scrollY + containerPos.top, left: window.scrollX + containerPos.left };
   };
 
   render() {
@@ -60,7 +56,7 @@ export default class ScreenPositionHelper extends React.PureComponent<Props, Sta
       <div
         className={this.props.className}
         ref={container => (this.container = container as HTMLDivElement)}>
-        {this.props.children(this.state.position)}
+        {this.props.children(this.getPosition())}
       </div>
     );
   }
-- 
2.39.5