From cdd615d97b2574f0e5ce053a5690a9afeef09934 Mon Sep 17 00:00:00 2001
From: Jiri Tomasek <jtomasek@redhat.com>
Date: Mon, 9 Nov 2015 09:52:53 +0100
Subject: [PATCH] Include NotificationList in Login component

Notifications are required to show also in Login component e.g. in
case when authentication token timed out and user will needs to login
again, also in the case when user is logged in, refreshes the page
and keystone is not responding.

Change-Id: I9aaf24bff1e95786392be56dbd70cfece0d1acac
---
 src/js/components/AuthenticatedContent.js | 2 +-
 src/js/components/Login.js                | 2 ++
 src/js/components/ui/NotificationList.js  | 8 +++++++-
 src/less/components/NotificationList.less | 6 +++++-
 4 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/js/components/AuthenticatedContent.js b/src/js/components/AuthenticatedContent.js
index 2e2b0a7d..6ce4795d 100644
--- a/src/js/components/AuthenticatedContent.js
+++ b/src/js/components/AuthenticatedContent.js
@@ -14,9 +14,9 @@ export default AuthenticatedComponent(class Nodes extends React.Component {
           <NavBar/>
         </header>
         <div className="wrapper-fixed-body container-fluid">
-          <NotificationList/>
           {this.props.children}
         </div>
+        <NotificationList className="above-footer"/>
         <Footer/>
       </div>
     );
diff --git a/src/js/components/Login.js b/src/js/components/Login.js
index 168d509e..255d0678 100644
--- a/src/js/components/Login.js
+++ b/src/js/components/Login.js
@@ -9,6 +9,7 @@ import KeystoneApiService from '../services/KeystoneApiService';
 import LoginActions from '../actions/LoginActions';
 import LoginStore from '../stores/LoginStore';
 import NotificationActions from '../actions/NotificationActions';
+import NotificationList from './ui/NotificationList';
 
 export default class Login extends React.Component {
   constructor() {
@@ -124,6 +125,7 @@ export default class Login extends React.Component {
             </div>
           </div>
         </div>
+        <NotificationList/>
       </div>
     );
   }
diff --git a/src/js/components/ui/NotificationList.js b/src/js/components/ui/NotificationList.js
index 6ec39a17..911af41e 100644
--- a/src/js/components/ui/NotificationList.js
+++ b/src/js/components/ui/NotificationList.js
@@ -41,7 +41,7 @@ export default class NotificationList extends React.Component {
     });
 
     return (
-      <div className="container-fluid notification-list">
+      <div className={this.props.className + ' container-fluid notification-list'}>
         <div className="row">
           <div className="col-lg-6 col-sm-8 col-xs-12">
             {notifications.reverse()}
@@ -51,3 +51,9 @@ export default class NotificationList extends React.Component {
     );
   }
 }
+NotificationList.propTypes = {
+  className: React.PropTypes.string
+};
+NotificationList.defaultProps = {
+  className: ''
+};
diff --git a/src/less/components/NotificationList.less b/src/less/components/NotificationList.less
index 50c380bc..a94b8b0e 100644
--- a/src/less/components/NotificationList.less
+++ b/src/less/components/NotificationList.less
@@ -1,10 +1,14 @@
 .notification-list {
   position: absolute;
   left:0;
-  bottom: @footer-height;
+  bottom: 0;
   z-index: 100;
   width: 100%;
 
+  &.above-footer {
+    bottom: @footer-height;
+  }
+
   .alert {
     opacity: .95;
     transition: opacity .2s ease-in-out;