SPAM: [RFC PATCH pve-manager] lxc: add OCI rootfs replacement window

[copystring <copystring@gmail.com>]

Add a guarded UI flow for replacing a stopped container rootfs from an OCI image archive. The action requires VM.Config.Disk, keeps the submit button disabled until the current config digest is loaded and the user confirms the rootfs replacement, and calls the new backend endpoint.

Signed-off-by: copystring <copystring@gmail.com>
---
 www/manager6/Makefile                |   1 +
 www/manager6/lxc/CmdMenu.js          |  14 +++
 www/manager6/lxc/Config.js           |  22 ++++
 www/manager6/lxc/RootfsOciReplace.js | 149 +++++++++++++++++++++++++++
 4 files changed, 186 insertions(+)
 create mode 100644 www/manager6/lxc/RootfsOciReplace.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index d4dd3f35..4f7206b9 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -207,6 +207,7 @@ JSSRC= 							\
 	dc/PCIMapView.js				\
 	dc/USBMapView.js				\
 	dc/DirMapView.js				\
+	lxc/RootfsOciReplace.js				\
 	lxc/CmdMenu.js					\
 	lxc/Config.js					\
 	lxc/CreateWizard.js				\
diff --git a/www/manager6/lxc/CmdMenu.js b/www/manager6/lxc/CmdMenu.js
index a7940e04..93bea07f 100644
--- a/www/manager6/lxc/CmdMenu.js
+++ b/www/manager6/lxc/CmdMenu.js
@@ -134,6 +134,20 @@ Ext.define('PVE.lxc.CmdMenu', {
                 },
             },
             { xtype: 'menuseparator' },
+            {
+                text: gettext('Replace Rootfs from OCI'),
+                iconCls: 'fa fa-fw fa-refresh',
+                hidden: !caps.vms['VM.Config.Disk'],
+                disabled: me.isTemplate || !stopped,
+                handler: () => {
+                    Ext.create('PVE.lxc.RootfsOciReplace', {
+                        nodename: info.node,
+                        vmid: info.vmid,
+                        canUpdateOptions: caps.vms['VM.Config.Options'],
+                        autoShow: true,
+                    });
+                },
+            },
             {
                 text: gettext('Take Snapshot'),
                 iconCls: 'fa fa-fw fa-history',
diff --git a/www/manager6/lxc/Config.js b/www/manager6/lxc/Config.js
index 3a99d6a7..9058a287 100644
--- a/www/manager6/lxc/Config.js
+++ b/www/manager6/lxc/Config.js
@@ -147,6 +147,22 @@ Ext.define('PVE.lxc.Config', {
                             });
                         },
                     },
+                    {
+                        text: gettext('Replace Rootfs from OCI'),
+                        itemId: 'replaceRootfsFromOciBtn',
+                        iconCls: 'fa fa-fw fa-refresh',
+                        hidden: !caps.vms['VM.Config.Disk'],
+                        disabled: template || running,
+                        handler: function () {
+                            Ext.create('PVE.lxc.RootfsOciReplace', {
+                                nodename: nodename,
+                                vmid: vmid,
+                                canUpdateOptions: caps.vms['VM.Config.Options'],
+                                reload: () => me.statusStore.load(),
+                                autoShow: true,
+                            });
+                        },
+                    },
                     {
                         iconCls: 'fa fa-heartbeat ',
                         hidden: !caps.nodes['Sys.Console'],
@@ -424,6 +440,12 @@ Ext.define('PVE.lxc.Config', {
             startBtn.setDisabled(!caps.vms['VM.PowerMgmt'] || status === 'running' || template);
             shutdownBtn.setDisabled(!caps.vms['VM.PowerMgmt'] || status !== 'running');
             me.down('#removeBtn').setDisabled(!caps.vms['VM.Allocate'] || status !== 'stopped');
+            let replaceRootfsBtn = me.down('#replaceRootfsFromOciBtn');
+            if (replaceRootfsBtn) {
+                replaceRootfsBtn.setDisabled(
+                    !caps.vms['VM.Config.Disk'] || template || status !== 'stopped',
+                );
+            }
             consoleBtn.setDisabled(template);
 
             if (prevStatus === 'stopped' && status === 'running') {
diff --git a/www/manager6/lxc/RootfsOciReplace.js b/www/manager6/lxc/RootfsOciReplace.js
new file mode 100644
index 00000000..2b6ffe78
--- /dev/null
+++ b/www/manager6/lxc/RootfsOciReplace.js
@@ -0,0 +1,149 @@
+Ext.define('PVE.lxc.RootfsOciReplace', {
+    extend: 'Proxmox.window.Edit',
+    alias: 'widget.pveLxcRootfsOciReplace',
+
+    title: gettext('Replace Rootfs from OCI Image'),
+    isCreate: true,
+    method: 'POST',
+    submitText: gettext('Replace Rootfs'),
+    showTaskViewer: true,
+    autoLoad: true,
+    width: 760,
+    fieldDefaults: {
+        labelWidth: 130,
+    },
+
+    initComponent: function () {
+        let me = this;
+
+        if (!me.nodename) {
+            throw 'no node name specified';
+        }
+        if (!me.vmid) {
+            throw 'no VM ID specified';
+        }
+
+        me.url = '/nodes/' + me.nodename + '/lxc/' + me.vmid + '/replace_rootfs_from_oci';
+        me.loadUrl = '/nodes/' + me.nodename + '/lxc/' + me.vmid + '/config';
+
+        let canUpdateOptions = !!me.canUpdateOptions;
+        let warningHtml = [
+            `<b>${Ext.String.htmlEncode(gettext('Rootfs replacement is destructive.'))}</b>`,
+            Ext.String.htmlEncode(gettext('The current rootfs / will be replaced by the OCI image.')),
+            Ext.String.htmlEncode(gettext('Separate mount points such as mp0, mp1, ... are preserved.')),
+            Ext.String.htmlEncode(
+                gettext(
+                    'Data stored only on / will not be part of the new active rootfs. The old rootfs is kept as an unused volume.',
+                ),
+            ),
+        ].join('<br>');
+
+        let templateStorageSelector = Ext.create('PVE.form.StorageSelector', {
+            name: 'tmplstorage',
+            fieldLabel: gettext('Image Storage'),
+            nodename: me.nodename,
+            storageContent: 'vztmpl',
+            autoSelect: true,
+            allowBlank: false,
+            submitValue: false,
+        });
+
+        let templateSelector = Ext.create('PVE.form.FileSelector', {
+            name: 'ostemplate',
+            fieldLabel: gettext('OCI Image'),
+            nodename: me.nodename,
+            storageContent: 'vztmpl',
+            allowBlank: false,
+        });
+
+        templateStorageSelector.on('change', function (_field, storage) {
+            templateSelector.setStorage(storage, me.nodename);
+        });
+
+        me.items = [
+            {
+                xtype: 'inputpanel',
+                border: false,
+                onGetValues: function (values) {
+                    delete values.tmplstorage;
+                    delete values.confirmRootfsReplace;
+
+                    values['confirm-rootfs-replace'] = 1;
+                    values['update-oci-config'] = values['update-oci-config'] ? 1 : 0;
+
+                    if (!values.storage) {
+                        delete values.storage;
+                    }
+                    if (!values.size) {
+                        delete values.size;
+                    }
+
+                    return values;
+                },
+                columnT: [
+                    {
+                        xtype: 'displayfield',
+                        fieldLabel: gettext('Warning'),
+                        userCls: 'pmx-hint',
+                        value: warningHtml,
+                    },
+                    templateStorageSelector,
+                    templateSelector,
+                ],
+                column1: [
+                    {
+                        xtype: 'pveStorageSelector',
+                        name: 'storage',
+                        fieldLabel: gettext('Target Storage'),
+                        nodename: me.nodename,
+                        storageContent: 'rootdir',
+                        allowBlank: true,
+                        autoSelect: false,
+                        emptyText: gettext('Current rootfs storage'),
+                    },
+                    {
+                        xtype: 'proxmoxtextfield',
+                        name: 'size',
+                        fieldLabel: gettext('Root Disk Size'),
+                        allowBlank: true,
+                        emptyText: gettext('Current size'),
+                        regex: /^\d+(\.\d+)?[KMGT]?$/,
+                        regexText: gettext('Invalid size'),
+                    },
+                ],
+                column2: [
+                    {
+                        xtype: 'proxmoxcheckbox',
+                        name: 'update-oci-config',
+                        fieldLabel: gettext('Update OCI config'),
+                        checked: canUpdateOptions,
+                        disabled: !canUpdateOptions,
+                        uncheckedValue: 0,
+                    },
+                    {
+                        xtype: 'proxmoxcheckbox',
+                        name: 'confirmRootfsReplace',
+                        fieldLabel: gettext('Confirmation'),
+                        boxLabel: gettext(
+                            'I understand that the current rootfs will be replaced and that data stored only on / will no longer be active.',
+                        ),
+                        submitValue: false,
+                        uncheckedValue: 0,
+                        getErrors: function () {
+                            return this.getValue() ? [] : [gettext('Confirmation required')];
+                        },
+                        listeners: {
+                            change: function (field) {
+                                field.validate();
+                            },
+                        },
+                    },
+                ],
+            },
+        ];
+
+        me.callParent();
+
+        me.on('destroy', () => Ext.isFunction(me.reload) && me.reload());
+    },
+});
-- 
2.55.0.windows.2