[pmg-devel] [PATCH gui] add certificates and acme view

[Dominik Csapak]

comments inline

On 3/9/21 3:13 PM, Wolfgang Bumiller wrote:
> Signed-off-by: Wolfgang Bumiller <w.bumiller at proxmox.com>
> ---
>   js/Certificates.js   | 108 +++++++++++++++++++++++++++++++++++++++++++
>   js/Makefile          |   1 +
>   js/NavigationTree.js |   6 +++
>   3 files changed, 115 insertions(+)
>   create mode 100644 js/Certificates.js
> 
> diff --git a/js/Certificates.js b/js/Certificates.js
> new file mode 100644
> index 0000000..33b1bde
> --- /dev/null
> +++ b/js/Certificates.js
> @@ -0,0 +1,108 @@
> +Ext.define('PMG.CertificateConfiguration', {
> +    extend: 'Ext.tab.Panel',
> +    alias: 'widget.pmgCertificateConfiguration',
> +
> +    title: gettext('Certificates'),
> +
> +    border: false,
> +    defaults: { border: false },
> +
> +    items: [
> +	{
> +	    itemId: 'certificates',
> +	    xtype: 'pmgCertificatesView',
> +	    border: 0,
> +	},
> +	{
> +	    itemId: 'acme',
> +	    xtype: 'pmgACMEConfigView',
> +	    border: 0,
> +	},
> +    ],
> +});

why the defaults: border: false and the border: 0?
one should be enough

> +
> +Ext.define('PMG.CertificateView', {
> +    extend: 'Ext.container.Container',
> +    alias: 'widget.pmgCertificatesView',
> +
> +    title: gettext('Certificates'),
> +
> +    //onlineHelp: 'sysadmin_certificate_management',

seems to be leftover (we should probably have the docs here too?)

> +
> +    initComponent: function() {
> +	let me = this;
> +
> +	Ext.apply(me, {
> +	    items: [
> +		{
> +		    xtype: 'pmxCertificates',
> +		    border: 0,
> +		    infoUrl: '/nodes/' + Proxmox.NodeName + '/certificates/info',
> +		    uploadButtons: [
> +			{
> +			    name: 'API',
> +			    id: 'pmg-api.pem',
> +			    url: `/nodes/${Proxmox.NodeName}/certificates/custom/api`,
> +			    deletable: false,
> +			    reloadUi: true,
> +			},
> +			{
> +			    name: 'SMTP',
> +			    id: 'pmg-tls.pem',
> +			    url: `/nodes/${Proxmox.NodeName}/certificates/custom/smtp`,
> +			    deletable: true,
> +			},
> +		    ],
> +		},
> +		{
> +		    xtype: 'pmxACMEDomains',
> +		    border: 0,
> +		    url: `/nodes/${Proxmox.NodeName}/config`,
> +		    nodename: Proxmox.NodeName,
> +		    acmeUrl: '/config/acme',
> +		    domainUsages: [
> +			{
> +			    usage: 'api',
> +			    name: 'API',
> +			    url: `/nodes/${Proxmox.NodeName}/certificates/acme/api`,
> +			    reloadUi: true,
> +			},
> +			{
> +			    usage: 'smtp',
> +			    name: 'SMTP',
> +			    url: `/nodes/${Proxmox.NodeName}/certificates/acme/smtp`,
> +			},
> +		    ],
> +		},
> +	    ],
> +	});
> +
> +	me.callParent();
> +    },
> +});

this could be written without initComponent, nothing there depends on a
local variable (Proxmox.NodeName is set by the page and always available)

> +
> +Ext.define('PMG.ACMEConfigView', {
> +    extend: 'Ext.panel.Panel',
> +    alias: 'widget.pmgACMEConfigView',
> +
> +    title: gettext('ACME Accounts'),
> +
> +    //onlineHelp: 'sysadmin_certificate_management',
> +
> +    items: [
> +	{
> +	    region: 'north',
> +	    border: false,
> +	    xtype: 'pmxACMEAccounts',
> +	    acmeUrl: '/config/acme',
> +	},
> +	{
> +	    region: 'center',
> +	    border: false,
> +	    xtype: 'pmxACMEPluginView',
> +	    acmeUrl: '/config/acme',
> +	},
> +    ],
> +});
> +
> +
> diff --git a/js/Makefile b/js/Makefile
> index a5266fc..43d3ad8 100644
> --- a/js/Makefile
> +++ b/js/Makefile
> @@ -91,6 +91,7 @@ JSSRC=							\
>   	ContactStatistics.js				\
>   	HourlyMailDistribution.js			\
>   	SpamContextMenu.js				\
> +	Certificates.js					\
>   	Application.js
>   
>   OnlineHelpInfo.js: /usr/bin/asciidoc-pmg
> diff --git a/js/NavigationTree.js b/js/NavigationTree.js
> index ac01fd6..63f8e94 100644
> --- a/js/NavigationTree.js
> +++ b/js/NavigationTree.js
> @@ -92,6 +92,12 @@ Ext.define('PMG.store.NavigationStore', {
>   			path: 'pmgBackupConfiguration',
>   			leaf: true,
>   		    },
> +		    {
> +			text: gettext('Certificates'),
> +			iconCls: 'fa fa-certificate',
> +			path: 'pmgCertificateConfiguration',
> +			leaf: true,
> +		    },
>   		],
>   	    },
>   	    {
>