feat(zimbra): add account express order cta & page

note that the handling of form field validation is also modified to make it more
convenient to test validity of field

ref: MANAGER-13960

Signed-off-by: Tristan WAGNER <[email protected]>

packages/manager/apps/zimbra/package.json

@@ -24,6 +24,7 @@
     "@ovh-ux/manager-config": "^8.0.0",
     "@ovh-ux/manager-core-api": "^0.9.0",
     "@ovh-ux/manager-core-utils": "^0.3.0",
+    "@ovh-ux/manager-module-order": "^0.7.1",
     "@ovh-ux/manager-react-components": "^1.41.1",
     "@ovh-ux/manager-react-core-application": "^0.11.1",
     "@ovh-ux/manager-react-shell-client": "^0.8.1",
@@ -39,6 +40,7 @@
     "element-internals-polyfill": "^1.3.10",
     "i18next": "^23.8.2",
     "i18next-http-backend": "2.5.0",
+    "jsurl": "^0.1.5",
     "react": "^18.2.0",
     "react-dom": "18.2.0",
     "react-i18next": "^14.0.5",

packages/manager/apps/zimbra/public/translations/accounts/Messages_fr_FR.json

@@ -13,5 +13,6 @@
   "zimbra_account_datagrid_tooltip_modification": "Modifier",
   "zimbra_account_datagrid_tooltip_delete": "Supprimer",
   "zimbra_account_account_add": "Créer un compte",
+  "zimbra_account_account_order": "Commander un compte",
   "zimbra_domains_tooltip_need_domain": "Veuillez d'abord configurer un domaine"
 }

packages/manager/apps/zimbra/public/translations/accounts/order/Messages_fr_FR.json

@@ -0,0 +1,17 @@
+{
+  "zimbra_account_order": "Commander un compte",
+  "zimbra_account_order_cta_back": "Retour vers mes comptes email",
+  "zimbra_account_order_title": "Commander vos comptes Zimbra",
+  "zimbra_account_order_subtitle": "Choisissez vos comptes Zimbra",
+  "zimbra_account_order_subtitle_commitment": "Durée de l'engagement",
+  "zimbra_account_order_legal_checkbox": "J’accepte qu’OVH mette en place le service immédiatement après validation de ma commande, et je renonce donc expressément à mon droit d’annulation au titre des dispositions de l’article L.121-21-8 du code de la consommation.",
+  "zimbra_account_order_no_product_error_message": "Il y a eu un problème lors du chargement du produit lié à votre commande, veuillez nous excuser et réessayer ultérieurement.",
+  "zimbra_account_order_commitment_month": "mois",
+  "zimbra_account_order_commitment_months": "mois",
+  "zimbra_account_order_commitment_available_soon": "Disponible prochainement",
+  "zimbra_account_order_cta_confirm": "Payer",
+  "zimbra_account_order_cta_done": "Retour",
+  "zimbra_account_order_initiated_title": "Commande de vos comptes Zimbra initiée !",
+  "zimbra_account_order_initiated_subtitle": "Si vous n'avez pas pu finaliser votre commande, merci de la compléter en cliquant sur le lien suivant :",
+  "zimbra_account_order_initiated_info": "Nous vous informerons de la disponibilité de vos comptes par e-mail."
+}

packages/manager/apps/zimbra/public/translations/dashboard/Messages_fr_FR.json

@@ -9,6 +9,7 @@
   "zimbra_dashboard_email_accounts_add": "Créer un compte email",
   "zimbra_dashboard_email_accounts_edit": "Modifier le compte",
   "zimbra_dashboard_email_accounts_settings": "Paramètres du compte",
+  "zimbra_dashboard_email_accounts_order": "Commander des comptes email",
   "zimbra_dashboard_email_accounts_alias": "Alias",
   "zimbra_dashboard_email_accounts_alias_add": "Créer un alias",
   "zimbra_dashboard_email_accounts_alias_delete": "Supprimer un alias",

packages/manager/apps/zimbra/src/api/_mock_/index.ts

@@ -5,3 +5,4 @@ export * from './domain';
 export * from './account';
 export * from './alias';
 export * from './task';
+export * from './order';

packages/manager/apps/zimbra/src/api/_mock_/order.ts

@@ -0,0 +1,91 @@
+import {
+  CurrencyCode,
+  IntervalUnitType,
+  OvhSubsidiary,
+} from '@ovh-ux/manager-react-components';
+import { order } from '@/api/order';
+
+export const orderCatalogMock: order.publicOrder.Catalog = {
+  catalogId: 2464,
+  locale: {
+    currencyCode: CurrencyCode.EUR,
+    subsidiary: OvhSubsidiary.FR,
+    taxRate: 20,
+  },
+  plans: [
+    {
+      planCode: 'zimbra-account-pp-starter',
+      invoiceName: 'Zimbra account',
+      addonFamilies: [],
+      product: 'zimbra-account',
+      pricingType: order.cart.GenericProductPricingTypeEnum.RENTAL,
+      consumptionConfiguration: null,
+      pricings: [
+        {
+          phase: 0,
+          capacities: [
+            order.cart.GenericProductPricingCapacitiesEnum.INSTALLATION,
+            order.cart.GenericProductPricingCapacitiesEnum.RENEW,
+          ],
+          commitment: 0,
+          description: 'monthly pricing',
+          interval: 1,
+          intervalUnit: IntervalUnitType.month,
+          quantity: {
+            min: 1,
+            max: null,
+          },
+          repeat: {
+            min: 1,
+            max: null,
+          },
+          price: 0,
+          tax: 0,
+          mode: 'default',
+          strategy: order.cart.GenericProductPricingStrategyEnum.VOLUME,
+          mustBeCompleted: false,
+          type: order.cart.GenericProductPricingTypeEnum.RENTAL,
+          promotions: [],
+          engagementConfiguration: null,
+        },
+      ],
+      configurations: [],
+      family: null,
+      blobs: {
+        commercial: {
+          name: 'Zimbra Starter',
+          price: {
+            precision: 2,
+            interval: 'P1M',
+            unit: 'M/account',
+          },
+        },
+        meta: {
+          configurations: [
+            {
+              name: 'domain_choices',
+              values: [
+                {
+                  value: 'new_or_transfer',
+                },
+                {
+                  value: 'use_mine',
+                },
+              ],
+            },
+          ],
+        },
+      },
+    },
+  ],
+  products: [
+    {
+      name: 'zimbra-account',
+      description: 'A zimbra account',
+      blobs: null,
+      configurations: [],
+    },
+  ],
+  addons: [],
+  planFamilies: [],
+};

packages/manager/apps/zimbra/src/api/order/api.ts

@@ -0,0 +1,18 @@
+import { v6 } from '@ovh-ux/manager-core-api';
+import { OvhSubsidiary } from '@ovh-ux/manager-react-components';
+import { order } from './type';
+
+// GET
+
+export const getOrderCatalog = async ({
+  ovhSubsidiary,
+  productName,
+}: {
+  ovhSubsidiary: OvhSubsidiary;
+  productName: string;
+}) => {
+  const { data } = await v6.get<order.publicOrder.Catalog>(
+    `/order/catalog/public/${productName}?ovhSubsidiary=${ovhSubsidiary}`,
+  );
+  return data;
+};

packages/manager/apps/zimbra/src/api/order/index.ts

@@ -0,0 +1,4 @@
+export * from './api';
+export * from './key';
+export * from './type';
+export * from './utils';

packages/manager/apps/zimbra/src/api/order/key.ts

@@ -0,0 +1,9 @@
+import { OvhSubsidiary } from '@ovh-ux/manager-react-components';
+
+export const getOrderCatalogQueryKey = ({
+  ovhSubsidiary,
+  productName,
+}: {
+  ovhSubsidiary: OvhSubsidiary;
+  productName: string;
+}) => [`get/order/catalog/${productName}/${ovhSubsidiary}`];