feat(xo-web/home/vm): add "Create backup" bulk action (#4257)

Fixes #2573

CHANGELOG.unreleased.md

@@ -6,6 +6,7 @@
 - [Sr/new] Ability to select NFS version when creating NFS storage [#3951](https://github.com/vatesfr/xen-orchestra/issues/3951) (PR [#4277](https://github.com/vatesfr/xen-orchestra/pull/4277))
 - [auth-saml] Improve compatibility with Microsoft Azure Active Directory (PR [#4294](https://github.com/vatesfr/xen-orchestra/pull/4294))
 - [Host] Display warning when "Citrix Hypervisor" license has restrictions [#4251](https://github.com/vatesfr/xen-orchestra/issues/4164) (PR [#4235](https://github.com/vatesfr/xen-orchestra/pull/4279))
+- [VM/Backup] Create backup bulk action [#2573](https://github.com/vatesfr/xen-orchestra/issues/2573) (PR [#4257](https://github.com/vatesfr/xen-orchestra/pull/4257))
 
 ### Bug fixes
 

packages/xo-web/src/common/intl/messages.js

@@ -676,6 +676,7 @@ const messages = {
   cloneVmLabel: 'Clone',
   fastCloneVmLabel: 'Fast clone',
   vmConsoleLabel: 'Console',
+  backupLabel: 'Backup',
 
   // ----- SR advanced tab -----
 

packages/xo-web/src/common/store/actions.js

@@ -53,3 +53,7 @@ export const setXoaConfiguration = createAction(
   'XOA_CONFIGURATION',
   configuration => configuration
 )
+export const setHomeVmIdsSelection = createAction(
+  'SET_HOME_VM_IDS_SELECTION',
+  homeVmIdsSelection => homeVmIdsSelection
+)

packages/xo-web/src/common/store/reducer.js

@@ -86,6 +86,12 @@ export default {
     }
   ),
 
+  // These IDs are used temporarily to be preselected in backup-ng/new/vms
+  homeVmIdsSelection: combineActionHandlers([], {
+    [actions.setHomeVmIdsSelection]: (_, homeVmIdsSelection) =>
+      homeVmIdsSelection,
+  }),
+
   objects: combineActionHandlers(
     {
       all: {}, // Mutable for performance!

packages/xo-web/src/xo-app/backup-ng/new/index.js

@@ -120,28 +120,31 @@ const createDoesRetentionExist = name => {
   return ({ propSettings, settings = propSettings }) => settings.some(predicate)
 }
 
-const getInitialState = () => ({
-  _displayAdvancedSettings: undefined,
-  _vmsPattern: undefined,
-  backupMode: false,
-  compression: undefined,
-  crMode: false,
-  deltaMode: false,
-  drMode: false,
-  name: '',
-  paramsUpdated: false,
-  remotes: [],
-  schedules: {},
-  settings: undefined,
-  showErrors: false,
-  smartMode: false,
-  snapshotMode: false,
-  srs: [],
-  tags: {
-    notValues: ['Continuous Replication', 'Disaster Recovery', 'XOSAN'],
-  },
-  vms: [],
-})
+const getInitialState = ({ preSelectedVmIds, setHomeVmIdsSelection }) => {
+  setHomeVmIdsSelection([]) // Clear preselected vmIds
+  return {
+    _displayAdvancedSettings: undefined,
+    _vmsPattern: undefined,
+    backupMode: false,
+    compression: undefined,
+    crMode: false,
+    deltaMode: false,
+    drMode: false,
+    name: '',
+    paramsUpdated: false,
+    remotes: [],
+    schedules: {},
+    settings: undefined,
+    showErrors: false,
+    smartMode: false,
+    snapshotMode: false,
+    srs: [],
+    tags: {
+      notValues: ['Continuous Replication', 'Disaster Recovery', 'XOSAN'],
+    },
+    vms: preSelectedVmIds,
+  }
+}
 
 const DeleteOldBackupsFirst = ({ handler, handlerParam, value }) => (
   <ActionButton
@@ -169,6 +172,7 @@ export default decorate([
     hostsById: createGetObjectsOfType('host'),
     poolsById: createGetObjectsOfType('pool'),
     srsById: createGetObjectsOfType('SR'),
+    preSelectedVmIds: state => state.homeVmIdsSelection,
   })),
   injectIntl,
   provideState({

packages/xo-web/src/xo-app/home/index.js

@@ -178,6 +178,14 @@ const OPTIONS = {
         icon: 'vm-snapshot',
         labelId: 'snapshotVmLabel',
       },
+      {
+        handler: (vmIds, _, { setHomeVmIdsSelection }, { router }) => {
+          setHomeVmIdsSelection(vmIds)
+          router.push('backup-ng/new/vms')
+        },
+        icon: 'backup',
+        labelId: 'backupLabel',
+      },
       {
         handler: deleteVms,
         icon: 'vm-delete',
@@ -1010,7 +1018,9 @@ export default class Home extends Component {
                         onClick={() => {
                           action.handler(
                             this._getSelectedItemsIds(),
-                            action.params
+                            action.params,
+                            this.props,
+                            this.context
                           )
                         }}
                       >