Merge remote-tracking branch 'origin/master' into list-fixes

BBhelp · May 5, 2017 · 5dcd64b · 5dcd64b
2 parents 92e5a22 + 124b88e
commit 5dcd64b
Show file tree

Hide file tree

Showing 8 changed files with 70 additions and 29 deletions.
diff --git a/app/npm-shrinkwrap.json b/app/npm-shrinkwrap.json
diff --git a/app/package.json b/app/package.json
@@ -31,10 +31,10 @@
     "moment": "^2.17.1",
     "octokat": "^0.6.4",
     "react": "^15.5.4",
-    "react-addons-css-transition-group": "^15.5.2",
     "react-addons-shallow-compare": "^15.5.2",
     "react-dom": "^15.5.4",
     "react-virtualized": "^9.7.4",
+    "react-transition-group": "^1.1.3",
     "textarea-caret": "^3.0.2",
     "ua-parser-js": "^0.7.12",
     "untildify": "^3.0.2",

diff --git a/app/src/ui/app-error.tsx b/app/src/ui/app-error.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react'
-import * as  ReactCSSTransitionGroup from 'react-addons-css-transition-group'
 
 import { Button } from './lib/button'
 import { ButtonGroup } from './lib/button-group'
@@ -11,6 +10,7 @@ import { GitError as GitErrorType } from 'dugite'
 import { Popup, PopupType } from '../lib/app-state'
 import { ErrorWithMetadata } from '../lib/error-with-metadata'
 import { remote } from 'electron'
+import { CSSTransitionGroup } from 'react-transition-group'
 
 /**
  * Inspect the error metadata to see if this is an uncaught error
@@ -175,6 +175,7 @@ export class AppError extends React.Component<IAppErrorProps, IAppErrorState> {
       <Dialog
         id='app-error'
         type='error'
+        key='error'
         title={title}
         dismissable={!unhandled}
         onDismissed={this.onDismissed}
@@ -210,14 +211,14 @@ export class AppError extends React.Component<IAppErrorProps, IAppErrorState> {
 
   public render() {
     return (
-      <ReactCSSTransitionGroup
+      <CSSTransitionGroup
         transitionName='modal'
         component='div'
         transitionEnterTimeout={dialogTransitionEnterTimeout}
         transitionLeaveTimeout={dialogTransitionLeaveTimeout}
       >
         {this.renderDialog()}
-      </ReactCSSTransitionGroup>
+      </CSSTransitionGroup>
     )
   }
 }
diff --git a/app/src/ui/app.tsx b/app/src/ui/app.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react'
-import * as  ReactCSSTransitionGroup from 'react-addons-css-transition-group'
 import { ipcRenderer, shell } from 'electron'
 
 import { RepositoriesList } from './repositories-list'
@@ -41,6 +40,7 @@ import { getVersion, getName } from './lib/app-proxy'
 import { Publish } from './publish-repository'
 import { Acknowledgements } from './acknowledgements'
 import { UntrustedCertificate } from './untrusted-certificate'
+import { CSSTransitionGroup } from 'react-transition-group'
 import { BlankSlateView } from './blank-slate'
 
 /** The interval at which we should check for updates. */
@@ -737,21 +737,28 @@ export class App extends React.Component<IAppProps, IAppState> {
 
     switch (popup.type) {
       case PopupType.RenameBranch:
-        return <RenameBranch dispatcher={this.props.dispatcher}
+        return <RenameBranch
+                key='rename-branch'
+                dispatcher={this.props.dispatcher}
                 repository={popup.repository}
                 branch={popup.branch}/>
       case PopupType.DeleteBranch:
-        return <DeleteBranch dispatcher={this.props.dispatcher}
+        return <DeleteBranch
+                key='delete-branch'
+                dispatcher={this.props.dispatcher}
                 repository={popup.repository}
                 branch={popup.branch}
                 onDismissed={this.onPopupDismissed}/>
       case PopupType.ConfirmDiscardChanges:
-        return <DiscardChanges repository={popup.repository}
+        return <DiscardChanges
+                key='discard-changes'
+                repository={popup.repository}
                 dispatcher={this.props.dispatcher}
                 files={popup.files}
                 onDismissed={this.onPopupDismissed}/>
       case PopupType.Preferences:
         return <Preferences
+                key='preferences'
                 dispatcher={this.props.dispatcher}
                 appStore={this.props.appStore}
                 dotComAccount={this.getDotComAccount()}
@@ -767,6 +774,7 @@ export class App extends React.Component<IAppProps, IAppState> {
           : null
 
         return <Merge
+                key='merge-branch'
                 dispatcher={this.props.dispatcher}
                 repository={repository}
                 allBranches={state.branchesState.allBranches}
@@ -781,33 +789,37 @@ export class App extends React.Component<IAppProps, IAppState> {
         const state = this.props.appStore.getRepositoryState(repository)
 
         return <RepositorySettings
+                key='repository-settings'
                 remote={state.remote}
                 dispatcher={this.props.dispatcher}
                 repository={repository}
                 onDismissed={this.onPopupDismissed}/>
       }
       case PopupType.SignIn:
         return <SignIn
+                key='sign-in'
                 signInState={this.state.signInState}
                 dispatcher={this.props.dispatcher}
                 onDismissed={this.onSignInDialogDismissed}/>
       case PopupType.AddRepository:
         return <AddExistingRepository
+                key='add-existing-repository'
                 onDismissed={this.onPopupDismissed}
                 dispatcher={this.props.dispatcher} />
       case PopupType.CreateRepository:
         return (
           <CreateRepository
+            key='create-repository'
             onDismissed={this.onPopupDismissed}
             dispatcher={this.props.dispatcher} />
         )
       case PopupType.CloneRepository:
         return <CloneRepository
-          accounts={this.state.accounts}
-          initialURL={popup.initialURL}
-          onDismissed={this.onPopupDismissed}
-          dispatcher={this.props.dispatcher}
-        />
+                key='clone-repository'
+                accounts={this.state.accounts}
+                initialURL={popup.initialURL}
+                onDismissed={this.onPopupDismissed}
+                dispatcher={this.props.dispatcher} />
       case PopupType.CreateBranch: {
         const state = this.props.appStore.getRepositoryState(popup.repository)
         const branchesState = state.branchesState
@@ -819,6 +831,7 @@ export class App extends React.Component<IAppProps, IAppState> {
         }
 
         return <CreateBranch
+                key='create-branch'
                 tip={branchesState.tip}
                 defaultBranch={branchesState.defaultBranch}
                 allBranches={branchesState.allBranches}
@@ -829,12 +842,14 @@ export class App extends React.Component<IAppProps, IAppState> {
       case PopupType.InstallGit:
         return (
           <InstallGit
+           key='install-git'
            onDismissed={this.onPopupDismissed}
            path={popup.path} />
         )
       case PopupType.About:
         return (
           <About
+           key='about'
            onDismissed={this.onPopupDismissed}
            applicationName={getName()}
            applicationVersion={getVersion()}
@@ -845,6 +860,7 @@ export class App extends React.Component<IAppProps, IAppState> {
       case PopupType.PublishRepository:
         return (
           <Publish
+            key='publish'
             dispatcher={this.props.dispatcher}
             repository={popup.repository}
             accounts={this.state.accounts}
@@ -854,6 +870,7 @@ export class App extends React.Component<IAppProps, IAppState> {
       case PopupType.UntrustedCertificate:
         return (
           <UntrustedCertificate
+            key='untrusted-certificate'
             certificate={popup.certificate}
             url={popup.url}
             onDismissed={this.onPopupDismissed}
@@ -862,7 +879,10 @@ export class App extends React.Component<IAppProps, IAppState> {
         )
       case PopupType.Acknowledgements:
         return (
-          <Acknowledgements onDismissed={this.onPopupDismissed}/>
+          <Acknowledgements
+            key='acknowledgements'
+            onDismissed={this.onPopupDismissed}
+          />
         )
       default:
         return assertNever(popup, `Unknown popup type: ${popup}`)
@@ -875,14 +895,14 @@ export class App extends React.Component<IAppProps, IAppState> {
 
   private renderPopup() {
     return (
-      <ReactCSSTransitionGroup
+      <CSSTransitionGroup
         transitionName='modal'
         component='div'
         transitionEnterTimeout={dialogTransitionEnterTimeout}
         transitionLeaveTimeout={dialogTransitionLeaveTimeout}
       >
         {this.currentPopupContent()}
-      </ReactCSSTransitionGroup>
+      </CSSTransitionGroup>
     )
   }
 

diff --git a/app/src/ui/changes/sidebar.tsx b/app/src/ui/changes/sidebar.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import * as  ReactCSSTransitionGroup from 'react-addons-css-transition-group'
+
 import { ChangesList } from './changes-list'
 import { DiffSelectionType } from '../../models/diff'
 import { IChangesState, PopupType } from '../../lib/app-state'
@@ -12,6 +12,7 @@ import { IAutocompletionProvider, EmojiAutocompletionProvider, IssuesAutocomplet
 import { ICommitMessage } from '../../lib/app-state'
 import { ClickSource } from '../list'
 import { WorkingDirectoryFileChange } from '../../models/status'
+import { CSSTransitionGroup } from 'react-transition-group'
 
 /**
  * The timeout for the animation of the enter/leave animation for Undo.
@@ -164,14 +165,14 @@ export class ChangesSidebar extends React.Component<IChangesSidebarProps, void>
     }
 
     return (
-      <ReactCSSTransitionGroup
+      <CSSTransitionGroup
         transitionName='undo'
         transitionAppear={true}
         transitionAppearTimeout={UndoCommitAnimationTimeout}
         transitionEnterTimeout={UndoCommitAnimationTimeout}
         transitionLeaveTimeout={UndoCommitAnimationTimeout}>
         {child}
-      </ReactCSSTransitionGroup>
+      </CSSTransitionGroup>
     )
   }
 

diff --git a/app/styles/ui/_dialog.scss b/app/styles/ui/_dialog.scss
@@ -33,19 +33,28 @@ dialog {
     &-enter {
       opacity: 1;
       transform: scale(0.75);
-    }
-
+      pointer-events: none;
 
+      &::backdrop {
+        opacity: 0;
+      }
+    }
 
     &-enter-active {
       opacity: 1;
       transform: scale(1);
       transition: transform 250ms var(--easing-ease-out-back);
+
+      &::backdrop {
+        opacity: 0.4;
+        transition: opacity 100ms ease-in;
+      }
     }
 
     &-leave {
       opacity: 1;
       transform: scale(1);
+      pointer-events: none;
 
       &::backdrop {
         opacity: 0.4;

diff --git a/appveyor.yml b/appveyor.yml
@@ -7,8 +7,8 @@ environment:
   nodejs_version: "7"
 
 cache:
-  - node_modules -> appveyor.yml
-  - '%USERPROFILE%\.electron -> appveyor.yml'
+  - node_modules
+  - '%USERPROFILE%\.electron'
 
 branches:
   only:

diff --git a/package.json b/package.json
@@ -94,10 +94,10 @@
     "@types/mocha": "^2.2.29",
     "@types/node": "^6.0.31",
     "@types/react": "15.0.23",
-    "@types/react-addons-css-transition-group": "^15.0.1",
     "@types/react-addons-test-utils": "^0.14.17",
     "@types/react-dom": "^15.5.0",
     "@types/react-virtualized": "^9.5.1",
+    "@types/react-transition-group": "^1.1.0",
     "@types/ua-parser-js": "^0.7.30",
     "@types/uuid": "^2.0.29",
     "@types/winston": "^2.2.0",