fix(xo-web/new-vm): list VIFs ordered by device (#6944)

Fixes zammad#15920

CHANGELOG.unreleased.md

@@ -11,6 +11,8 @@
 
 > Users must be able to say: “I had this issue, happy to know it's fixed”
 
+- [New VM] Order interfaces by device as done on a VM Network tab (PR [#6944](https://github.com/vatesfr/xen-orchestra/pull/6944))
+
 ### Packages to release
 
 > When modifying a package, add it here with its release type.
@@ -27,4 +29,6 @@
 
 <!--packages-start-->
 
+- xo-web patch
+
 <!--packages-end-->

packages/xo-web/src/xo-app/new-vm/index.js

@@ -549,9 +549,12 @@ export default class NewVm extends BaseComponent {
     forEach(template.VIFs, vifId => {
       const vif = getObject(storeState, vifId, resourceSet)
       VIFs.push({
+        device: vif.device,
         network: pool || isInResourceSet(vif.$network) ? vif.$network : defaultNetworkIds[0],
       })
     })
+    // sort the array so it corresponds to the order chosen by the user when creating the VM
+    VIFs.sort((a, b) => Number(a.device) - Number(b.device))
     if (VIFs.length === 0) {
       VIFs = defaultNetworkIds.map(id => ({ network: id }))
     }