From 9c2a05ba3f65879ee68f958f338bb101eb6daaaf Mon Sep 17 00:00:00 2001
From: Juan Tejada <juans.tejada@gmail.com>
Date: Wed, 24 Feb 2016 15:01:44 -0800
Subject: [PATCH] fix(fixed-popover): Reposition when overflowing on `left`
 direction

- This is a temporary solution
---
 .../lib/quick-action-snooze-button.jsx        |  4 +--
 src/components/fixed-popover.jsx              | 28 +++++++++++++------
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/internal_packages/thread-snooze/lib/quick-action-snooze-button.jsx b/internal_packages/thread-snooze/lib/quick-action-snooze-button.jsx
index a919d215e..54d717218 100644
--- a/internal_packages/thread-snooze/lib/quick-action-snooze-button.jsx
+++ b/internal_packages/thread-snooze/lib/quick-action-snooze-button.jsx
@@ -25,10 +25,10 @@ class QuickActionSnoozeButton extends Component {
     // Grab the parent node because of the zoom applied to this button. If we
     // took this element directly, we'd have to divide everything by 2
     const element = React.findDOMNode(this).parentNode;
-    const {height, width, top, left} = element.getBoundingClientRect()
+    const {height, width, top, bottom, left, right} = element.getBoundingClientRect()
 
     // The parent node is a bit too much to the left, lets adjust this.
-    const rect = {height, width, top, left: left + 5}
+    const rect = {height, width, top, bottom, right, left: left + 5}
     Actions.openPopover(
       <SnoozePopoverBody threads={[thread]}/>,
       rect,
diff --git a/src/components/fixed-popover.jsx b/src/components/fixed-popover.jsx
index d342e203a..18f8cba0e 100644
--- a/src/components/fixed-popover.jsx
+++ b/src/components/fixed-popover.jsx
@@ -2,6 +2,11 @@ import _ from 'underscore';
 import React, {Component, PropTypes} from 'react';
 
 
+// TODO
+// This is a temporary hack for the snooze popover
+// This should be the actual dimensions of the rendered popover body
+const OVERFLOW_LIMIT = 50;
+
 /**
  * Renders a popover absultely positioned in the window next to the provided
  * rect.
@@ -69,12 +74,8 @@ class FixedPopover extends Component {
     }
   };
 
-  _getNewDirection = (direction, originRect, windowDimensions)=> {
-    // TODO
-    // This is a temporary solution for the snooze popover.
-    // This should grab the actual dimensions of the rendered popover body
-    const limit = 50;
-
+  _getNewDirection = (direction, originRect, windowDimensions, limit = OVERFLOW_LIMIT)=> {
+    // TODO this is a hack. Implement proper repositioning
     switch (direction) {
     case 'right':
       if (
@@ -93,7 +94,6 @@ class FixedPopover extends Component {
       }
       break;
     default:
-      // TODO implement missing
       break;
     }
     return null;
@@ -145,9 +145,19 @@ class FixedPopover extends Component {
         top: originRect.top,
         right: (windowDimensions.width - originRect.left) + 10,
       }
+      // TODO This is a hack for the snooze popover. Fix this
+      let popoverTop = originRect.height / 2;
+      let popoverTransform = 'translate(-100%, -50%)';
+      if (originRect.top < OVERFLOW_LIMIT * 2) {
+        popoverTop = 0;
+        popoverTransform = 'translate(-100%, 0)';
+      } else if (windowDimensions.height - originRect.bottom < OVERFLOW_LIMIT * 2) {
+        popoverTop = -190;
+        popoverTransform = 'translate(-100%, 0)';
+      }
       popoverStyle = {
-        transform: 'translate(-100%, -50%)',
-        top: originRect.height / 2,
+        transform: popoverTransform,
+        top: popoverTop,
       }
       pointerStyle = {
         transform: 'translate(-13px, -50%) rotate(270deg)',