feat: Allow users to subscribe to newsletters

fix gravitee-io/issues#3420

src/components/navbar/navbar.component.ts

@@ -35,25 +35,37 @@ export const NavbarComponent: ng.IComponentOptions = {
     $state: StateService,
     $transitions,
     $interval: IIntervalService,
-    AuthenticationService: AuthenticationService
+    AuthenticationService: AuthenticationService,
+    $window
   ) {
     'ngInject';
 
     const vm = this;
+
+    vm.refreshUser = (user) => {
+      vm.profileConfirmed = (user && !user.firstLogin) || $window.localStorage.getItem('profileConfirmed');
+    };
+
     vm.$state = $state;
     vm.tasksScheduler = null;
     vm.$rootScope = $rootScope;
     vm.displayContextualDocumentationButton = false;
     vm.visible = true;
     vm.localLoginDisabled = (!Constants.authentication.localLogin.enabled) || false;
+    vm.refreshUser(UserService.currentUser);
 
     $scope.$on('graviteeUserRefresh', (event, {user, refresh}) => {
+
       if (refresh) {
         UserService.current()
-          .then((user) => vm.startTasks(user))
+          .then((user) => {
+            vm.startTasks(user);
+            vm.refreshUser(user);
+          })
           .catch(() => delete vm.graviteeUser);
       } else if (user && user.authenticated) {
         vm.startTasks(user);
+        vm.refreshUser(user);
       } else {
         delete vm.graviteeUser;
       }

src/components/navbar/navbar.html

@@ -25,14 +25,10 @@
              ng-if="$ctrl.displayContextualDocumentationButton">
     <ng-md-icon icon="live_help" gv-theme-element="portal.navbar.help"></ng-md-icon>
   </md-button>
-  <portal-notifications user="$ctrl.graviteeUser" ng-if="$ctrl.graviteeUser.id"></portal-notifications>
+  <portal-notifications user="$ctrl.graviteeUser" ng-if="$ctrl.graviteeUser.id && $ctrl.profileConfirmed"></portal-notifications>
   <md-button ng-if="!$ctrl.graviteeUser.id" ui-sref-active="menu-active" ng-click="$ctrl.authenticate()" ng-show="'login' !== $ctrl.$state.current.name">{{'menu.login' | translate}}</md-button>
-  <!--<md-button ng-if="!$ctrl.graviteeUser.id && $ctrl.isOnlyOAuth()" ui-sref-active="menu-active" style="background-color: {{provider.color}}; color: #fff;" data-ng-repeat="provider in $ctrl.providers" ng-click="$ctrl.authenticate(provider.id)">
-    <ng-md-icon icon="{{provider.icon}}" size="20" style="fill: white;margin-right: 5px"></ng-md-icon>{{'menu.login' | translate}}
-  </md-button>
-  -->
 
-  <md-menu ng-if="$ctrl.graviteeUser.id" md-offset="0 54">
+  <md-menu ng-if="$ctrl.graviteeUser.id && $ctrl.profileConfirmed" md-offset="0 54">
     <md-button class="gv-navbar-user-link" ng-click="$mdMenu.open($event)" aria-label="Open user menu">
       <img ng-if="!$ctrl.hasAlert()" ng-src="{{$ctrl.getUserPicture()}}" onerror="this.src='assets/default_photo.png'"
            alt="user-picture" gv-theme-element="portal.navbar.user.img"/>

src/entities/user.ts

@@ -27,6 +27,8 @@ export class User {
   public tasks: PagedResult;
   public notifications: PagedResult;
   public authenticated: boolean = false;
+  public firstLogin: boolean;
+  public picture: string;
 
   constructor() {
     'ngInject';

src/index.route.ts

@@ -153,6 +153,12 @@ function routerConfig($stateProvider: StateProvider, $urlServiceProvider: UrlSer
           }
         );
       }
+    })
+    .state('confirmProfile', {
+      url: '/confirmProfile',
+      template: require('./user/confirmProfile/confirmProfile.html'),
+      controller: 'ConfirmProfileController',
+      controllerAs: '$ctrl'
     });
 
   $urlServiceProvider.rules.otherwise('/login');

src/management/api/header/api-header.html

@@ -20,7 +20,7 @@
 		<div ng-switch="$ctrl.api.visibility" layout="row" layout-align="start stretch">
 			<div class="gravitee-api-header-image" ng-if="$ctrl.readOnly" ng-style="{'background-image':'url({{$ctrl.api.picture || $ctrl.api.picture_url || 'assets/default_api_logo.png'}})'}" layout="column" layout-align="center center"></div>
 			<gravitee-image ng-if="!$ctrl.readOnly" image="$ctrl.api.picture" image-url="$ctrl.api.picture_url" image-default="'assets/default_api_logo.png'"></gravitee-image>
-			<div flex="70" layout="column"layout-align="start start">
+			<div flex="70" layout="column" layout-align="start start">
 				<div>
 					<h4>{{$ctrl.api.name}}
 						<small>({{$ctrl.api.version}})

src/management/api/proxy/apiProxy.controller.ts

@@ -99,7 +99,7 @@ class ApiProxyController {
     this.initState();
 
     this.views = resolvedViews;
-    _.remove( this.views, (item) => {
+    _.remove( this.views, (item: any) => {
       return item.id === 'all';
     });
 

src/management/configuration/application/registration/client-registration-providers.component.ts

@@ -18,6 +18,7 @@ import NotificationService from '../../../../services/notification.service';
 import PortalConfigService from '../../../../services/portalConfig.service';
 import { ClientRegistrationProvider } from '../../../../entities/clientRegistrationProvider';
 import ClientRegistrationProviderService from '../../../../services/clientRegistrationProvider.service';
+import _ = require('lodash');
 
 const ClientRegistrationProvidersComponent: ng.IComponentOptions = {
   bindings: {

src/management/configuration/tags/tags.controller.ts

@@ -22,6 +22,9 @@ import {IScope} from 'angular';
 
 class TagsController {
   private tags: any;
+  private groups: Array<any>;
+  private entrypoints: Array<any>;
+  private formSettings: any;
 
   constructor(
     private TagService: TagService,
@@ -98,14 +101,14 @@ class TagsController {
   }
 
   saveSettings = () => {
-    PortalConfigService.save().then( () => {
-      NotificationService.show('Configuration saved!');
+    this.PortalConfigService.save().then( () => {
+      this.NotificationService.show('Configuration saved!');
       this.formSettings.$setPristine();
     });
   }
 
   resetSettings = () => {
-    PortalConfigService.get().then((response) => {
+    this.PortalConfigService.get().then((response) => {
       this.Constants = response.data;
       this.formSettings.$setPristine();
     });

src/management/management.interceptor.ts

@@ -45,7 +45,7 @@ function interceptorConfig(
               $location.$$path !== ''
               && $location.$$path !== '/'
               && $location.$$path !== '/login'
-              && !$location.$$path.startsWith('/registration/confirm');
+              && !$location.$$path.startsWith('/registration');
             if (error.config.forceSessionExpired || (!sessionExpired && !error.config.silentCall)) {
               sessionExpired = true;
               // session expired

src/management/management.module.ts

@@ -456,6 +456,7 @@ import ThemeComponent from './configuration/theme/theme.component';
 import ThemeService from '../services/theme.service';
 
 import authenticationConfig from '../authentication/authentication.config';
+import ConfirmProfileController from '../user/confirmProfile/confirmProfile.controller';
 
 
 (<any>window).traverse = traverse;
@@ -651,6 +652,7 @@ angular.module('gravitee-management', [uiRouter, permission, uiPermission, 'ngMa
   .controller('RegistrationController', RegistrationController)
   .controller('ConfirmController', ConfirmController)
   .controller('ResetPasswordController', ResetPasswordController)
+  .controller('ConfirmProfileController', ConfirmProfileController)
   .controller('DialogSubscriptionRejectController', DialogSubscriptionRejectController)
   .controller('DialogSubscriptionAcceptController', DialogSubscriptionAcceptController)
   .controller('DialogSubscriptionCreateController', DialogSubscriptionCreateController)

src/management/management.run.ts

@@ -21,12 +21,16 @@ function runBlock($rootScope, $window, $http, $mdSidenav, $transitions, $state,
                   $timeout, UserService: UserService, Constants, PermissionStrategies) {
   'ngInject';
 
-  $transitions.onStart({ to: (state) => state.name !== 'login' && state.name !== 'registration' && state.name !== 'confirm'}, function(trans) {
+  $transitions.onStart({ to: (state) => state.name !== 'login' && state.name !== 'registration'
+      && state.name !== 'confirm' && state.name !== 'confirmProfile'}, (trans) => {
     let forceLogin = Constants.authentication.forceLogin.enabled;
 
     if (forceLogin && !UserService.isAuthenticated()) {
       return trans.router.stateService.target('login');
     }
+    if (UserService.isAuthenticated() && UserService.currentUser.firstLogin && !$window.localStorage.getItem('profileConfirmed')) {
+      return trans.router.stateService.target('confirmProfile');
+    }
   });
 
   $transitions.onFinish({}, function (trans) {

src/services/user.service.ts

@@ -212,6 +212,7 @@ class UserService {
     this.isLogout = true;
     this.$window.localStorage.removeItem('satellizer_token');
     this.$cookies.remove('Auth-Graviteeio-APIM');
+    this.$window.localStorage.removeItem('profileConfirmed');
   }
 
   currentUserPicture(): string {
@@ -229,7 +230,7 @@ class UserService {
   }
 
   save(user): ng.IPromise<any> {
-    return this.$http.put(`${this.userURL}`, {username: user.username, picture: user.picture});
+    return this.$http.put(`${this.userURL}`, {username: user.username, picture: user.picture, newsletter: user.newsletter});
   }
 
   resetPassword(id: string): ng.IPromise<any> {

src/user/confirmProfile/confirmProfile.controller.ts

@@ -0,0 +1,39 @@
+/*
+ * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *         http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import UserService from '../../services/user.service';
+
+class ConfirmProfileController {
+
+  newsletterEnabled: boolean;
+
+  constructor($state, $scope, public UserService: UserService, NotificationService, Constants, $window, $rootScope) {
+    'ngInject';
+
+    $scope.user = UserService.currentUser;
+    this.newsletterEnabled = Constants.newsletter.enabled;
+
+    $scope.save = () => {
+      UserService.save($scope.user).then(() => {
+        $window.localStorage.setItem('profileConfirmed', true);
+        $rootScope.$broadcast('graviteeUserRefresh', { user: $scope.user });
+        NotificationService.show('Your profile has been updated successfully');
+        $state.go('management');
+      });
+    };
+  }
+}
+
+export default ConfirmProfileController;

src/user/confirmProfile/confirmProfile.html

@@ -0,0 +1,39 @@
+<!--
+
+    Copyright (C) 2015 The Gravitee team (http://gravitee.io)
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+-->
+<md-content class="gravitee-no-sidenav-container" flex>
+  <div class="login-page">
+    <div class="form">
+      <div class="gravitee-no-sidenav-header" layout="column">
+        <label>Confirm profile</label>
+      </div>
+
+      <form name="formConfirm" ng-submit="save()" layout="column">
+        <gravitee-image image="user.picture" image-border-radius="true"
+                        image-url="$ctrl.UserService.currentUserPicture()"
+                        image-form="formConfirm"></gravitee-image>
+
+        <md-checkbox ng-show="$ctrl.newsletterEnabled && user.email" ng-model="user.newsletter"
+                     aria-label="Subscribe to newsletter" flex ng-init="user.newsletter = true">
+          Subscribe to newsletter and receive information about new versions and updates
+        </md-checkbox>
+
+        <md-button type="submit" class="md-raised md-primary" ng-disabled="isLoading">Confirm profile</md-button>
+      </form>
+    </div>
+  </div>
+</md-content>

src/user/registration/registration.controller.ts

@@ -14,9 +14,10 @@
  * limitations under the License.
  */
 class RegistrationController {
+  newsletterEnabled: boolean;
+
   constructor(UserService, $scope, NotificationService) {
     'ngInject';
-
     $scope.register = function () {
       UserService.register($scope.user).then(function () {
         $scope.formRegistration.$setPristine();