feat(dedicated.netapp): create volume from snapshot

ref: MANAGER-11778

Signed-off-by: Quentin Pavy <[email protected]>

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/component.js

@@ -6,6 +6,7 @@ export default {
     addSnapshotLink: '<',
     deleteSnapshot: '<',
     editSnapshot: '<',
+    createVolumeFromSnapshot: '<',
     serviceName: '<',
     snapshots: '<',
     hasOnlySystemSnapshot: '<',

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/component.js

@@ -0,0 +1,16 @@
+import controller from './controller';
+import template from './template.html';
+
+export default {
+  bindings: {
+    goToSnapshots: '<',
+    goToVolumes: '<',
+    serviceName: '<',
+    snapshot: '<',
+    volumeId: '<',
+    volume: '<',
+    trackClick: '<',
+  },
+  controller,
+  template,
+};

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/constants.js

@@ -0,0 +1,5 @@
+export const PATTERN = /^[a-zA-Z0-9_|\\,. -]*$/;
+
+export default {
+  PATTERN,
+};

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/controller.js

@@ -0,0 +1,55 @@
+import { PATTERN } from './constants';
+
+export default class NetAppVolumesDashboardSnapshotsCreateVolumeController {
+  /* @ngInject */
+  constructor($http, $translate, NetAppSnapshotCreateVolumeService) {
+    this.$http = $http;
+    this.$translate = $translate;
+    this.NetAppSnapshotCreateVolumeService = NetAppSnapshotCreateVolumeService;
+    this.PATTERN = PATTERN;
+  }
+
+  $onInit() {
+    this.isLoading = false;
+  }
+
+  createVolumeFromSnapshot() {
+    this.isLoading = true;
+    this.trackClick('create-volume::confirm');
+    return this.NetAppSnapshotCreateVolumeService.createVolumeFromSnapshot(
+      this.serviceName,
+      this.name,
+      this.description,
+      this.volume.protocol,
+      this.volume.size,
+      this.snapshot.id,
+    )
+      .then(() =>
+        this.goToVolumes(
+          this.$translate.instant(
+            'netapp_volumes_snapshots_create_volume_success',
+          ),
+        ),
+      )
+      .catch((error) =>
+        this.goToSnapshots(
+          this.$translate.instant(
+            'netapp_volumes_snapshots_create_volume_error',
+            {
+              message: error.data?.message,
+              requestId: error.headers('X-Ovh-Queryid'),
+            },
+          ),
+          'error',
+        ),
+      )
+      .finally(() => {
+        this.isLoading = false;
+      });
+  }
+
+  goBack() {
+    this.trackClick('create-volume::cancel');
+    return this.goToSnapshots();
+  }
+}

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/index.js

@@ -0,0 +1,26 @@
+import angular from 'angular';
+import '@uirouter/angularjs';
+import 'oclazyload';
+
+const moduleName =
+  'ovhManagerNetAppVolumesDashboardSnapshotsCreateVolumeLazyLoading';
+
+angular.module(moduleName, ['ui.router', 'oc.lazyLoad']).config(
+  /* @ngInject */ ($stateProvider) => {
+    $stateProvider.state(
+      'netapp.dashboard.volumes.dashboard.snapshots.create-volume.**',
+      {
+        url: '/:snapshotId/create-volume',
+        lazyLoad: ($transition$) => {
+          const $ocLazyLoad = $transition$.injector().get('$ocLazyLoad');
+
+          return import('./module').then((mod) =>
+            $ocLazyLoad.inject(mod.default || mod),
+          );
+        },
+      },
+    );
+  },
+);
+
+export default moduleName;

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/module.js

@@ -0,0 +1,32 @@
+import angular from 'angular';
+import '@ovh-ux/manager-core';
+import '@ovh-ux/ng-ui-router-breadcrumb';
+import '@ovh-ux/ng-ui-router-layout';
+import '@ovh-ux/ui-kit';
+import '@uirouter/angularjs';
+import 'angular-translate';
+
+import component from './component';
+import routing from './routing';
+import service from './service';
+
+const moduleName = 'ovhManagerNetAppVolumesDashboardSnapshotsCreateVolume';
+
+angular
+  .module(moduleName, [
+    'ngUiRouterBreadcrumb',
+    'ngUiRouterLayout',
+    'oui',
+    'ovhManagerCore',
+    'pascalprecht.translate',
+    'ui.router',
+  ])
+  .config(routing)
+  .component(
+    'ovhManagerNetAppVolumesDashboardSnapshotsCreateVolumeComponent',
+    component,
+  )
+  .service('NetAppSnapshotCreateVolumeService', service)
+  .run(/* @ngTranslationsInject:json ./translations */);
+
+export default moduleName;

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/routing.js

@@ -0,0 +1,22 @@
+export default /* @ngInject */ ($stateProvider) => {
+  $stateProvider.state(
+    'netapp.dashboard.volumes.dashboard.snapshots.create-volume',
+    {
+      url: '/:snapshotId/create-volume',
+      views: {
+        modal: {
+          component:
+            'ovhManagerNetAppVolumesDashboardSnapshotsCreateVolumeComponent',
+        },
+      },
+      layout: 'modal',
+      resolve: {
+        breadcrumb: /* @ngInject */ () => null,
+        snapshotId: /* @ngInject */ ($transition$) =>
+          $transition$.params().snapshotId,
+        snapshot: /* @ngInject */ (snapshots, snapshotId) =>
+          snapshots.find(({ id }) => id === snapshotId),
+      },
+    },
+  );
+};

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/service.js

@@ -0,0 +1,23 @@
+export default class NetAppSnapshotCreateVolumeService {
+  /* @ngInject */
+  constructor($http) {
+    this.$http = $http;
+  }
+
+  createVolumeFromSnapshot(
+    serviceName,
+    name,
+    description,
+    protocol,
+    size,
+    snapshotID,
+  ) {
+    return this.$http.post(`/storage/netapp/${serviceName}/share`, {
+      name,
+      description,
+      protocol,
+      size,
+      snapshotID,
+    });
+  }
+}

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/template.html

@@ -0,0 +1,44 @@
+<form
+    id="createVolumeFormSnapshot"
+    name="createVolumeFormSnapshot"
+    data-ng-submit="createVolumeFormSnapshot.$valid && $ctrl.createVolumeFromSnapshot()"
+    novalidate
+>
+    <oui-modal
+        data-heading="{{ ::'netapp_volumes_snapshots_create_volume_title' | translate }}"
+        data-primary-label="{{ ::'netapp_volumes_snapshots_create_volume_confirm' | translate }}"
+        data-secondary-label="{{ ::'netapp_volumes_snapshots_create_volume_cancel' | translate }}"
+        data-secondary-action="$ctrl.goBack()"
+        data-on-dismiss="$ctrl.goBack()"
+        data-loading="$ctrl.isLoading"
+    >
+        <p
+            data-translate="netapp_volumes_snapshots_create_volume_description"
+            data-translate-values="{snapshot: $ctrl.snapshot.name || $ctrl.snapshot.id}"
+        ></p>
+        <oui-field
+            label="{{:: 'netapp_volumes_snapshots_create_volume_name_label' | translate }}"
+        >
+            <input
+                class="oui-input"
+                name="volumeName"
+                type="text"
+                data-ng-model="$ctrl.name"
+                data-ng-pattern="$ctrl.PATTERN"
+                maxlength="255"
+            />
+        </oui-field>
+        <oui-field
+            label="{{:: 'netapp_volumes_snapshots_create_volume_description_label' | translate }}"
+        >
+            <input
+                class="oui-input"
+                name="volumeDescription"
+                type="text"
+                data-ng-model="$ctrl.description"
+                data-ng-pattern="$ctrl.PATTERN"
+                maxlength="255"
+            />
+        </oui-field>
+    </oui-modal>
+</form>

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/create-volume/translations/Messages_fr_FR.json

@@ -0,0 +1,10 @@
+{
+  "netapp_volumes_snapshots_create_volume_title": "Créer un volume",
+  "netapp_volumes_snapshots_create_volume_description": "Vous allez créer un volume à partir du snapshot {{ snapshot }}",
+  "netapp_volumes_snapshots_create_volume_name_label": "Nom du volume (optionnel)",
+  "netapp_volumes_snapshots_create_volume_description_label": "Description (optionnel)",
+  "netapp_volumes_snapshots_create_volume_confirm": "Confirmer",
+  "netapp_volumes_snapshots_create_volume_cancel": "Annuler",
+  "netapp_volumes_snapshots_create_volume_success": "Votre volume a été créé avec succès.",
+  "netapp_volumes_snapshots_create_volume_error": "Une erreur est survenue lors de la creation du volume. <br> {{ message }} <br> {{ requestId }}"
+}

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/module.js

@@ -15,6 +15,7 @@ import restoreModule from './restore';
 import editModule from './edit';
 import deleteModule from './delete';
 import service from './service';
+import createVolumeModule from './create-volume';
 
 const moduleName = 'ovhManagerNetAppVolumesDashboardSnapshots';
 
@@ -31,6 +32,7 @@ angular
     editModule,
     deleteModule,
     snapshotPolicies,
+    createVolumeModule,
   ])
   .config(routing)
   .component('ovhManagerNetAppVolumesDashboardSnapshots', component)

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/routing.js

@@ -37,7 +37,19 @@ export default /* @ngInject */ ($stateProvider) => {
           volumeId,
           snapshotId,
         }),
-
+      createVolumeFromSnapshot: /* @ngInject */ (
+        $state,
+        serviceName,
+        volumeId,
+      ) => (snapshotId) =>
+        $state.go(
+          'netapp.dashboard.volumes.dashboard.snapshots.create-volume',
+          {
+            serviceName,
+            volumeId,
+            snapshotId,
+          },
+        ),
       goToSnapshots: /* @ngInject */ (
         $state,
         Alerter,

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/template.html

@@ -93,6 +93,14 @@ <h2 data-translate="netapp_volumes_snapshots"></h2>
                         data-translate="netapp_volumes_snapshots_actions_edit"
                     ></span>
                 </oui-action-menu-item>
+                <oui-action-menu-item
+                    data-ng-if="$row.type !== $ctrl.SNAPSHOT_TYPE.AUTOMATIC"
+                    data-on-click="$ctrl.createVolumeFromSnapshot($row.id)"
+                >
+                    <span
+                        data-translate="netapp_volumes_snapshots_actions_create_volume"
+                    ></span>
+                </oui-action-menu-item>
                 <oui-action-menu-item
                     data-on-click="$ctrl.holdSnapshot($row.id)"
                     data-ng-if="$row.type === $ctrl.SNAPSHOT_TYPE.AUTOMATIC"

packages/manager/modules/netapp/src/dashboard/volumes/dashboard/snapshots/translations/Messages_fr_FR.json

@@ -6,6 +6,7 @@
   "netapp_volumes_snapshots_actions_create_label": "Snapshot: Créer un snapshot",
   "netapp_volumes_snapshots_actions_edit": "Éditer",
   "netapp_volumes_snapshots_actions_hold": "Sauvegarder",
+  "netapp_volumes_snapshots_actions_create_volume": "Créer un volume",
   "netapp_volumes_snapshots_actions_delete": "Supprimer",
   "netapp_volumes_snapshots_id": "ID",
   "netapp_volumes_snapshots_name": "Nom",