feat(xo-web/backup-ng/new): ability to edit a schedule's name (#3143)

See #2711
Fixes #3071

CHANGELOG.md

@@ -7,6 +7,7 @@
 - Export VDI content [#2432](https://github.com/vatesfr/xen-orchestra/issues/2432) (PR [#3194](https://github.com/vatesfr/xen-orchestra/pull/3194))
 - Search syntax support wildcard (`*`) and regular expressions [#3190](https://github.com/vatesfr/xen-orchestra/issues/3190) (PRs [#3198](https://github.com/vatesfr/xen-orchestra/pull/3198) & [#3199](https://github.com/vatesfr/xen-orchestra/pull/3199))
 - Import VDI content [#2432](https://github.com/vatesfr/xen-orchestra/issues/2432) (PR [#3216](https://github.com/vatesfr/xen-orchestra/pull/3216))
+- [Backup NG form] Ability to edit a schedule's name [#2711](https://github.com/vatesfr/xen-orchestra/issues/2711) [#3071](https://github.com/vatesfr/xen-orchestra/issues/3071) (PR [#3143](https://github.com/vatesfr/xen-orchestra/pull/3143))
 
 ### Bug fixes
 

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

@@ -227,11 +227,13 @@ export default [
 
             if (
               newSchedule.cron !== oldSchedule.cron ||
+              newSchedule.name !== oldSchedule.name ||
               newSchedule.timezone !== oldSchedule.timezone
             ) {
               return editSchedule({
                 id,
                 cron: newSchedule.cron,
+                name: newSchedule.name,
                 timezone: newSchedule.timezone,
               })
             }
@@ -245,6 +247,7 @@ export default [
             if (props.schedules[tmpId] === undefined) {
               const { id } = await createSchedule(props.job.id, {
                 cron: schedule.cron,
+                name: schedule.name,
                 timezone: schedule.timezone,
               })
 
@@ -408,8 +411,16 @@ export default [
       },
       saveSchedule: (
         _,
-        { cron, timezone, exportRetention, copyRetention, snapshotRetention }
+        {
+          copyRetention,
+          cron,
+          exportRetention,
+          name,
+          snapshotRetention,
+          timezone,
+        }
       ) => async (state, props) => {
+        name = name !== undefined && name.trim() === '' ? undefined : name
         if (state.editionMode === 'creation') {
           const id = generateRandomId()
           return {
@@ -418,8 +429,9 @@ export default [
             schedules: {
               ...state.schedules,
               [id]: {
-                id,
                 cron,
+                id,
+                name,
                 timezone,
               },
             },
@@ -441,6 +453,7 @@ export default [
         schedules[id] = {
           ...schedules[id],
           cron,
+          name,
           timezone,
         }
         settings[id] = {

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

@@ -1,5 +1,6 @@
 import _ from 'intl'
 import ActionButton from 'action-button'
+import defined from 'xo-defined'
 import moment from 'moment-timezone'
 import React from 'react'
 import Scheduler, { SchedulePreview } from 'scheduling'
@@ -9,7 +10,7 @@ import { injectState, provideState } from '@julien-f/freactal'
 import { isEqual } from 'lodash'
 import { Number } from 'form'
 
-import { FormFeedback, FormGroup } from './utils'
+import { FormFeedback, FormGroup, Input } from './utils'
 
 export default [
   injectState,
@@ -26,10 +27,12 @@ export default [
         timezone = moment.tz.guess(),
       },
     }) => ({
+      copyRetention,
       cron,
       exportRetention,
-      copyRetention,
       formId: generateRandomId(),
+      idInputName: generateRandomId(),
+      name: undefined,
       snapshotRetention,
       timezone,
     }),
@@ -51,6 +54,9 @@ export default [
         cron: cronPattern,
         timezone,
       }),
+      setName: (_, { target: { value } }) => () => ({
+        name: value,
+      }),
     },
     computed: {
       isScheduleInvalid: ({ retentionNeeded, scheduleNotEdited }) =>
@@ -70,10 +76,11 @@ export default [
         ),
       scheduleNotEdited: (
         {
+          copyRetention,
           cron,
           editionMode,
           exportRetention,
-          copyRetention,
+          name,
           snapshotRetention,
           timezone,
         },
@@ -82,16 +89,18 @@ export default [
         editionMode !== 'creation' &&
         isEqual(
           {
+            copyRetention: schedule.copyRetention,
             cron: schedule.cron,
             exportRetention: schedule.exportRetention,
-            copyRetention: schedule.copyRetention,
+            name: schedule.name,
             snapshotRetention: schedule.snapshotRetention,
             timezone: schedule.timezone,
           },
           {
+            copyRetention,
             cron,
             exportRetention,
-            copyRetention,
+            name,
             snapshotRetention,
             timezone,
           }
@@ -107,6 +116,16 @@ export default [
         message={_('retentionNeeded')}
       >
         <CardBlock>
+          <FormGroup>
+            <label htmlFor={state.idInputName}>
+              <strong>{_('formName')}</strong>
+            </label>
+            <Input
+              id={state.idInputName}
+              onChange={effects.setName}
+              value={defined(state.name, state.tmpSchedule.name, '')}
+            />
+          </FormGroup>
           {state.exportMode && (
             <FormGroup>
               <label>
@@ -152,9 +171,10 @@ export default [
           <br />
           <ActionButton
             btnStyle='primary'
+            data-copyRetention={state.copyRetention}
             data-cron={state.cron}
             data-exportRetention={state.exportRetention}
-            data-copyRetention={state.copyRetention}
+            data-name={state.name}
             data-snapshotRetention={state.snapshotRetention}
             data-timezone={state.timezone}
             disabled={state.isScheduleInvalid}