From da3287c10079fc06385c6477887fb94256295c4f Mon Sep 17 00:00:00 2001
From: Ben Gotow <bengotow@gmail.com>
Date: Fri, 23 Oct 2015 15:03:12 -0700
Subject: [PATCH] fix(undo-redo): Fix "undo" button clickability, improve
 animation

---
 .../undo-redo/lib/undo-redo-component.cjsx             | 10 ++++++----
 internal_packages/undo-redo/stylesheets/undo-redo.less |  9 +++++++--
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/internal_packages/undo-redo/lib/undo-redo-component.cjsx b/internal_packages/undo-redo/lib/undo-redo-component.cjsx
index d384a2a24..14cbbb5f4 100644
--- a/internal_packages/undo-redo/lib/undo-redo-component.cjsx
+++ b/internal_packages/undo-redo/lib/undo-redo-component.cjsx
@@ -12,6 +12,8 @@ AccountStore} = require 'nylas-exports'
 class UndoRedoComponent extends React.Component
   @displayName: 'UndoRedoComponent'
 
+  @containerRequired: false
+
   constructor: (@props) ->
     @state = @_getStateFromStores()
     @_timeout = null
@@ -53,8 +55,8 @@ class UndoRedoComponent extends React.Component
 
     <TimeoutTransitionGroup
       className={names}
-      leaveTimeout={450}
-      enterTimeout={250}
+      leaveTimeout={150}
+      enterTimeout={150}
       transitionName="undo-redo-item">
       {inner}
     </TimeoutTransitionGroup>
@@ -65,7 +67,7 @@ class UndoRedoComponent extends React.Component
         <div className="undo-redo-message-wrapper">
           {@state.task.description()}
         </div>
-        <div className="undo-redo-action-wrapper" onClick={@_undoTask}>
+        <div className="undo-redo-action-wrapper" onClick={@_onClick}>
           <RetinaImg name="undo-icon@2x.png"
                      mode={RetinaImg.Mode.ContentPreserve}/>
           <span className="undo-redo-action-text">Undo</span>
@@ -74,7 +76,7 @@ class UndoRedoComponent extends React.Component
     else
       []
 
-  _undoTask: =>
+  _onClick: =>
     atom.commands.dispatch(document.querySelector('body'), 'core:undo')
     @_hide()
 
diff --git a/internal_packages/undo-redo/stylesheets/undo-redo.less b/internal_packages/undo-redo/stylesheets/undo-redo.less
index c4b90c795..0c9d7d858 100644
--- a/internal_packages/undo-redo/stylesheets/undo-redo.less
+++ b/internal_packages/undo-redo/stylesheets/undo-redo.less
@@ -4,6 +4,7 @@
 .undo-redo-manager {
   position: absolute;
   bottom: 10px;
+  z-index: 100;
   width:100%;
   text-align: center;
   pointer-events: none;
@@ -52,18 +53,22 @@ body.platform-win32 {
 
 .undo-redo-item-enter {
   opacity: 0.01;
-  transition: all .3s ease-out;
+  transform: translate3d(0, 10px, 0);
+  transition: all .15s ease-out;
 }
 
 .undo-redo-item-enter.undo-redo-item-enter-active {
   opacity: 1;
+  transform: translate3d(0, 0, 0);
 }
 
 .undo-redo-item-leave {
   opacity: 1;
-  transition: all .3s ease-in;
+  transform: translate3d(0, 0, 0);
+  transition: all .15s ease-in;
 }
 
 .undo-redo-item-leave.undo-redo-item-leave-active {
+  transform: translate3d(0, 10px, 0);
   opacity: 0.01;
 }