feat(dedicated-cloud): add dashboard light when vcd and pcc is migrated

ref: MANAGER-15242

Signed-off-by: Thibault Barske <[email protected]>

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard-light/dedicatedCloud-dashboard-light.component.js

@@ -0,0 +1,31 @@
+import template from './dedicatedCloud-dashboard-light.html';
+
+export default {
+  bindings: {
+    currentDrp: '<',
+    currentUser: '<',
+    goToVpnConfiguration: '<',
+    pccType: '<',
+    isLv1Lv2BannerAvailable: '<',
+    productId: '<',
+    currentService: '<',
+    datacenterList: '<',
+    deleteDrp: '<',
+    disableVmwareOption: '<',
+    drpGlobalStatus: '<',
+    editDetails: '<',
+    goToDrp: '<',
+    goToDrpDatacenterSelection: '<',
+    isDrpActionPossible: '<',
+    onTerminate: '<',
+    onMlSubscribe: '<',
+    orderSecurityOption: '<',
+    orderVmwareOption: '<',
+    isMailingListSubscriptionAvailable: '<',
+    setMessage: '<',
+    onUpgradeVersion: '<',
+    associateIpBlockLink: '<',
+    onExecutionDateChange: '<',
+  },
+  template,
+};

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard-light/dedicatedCloud-dashboard-light.html

@@ -0,0 +1,12 @@
+<div data-ui-view>
+    <div class="col-md-4">
+        <ovh-manager-pcc-dashboard-general-information
+            data-current-service="$ctrl.currentService"
+            data-edit-details="$ctrl.editDetails"
+            data-on-upgrade-version="$ctrl.onUpgradeVersion"
+            data-associate-ip-block-link="$ctrl.associateIpBlockLink"
+            data-on-execution-date-change="$ctrl.onExecutionDateChange"
+            data-tracking-prefix="$ctrl.trackingPrefix"
+        ></ovh-manager-pcc-dashboard-general-information>
+    </div>
+</div>

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard-light/dedicatedCloud-dashboard-light.scss

@@ -0,0 +1,3 @@
+.oui-tile {
+  min-height: 19.5rem !important;
+}

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard-light/index.js

@@ -0,0 +1,12 @@
+import generalInformation from '../dashboard/tiles/general-information';
+import component from './dedicatedCloud-dashboard-light.component';
+import './dedicatedCloud-dashboard-light.scss';
+
+const moduleName = 'ovhManagerPccDashboardLight';
+
+angular
+  .module(moduleName, [generalInformation])
+  .component('pccDashboardLight', component)
+  .run(/* @ngTranslationsInject:json ./translations */);
+
+export default moduleName;

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard/dedicatedCloud-dashboard.component.js

@@ -35,6 +35,7 @@ export default {
     trackingPrefix: '<',
     dedicatedCloudDescription: '<',
     managedVCDAvailability: '<',
+    dedicatedCloudVCDMigrationState: '<',
   },
   template,
 };

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard/dedicatedCloud-dashboard.html

@@ -82,6 +82,7 @@
                 data-tracking-prefix="$ctrl.trackingPrefix"
                 data-go-to-vcd-order="$ctrl.goToVcdOrder"
                 data-product-id="$ctrl.productId"
+                data-vcd-migration-state="$ctrl.dedicatedCloudVCDMigrationState"
             ></ovh-manager-pcc-dashboard-vmware-cloud-director>
         </div>
     </div>

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard/tiles/vmware-cloud-director/component.js

@@ -6,6 +6,7 @@ export default {
     goToVcdOrder: '<',
     productId: '<',
     trackingPrefix: '<',
+    vcdMigrationState: '<',
   },
   name: 'ovhManagerPccDashboardVmwareCloudDirector',
   controller,

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dashboard/tiles/vmware-cloud-director/controller.js

@@ -8,7 +8,7 @@ export default class {
 
   $onInit() {
     this.guideLinks = this.DedicatedCloud.getVCDGuideLinks();
-    this.checkMigration();
+    this.defineMigrationTitle();
   }
 
   trackGuideClick(guideName) {
@@ -18,19 +18,11 @@ export default class {
     });
   }
 
-  checkMigration() {
-    this.loading = true;
-    return this.DedicatedCloud.getManagedVCDMigrationState(this.productId)
-      .then((state) => {
-        this.vcdMigrationState = state;
-        this.migrationTitle = this.$translate.instant(
-          this.vcdMigrationState.isDone
-            ? 'dedicatedCloud_vmware_cloud_director_migration'
-            : 'dedicatedCloud_vmware_cloud_director_validate_migration',
-        );
-      })
-      .finally(() => {
-        this.loading = false;
-      });
+  defineMigrationTitle() {
+    this.migrationTitle = this.$translate.instant(
+      this.vcdMigrationState.isDone
+        ? 'dedicatedCloud_vmware_cloud_director_migration'
+        : 'dedicatedCloud_vmware_cloud_director_validate_migration',
+    );
   }
 }

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dedicatedCloud.component.js

@@ -13,6 +13,9 @@ export default {
     securityState: '<',
     setMessage: '<',
     usersState: '<',
+    dedicatedCloudVCDMigrationState: '<',
+    dedicatedCloudPCCMigrationState: '<',
+    dedicatedCloudMigrationState: '<',
   },
   controller,
   template,

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dedicatedCloud.controller.js

@@ -2,10 +2,12 @@ import { TRACKING_PREFIX } from './dedicatedCloud.constant';
 
 export default class {
   /* @ngInject */
-  constructor($scope, $translate) {
+  constructor($scope, $translate, $location) {
     this.$scope = $scope;
     this.$translate = $translate;
     this.TRACKING_PREFIX = TRACKING_PREFIX;
+    this.$location = $location;
+    this.isTabsHidden = this.dedicatedCloudMigrationState;
   }
 
   $onInit() {

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/dedicatedCloud.html

@@ -33,9 +33,11 @@
         <ovh-manager-pcc-managed-vcd-migration-banner
             data-service-name="$ctrl.dedicatedCloud.serviceName"
             data-tracking-prefix="$ctrl.TRACKING_PREFIX"
+            data-vcd-migration-state="$ctrl.dedicatedCloudVCDMigrationState"
+            data-pcc-migration-state="$ctrl.dedicatedCloudPCCMigrationState"
+            data-migration-state="$ctrl.dedicatedCloudMigrationState"
         />
-
-        <oui-header-tabs>
+        <oui-header-tabs data-ng-if="!$ctrl.isTabsHidden">
             <oui-header-tabs-item data-state="{{:: $ctrl.pccDashboardState }}"
                 ><span data-translate="dedicatedCloud_tab_dashboard"></span
             ></oui-header-tabs-item>

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/vmware-cloud-director/migration-banner/component.js

@@ -5,6 +5,9 @@ export default {
   bindings: {
     serviceName: '<',
     trackingPrefix: '<',
+    pccMigrationState: '<',
+    vcdMigrationState: '<',
+    migrationState: '<',
   },
   controller,
   template,

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/vmware-cloud-director/migration-banner/controller.js

@@ -6,7 +6,7 @@ export default class ManagedVcdMigrationBannerCtrl {
   }
 
   $onInit() {
-    this.loadMigrationState();
+    this.trackMigrationState();
   }
 
   trackPage(name) {
@@ -15,26 +15,17 @@ export default class ManagedVcdMigrationBannerCtrl {
     });
   }
 
-  loadMigrationState() {
-    this.migrationState = null;
+  trackMigrationState() {
+    if (this.pccMigrationState?.isEnabling) {
+      this.trackPage(
+        'vmware::vmware::banner-info::migrate_to_managed_vcd_pending',
+      );
+    }
 
-    this.DedicatedCloud.getPCCMigrationState(this.serviceName).then((state) => {
-      this.migrationState = state;
-      if (state.isEnabling) {
-        this.trackPage(
-          'vmware::vmware::banner-info::migrate_to_managed_vcd_pending',
-        );
-      }
-    });
-
-    this.DedicatedCloud.getManagedVCDMigrationState(this.serviceName).then(
-      (state) => {
-        if (state.isDone) {
-          this.trackPage(
-            'vmware::vmware::banner-info::migrate_to_managed_vcd_success',
-          );
-        }
-      },
-    );
+    if (this.vcdMigrationState?.isDone) {
+      this.trackPage(
+        'vmware::vmware::banner-info::migrate_to_managed_vcd_success',
+      );
+    }
   }
 }

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/vmware-cloud-director/migration-banner/template.html

@@ -1,9 +1,3 @@
-<oui-message
-    class="pt-2"
-    data-type="warning"
-    data-ng-if="$ctrl.migrationState.isEnabling"
->
-    <span
-        data-translate="dedicatedCloud_managed_vcd_migration_pending_warning"
-    ></span>
+<oui-message class="pt-2" data-type="info" data-ng-if="$ctrl.migrationState">
+    <span data-translate="dedicatedCloud_managed_vcd_migrated"></span>
 </oui-message>

packages/manager/apps/dedicated/client/app/components/dedicated-cloud/vmware-cloud-director/migration-banner/translations/Messages_fr_FR.json

@@ -1,3 +1,3 @@
 {
-  "dedicatedCloud_managed_vcd_migration_pending_warning": "Attention migration en cours : les modifications de votre service ne seront pas prises en compte"
+  "dedicatedCloud_managed_vcd_migrated": "Votre solution Hosted Private Cloud a été migrée vers VMware Cloud Director. Cette page vous permet de gérer vos blocs d'IP publiques (commande d'un nouveau bloc, réattribution d'un bloc existant vers un autre service) qui sont actuellement attachés à votre service Hosted Private Cloud et connectés à votre service VMware Cloud Director. Cette situation est temporaire et prendra fin lorsque vos blocs d'IP publiques auront été attachés automatiquement à votre service VMware Cloud Director."
 }

packages/manager/apps/dedicated/client/app/dedicatedCloud/dashboard-light/dedicatedCloudLight.module.js

@@ -0,0 +1,10 @@
+import angular from 'angular';
+
+import dashboardLightModule from '../../components/dedicated-cloud/dashboard-light';
+import routing from './dedicatedCloudLight.routing';
+
+const moduleName = 'ovhManagerDedicatedCloudLightModule';
+
+angular.module(moduleName, [dashboardLightModule]).config(routing);
+
+export default moduleName;

packages/manager/apps/dedicated/client/app/dedicatedCloud/dashboard-light/dedicatedCloudLight.routing.js

@@ -0,0 +1,22 @@
+export default /* @ngInject */ ($stateProvider) => {
+  $stateProvider.state('app.dedicatedCloud.details.dashboard.light', {
+    url: '/tag/migration-vcd',
+    redirectTo: (transition) => {
+      return transition
+        .injector()
+        .getAsync('dedicatedCloudMigrationState')
+        .then((dedicatedCloudMigrationState) => {
+          if (!dedicatedCloudMigrationState) {
+            return 'app.dedicatedCloud.details.dashboard';
+          }
+
+          return false;
+        });
+    },
+    resolve: {
+      breadcrumb: () => null,
+    },
+    reloadOnSearch: false,
+    component: 'pccDashboardLight',
+  });
+};

packages/manager/apps/dedicated/client/app/dedicatedCloud/dashboard/dedicatedCloud-dashboard.module.js

@@ -13,6 +13,7 @@ import update from './update';
 import vmwareOptionDisable from './vmware-option/disable';
 import vmwareOptionOrder from './vmware-option/order';
 import vcdOrder from './vmware-cloud-director/order';
+import dedicatedCloudDashboardLightModule from '../dashboard-light/dedicatedCloudLight.module';
 
 const moduleName = 'dedicatedCloudDashboardModule';
 
@@ -30,6 +31,7 @@ angular
     vmwareOptionDisable,
     vmwareOptionOrder,
     vcdOrder,
+    dedicatedCloudDashboardLightModule,
   ])
   .config(routing);
 

packages/manager/apps/dedicated/client/app/dedicatedCloud/details/dedicatedCloud.routing.js

@@ -26,7 +26,20 @@ export default /* @ngInject */ ($stateProvider) => {
           },
         };
       }
-      return 'app.dedicatedCloud.details.dashboard';
+
+      return transition
+        .injector()
+        .getAsync('dedicatedCloudMigrationState')
+        .then((dedicatedCloudMigrationState) => {
+          if (dedicatedCloudMigrationState) {
+            return {
+              state: 'app.dedicatedCloud.details.dashboard.light',
+            };
+          }
+
+          return 'app.dedicatedCloud.details.dashboard';
+        })
+        .catch(() => 'app.dedicatedCloud.details.dashboard');
     },
     resolve: {
       currentService: /* @ngInject */ (DedicatedCloud, productId) =>
@@ -99,15 +112,42 @@ export default /* @ngInject */ ($stateProvider) => {
           .then((featureAvailability) =>
             featureAvailability.isFeatureAvailable('hpc-vmware-managed-vcd'),
           ),
-
       dedicatedCloudServiceInfos: /* @ngInject */ (
         $stateParams,
         OvhApiDedicatedCloud,
       ) =>
         OvhApiDedicatedCloud.v6().getServiceInfos({
           serviceName: $stateParams.productId,
         }),
-
+      dedicatedCloudVCDMigrationState: /* @ngInject */ (
+        DedicatedCloud,
+        $stateParams,
+        managedVCDAvailability,
+      ) => {
+        if (!managedVCDAvailability) return null;
+        return DedicatedCloud.getManagedVCDMigrationState(
+          $stateParams.productId,
+        ).catch(() => null);
+      },
+      dedicatedCloudPCCMigrationState: /* @ngInject */ (
+        DedicatedCloud,
+        $stateParams,
+        managedVCDAvailability,
+      ) => {
+        if (!managedVCDAvailability) return null;
+        return DedicatedCloud.getPCCMigrationState(
+          $stateParams.productId,
+        ).catch(() => null);
+      },
+      dedicatedCloudMigrationState: /* @ngInject */ (
+        dedicatedCloudVCDMigrationState,
+        dedicatedCloudPCCMigrationState,
+      ) => {
+        return !!(
+          dedicatedCloudVCDMigrationState?.isDone ||
+          dedicatedCloudPCCMigrationState?.isEnabling
+        );
+      },
       drpAvailability: /* @ngInject */ (ovhFeatureFlipping) =>
         ovhFeatureFlipping
           .checkFeatureAvailability('dedicated-cloud:drp')
@@ -284,7 +324,6 @@ export default /* @ngInject */ ($stateProvider) => {
       ) => {
         Alerter.set(`alert-${type}`, message, null, 'dedicatedCloud');
       },
-      trackingPrefix: () => 'dedicated::dedicatedClouds',
       usesLegacyOrder: /* @ngInject */ (currentService) =>
         currentService.usesLegacyOrder,
       newProductUrl: /* @ngInject */ (ovhFeatureFlipping, coreConfig) =>

packages/manager/apps/dedicated/client/app/managedBaremetal/dashboard-light/dedicatedCloudLight.module.js

@@ -0,0 +1,10 @@
+import angular from 'angular';
+
+import dashboardLightModule from '../../components/dedicated-cloud/dashboard-light';
+import routing from './dedicatedCloudLight.routing';
+
+const moduleName = 'ovhManagerManagedBaremetalLightModule';
+
+angular.module(moduleName, [dashboardLightModule]).config(routing);
+
+export default moduleName;

packages/manager/apps/dedicated/client/app/managedBaremetal/dashboard-light/dedicatedCloudLight.routing.js

@@ -0,0 +1,22 @@
+export default /* @ngInject */ ($stateProvider) => {
+  $stateProvider.state('app.managedBaremetal.details.dashboard.light', {
+    url: '/tag/migration-vcd',
+    redirectTo: (transition) => {
+      return transition
+        .injector()
+        .getAsync('dedicatedCloudMigrationState')
+        .then((dedicatedCloudMigrationState) => {
+          if (!dedicatedCloudMigrationState) {
+            return 'app.managedBaremetal.details.dashboard';
+          }
+
+          return false;
+        });
+    },
+    resolve: {
+      breadcrumb: () => null,
+    },
+    reloadOnSearch: false,
+    component: 'pccDashboardLight',
+  });
+};