[pbs-devel] [PATCH proxmox-backup v4 32/45] ui: add S3 client edit window for configuration create/edit

Christian Ebner c.ebner at proxmox.com
Mon Jun 23 11:40:53 CEST 2025


Adds an edit window for creating or editing S3 client configurations.
Loosely based on the same edit window for the remote configuration.

Signed-off-by: Christian Ebner <c.ebner at proxmox.com>
---
 www/window/S3ClientEdit.js | 148 +++++++++++++++++++++++++++++++++++++
 1 file changed, 148 insertions(+)
 create mode 100644 www/window/S3ClientEdit.js

diff --git a/www/window/S3ClientEdit.js b/www/window/S3ClientEdit.js
new file mode 100644
index 000000000..fbee4a8b5
--- /dev/null
+++ b/www/window/S3ClientEdit.js
@@ -0,0 +1,148 @@
+Ext.define('PBS.window.S3ClientEdit', {
+    extend: 'Proxmox.window.Edit',
+    alias: 'widget.pbsS3ClientEdit',
+    mixins: ['Proxmox.Mixin.CBind'],
+
+    onlineHelp: 'backup_s3client',
+
+    isAdd: true,
+
+    subject: gettext('S3 Client'),
+
+    fieldDefaults: { labelWidth: 120 },
+
+    cbindData: function (initialConfig) {
+        let me = this;
+
+        let baseurl = '/api2/extjs/config/s3';
+        let id = initialConfig.id;
+
+        me.isCreate = !id;
+        me.url = id ? `${baseurl}/${id}` : baseurl;
+        me.method = id ? 'PUT' : 'POST';
+        me.autoLoad = !!id;
+        return {
+            passwordEmptyText: me.isCreate ? '' : gettext('Unchanged'),
+        };
+    },
+
+    items: {
+        xtype: 'inputpanel',
+        column1: [
+            {
+                xtype: 'pmxDisplayEditField',
+                name: 'id',
+                fieldLabel: gettext('Unique Identifier'),
+                renderer: Ext.htmlEncode,
+                allowBlank: false,
+                minLength: 4,
+                cbind: {
+                    editable: '{isCreate}',
+                },
+            },
+            {
+                xtype: 'proxmoxtextfield',
+                name: 'endpoint',
+                fieldLabel: gettext('Endpoint'),
+                allowBlank: false,
+                emptyText: gettext('e.g. {{bucket}}.s3.{{region}}.amazonaws.com'),
+                autoEl: {
+                    tag: 'div',
+                    'data-qtip': gettext(
+                        'IP or FQDN S3 endpoint (allows {{bucket}} or {{region}} templating)',
+                    ),
+                },
+            },
+            {
+                xtype: 'proxmoxtextfield',
+                name: 'port',
+                fieldLabel: gettext('Port'),
+                emptyText: gettext('default (443)'),
+                cbind: {
+                    deleteEmpty: '{!isCreate}',
+                },
+            },
+            {
+                xtype: 'proxmoxcheckbox',
+                name: 'path-style',
+                fieldLabel: gettext('Path Style'),
+                autoEl: {
+                    tag: 'div',
+                    'data-qtip': gettext('Use path style over vhost style bucket addressing.'),
+                },
+                uncheckedValue: false,
+                value: false,
+            },
+        ],
+
+        column2: [
+            {
+                xtype: 'proxmoxtextfield',
+                name: 'region',
+                fieldLabel: gettext('Region'),
+                emptyText: gettext('default (us-west-1)'),
+                cbind: {
+                    deleteEmpty: '{!isCreate}',
+                },
+            },
+            {
+                xtype: 'proxmoxtextfield',
+                name: 'access-key',
+                fieldLabel: gettext('Access Key'),
+                cbind: {
+                    emptyText: '{passwordEmptyText}',
+                    allowBlank: '{!isCreate}',
+                },
+            },
+            {
+                xtype: 'textfield',
+                name: 'secret-key',
+                inputType: 'password',
+                fieldLabel: gettext('Secret Key'),
+                cbind: {
+                    emptyText: '{passwordEmptyText}',
+                    allowBlank: '{!isCreate}',
+                },
+            },
+        ],
+
+        columnB: [
+            {
+                xtype: 'proxmoxtextfield',
+                name: 'fingerprint',
+                fieldLabel: gettext('Fingerprint'),
+                emptyText: gettext(
+                    "Server certificate's SHA-256 fingerprint, required for self-signed certificates",
+                ),
+                cbind: {
+                    deleteEmpty: '{!isCreate}',
+                },
+            },
+        ],
+    },
+
+    getValues: function () {
+        let me = this;
+        let values = me.callParent(arguments);
+
+        if (me.isCreate) {
+            /// Secrets are stored into separate config, but set the same id for both configs
+            values['secrets-id'] = values.id;
+        }
+
+        if (values.delete && !Ext.isArray(values.delete)) {
+            values.delete = values.delete.split(',');
+        }
+        PBS.Utils.delete_if_default(values, 'path-style', false, me.isCreate);
+
+        if (values['access-key'] === '') {
+            delete values['access-key'];
+        }
+
+        if (values['secret-key'] === '') {
+            delete values['secret-key'];
+        }
+
+        return values;
+    },
+});
-- 
2.47.2





More information about the pbs-devel mailing list