ui: datastore content: show root node for better UX with NS

that way it's easier to see on which NS one currently operates and
allows better distinguishing of root NS and some sub ns named "Root"

Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
This commit is contained in:
Thomas Lamprecht 2022-05-10 15:15:29 +02:00
parent 6f5753cfa3
commit e8112eb37b
1 changed files with 26 additions and 15 deletions

View File

@ -50,7 +50,7 @@ Ext.define('PBS.DataStoreContent', {
alias: 'widget.pbsDataStoreContent', alias: 'widget.pbsDataStoreContent',
mixins: ['Proxmox.Mixin.CBind'], mixins: ['Proxmox.Mixin.CBind'],
rootVisible: false, rootVisible: true,
title: gettext('Content'), title: gettext('Content'),
@ -272,8 +272,16 @@ Ext.define('PBS.DataStoreContent', {
children.push(group); children.push(group);
} }
let isRootNS = !view.namespace || view.namespace === '';
let rootText = isRootNS
? gettext('Root Namespace')
: Ext.String.format(gettext("Namespace '{0}'"), view.namespace);
view.setRootNode({ view.setRootNode({
text: rootText,
iconCls: "fa fa-" + (isRootNS ? 'database' : 'object-group'),
expanded: true, expanded: true,
expandable: false,
children: children, children: children,
}); });
@ -768,7 +776,7 @@ Ext.define('PBS.DataStoreContent', {
flex: 1, flex: 1,
renderer: (v, meta, record) => { renderer: (v, meta, record) => {
let data = record.data; let data = record.data;
if (!data || data.leaf) { if (!data || data.leaf || data.root) {
return ''; return '';
} }
if (v === undefined || v === null) { if (v === undefined || v === null) {
@ -791,17 +799,17 @@ Ext.define('PBS.DataStoreContent', {
} }
let view = tree.up(); let view = tree.up();
let controller = view.controller; let controller = view.controller;
controller.onNotesEdit(view, rec.data, rec.parentNode.id === 'root'); controller.onNotesEdit(view, rec.data, rec.parentNode?.id === 'root');
}); });
}, },
dblclick: function(tree, el, row, col, ev, rec) { dblclick: function(tree, el, row, col, ev, rec) {
let data = rec.data || {}; let data = rec.data || {};
if (data.leaf) { if (data.leaf || data.root) {
return; return;
} }
let view = tree.up(); let view = tree.up();
let controller = view.controller; let controller = view.controller;
controller.onNotesEdit(view, rec.data, rec.parentNode.id === 'root'); controller.onNotesEdit(view, rec.data, rec.parentNode?.id === 'root');
}, },
}, },
}, },
@ -814,39 +822,39 @@ Ext.define('PBS.DataStoreContent', {
{ {
handler: 'onVerify', handler: 'onVerify',
getTip: (v, m, rec) => Ext.String.format(gettext("Verify '{0}'"), v), getTip: (v, m, rec) => Ext.String.format(gettext("Verify '{0}'"), v),
getClass: (v, m, rec) => rec.data.leaf ? 'pmx-hidden' : 'pve-icon-verify-lettering', getClass: (v, m, rec) => rec.data.root || rec.data.leaf ? 'pmx-hidden' : 'pve-icon-verify-lettering',
isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf, isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf,
}, },
{ {
handler: 'onChangeOwner', handler: 'onChangeOwner',
getClass: (v, m, rec) => rec.parentNode.id ==='root' ? 'fa fa-user' : 'pmx-hidden', getClass: (v, m, rec) => rec.parentNode && rec.parentNode.id ==='root' ? 'fa fa-user' : 'pmx-hidden',
getTip: (v, m, rec) => Ext.String.format(gettext("Change owner of '{0}'"), v), getTip: (v, m, rec) => Ext.String.format(gettext("Change owner of '{0}'"), v),
isActionDisabled: (v, r, c, i, rec) => rec.parentNode.id !=='root', isActionDisabled: (v, r, c, i, rec) => !rec.parentNode || rec.parentNode.id !=='root',
}, },
{ {
handler: 'onPrune', handler: 'onPrune',
getTip: (v, m, rec) => Ext.String.format(gettext("Prune '{0}'"), v), getTip: (v, m, rec) => Ext.String.format(gettext("Prune '{0}'"), v),
getClass: (v, m, rec) => rec.parentNode.id ==='root' ? 'fa fa-scissors' : 'pmx-hidden', getClass: (v, m, rec) => rec.parentNode && rec.parentNode.id ==='root' ? 'fa fa-scissors' : 'pmx-hidden',
isActionDisabled: (v, r, c, i, rec) => rec.parentNode.id !=='root', isActionDisabled: (v, r, c, i, rec) => rec.parentNode?.id !=='root',
}, },
{ {
handler: 'onProtectionChange', handler: 'onProtectionChange',
getTip: (v, m, rec) => Ext.String.format(gettext("Change protection of '{0}'"), v), getTip: (v, m, rec) => Ext.String.format(gettext("Change protection of '{0}'"), v),
getClass: (v, m, rec) => { getClass: (v, m, rec) => {
if (!rec.data.leaf && rec.parentNode.id !== 'root') { if (!rec.data.leaf && rec.parentNode && rec.parentNode.id !== 'root') {
let extraCls = rec.data.protected ? 'good' : 'faded'; let extraCls = rec.data.protected ? 'good' : 'faded';
return `fa fa-shield ${extraCls}`; return `fa fa-shield ${extraCls}`;
} }
return 'pmx-hidden'; return 'pmx-hidden';
}, },
isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf || rec.parentNode.id === 'root', isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf || !rec.parentNode || rec.parentNode.id === 'root',
}, },
{ {
handler: 'onForget', handler: 'onForget',
getTip: (v, m, rec) => rec.parentNode.id !=='root' getTip: (v, m, rec) => rec.parentNode?.id !=='root'
? Ext.String.format(gettext("Permanently forget snapshot '{0}'"), v) ? Ext.String.format(gettext("Permanently forget snapshot '{0}'"), v)
: Ext.String.format(gettext("Permanently forget group '{0}'"), v), : Ext.String.format(gettext("Permanently forget group '{0}'"), v),
getClass: (v, m, rec) => !rec.data.leaf ? 'fa critical fa-trash-o' : 'pmx-hidden', getClass: (v, m, rec) => !(rec.data.leaf || rec.data.root) ? 'fa critical fa-trash-o' : 'pmx-hidden',
isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf, isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf,
}, },
{ {
@ -888,7 +896,7 @@ Ext.define('PBS.DataStoreContent', {
sortable: true, sortable: true,
dataIndex: 'size', dataIndex: 'size',
renderer: (v, meta, record) => { renderer: (v, meta, record) => {
if (record.data.text === 'client.log.blob' && v === undefined) { if ((record.data.text === 'client.log.blob' && v === undefined) || record.data.root) {
return ''; return '';
} }
if (v === undefined || v === null) { if (v === undefined || v === null) {
@ -962,6 +970,9 @@ Ext.define('PBS.DataStoreContent', {
} }
}, },
renderer: (v, meta, record) => { renderer: (v, meta, record) => {
if (!record.parentNode) {
return ''; // TODO: accumulate verify of all groups into root NS node?
}
let i = (cls, txt) => `<i class="fa fa-fw fa-${cls}"></i> ${txt}`; let i = (cls, txt) => `<i class="fa fa-fw fa-${cls}"></i> ${txt}`;
if (v === undefined || v === null) { if (v === undefined || v === null) {
return record.data.leaf ? '' : i('question-circle-o warning', gettext('None')); return record.data.leaf ? '' : i('question-circle-o warning', gettext('None'));