feat(pci): change link to legacy manager display

marie-j · jleveugle · commit bcd932afa6e3 · 2019-05-22T11:32:46.000+02:00
diff --git a/packages/manager/modules/pci/src/projects/project/legacy-forward/forward.constants.js b/packages/manager/modules/pci/src/projects/project/legacy-forward/forward.constants.js
diff --git a/packages/manager/modules/pci/src/projects/project/legacy-forward/forward.controller.js b/packages/manager/modules/pci/src/projects/project/legacy-forward/forward.controller.js
diff --git a/packages/manager/modules/pci/src/projects/project/legacy-forward/forward.html b/packages/manager/modules/pci/src/projects/project/legacy-forward/forward.html
diff --git a/packages/manager/modules/pci/src/projects/project/project.controller.js b/packages/manager/modules/pci/src/projects/project/project.controller.js
@@ -1,20 +1,37 @@
 import isNil from 'lodash/isNil';
 
 import { ACTIONS, LINKS } from './project.constants';
+import { LEGACY_URLS } from './legacy-forward/forward.constants';
+
+import controller from './legacy-forward/forward.controller';
+import template from './legacy-forward/forward.html';
 
 export default class ProjectController {
   /* @ngInject */
-  constructor($state, $stateParams, $transitions, coreConfig, OvhApiCloudProject, sidebarVisible) {
+  constructor(
+    $state,
+    $stateParams,
+    $uibModal,
+    atInternet,
+    coreConfig,
+    OvhApiCloudProject,
+    sidebarVisible,
+    user,
+  ) {
     this.$state = $state;
     this.$stateParams = $stateParams;
+    this.$uibModal = $uibModal;
+    this.atInternet = atInternet;
     this.OvhApiCloudProject = OvhApiCloudProject;
     this.sidebarVisible = sidebarVisible;
     this.loading = false;
+    this.user = user;
 
     this.actions = ACTIONS.filter(
       ({ regions }) => isNil(regions) || regions.includes(coreConfig.getRegion()),
     );
     this.links = LINKS;
+    this.LEGACY_URL = LEGACY_URLS[coreConfig.getRegion()];
   }
 
   $onInit() {
@@ -33,4 +50,16 @@ export default class ProjectController {
         this.loading = false;
       });
   }
+
+  goToLegacy() {
+    this.atInternet.trackClick({
+      name: 'public-cloud_menu_back-to-cloud',
+      type: 'action',
+    });
+    return this.$uibModal.open({
+      template,
+      controller,
+      controllerAs: '$ctrl',
+    });
+  }
 }
diff --git a/packages/manager/modules/pci/src/projects/project/project.html b/packages/manager/modules/pci/src/projects/project/project.html
@@ -4,6 +4,23 @@
             <cloud-sidebar></cloud-sidebar>
         </div>
         <div class="h-100 position-relative p-0 col-lg-10">
+            <div class="pci-project-banner d-flex justify-content-between p-3">
+                <span data-translate="pci_projects_project_welcome" class="font-weight-bold oui-color-sapphire"></span>
+                <button class="oui-link pci-project-link_light"
+                    data-ng-if="$ctrl.user.ovhSubsidiary === 'FR'"
+                    type="button"
+                    data-ng-click="$ctrl.goToLegacy()"
+                    data-translate="pci_projects_project_welcome_legacy">
+                </button>
+                <a class="oui-link pci-project-link_light"
+                    data-ng-if="$ctrl.user.ovhSubsidiary !== 'FR'"
+                    data-track-on="click"
+                    data-track-name="public-cloud_menu_back-to-cloud"
+                    data-track-type="action"
+                    data-ng-href="{{:: $ctrl.LEGACY_URL}}">
+                    <span data-translate="pci_projects_project_welcome_legacy"></span>
+                </a>
+            </div>
             <div class="pci-project-content position-absolute w-100 h-100 pt-4 px-3 px-md-5" style="overflow: auto;">
                 <uirouter-breadcrumb></uirouter-breadcrumb>
                 <div class="pci-project-view mt-3 pb-4" data-ui-view>
diff --git a/packages/manager/modules/pci/src/projects/project/project.less b/packages/manager/modules/pci/src/projects/project/project.less
@@ -0,0 +1,10 @@
+@background-color: rgb(239, 249, 253);
+@link-color: rgb(77, 111, 146);
+
+.pci-project-banner {
+  background-color: @background-color;
+
+  .pci-project-link_light {
+    color: @link-color;
+  }
+}
diff --git a/packages/manager/modules/pci/src/projects/project/project.module.js b/packages/manager/modules/pci/src/projects/project/project.module.js
@@ -23,6 +23,8 @@ import vouchers from './vouchers';
 import regions from './regions';
 import routing from './project.routing';
 
+import './project.less';
+
 const moduleName = 'ovhManagerPciProject';
 
 angular
diff --git a/packages/manager/modules/pci/src/projects/project/project.routing.js b/packages/manager/modules/pci/src/projects/project/project.routing.js
@@ -44,6 +44,7 @@ export default /* @ngInject */ ($stateProvider) => {
           ? project.description
           : null),
         sidebarVisible: /* @ngInject */ project => project.status !== 'creating',
+        user: /* @ngInject */ SessionService => SessionService.getUser(),
       },
     });
 };
diff --git a/packages/manager/modules/pci/src/projects/project/sidebar/sidebar.controller.js b/packages/manager/modules/pci/src/projects/project/sidebar/sidebar.controller.js
@@ -1,10 +1,8 @@
 import isEmpty from 'lodash/isEmpty';
 import isNil from 'lodash/isNil';
 import set from 'lodash/set';
-import get from 'lodash/get';
 
 import { MENU } from './sidebar.constant';
-import { LEGACY_URLS } from './legacy-forward/forward.constants';
 
 export default class SidebarController {
   /* @ngInject */
@@ -15,11 +13,9 @@ export default class SidebarController {
     $stateParams,
     $transitions,
     atInternet,
-    CloudSidebar,
     coreConfig,
     OvhApiServices,
     OvhApiCloudProject,
-    SessionService,
   ) {
     this.$translate = $translate;
     this.$transitions = $transitions;
@@ -30,8 +26,6 @@ export default class SidebarController {
     this.coreConfig = coreConfig;
     this.OvhApiServices = OvhApiServices;
     this.OvhApiCloudProject = OvhApiCloudProject;
-    this.CloudSidebar = CloudSidebar;
-    this.sessionService = SessionService;
 
     this.isOpen = false;
     this.isLoading = false;
@@ -82,12 +76,6 @@ export default class SidebarController {
       }
       this.isDisplayingProjectsList = false;
     });
-
-    this.sessionService.getUser()
-      .then((user) => {
-        this.user = user;
-        this.legacyUrl = get(LEGACY_URLS, this.coreConfig.getRegion());
-      });
   }
 
   onMenuItemClick({ id }) {
diff --git a/packages/manager/modules/pci/src/projects/project/sidebar/sidebar.html b/packages/manager/modules/pci/src/projects/project/sidebar/sidebar.html
@@ -48,23 +48,6 @@ <h2 class="mb-0 d-inline-block" style="font-weight: 400;" data-ng-bind="$ctrl.pr
                             </ul>
                         </div>
                     </li>
-                    <li class="oui-sidebar-list__item sidebar-menu-orphan-item">
-                        <button class="oui-sidebar-link"
-                            data-ng-if="$ctrl.user.ovhSubsidiary === 'FR'"
-                            type="button"
-                            data-ng-click="$ctrl.CloudSidebar.goToLegacy()"
-                            data-translate="cloud_sidebar_public_cloud_project_forward_legacy">
-                        </button>
-
-                        <a class="oui-sidebar-link"
-                            data-ng-if="$ctrl.user.ovhSubsidiary !== 'FR'"
-                            data-track-on="click"
-                            data-track-name="public-cloud_menu_back-to-cloud"
-                            data-track-type="action"
-                            data-ng-href="{{$ctrl.legacyUrl}}">
-                          <span data-translate="cloud_sidebar_public_cloud_project_forward_legacy"></span>
-                        </a>
-                    </li>
                 </ul>
             </div>
         </nav>
diff --git a/packages/manager/modules/pci/src/projects/project/sidebar/sidebar.service.js b/packages/manager/modules/pci/src/projects/project/sidebar/sidebar.service.js
@@ -2,14 +2,10 @@ import includes from 'lodash/includes';
 import isUndefined from 'lodash/isUndefined';
 import { MENU } from './sidebar.constant';
 
-import template from './legacy-forward/forward.html';
-import controller from './legacy-forward/forward.controller';
-
 export default class Sidebar {
   /* @ngInject */
-  constructor($translate, $uibModal, atInternet, coreConfig) {
+  constructor($translate, atInternet, coreConfig) {
     this.$translate = $translate;
-    this.$uibModal = $uibModal;
     this.atInternet = atInternet;
 
     this.REGION = coreConfig.getRegion();
@@ -27,23 +23,6 @@ export default class Sidebar {
           stateParams,
         })).filter(({ regions }) => includes(regions, this.REGION) || isUndefined(regions)),
       })),
-      {
-        name: 'back-to-cloud',
-        title: this.$translate.instant('cloud_sidebar_public_cloud_project_forward_legacy'),
-        click: () => this.goToLegacy(),
-      },
     ];
   }
-
-  goToLegacy() {
-    this.atInternet.trackClick({
-      name: 'public-cloud_menu_back-to-cloud',
-      type: 'action',
-    });
-    return this.$uibModal.open({
-      template,
-      controller,
-      controllerAs: '$ctrl',
-    });
-  }
 }
diff --git a/packages/manager/modules/pci/src/projects/project/sidebar/translations/Messages_fr_FR.json b/packages/manager/modules/pci/src/projects/project/sidebar/translations/Messages_fr_FR.json
@@ -29,11 +29,5 @@
   "cloud_sidebar_project_management_contact_rights": "Contacts and Rights",
   "cloud_sidebar_project_management_settings": "Project settings",
   "cloud_sidebar_public_cloud_project_toggle": "Ouvre la liste des projets",
-  "cloud_sidebar_public_cloud_project_toggle_close": "Retour au menu",
-  "cloud_sidebar_public_cloud_project_forward_legacy": "Revenir à l'ancienne interface",
-
-  "pci_projects_project_forward": "Nous allons basculer sur l'ancienne interface Cloud",
-  "pci_projects_project_forward_feedback": "Donnez nous votre avis",
-  "pci_projects_project_forward_legacy": "Continuer vers l'ancienne interface",
-  "pci_projects_project_forward_content": "Merci d'avoir essayé la nouvelle version Public Cloud. Dites-nous ce que vous avez aimé et ce qui ne vous a pas plu. Vos commentaires permettront de l'améliorer."
+  "cloud_sidebar_public_cloud_project_toggle_close": "Retour au menu"
 }
diff --git a/packages/manager/modules/pci/src/projects/project/translations/Messages_fr_FR.json b/packages/manager/modules/pci/src/projects/project/translations/Messages_fr_FR.json
@@ -11,5 +11,12 @@
   "pci_projects_project_documentation_boot_your_first_cloud_server_in_3_minutes": "Boot your first cloud server in 3 minutes",
   "pci_projects_project_documentation_prepare_the_environment_for_using_the_open_stack_api": "Prepare the environment for using the OpenStack API",
   "pci_projects_project_documentation_create_and_configure_and_additional_disk_on_an_instance": "Create and configure and additional disk on an instance",
-  "pci_projects_project_documentation_see_all_public_cloud_guides": "See all Public Cloud guides"
+  "pci_projects_project_documentation_see_all_public_cloud_guides": "See all Public Cloud guides",
+
+  "pci_projects_project_welcome": "Bienvenue sur la nouvelle interface Public Cloud",
+  "pci_projects_project_welcome_legacy": "Retourner vers l'ancienne interface",
+  "pci_projects_project_forward": "Nous allons basculer sur l'ancienne interface Cloud",
+  "pci_projects_project_forward_feedback": "Donnez nous votre avis",
+  "pci_projects_project_forward_legacy": "Continuer vers l'ancienne interface",
+  "pci_projects_project_forward_content": "Merci d'avoir essayé la nouvelle version Public Cloud. Dites-nous ce que vous avez aimé et ce qui ne vous a pas plu. Vos commentaires permettront de l'améliorer."
 }
