feat(xo-web/vm/attach disk): warning if VDI is on another local SR (#4117)

See #3911

Show a warning message if the VM has a VDI sitting on a local SR and the user
select a VDI sitting on a local SR on a different host since the VM won't be
able to start

CHANGELOG.unreleased.md

@@ -6,6 +6,7 @@
 - [Home] No more false positives when select Tag on Home page [#4087](https://github.com/vatesfr/xen-orchestra/issues/4087) (PR [#4112](https://github.com/vatesfr/xen-orchestra/pull/4112))
 - [VDI migration, New disk] Warning when SR host is different from the other disks [#3911](https://github.com/vatesfr/xen-orchestra/issues/3911) (PR [#4035](https://github.com/vatesfr/xen-orchestra/pull/4035))
 - [Backup reports] Support metadata backups (PR [#4084](https://github.com/vatesfr/xen-orchestra/pull/4084))
+- [Attach disk] Display warning message when VDI SR is on different host from the other disks [#3911](https://github.com/vatesfr/xen-orchestra/issues/3911) (PR [#4117](https://github.com/vatesfr/xen-orchestra/pull/4117))
 
 ### Bug fixes
 

packages/xo-web/src/xo-app/vm/tab-disks.js

@@ -406,8 +406,12 @@ class NewDisk extends Component {
   }
 }
 
+@connectStore({
+  srs: createGetObjectsOfType('SR'),
+})
 class AttachDisk extends Component {
   static propTypes = {
+    checkSr: PropTypes.func.isRequired,
     onClose: PropTypes.func,
     vbds: PropTypes.array.isRequired,
     vm: PropTypes.object.isRequired,
@@ -432,6 +436,13 @@ class AttachDisk extends Component {
 
   _selectVdi = vdi => this.setState({ vdi })
 
+  _checkSr = createSelector(
+    () => this.props.checkSr,
+    () => this.props.srs,
+    () => this.state.vdi,
+    (check, srs, vdi) => check(srs[vdi.$SR])
+  )
+
   _addVdi = () => {
     const { vm, vbds, onClose = noop } = this.props
     const { bootable, readOnly, vdi } = this.state
@@ -483,6 +494,13 @@ class AttachDisk extends Component {
                 {_('vbdAttach')}
               </ActionButton>
             </span>
+            {!this._checkSr() && (
+              <div>
+                <span className='text-danger'>
+                  <Icon icon='alarm' /> {_('warningVdiSr')}
+                </span>
+              </div>
+            )}
           </fieldset>
         )}
       </form>
@@ -896,6 +914,7 @@ export default class TabDisks extends Component {
             {attachDisk && (
               <div>
                 <AttachDisk
+                  checkSr={this._getCheckSr()}
                   vm={vm}
                   vbds={vbds}
                   onClose={this._toggleAttachDisk}