flash: re-add flash messages to top application component

backend/src/appenlight/templates/layout.jinja2

@@ -1,18 +1,11 b''
 {% extends "/layout_base.jinja2" %}
 
 {% block outer_content %}
 <!-- Begin page content -->
 <div class="container">
-    <div class="row ng-cloak" data-ng-if="flash.length" style="margin-bottom: 10px">
-        <div class="col-xs-12">
-            {% raw %}
-            <uib-alert data-ng-repeat="message in flash" type="{{ message.type}}" close="closeAlert($index)" class="animate-repeat">{{message.msg}}</uib-alert>
-            {% endraw %}
-        </div>
-    </div>
     <div class="row">
         {% block content %}{% endblock %}
     </div>
 </div>
 
 {% endblock %}

frontend/src/app.js

@@ -1,203 +1,206 b''
 // # Copyright (C) 2010-2016  RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # AppEnlight Enterprise Edition, including its added features, Support
 // # services, and proprietary license terms, please see
 // # https://rhodecode.com/licenses/
 
 'use strict';
 
 // Declare app level module which depends on filters, and services
 angular.module('appenlight.base', [
     'ngRoute',
     'ui.router',
     'ui.router.router',
     'underscore',
     'ui.bootstrap',
     'ngResource',
     'ngAnimate',
     'ngCookies',
     'smart-table',
     'angular-toArrayFilter',
     'mentio'
 ]);
 
 angular.module('appenlight.filters', []);
 angular.module('appenlight.templates', []);
 angular.module('appenlight.controllers', [
     'appenlight.base'
 ]);
 angular.module('appenlight.components', [
     'appenlight.components.channelstream',
     'appenlight.components.appenlightApp',
     'appenlight.components.appenlightHeader',
     'appenlight.components.indexDashboardView',
     'appenlight.components.logsBrowserView',
-    'appenlight.components.eventBrowserView'
+    'appenlight.components.eventBrowserView',
+    'appenlight.components.userProfileView',
+    'appenlight.components.userIdentitiesView',
+    'appenlight.components.settingsView'
 ]);
 angular.module('appenlight.directives', [
     'appenlight.directives.c3chart',
     'appenlight.directives.confirmValidate',
     'appenlight.directives.focus',
     'appenlight.directives.formErrors',
     'appenlight.directives.humanFormat',
     'appenlight.directives.isoToRelativeTime',
     'appenlight.directives.permissionsForm',
     'appenlight.directives.smallReportGroupList',
     'appenlight.directives.smallReportList',
     'appenlight.directives.pluginConfig',
     'appenlight.directives.recursive',
     'appenlight.directives.reportAlertAction',
     'appenlight.directives.postProcessAction',
     'appenlight.directives.rule',
     'appenlight.directives.ruleReadOnly'
 ]);
 angular.module('appenlight.services', [
     'appenlight.services.chartResultParser',
     'appenlight.services.resources',
     'appenlight.services.stateHolder',
     'appenlight.services.typeAheadTagHelper',
     'appenlight.services.UUIDProvider'
 ]).value('version', '0.1');
 
 
 var pluginsToLoad = _.map(decodeEncodedJSON(window.AE.plugins),
     function(item){
         return item.config.angular_module
     });
 console.log(pluginsToLoad);
 angular.module('appenlight.plugins', pluginsToLoad);
 
 var app = angular.module('appenlight', [
     'appenlight.base',
     'appenlight.config',
     'appenlight.templates',
     'appenlight.filters',
     'appenlight.services',
     'appenlight.directives',
     'appenlight.controllers',
     'appenlight.components',
     'appenlight.plugins'
 ]);
 
 // needs manual execution because of plugin files
 function kickstartAE(initialUserData) {
     app.config(['$httpProvider', '$uibTooltipProvider', '$locationProvider', function ($httpProvider, $uibTooltipProvider, $locationProvider) {
         $locationProvider.html5Mode(true);
         $httpProvider.interceptors.push(['$q', '$rootScope', '$timeout', 'stateHolder', function ($q, $rootScope, $timeout, stateHolder) {
             return {
                 'response': function (response) {
                     var flashMessages = angular.fromJson(response.headers('x-flash-messages'));
                     if (flashMessages && flashMessages.length > 0) {
                         stateHolder.flashMessages.extend(flashMessages);
                     }
                     return response;
                 },
                 'responseError': function (rejection) {
                     if (rejection.status > 299 && rejection.status !== 422) {
                         stateHolder.flashMessages.extend([{
                             msg: 'Response status code: ' + rejection.status + ', "' + rejection.statusText + '", url: ' + rejection.config.url,
                             type: 'error'
                         }]);
                     }
                     if (rejection.status == 0) {
                         stateHolder.flashMessages.extend([{
                             msg: 'Response timeout',
                             type: 'error'
                         }]);
                     }
                     var flashMessages = angular.fromJson(rejection.headers('x-flash-messages'));
                     if (flashMessages && flashMessages.length > 0) {
                         stateHolder.flashMessages.extend(flashMessages);
                     }
 
                     return $q.reject(rejection);
                 }
             }
         }]);
 
         $uibTooltipProvider.options({appendToBody: true});
 
     }]);
 
 
     app.config(function ($provide) {
         $provide.decorator("$exceptionHandler", function ($delegate) {
             return function (exception, cause) {
                 $delegate(exception, cause);
                 if (typeof AppEnlight !== 'undefined') {
                     AppEnlight.grabError(exception);
                 }
             };
         });
     });
 
     app.run(['$rootScope', '$timeout', 'stateHolder', '$state', '$location', '$transitions', '$window', 'AeConfig',
         function ($rootScope, $timeout, stateHolder, $state, $location, $transitions, $window, AeConfig) {
             if (initialUserData){
                 stateHolder.AeUser.update(initialUserData);
             }
             $rootScope.$state = $state;
             $rootScope.stateHolder = stateHolder;
             $rootScope.flash = stateHolder.flashMessages.list;
             $rootScope.closeAlert = stateHolder.flashMessages.closeAlert;
             $rootScope.AeConfig = AeConfig;
 
             var transitionApp = function($transition$, $state) {
                 // redirect user to /register unless its one of open views
                 var isGuestState = [
                         'report.view_detail',
                         'report.view_group',
                         'dashboard.view'
                     ].indexOf($transition$.to().name) !== -1;
 
                 var path = $window.location.pathname;
                 // strip trailing slash
                 if (path.substr(path.length - 1) === '/') {
                     path = path.substr(0, path.length - 1);
                 }
                 var isOpenView = false;
                 var openViews = [
                     AeConfig.urls.otherRoutes.lostPassword,
                     AeConfig.urls.otherRoutes.lostPasswordGenerate
                 ];
                 console.log('$transitions.onBefore', path, $transition$.to().name, $state);
                 _.each(openViews, function (url) {
                     var url = '/' + url.split('/').slice(3).join('/');
                     if (url === path) {
                         isOpenView = true;
                     }
                 });
                 if (stateHolder.AeUser.id === null && !isGuestState && !isOpenView) {
                     if (window.location.toString().indexOf(AeConfig.urls.otherRoutes.register) === -1) {
                         console.log('redirect to register');
                         var newLocation = AeConfig.urls.otherRoutes.register + '?came_from=' + encodeURIComponent(window.location);
                         // fix infinite digest here
                         $rootScope.$on('$locationChangeStart',
                             function(event, toState, toParams, fromState, fromParams, options){
                                 event.preventDefault();
                                 $window.location = newLocation;
                             });
                         $window.location = newLocation;
                         return false;
                     }
                     return false;
                 }
                 return true;
             };
             $transitions.onBefore({}, transitionApp);
 
         }]);
 }

frontend/src/components/appenlight-app/appenlight-app.html

@@ -1,5 +1,16 b''
 <channelstream config="AeConfig"></channelstream>
 <appenlight-header></appenlight-header>
+<div class="container" data-ng-if="flash.length">
+    <div class="row" style="margin-bottom: 10px">
+        <div class="col-xs-12">
+            <uib-alert data-ng-repeat="message in flash"
+                       type="{{ message.type }}"
+                       close="closeAlert($index)" class="animate-repeat">
+                {{ message.msg }}</uib-alert>
+        </div>
+    </div>
+</div>
+
 <div id="outer-content">
     <div ui-view class="container"></div>
 </div>

frontend/src/routes.js

@@ -1,247 +1,244 b''
 // # Copyright (C) 2010-2016  RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # AppEnlight Enterprise Edition, including its added features, Support
 // # services, and proprietary license terms, please see
 // # https://rhodecode.com/licenses/
 
 angular.module('appenlight').config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
 
     $urlRouterProvider.otherwise('/ui');
 
     $stateProvider.state('logs', {
         url: '/ui/logs?resource',
         component: 'logsBrowserView'
     });
 
     $stateProvider.state('front_dashboard', {
         url: '/ui',
         component: 'indexDashboardView'
     });
     
     $stateProvider.state('report', {
         abstract: true,
         url: '/ui/report',
         templateUrl: 'templates/reports/parent_view.html'
     });
 
     $stateProvider.state('report.list', {
         url: '?start_date&min_duration&max_duration&{view_name:any}&{server_name:any}&resource',
         templateUrl: 'templates/reports/list.html',
         controller: 'ReportsListController as reports_list'
     });
 
     $stateProvider.state('report.list_slow', {
         url: '/list_slow?start_date&min_duration&max_duration&{view_name:any}&{server_name:any}&resource',
         templateUrl: 'templates/reports/list_slow.html',
         controller: 'ReportsListSlowController as reports_list'
     });
 
     $stateProvider.state('report.view_detail', {
         url: '/:groupId/:reportId',
         templateUrl: 'templates/reports/view.html',
         controller: 'ReportsViewController as report'
     });
     $stateProvider.state('report.view_group', {
         url: '/:groupId',
         templateUrl: 'templates/reports/view.html',
         controller: 'ReportsViewController as report'
     });
     $stateProvider.state('events', {
         url: '/ui/events',
         component: 'eventBrowserView'
     });
     $stateProvider.state('admin', {
         url: '/ui/admin',
         templateUrl: 'templates/admin/parent_view.html'
     });
     $stateProvider.state('admin.user', {
         abstract: true,
         url: '/user',
         templateUrl: 'templates/admin/users/parent_view.html'
     });
     $stateProvider.state('admin.user.list', {
         url: '/list',
         templateUrl: 'templates/admin/users/users_list.html',
         controller: 'AdminUsersController as users'
     });
     $stateProvider.state('admin.user.create', {
         url: '/create',
         templateUrl: 'templates/admin/users/users_create.html',
         controller: 'AdminUsersCreateController as user'
     });
     $stateProvider.state('admin.user.update', {
         url: '/{userId}/update',
         templateUrl: 'templates/admin/users/users_create.html',
         controller: 'AdminUsersCreateController as user'
     });
 
 
     $stateProvider.state('admin.group', {
         abstract: true,
         url: '/group',
         templateUrl: 'templates/admin/groups/parent_view.html'
     });
     $stateProvider.state('admin.group.list', {
         url: '/list',
         templateUrl: 'templates/admin/groups/groups_list.html',
         controller: 'AdminGroupsController as groups'
     });
     $stateProvider.state('admin.group.create', {
         url: '/create',
         templateUrl: 'templates/admin/groups/groups_create.html',
         controller: 'AdminGroupsCreateController as group'
     });
     $stateProvider.state('admin.group.update', {
         url: '/{groupId}/update',
         templateUrl: 'templates/admin/groups/groups_create.html',
         controller: 'AdminGroupsCreateController as group'
     });
 
     $stateProvider.state('admin.application', {
         abstract: true,
         url: '/application',
         templateUrl: 'templates/admin/users/parent_view.html'
     });
 
     $stateProvider.state('admin.application.list', {
         url: '/list',
         templateUrl: 'templates/admin/applications/applications_list.html',
         controller: 'AdminApplicationsListController as applications'
     });
 
     $stateProvider.state('admin.partitions', {
         url: '/partitions',
         templateUrl: 'templates/admin/partitions.html',
         controller: 'AdminPartitionsController as partitions'
     });
     $stateProvider.state('admin.system', {
         url: '/system',
         templateUrl: 'templates/admin/system.html',
         controller: 'AdminSystemController as system'
     });
 
     $stateProvider.state('admin.configs', {
         abstract: true,
         url: '/configs',
         templateUrl: 'templates/admin/configs/parent_view.html'
     });
 
     $stateProvider.state('admin.configs.list', {
-        url: '',
+        url: '/list',
         templateUrl: 'templates/admin/configs/edit.html',
         controller: 'ConfigsListController as configs'
     });
 
     $stateProvider.state('user', {
         url: '/ui/user',
-        templateUrl: 'templates/user/parent_view.html'
+        component: 'settingsView'
     });
 
     $stateProvider.state('user.profile', {
         abstract: true,
-        url: '/profile',
-        templateUrl: 'templates/user/profile.html'
+        template: '<ui-view></ui-view>'
     });
     $stateProvider.state('user.profile.edit', {
-        url: '',
-        templateUrl: 'templates/user/profile_edit.html',
-        controller: 'UserProfileController as profile'
+        url: '/profile',
+        component: 'userProfileView'
     });
 
 
     $stateProvider.state('user.profile.password', {
         url: '/password',
         templateUrl: 'templates/user/profile_password.html',
         controller: 'UserPasswordController as password'
     });
 
     $stateProvider.state('user.profile.identities', {
         url: '/identities',
-        templateUrl: 'templates/user/profile_identities.html',
-        controller: 'UserIdentitiesController as identities'
+        component: 'userIdentitiesView'
     });
 
     $stateProvider.state('user.profile.auth_tokens', {
         url: '/auth_tokens',
         templateUrl: 'templates/user/auth_tokens.html',
         controller: 'UserAuthTokensController as auth_tokens'
     });
 
     $stateProvider.state('user.alert_channels', {
         abstract: true,
         url: '/alert_channels',
         templateUrl: 'templates/user/alert_channels.html'
     });
 
     $stateProvider.state('user.alert_channels.list', {
-        url: '',
+        url: '/list',
         templateUrl: 'templates/user/alert_channels_list.html',
         controller: 'AlertChannelsController as channels'
     });
 
     $stateProvider.state('user.alert_channels.email', {
         url: '/email',
         templateUrl: 'templates/user/alert_channels_email.html',
         controller: 'AlertChannelsEmailController as email'
     });
 
     $stateProvider.state('applications', {
         abstract: true,
         url: '/ui/applications',
         templateUrl: 'templates/applications/parent_view.html'
     });
 
     $stateProvider.state('applications.list', {
-        url: '',
+        url: '/list',
         templateUrl: 'templates/applications/list.html',
         controller: 'ApplicationsListController as applications'
     });
     $stateProvider.state('applications.update', {
         url: '/{resourceId}/update',
         templateUrl: 'templates/applications/applications_update.html',
         controller: 'ApplicationsUpdateController as application'
     });
 
     $stateProvider.state('applications.integrations', {
         url: '/{resourceId}/integrations',
         templateUrl: 'templates/applications/integrations.html',
         controller: 'IntegrationsListController as integrations',
         data: {
             resource: null
         }
     });
 
     $stateProvider.state('applications.purge_logs', {
         url: '/purge_logs',
         templateUrl: 'templates/applications/applications_purge_logs.html',
         controller: 'ApplicationsPurgeLogsController as applications_purge'
     });
 
     $stateProvider.state('applications.integrations.edit', {
         url: '/{integration}',
         templateUrl: function ($stateParams) {
             return 'templates/applications/integrations/' + $stateParams.integration + '.html'
         },
         controller: 'IntegrationController as integration'
     });
 
     $stateProvider.state('tests', {
         url: '/ui/tests',
         templateUrl: 'templates/user/alert_channels_test.html',
         controller: 'AlertChannelsTestController as test_action'
     });
 
 }]);