feat(pci-object-storage): s3 localzones

packages/manager-react-components/vite.config.mts

@@ -55,11 +55,11 @@ export default defineConfig({
         'react-router-dom',
         'react-i18next',
         'zustand',
-        "@ovhcloud/ods-common-core",
-        "@ovhcloud/ods-common-theming",
-        "@ovhcloud/ods-components",
-        "@ovhcloud/ods-components/react",
-        "@ovhcloud/ods-theme-blue-jeans"
+        '@ovhcloud/ods-common-core',
+        '@ovhcloud/ods-common-theming',
+        '@ovhcloud/ods-components',
+        '@ovhcloud/ods-components/react',
+        '@ovhcloud/ods-theme-blue-jeans',
       ],
       output: {
         globals: {

packages/manager/modules/pci/src/components/project/regions-list/regions-list.component.js

@@ -16,5 +16,7 @@ export default {
     projectId: '<?',
     reload: '<?',
     loadEnd: '&?',
+    isDiscoveryProject: '<',
+    projectActivationPageHref: '<',
   },
 };

packages/manager/modules/pci/src/components/project/regions-list/regions-list.controller.js

@@ -81,20 +81,25 @@ export default class RegionsListController {
         this.coreConfig.getUser().ovhSubsidiary,
       )
         .then((productCapabilities) => {
-          const productCapability = productCapabilities.plans
-            ?.filter((plan) =>
-              plan.code?.startsWith(STORAGE_STANDARD_REGION_PLANCODE),
-            )
-            .filter(
-              (plan, index, self) =>
-                index === self.findIndex((p) => p.name === plan.name),
-            );
+          const productCapability = productCapabilities.plans?.filter((plan) =>
+            plan.code?.startsWith(STORAGE_STANDARD_REGION_PLANCODE),
+          );
 
           const productRegionsAllowed = productCapability?.flatMap(
             ({ regions }) => regions,
           );
 
-          const regionsAllowedByDeploymentMode = productRegionsAllowed.filter(
+          const uniqueProductRegionsAllowed = productRegionsAllowed.filter(
+            (value, index, self) =>
+              index ===
+              self.findIndex(
+                (region) =>
+                  region.name === value.name &&
+                  region.datacenter === value.datacenter,
+              ),
+          );
+
+          const regionsAllowedByDeploymentMode = uniqueProductRegionsAllowed.filter(
             (item) => item.type === this.deploymentMode,
           );
 

packages/manager/modules/pci/src/components/project/regions-list/regions-list.html

@@ -171,13 +171,24 @@
             data-ng-if="$ctrl.selectedRegion.enabled === false"
             class="regions-list"
         >
-            <p class="oui-color-ae-500">
+            <p class="oui-color-ae-500" data-ng-if="!$ctrl.isDiscoveryProject">
                 <strong
                     data-translate="pci_projects_project_storages_containers_add_add_region_activate"
                 >
                 </strong>
             </p>
         </div>
+        <div data-ng-if="$ctrl.isDiscoveryProject" class="regions-list">
+            <p class="oui-color-ae-500">
+                <strong
+                    data-translate="pci_project_regions_list_activate_project_banner_message"
+                ></strong>
+                <a
+                    data-ng-href="{{:: $ctrl.projectActivationPageHref }}"
+                    data-translate="pci_project_regions_list_activate_project_banner_link_text"
+                ></a>
+            </p>
+        </div>
     </oui-tabs-item>
 </oui-tabs>
 <oui-spinner

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_de_DE.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Bitte aktivieren Sie die letzten Standorte jeder Zone im Bereich <a href=\"{{url}}\" class=\"oui-link\">Standorte</a>",
   "pci_project_regions_list_region": "Standort",
   "pci_project_regions_list_quota": "Mein Quota erhöhen",
-  "pci_project_regions_list_current_offer": "Derzeitiges Angebot"
+  "pci_project_regions_list_current_offer": "Derzeitiges Angebot",
+  "pci_project_regions_list_activate_project_banner_message": "Um auf die folgenden Schritte zuzugreifen, müssen Sie",
+  "pci_project_regions_list_activate_project_banner_link_text": "Ihr Projekt aktivieren."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_en_GB.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Please activate the latest locations in each zone in the <a href=\"{{url}}\" class=\"oui-link\">Locations</a> section.",
   "pci_project_regions_list_region": "Location",
   "pci_project_regions_list_quota": "Increase your quota",
-  "pci_project_regions_list_current_offer": "Current solution"
+  "pci_project_regions_list_current_offer": "Current solution",
+  "pci_project_regions_list_activate_project_banner_message": "To go to the next steps,",
+  "pci_project_regions_list_activate_project_banner_link_text": "activate your project."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_es_ES.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Por favor, active las últimas localizaciones de cada zona en la sección <a href=\"{{url}}\" class=\"oui-link\">Localizaciones</a>.",
   "pci_project_regions_list_region": "Localización",
   "pci_project_regions_list_quota": "Aumentar los límites de mi cuota",
-  "pci_project_regions_list_current_offer": "Producto actual"
+  "pci_project_regions_list_current_offer": "Producto actual",
+  "pci_project_regions_list_activate_project_banner_message": "Para acceder a las siguientes etapas",
+  "pci_project_regions_list_activate_project_banner_link_text": "debe activar el proyecto."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_fr_CA.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Nous vous invitons à activer les dernières localisations de chaque zone dans la partie <a href=\"{{url}}\" class=\"oui-link\">Localisations</a>",
   "pci_project_regions_list_region": "Localisation",
   "pci_project_regions_list_quota": "Augmenter mon quota",
-  "pci_project_regions_list_current_offer": "Offre actuelle"
+  "pci_project_regions_list_current_offer": "Offre actuelle",
+  "pci_project_regions_list_activate_project_banner_message": "Pour accéder aux étapes suivantes, vous devez",
+  "pci_project_regions_list_activate_project_banner_link_text": "activer votre projet."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_fr_FR.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Nous vous invitons à activer les dernières localisations de chaque zone dans la partie <a href=\"{{url}}\" class=\"oui-link\">Localisations</a>",
   "pci_project_regions_list_region": "Localisation",
   "pci_project_regions_list_quota": "Augmenter mon quota",
-  "pci_project_regions_list_current_offer": "Offre actuelle"
+  "pci_project_regions_list_current_offer": "Offre actuelle",
+  "pci_project_regions_list_activate_project_banner_message": "Pour accéder aux étapes suivantes, vous devez",
+  "pci_project_regions_list_activate_project_banner_link_text": "activer votre projet."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_it_IT.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Per attivare le ultime localizzazioni disponibili in ogni zona, accedi alla sezione <a href=\"{{url}}\" class=\"oui-link\">Region</a>",
   "pci_project_regions_list_region": "Localizzazione",
   "pci_project_regions_list_quota": "Aumenta la tua quota",
-  "pci_project_regions_list_current_offer": "Soluzione corrente"
+  "pci_project_regions_list_current_offer": "Soluzione corrente",
+  "pci_project_regions_list_activate_project_banner_message": "Per accedere agli step successivi, è necessario",
+  "pci_project_regions_list_activate_project_banner_link_text": "attivare il tuo progetto."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_pl_PL.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Włącz najnowsze regiony każdej strefy w sekcji <a href=\"{{url}}\" class=\"oui-link\">Lokalizacje</a>.",
   "pci_project_regions_list_region": "Lokalizacja",
   "pci_project_regions_list_quota": "Zwiększ limit",
-  "pci_project_regions_list_current_offer": "Aktualna oferta"
+  "pci_project_regions_list_current_offer": "Aktualna oferta",
+  "pci_project_regions_list_activate_project_banner_message": "Aby przejść do kolejnych etapów, musisz",
+  "pci_project_regions_list_activate_project_banner_link_text": "aktywować projekt."
 }

packages/manager/modules/pci/src/components/project/regions-list/translations/Messages_pt_PT.json

@@ -4,5 +4,7 @@
   "pci_project_regions_list_add": "Pode ativar as últimas regiões de cada zona na secção <a href=\"{{url}}\" class=\"oui-link\">Localizações</a>",
   "pci_project_regions_list_region": "Localização",
   "pci_project_regions_list_quota": "Aumentar o meu limite",
-  "pci_project_regions_list_current_offer": "Oferta atual"
+  "pci_project_regions_list_current_offer": "Oferta atual",
+  "pci_project_regions_list_activate_project_banner_message": "Para aceder às etapas seguintes, deve",
+  "pci_project_regions_list_activate_project_banner_link_text": "ativar o seu projeto."
 }

packages/manager/modules/pci/src/projects/project/storages/containers/add/add.component.js

@@ -23,5 +23,7 @@ export default {
     trackEncryptionAction: '<',
     catalog: '<',
     is3azAvailable: '<',
+    projectActivationPageHref: '<',
+    isLocalzoneAvailable: '<',
   },
 };

packages/manager/modules/pci/src/projects/project/storages/containers/add/add.controller.js

@@ -19,6 +19,7 @@ import {
   OBJECT_CONTAINER_MODE_MONO_ZONE,
   STORAGE_STANDARD_PLANCODE,
   SWIFT_PLANCODE,
+  OBJECT_CONTAINER_MODE_LOCAL_ZONE,
 } from '../containers.constants';
 
 import { CONTAINER_USER_ASSOCIATION_MODES } from './components/associate-user-to-container/constant';
@@ -107,6 +108,7 @@ export default class PciStoragesContainersAddController {
       },
     );
 
+    this.featureFlipLocalzoneContainer();
     this.setOffersPrices();
     this.setDeploymentModePrices();
     this.featureFlip3azContainer();
@@ -137,6 +139,13 @@ export default class PciStoragesContainersAddController {
     this.messages = this.messageHandler.getMessages();
   }
 
+  shouldDisplayContainerName() {
+    if (this.isRightOffer() && !this.isLocalZone()) {
+      return !this.archive && this.currentStep > 4;
+    }
+    return !this.archive && !this.isAddingRegion && !this.isAddingRegionError;
+  }
+
   featureFlip3azContainer() {
     if (!this.is3azAvailable) {
       const index = OBJECT_CONTAINER_DEPLOYMENT_MODES.indexOf(
@@ -158,7 +167,19 @@ export default class PciStoragesContainersAddController {
       .filter((addon) => addon.planCode === planCode)
       .map((addon) => addon.pricings[0].price)[0];
 
-    return hourlyPrice * 720 * 1024 * 0.00000001;
+    return hourlyPrice * 730 * 1024 * 0.00000001;
+  }
+
+  featureFlipLocalzoneContainer() {
+    if (!this.isLocalzoneAvailable) {
+      const index = OBJECT_CONTAINER_DEPLOYMENT_MODES.indexOf(
+        OBJECT_CONTAINER_MODE_LOCAL_ZONE,
+      );
+
+      if (index > -1) {
+        OBJECT_CONTAINER_DEPLOYMENT_MODES.splice(index, 1);
+      }
+    }
   }
 
   setOffersPrices() {
@@ -192,7 +213,7 @@ export default class PciStoragesContainersAddController {
 
         if (price > 0) {
           if (!lowestPrice || price < lowestPrice) {
-            lowestPrice = price * 720 * 1024 * 0.00000001;
+            lowestPrice = price * 730 * 1024 * 0.00000001;
           }
         }
       }
@@ -237,9 +258,27 @@ export default class PciStoragesContainersAddController {
             OBJECT_CONTAINER_MODE_MONO_ZONE,
           ),
         );
+
+      this.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[
+        OBJECT_CONTAINER_MODE_LOCAL_ZONE
+      ].price =
+        this.getLowestPriceAddon(
+          productCapability,
+          OBJECT_CONTAINER_MODE_LOCAL_ZONE,
+        ) &&
+        this.PriceFormatter.format(
+          this.getLowestPriceAddon(
+            productCapability,
+            OBJECT_CONTAINER_MODE_LOCAL_ZONE,
+          ),
+        );
     });
   }
 
+  isLocalZone() {
+    return this.container.deploymentMode === OBJECT_CONTAINER_MODE_LOCAL_ZONE;
+  }
+
   isRightOffer() {
     return OBJECT_CONTAINER_OFFER_STORAGE_STANDARD === this.container.offer;
   }
@@ -271,6 +310,7 @@ export default class PciStoragesContainersAddController {
 
   onContainerSolutionChange() {
     this.container.region = null;
+    this.container.containerType = null;
   }
 
   onRegionsFocus() {

packages/manager/modules/pci/src/projects/project/storages/containers/add/add.html

@@ -193,23 +193,31 @@ <h2 class="oui-header__description mb-5">
                 >
                     <oui-select-picker-label>
                         <span
-                            data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + deploymentModeName) | translate"
-                        ></span>
+                            data-ng-bind="::($ctrl.isLocalzoneAvailable
+                            ? 'pci_projects_project_storages_containers_add_deployment_mode_'
+                            : 'pci_projects_project_storages_containers_add_deployment_mode_flipping_') + deploymentModeName | translate"
+                        >
+                        </span>
                         <span
                             class="oui-badge oui-badge_best-seller"
                             data-ng-if="$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[deploymentModeName].isMultiZone"
                             data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + deploymentModeName + '_label') | translate"
                         ></span>
                         <span
                             class="oui-badge oui-badge_info"
-                            data-ng-if="!$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[deploymentModeName].isMultiZone"
+                            data-ng-if="$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[deploymentModeName].isMonoZone && $ctrl.isLocalzoneAvailable"
                             data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + deploymentModeName + '_label') | translate"
                         ></span>
                         <span
                             class="oui-badge oui-badge_limited-edition"
                             data-ng-if="$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[deploymentModeName].isMultiZone"
                             data-translate="pci_projects_project_storages_containers_add_deployment_mode_soon"
                         ></span>
+                        <span
+                            class="oui-badge oui-badge_promotion"
+                            data-ng-if="$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[deploymentModeName].isLocalZone"
+                            data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + deploymentModeName + '_label') | translate"
+                        ></span>
                     </oui-select-picker-label>
                     <oui-select-picker-section>
                         <p
@@ -265,7 +273,9 @@ <h2 class="oui-header__description mb-5">
                 >
                     <oui-select-picker-label>
                         <strong
-                            data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + $ctrl.container.deploymentMode) | translate"
+                            data-ng-bind=":: (($ctrl.isLocalzoneAvailable
+                            ? 'pci_projects_project_storages_containers_add_deployment_mode_'
+                            : 'pci_projects_project_storages_containers_add_deployment_mode_flipping_') + $ctrl.container.deploymentMode) | translate"
                         ></strong>
                         <span
                             class="oui-badge oui-badge_best-seller oui-3az"
@@ -274,7 +284,12 @@ <h2 class="oui-header__description mb-5">
                         ></span>
                         <span
                             class="oui-badge oui-badge_info"
-                            data-ng-if="!$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[$ctrl.container.deploymentMode].isMultiZone"
+                            data-ng-if="$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[$ctrl.container.deploymentMode].isMonoZone && $ctrl.isLocalzoneAvailable"
+                            data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + $ctrl.container.deploymentMode + '_label') | translate"
+                        ></span>
+                        <span
+                            class="oui-badge oui-badge_promotion"
+                            data-ng-if="$ctrl.OBJECT_CONTAINER_DEPLOYMENT_MODES_LABELS[$ctrl.container.deploymentMode].isLocalZone"
                             data-ng-bind=":: ('pci_projects_project_storages_containers_add_deployment_mode_' + $ctrl.container.deploymentMode + '_label') | translate"
                         ></span>
                     </oui-select-picker-label>
@@ -305,7 +320,7 @@ <h2 class="oui-header__description mb-5">
         data-ng-if="!$ctrl.archive && (!$ctrl.isRightOffer() || $ctrl.container.deploymentMode)"
         data-name="storage_container_add_region"
         data-header="{{:: 'pci_projects_project_storages_containers_add_region_title' | translate }}"
-        data-navigation="$ctrl.container.region"
+        data-navigation="$ctrl.container.region && !$ctrl.isDiscoveryProject"
         data-on-focus="$ctrl.onRegionsFocus()"
         data-on-submit="$ctrl.onRegionChange()"
         data-editable="!$ctrl.isLoading"
@@ -321,6 +336,8 @@ <h2 class="oui-header__description mb-5">
             data-project-id="$ctrl.projectId"
             data-reload="$ctrl.reloadRegions"
             data-load-end="$ctrl.reloadRegionsEnd()"
+            data-is-discovery-project="$ctrl.isDiscoveryProject"
+            data-project-activation-page-href="$ctrl.projectActivationPageHref"
         ></pci-project-regions-list>
     </oui-step-form>
 
@@ -364,7 +381,7 @@ <h2 class="oui-header__description mb-5">
     <!--Create/Linked user-->
     <oui-step-form
         data-position="3"
-        data-ng-if="!$ctrl.archive && $ctrl.isRightOffer()"
+        data-ng-if="!$ctrl.archive && $ctrl.isRightOffer() && !$ctrl.isLocalZone()"
         data-header="{{:: 'pci_projects_project_storages_containers_add_create_or_linked_user_title' | translate }}"
         data-navigation="$ctrl.isReadyForValidation()"
         data-name="storage_container_add_user"
@@ -387,7 +404,7 @@ <h2 class="oui-header__description mb-5">
 
     <oui-step-form
         data-position="4"
-        data-ng-if="!$ctrl.archive && $ctrl.isRightOffer()"
+        data-ng-if="!$ctrl.archive && $ctrl.isRightOffer() && !$ctrl.isLocalZone()"
         data-header="{{:: 'pci_projects_project_storages_containers_bucket_versioning_title' | translate }}"
         data-editable="!$ctrl.isLoading"
         data-name="storage_container_bucket_versioning"
@@ -401,7 +418,7 @@ <h2 class="oui-header__description mb-5">
     <!-- Data encryption -->
     <oui-step-form
         data-position="{{!$ctrl.archive && $ctrl.isRightOffer() ? 5 : 4}}"
-        data-ng-if="!$ctrl.archive && $ctrl.encryptionAvailable && $ctrl.isRightOffer()"
+        data-ng-if="!$ctrl.archive && $ctrl.encryptionAvailable && $ctrl.isRightOffer() && !$ctrl.isLocalZone()"
         data-header="{{:: 'pci_projects_project_storages_containers_data_encryption_title' | translate }}"
         data-editable="!$ctrl.isLoading"
         data-name="storage_container_data_encryption"
@@ -424,13 +441,13 @@ <h2 class="oui-header__description mb-5">
         data-cancel-text="{{:: 'pci_projects_project_storages_containers_add_cancel_label' | translate }}"
         data-submit-text="{{:: 'pci_projects_project_storages_containers_add_submit_label' | translate }}"
         name="storage_container_add_name"
-        data-valid="!$ctrl.isDiscoveryProject"
+        data-valid="!$ctrl.isDiscoveryProject && !$ctrl.isAddingRegion && !$ctrl.isAddingRegionError"
         data-prevent-next
     >
         <oui-field
             data-size="xl"
             data-help-text="{{ ::'pci_projects_project_storages_containers_add_pattern_help_storage-s3' | translate }}"
-            data-ng-if="$ctrl.isRightOffer() ? !$ctrl.archive && $ctrl.currentStep > 4 : !$ctrl.archive"
+            data-ng-if="$ctrl.shouldDisplayContainerName()"
         >
             <input
                 class="oui-input"
@@ -441,6 +458,10 @@ <h2 class="oui-header__description mb-5">
                 data-ng-required="true"
             />
         </oui-field>
+        <oui-spinner
+            data-size="s"
+            data-ng-if="$ctrl.isAddingRegion"
+        ></oui-spinner>
     </oui-step-form>
 
     <!--Archive container steps-->