ovh · antonymarion · Jul 1, 2024 · Jun 26, 2024
diff --git a/packages/manager/apps/web/client/app/hosting/dashboard/translations/Messages_fr_FR.json b/packages/manager/apps/web/client/app/hosting/dashboard/translations/Messages_fr_FR.json
@@ -311,6 +311,7 @@
   "hosting_tab_DOMAINS_table_popover_delete": "Détacher le domaine",
   "hosting_tab_DOMAINS_table_popover_activate": "Activer le CDN",
   "hosting_tab_DOMAINS_table_popover_modify": "Modifier le domaine",
+  "hosting_tab_DOMAINS_table_git_association": "Associer Git",
   "hosting_tab_DOMAINS_table_popover_purge": "Purger le CDN",
   "hosting_tab_DOMAINS_table_popover_modify_cdn": "Modifier le CDN",
   "hosting_tab_DOMAINS_table_popover_refresh": "Recharger",

diff --git a/...ient/app/hosting/multisite/git-association/hosting-multisite-git-association.component.js b/...ient/app/hosting/multisite/git-association/hosting-multisite-git-association.component.js
@@ -4,8 +4,12 @@ import template from './hosting-multisite-git-association.html';
 export default {
   bindings: {
     sshKey: '<',
+    path: '<',
+    status: '<',
+    alertId: '<',
     serviceName: '<',
     goBack: '<',
+    webHookUrl: '<',
   },
   controller,
   template,

diff --git a/...ient/app/hosting/multisite/git-association/hosting-multisite-git-association.constants.js b/...ient/app/hosting/multisite/git-association/hosting-multisite-git-association.constants.js
@@ -5,7 +5,6 @@ export const EXAMPLE_HTTPS_REPOSITORY_URL =
 export const EXAMPLE_SSH_REPOSITORY_URL = 'git@github.com/username/';
 export const EXAMPLE_BRANCHES_NAMES = '"main", "master", ...';
 export const GITHUB_VCS = 'github';
-export const PATH_PREFIX = '[www]';
 export const REGEX_GIT_REPO = /^[https:\\/\\/|git:\\/\\/].*/;
 
 export default {
@@ -14,6 +13,5 @@ export default {
   EXAMPLE_BRANCHES_NAMES,
   EXAMPLE_SSH_REPOSITORY_URL,
   GITHUB_VCS,
-  PATH_PREFIX,
   REGEX_GIT_REPO,
 };
diff --git a/...ent/app/hosting/multisite/git-association/hosting-multisite-git-association.controller.js b/...ent/app/hosting/multisite/git-association/hosting-multisite-git-association.controller.js
@@ -5,47 +5,61 @@ import {
   EXAMPLE_SSH_REPOSITORY_URL,
   GITHUB_VCS,
   REGEX_GIT_REPO,
-  PATH_PREFIX,
 } from './hosting-multisite-git-association.constants';
 
 export default class HostingMultisiteGitAssociationController {
   /* @ngInject */
-  constructor(HostingMultisiteGitAssociationService, coreURLBuilder) {
+  constructor(
+    HostingMultisiteGitAssociationService,
+    coreURLBuilder,
+    $translate,
+  ) {
     this.REPOSITORY_PLACEHOLDER = REPOSITORY_PLACEHOLDER;
     this.EXAMPLE_BRANCHES_NAMES = EXAMPLE_BRANCHES_NAMES;
     this.EXAMPLE_HTTPS_REPOSITORY_URL = EXAMPLE_HTTPS_REPOSITORY_URL;
     this.GITHUB_VCS = GITHUB_VCS;
     this.EXAMPLE_SSH_REPOSITORY_URL = EXAMPLE_SSH_REPOSITORY_URL;
-    this.PATH_PREFIX = PATH_PREFIX;
     this.REGEX_GIT_REPO = REGEX_GIT_REPO;
     this.HostingMultisiteGitAssociationService = HostingMultisiteGitAssociationService;
-    this.model = {
-      repositoryUrl: null,
-      branchName: null,
-      webhookUrl: '',
-    };
     this.coreURLBuilder = coreURLBuilder;
+    this.$translate = $translate;
   }
 
   $onInit() {
-    this.errorMessage = !this.sshKey;
     this.ongoingTasksHref = this.coreURLBuilder.buildURL(
       'web',
       `#/hosting/${this.serviceName}/task`,
     );
+    this.model = {
+      webHookUrl: this.webHookUrl,
+      repositoryUrl: null,
+      branchName: null,
+    };
   }
 
   applyConfiguration() {
-    this.HostingMultisiteGitAssociationService.getVcsWebhookUrls(
+    this.HostingMultisiteGitAssociationService.postWebsiteAssociated(
       this.serviceName,
-      this.path,
-      this.GITHUB_VCS,
+      this.path, // www for instance
+      this.model.branchName,
+      this.model.repositoryUrl,
     )
-      .then(({ push }) => {
-        this.model.webhookUrl = push;
+      .then(() => {
+        this.goBack(
+          this.$translate.instant(
+            'hosting_multisite_git_association_success_message',
+            { href: this.ongoingTasksHref },
+          ),
+        );
       })
-      .catch(({ status }) => {
-        this.statusCode = status;
+      .catch(({ data: { message } }) => {
+        this.goBack(
+          this.$translate.instant(
+            'hosting_multisite_git_association_error_message',
+            { errorMessage: message },
+          ),
+          'error',
+        );
       });
   }
 }
diff --git a/...s/web/client/app/hosting/multisite/git-association/hosting-multisite-git-association.html b/...s/web/client/app/hosting/multisite/git-association/hosting-multisite-git-association.html
@@ -1,26 +1,10 @@
 <oui-back-button data-on-click="$ctrl.goBack()"></oui-back-button>
 
-<oui-message data-type="error" data-ng-if="$ctrl.errorMessage">
-    <p
-        data-ng-if="$ctrl.statusCode===500"
-        data-translate="hosting_multisite_git_association_ssh_key_internal_error_message"
-    ></p>
-    <p
-        data-ng-if="$ctrl.statusCode!==500"
-        data-ng-bind-html="$ctrl.errorMessage"
-    ></p>
-</oui-message>
-
-<oui-message data-type="success" data-ng-if="!$ctrl.errorMessagee">
-    <p
-        data-translate="hosting_multisite_git_association_ssh_key_success_message"
-        data-translate-values="{href: $ctrl.ongoingTasksHref}"
-    ></p>
-</oui-message>
+<div data-ovh-alert="git_association_alert"></div>
 
 <h1
     data-translate="hosting_multisite_git_association_title"
-    data-translate-value="{path: $ctrl.PATH_PREFIX}"
+    data-translate-value="{path: '[' + $ctrl.path + ']'}"
 ></h1>
 <p data-translate="hosting_multisite_git_association_configure_description"></p>
 
@@ -34,7 +18,10 @@ <h3 data-translate="hosting_multisite_git_association_ssh_key"></h3>
             class="col-md-4"
             data-label="{{ ::'hosting_multisite_git_association_ssh_key' | translate }}"
         >
-            <oui-clipboard data-model=":: $ctrl.sshKey"></oui-clipboard>
+            <oui-clipboard
+                name="sshKey"
+                data-model=":: $ctrl.sshKey"
+            ></oui-clipboard>
         </oui-field>
     </div>
     <h3 data-translate="hosting_multisite_git_association_configure"></h3>
@@ -72,6 +59,9 @@ <h3 data-translate="hosting_multisite_git_association_configure"></h3>
         <oui-field
             class="col-md-4"
             data-label="{{ ::'hosting_multisite_git_association_repository' | translate }}"
+            data-error-messages="{
+                pattern: ('hosting_multisite_git_association_incorrect_url_format' | translate)
+            }"
         >
             <div class="d-flex oui-input-group oui-input-group_inline">
                 <input
@@ -132,7 +122,10 @@ <h3 data-translate="hosting_multisite_git_association_configure_auto"></h3>
             class="col-md-4"
             data-label="{{ ::'hosting_multisite_git_association_webhook_url' | translate }}"
         >
-            <oui-clipboard data-model="$ctrl.model.webhookUrl"></oui-clipboard>
+            <oui-clipboard
+                name="webhookUrl"
+                data-model="$ctrl.model.webhookUrl"
+            ></oui-clipboard>
         </oui-field>
     </div>
 </form>

diff --git a/...client/app/hosting/multisite/git-association/hosting-multisite-git-association.routing.js b/...client/app/hosting/multisite/git-association/hosting-multisite-git-association.routing.js
@@ -1,16 +1,63 @@
+import { GITHUB_VCS } from './hosting-multisite-git-association.constants';
+
 export default /* @ngInject */ ($stateProvider) => {
   $stateProvider.state('app.hosting.dashboard.git', {
     url: '/multisite/git-association',
     component: 'hostingMultisiteGitAssociationComponent',
+    params: {
+      status: null,
+      alertId: null,
+    },
     resolve: {
-      goBack: /* @ngInject */ ($state, $transition$) => () =>
-        $state.go('app.hosting.dashboard.multisite', {
-          productId: $transition$.params().productId,
-        }),
+      goBack: /* @ngInject */ ($transition$, $state, $timeout, setMessage) => (
+        message,
+        type,
+      ) => {
+        const promise = $state.go(
+          'app.hosting.dashboard.multisite',
+          {
+            productId: $transition$.params().productId,
+          },
+          { reload: true },
+        );
+        if (message) {
+          promise.then(() => $timeout(() => setMessage(message, type)));
+        }
+
+        return promise;
+      },
+      setMessage: /* @ngInject */ (
+        Alerter,
+        $translate,
+        coreURLBuilder,
+        alertId,
+        serviceName,
+      ) => (message, type = 'success') => {
+        const params =
+          type === 'error'
+            ? { errorMessage: message }
+            : {
+                href: coreURLBuilder.buildURL(
+                  'web',
+                  `#/hosting/${serviceName}/task`,
+                ),
+              };
+        return Alerter.set(
+          `alert-${type}`,
+          $translate.instant(
+            `hosting_multisite_git_association_${type}_message`,
+            params,
+          ),
+          message,
+          alertId,
+        );
+      },
       breadcrumb: /* @ngInject */ ($translate) =>
         $translate.instant('hosting_multisite'),
       serviceName: /* @ngInject */ ($transition$) =>
         $transition$.params().productId,
+      status: /* @ngInject */ ($transition$) => $transition$.params().status,
+      alertId: /* @ngInject */ ($transition$) => $transition$.params().alertId,
       path: /* @ngInject */ (Hosting, serviceName) =>
         Hosting.getSelected(serviceName, true).then(
           (hosting) => hosting.displayName,
@@ -19,6 +66,16 @@ export default /* @ngInject */ ($stateProvider) => {
         HostingMultisiteGitAssociationService,
         serviceName,
       ) => HostingMultisiteGitAssociationService.getSshKey(serviceName),
+      webHookUrl: /* @ngInject */ (
+        HostingMultisiteGitAssociationService,
+        serviceName,
+        path,
+      ) =>
+        HostingMultisiteGitAssociationService.getVcsWebhookUrls(
+          serviceName,
+          path,
+          GITHUB_VCS,
+        ).then(({ push }) => push),
     },
   });
 };
diff --git a/...client/app/hosting/multisite/git-association/hosting-multisite-git-association.service.js b/...client/app/hosting/multisite/git-association/hosting-multisite-git-association.service.js
@@ -19,6 +19,30 @@ export default class HostingMultisiteGitAssociationService {
         }
         throw error;
       })
-      .then(({ data }) => data.publicKey);
+      .then(({ data }) => data.publicKey)
+      .catch((error) => {
+        if (error.status === 500) {
+          return null;
+        }
+        throw error;
+      });
+  }
+
+  getWebsitesAssociated(serviceName, path) {
+    return this.$http.put(`/hosting/web/${serviceName}/website?path=${path}`);
+  }
+
+  putWebsiteAssociated(serviceName, vcsBranch, id) {
+    return this.$http.put(`/hosting/web/${serviceName}/website/${id}`, {
+      vcsBranch,
+    });
+  }
+
+  postWebsiteAssociated(serviceName, path, vcsBranch, vcsUrl) {
+    return this.$http.post(`/hosting/web/${serviceName}/website`, {
+      path,
+      vcsBranch,
+      vcsUrl,
+    });
   }
 }
diff --git a/packages/manager/apps/web/client/app/hosting/multisite/hosting-multisite.controller.js b/packages/manager/apps/web/client/app/hosting/multisite/hosting-multisite.controller.js
@@ -35,6 +35,7 @@ angular
       $location,
       $rootScope,
       $translate,
+      $timeout,
       atInternet,
       Hosting,
       HOSTING,
@@ -235,6 +236,30 @@ angular
         $scope.setAction('multisite/update/hosting-multisite-update', domain);
       };
 
+      $scope.goToAssociateRepository = (domain) => {
+        const promise = $state.go('app.hosting.dashboard.git', {
+          alertId: $scope.alerts.main,
+          status: domain.status,
+          serviceName: $scope.hosting.serviceName,
+          path: domain.path,
+        });
+
+        if (domain.status === 'error') {
+          promise.then(() =>
+            $timeout(() =>
+              Alerter.set(
+                `alert-danger`,
+                $translate.instant(
+                  'hosting_multisite_git_association_apply_configuration_status_error',
+                ),
+                null,
+                'git_association_alert',
+              ),
+            ),
+          );
+        }
+      };
+
       $scope.restartDomain = (domain) =>
         HostingDomain.restartVirtualHostOfAttachedDomain(
           $stateParams.productId,

diff --git a/packages/manager/apps/web/client/app/hosting/multisite/translations/Messages_fr_FR.json b/packages/manager/apps/web/client/app/hosting/multisite/translations/Messages_fr_FR.json
@@ -13,9 +13,12 @@
   "hosting_multisite_statistics_changing_datavis_tool": "L'outil de visualisation des statistiques de votre CDN évolue. Retrouvez désormais vos données <b>sur la page OVHcloud Web Statistics</b> pour vous aider à suivre et piloter le trafic de vos sites web",
   "hosting_multisite_git_association_title": "Configurer votre Git pour votre répertoire {{ path }}",
   "hosting_multisite_git_association_ssh_key": "Clé SSH",
+  "hosting_multisite_git_association_incorrect_url_format": "Le format de l'url n'est pas correct",
   "hosting_multisite_git_association_ssh_url_repo_help": "Indiquer l'URL de votre dépôt Git ({{ httpsRepo }}) ou si SSH est activé ({{ sshRepo }})",
   "hosting_multisite_git_association_ssh_key_internal_error_message": "La génération de votre clé SSH a échoué, veuillez ré-essayer ultérieurement ou contacter le support",
-  "hosting_multisite_git_association_ssh_key_success_message": "Git est en cours d’activation. Vous pouvez suivre son activation depuis les tâches en cours <a href=\"{{ href }}\">Tâches en cours</a>",
+  "hosting_multisite_git_association_apply_configuration_status_error": "Votre dernière configuration a échoué. Afin de configurer Git, vous devez à nouveau appliquer votre configuration.",
+  "hosting_multisite_git_association_error_message": "Git n'a pas pu être activé {{ errorMessage }}",
+  "hosting_multisite_git_association_success_message": "Git est en cours d'activation. Vous pouvez suivre son activation depuis les tâches en cours <a href=\"{{ href }}\">Tâches en cours</a>",
   "hosting_multisite_git_association_ssh_branches_names": "Indiquer le nom de la branche de votre dépôt qui sera répliqué ({{ branchesNames }})",
   "hosting_multisite_git_association_configure": "Configurer votre déploiement",
   "hosting_multisite_git_association_configure_auto": "Configurer votre déploiement automatique",

diff --git a/packages/manager/apps/web/client/app/hosting/popover/multisite.html b/packages/manager/apps/web/client/app/hosting/popover/multisite.html
@@ -68,4 +68,11 @@
     >
         <span data-translate="hosting_tab_DOMAINS_table_popover_purge"></span>
     </oui-button>
+    <oui-button
+        data-variant="link"
+        class="d-block"
+        data-on-click="goToAssociateRepository(domain)"
+    >
+        <span data-translate="hosting_tab_DOMAINS_table_git_association"></span>
+    </oui-button>
 </div>