]> git.proxmox.com Git - proxmox-widget-toolkit.git/blob - src/node/APTRepositories.js
language selector: increase only picker list view
[proxmox-widget-toolkit.git] / src / node / APTRepositories.js
1 Ext.define('apt-repolist', {
2 extend: 'Ext.data.Model',
3 fields: [
4 'Path',
5 'Index',
6 'Origin',
7 'FileType',
8 'Enabled',
9 'Comment',
10 'Types',
11 'URIs',
12 'Suites',
13 'Components',
14 'Options',
15 ],
16 });
17
18 Ext.define('Proxmox.window.APTRepositoryAdd', {
19 extend: 'Proxmox.window.Edit',
20 alias: 'widget.pmxAPTRepositoryAdd',
21
22 isCreate: true,
23 isAdd: true,
24
25 subject: gettext('Repository'),
26 width: 600,
27
28 initComponent: function() {
29 let me = this;
30
31 if (!me.repoInfo || me.repoInfo.length === 0) {
32 throw "repository information not initialized";
33 }
34
35 let description = Ext.create('Ext.form.field.Display', {
36 fieldLabel: gettext('Description'),
37 name: 'description',
38 });
39
40 let status = Ext.create('Ext.form.field.Display', {
41 fieldLabel: gettext('Status'),
42 name: 'status',
43 renderer: function(value) {
44 let statusText = gettext('Not yet configured');
45 if (value !== '') {
46 statusText = Ext.String.format(
47 '{0}: {1}',
48 gettext('Configured'),
49 value ? gettext('enabled') : gettext('disabled'),
50 );
51 }
52
53 return statusText;
54 },
55 });
56
57 let repoSelector = Ext.create('Proxmox.form.KVComboBox', {
58 fieldLabel: gettext('Repository'),
59 xtype: 'proxmoxKVComboBox',
60 name: 'handle',
61 allowBlank: false,
62 comboItems: me.repoInfo.map(info => [info.handle, info.name]),
63 validator: function(renderedValue) {
64 let handle = this.value;
65 // we cannot use this.callParent in instantiations
66 let valid = Proxmox.form.KVComboBox.prototype.validator.call(this, renderedValue);
67
68 if (!valid || !handle) {
69 return false;
70 }
71
72 const info = me.repoInfo.find(elem => elem.handle === handle);
73 if (!info) {
74 return false;
75 }
76
77 if (info.status) {
78 return Ext.String.format(gettext('{0} is already configured'), renderedValue);
79 }
80 return valid;
81 },
82 listeners: {
83 change: function(f, value) {
84 const info = me.repoInfo.find(elem => elem.handle === value);
85 description.setValue(info.description);
86 status.setValue(info.status);
87 },
88 },
89 });
90
91 repoSelector.setValue(me.repoInfo[0].handle);
92
93 Ext.apply(me, {
94 items: [
95 repoSelector,
96 description,
97 status,
98 ],
99 repoSelector: repoSelector,
100 });
101
102 me.callParent();
103 },
104 });
105
106 Ext.define('Proxmox.node.APTRepositoriesErrors', {
107 extend: 'Ext.grid.GridPanel',
108
109 xtype: 'proxmoxNodeAPTRepositoriesErrors',
110
111 store: {},
112
113 scrollable: true,
114
115 viewConfig: {
116 stripeRows: false,
117 getRowClass: (record) => {
118 switch (record.data.status) {
119 case 'warning': return 'proxmox-warning-row';
120 case 'critical': return 'proxmox-invalid-row';
121 default: return '';
122 }
123 },
124 },
125
126 hideHeaders: true,
127
128 columns: [
129 {
130 dataIndex: 'status',
131 renderer: (value) => `<i class="fa fa-fw ${Proxmox.Utils.get_health_icon(value, true)}"></i>`,
132 width: 50,
133 },
134 {
135 dataIndex: 'message',
136 flex: 1,
137 },
138 ],
139 });
140
141 Ext.define('Proxmox.node.APTRepositoriesGrid', {
142 extend: 'Ext.grid.GridPanel',
143 xtype: 'proxmoxNodeAPTRepositoriesGrid',
144 mixins: ['Proxmox.Mixin.CBind'],
145
146 title: gettext('APT Repositories'),
147
148 cls: 'proxmox-apt-repos', // to allow applying styling to general components with local effect
149
150 border: false,
151
152 tbar: [
153 {
154 text: gettext('Reload'),
155 iconCls: 'fa fa-refresh',
156 handler: function() {
157 let me = this;
158 me.up('proxmoxNodeAPTRepositories').reload();
159 },
160 },
161 {
162 text: gettext('Add'),
163 name: 'addRepo',
164 disabled: true,
165 repoInfo: undefined,
166 cbind: {
167 onlineHelp: '{onlineHelp}',
168 },
169 handler: function(button, event, record) {
170 Proxmox.Utils.checked_command(() => {
171 let me = this;
172 let panel = me.up('proxmoxNodeAPTRepositories');
173
174 let extraParams = {};
175 if (panel.digest !== undefined) {
176 extraParams.digest = panel.digest;
177 }
178
179 Ext.create('Proxmox.window.APTRepositoryAdd', {
180 repoInfo: me.repoInfo,
181 url: `/api2/extjs/nodes/${panel.nodename}/apt/repositories`,
182 method: 'PUT',
183 extraRequestParams: extraParams,
184 onlineHelp: me.onlineHelp,
185 listeners: {
186 destroy: function() {
187 panel.reload();
188 },
189 },
190 }).show();
191 });
192 },
193 },
194 '-',
195 {
196 xtype: 'proxmoxAltTextButton',
197 defaultText: gettext('Enable'),
198 altText: gettext('Disable'),
199 name: 'repoEnable',
200 disabled: true,
201 bind: {
202 text: '{enableButtonText}',
203 },
204 handler: function(button, event, record) {
205 let me = this;
206 let panel = me.up('proxmoxNodeAPTRepositories');
207
208 let params = {
209 path: record.data.Path,
210 index: record.data.Index,
211 enabled: record.data.Enabled ? 0 : 1, // invert
212 };
213
214 if (panel.digest !== undefined) {
215 params.digest = panel.digest;
216 }
217
218 Proxmox.Utils.API2Request({
219 url: `/nodes/${panel.nodename}/apt/repositories`,
220 method: 'POST',
221 params: params,
222 failure: function(response, opts) {
223 Ext.Msg.alert(gettext('Error'), response.htmlStatus);
224 panel.reload();
225 },
226 success: function(response, opts) {
227 panel.reload();
228 },
229 });
230 },
231 },
232 ],
233
234 sortableColumns: false,
235 viewConfig: {
236 stripeRows: false,
237 getRowClass: (record, index) => record.get('Enabled') ? '' : 'proxmox-disabled-row',
238 },
239
240 columns: [
241 {
242 header: gettext('Enabled'),
243 dataIndex: 'Enabled',
244 align: 'center',
245 renderer: Proxmox.Utils.renderEnabledIcon,
246 width: 90,
247 },
248 {
249 header: gettext('Types'),
250 dataIndex: 'Types',
251 renderer: function(types, cell, record) {
252 return types.join(' ');
253 },
254 width: 100,
255 },
256 {
257 header: gettext('URIs'),
258 dataIndex: 'URIs',
259 renderer: function(uris, cell, record) {
260 return uris.join(' ');
261 },
262 width: 350,
263 },
264 {
265 header: gettext('Suites'),
266 dataIndex: 'Suites',
267 renderer: function(suites, metaData, record) {
268 let err = '';
269 if (record.data.warnings && record.data.warnings.length > 0) {
270 let txt = [gettext('Warning')];
271 record.data.warnings.forEach((warning) => {
272 if (warning.property === 'Suites') {
273 txt.push(warning.message);
274 }
275 });
276 metaData.tdAttr = `data-qtip="${Ext.htmlEncode(txt.join('<br>'))}"`;
277 if (record.data.Enabled) {
278 metaData.tdCls = 'proxmox-invalid-row';
279 err = '<i class="fa fa-fw critical fa-exclamation-circle"></i> ';
280 } else {
281 metaData.tdCls = 'proxmox-warning-row';
282 err = '<i class="fa fa-fw warning fa-exclamation-circle"></i> ';
283 }
284 }
285 return suites.join(' ') + err;
286 },
287 width: 130,
288 },
289 {
290 header: gettext('Components'),
291 dataIndex: 'Components',
292 renderer: function(components, metaData, record) {
293 if (components === undefined) {
294 return '';
295 }
296 let err = '';
297 if (components.length === 1) {
298 // FIXME: this should be a flag set to the actual repsotiories, i.e., a tristate
299 // like production-ready = <yes|no|other> (Option<bool>)
300 if (components[0].match(/\w+(-no-subscription|test)\s*$/i)) {
301 metaData.tdCls = 'proxmox-warning-row';
302 err = '<i class="fa fa-fw warning fa-exclamation-circle"></i> ';
303
304 let qtip = components[0].match(/no-subscription/)
305 ? gettext('The no-subscription repository is NOT production-ready')
306 : gettext('The test repository may contain unstable updates')
307 ;
308 metaData.tdAttr = `data-qtip="${Ext.htmlEncode(qtip)}"`;
309 }
310 }
311 return components.join(' ') + err;
312 },
313 width: 170,
314 },
315 {
316 header: gettext('Options'),
317 dataIndex: 'Options',
318 renderer: function(options, cell, record) {
319 if (!options) {
320 return '';
321 }
322
323 let filetype = record.data.FileType;
324 let text = '';
325
326 options.forEach(function(option) {
327 let key = option.Key;
328 if (filetype === 'list') {
329 let values = option.Values.join(',');
330 text += `${key}=${values} `;
331 } else if (filetype === 'sources') {
332 let values = option.Values.join(' ');
333 text += `${key}: ${values}<br>`;
334 } else {
335 throw "unknown file type";
336 }
337 });
338 return text;
339 },
340 flex: 1,
341 },
342 {
343 header: gettext('Origin'),
344 dataIndex: 'Origin',
345 width: 120,
346 renderer: (value, meta, rec) => {
347 if (typeof value !== 'string' || value.length === 0) {
348 value = gettext('Other');
349 }
350 let cls = 'fa fa-fw fa-question-circle-o';
351 if (value.match(/^\s*Proxmox\s*$/i)) {
352 cls = 'pmx-itype-icon pmx-itype-icon-proxmox-x';
353 } else if (value.match(/^\s*Debian\s*(:?Backports)?$/i)) {
354 cls = 'pmx-itype-icon pmx-itype-icon-debian-swirl';
355 }
356 return `<i class='${cls}'></i> ${value}`;
357 },
358 },
359 {
360 header: gettext('Comment'),
361 dataIndex: 'Comment',
362 flex: 2,
363 },
364 ],
365
366 features: [
367 {
368 ftype: 'grouping',
369 groupHeaderTpl: '{[ "File: " + values.name ]} ({rows.length} repositor{[values.rows.length > 1 ? "ies" : "y"]})',
370 enableGroupingMenu: false,
371 },
372 ],
373
374 store: {
375 model: 'apt-repolist',
376 groupField: 'Path',
377 sorters: [
378 {
379 property: 'Index',
380 direction: 'ASC',
381 },
382 ],
383 },
384
385 initComponent: function() {
386 let me = this;
387
388 if (!me.nodename) {
389 throw "no node name specified";
390 }
391
392 me.callParent();
393 },
394 });
395
396 Ext.define('Proxmox.node.APTRepositories', {
397 extend: 'Ext.panel.Panel',
398 xtype: 'proxmoxNodeAPTRepositories',
399 mixins: ['Proxmox.Mixin.CBind'],
400
401 digest: undefined,
402
403 onlineHelp: undefined,
404
405 product: 'Proxmox VE', // default
406
407 controller: {
408 xclass: 'Ext.app.ViewController',
409
410 selectionChange: function(grid, selection) {
411 let me = this;
412 if (!selection || selection.length < 1) {
413 return;
414 }
415 let rec = selection[0];
416 let vm = me.getViewModel();
417 vm.set('selectionenabled', rec.get('Enabled'));
418 vm.notify();
419 },
420
421 updateState: function() {
422 let me = this;
423 let vm = me.getViewModel();
424
425 let store = vm.get('errorstore');
426 store.removeAll();
427
428 let status = 'good'; // start with best, the helper below will downgrade if needed
429 let text = gettext('All OK, you have production-ready repositories configured!');
430
431 let addGood = message => store.add({ status: 'good', message });
432 let addWarn = (message, important) => {
433 if (status !== 'critical') {
434 status = 'warning';
435 text = important ? message : gettext('Warning');
436 }
437 store.add({ status: 'warning', message });
438 };
439 let addCritical = (message, important) => {
440 status = 'critical';
441 text = important ? message : gettext('Error');
442 store.add({ status: 'critical', message });
443 };
444
445 let errors = vm.get('errors');
446 errors.forEach(error => addCritical(`${error.path} - ${error.error}`));
447
448 let activeSubscription = vm.get('subscriptionActive');
449 let enterprise = vm.get('enterpriseRepo');
450 let nosubscription = vm.get('noSubscriptionRepo');
451 let test = vm.get('testRepo');
452 let wrongSuites = vm.get('suitesWarning');
453
454 if (!enterprise && !nosubscription && !test) {
455 addCritical(
456 Ext.String.format(gettext('No {0} repository is enabled, you do not get any updates!'), vm.get('product')),
457 );
458 } else if (errors.length > 0) {
459 // nothing extra, just avoid that we show "get updates"
460 } else if (enterprise && !nosubscription && !test && activeSubscription) {
461 addGood(Ext.String.format(gettext('You get supported updates for {0}'), vm.get('product')));
462 } else if (nosubscription || test) {
463 addGood(Ext.String.format(gettext('You get updates for {0}'), vm.get('product')));
464 }
465
466 if (wrongSuites) {
467 addWarn(gettext('Some suites are misconfigured'));
468 }
469
470 if (!activeSubscription && enterprise) {
471 addWarn(gettext('The enterprise repository is enabled, but there is no active subscription!'));
472 }
473
474 if (nosubscription) {
475 addWarn(gettext('The no-subscription repository is not recommended for production use!'));
476 }
477
478 if (test) {
479 addWarn(gettext('The test repository may pull in unstable updates and is not recommended for production use!'));
480 }
481
482 if (errors.length > 0) {
483 text = gettext('Fatal parsing error for at least one repository');
484 }
485
486 let iconCls = Proxmox.Utils.get_health_icon(status, true);
487
488 vm.set('state', {
489 iconCls,
490 text,
491 });
492 },
493 },
494
495 viewModel: {
496 data: {
497 product: 'Proxmox VE', // default
498 errors: [],
499 suitesWarning: false,
500 subscriptionActive: '',
501 noSubscriptionRepo: '',
502 enterpriseRepo: '',
503 testRepo: '',
504 selectionenabled: false,
505 state: {},
506 },
507 formulas: {
508 enableButtonText: (get) => get('selectionenabled')
509 ? gettext('Disable') : gettext('Enable'),
510 },
511 stores: {
512 errorstore: {
513 fields: ['status', 'message'],
514 },
515 },
516 },
517
518 scrollable: true,
519 layout: {
520 type: 'vbox',
521 align: 'stretch',
522 },
523
524 items: [
525 {
526 xtype: 'panel',
527 border: false,
528 layout: {
529 type: 'hbox',
530 align: 'stretch',
531 },
532 height: 200,
533 title: gettext('Status'),
534 items: [
535 {
536 xtype: 'box',
537 flex: 2,
538 margin: 10,
539 data: {
540 iconCls: Proxmox.Utils.get_health_icon(undefined, true),
541 text: '',
542 },
543 bind: {
544 data: '{state}',
545 },
546 tpl: [
547 '<center class="centered-flex-column" style="font-size:15px;line-height: 25px;">',
548 '<i class="fa fa-4x {iconCls}"></i>',
549 '{text}',
550 '</center>',
551 ],
552 },
553 {
554 xtype: 'proxmoxNodeAPTRepositoriesErrors',
555 name: 'repositoriesErrors',
556 flex: 7,
557 margin: 10,
558 bind: {
559 store: '{errorstore}',
560 },
561 },
562 ],
563 },
564 {
565 xtype: 'proxmoxNodeAPTRepositoriesGrid',
566 name: 'repositoriesGrid',
567 flex: 1,
568 cbind: {
569 nodename: '{nodename}',
570 onlineHelp: '{onlineHelp}',
571 },
572 majorUpgradeAllowed: false, // TODO get release information from an API call?
573 listeners: {
574 selectionchange: 'selectionChange',
575 },
576 },
577 ],
578
579 check_subscription: function() {
580 let me = this;
581 let vm = me.getViewModel();
582
583 Proxmox.Utils.API2Request({
584 url: `/nodes/${me.nodename}/subscription`,
585 method: 'GET',
586 failure: (response, opts) => Ext.Msg.alert(gettext('Error'), response.htmlStatus),
587 success: function(response, opts) {
588 const res = response.result;
589 const subscription = !(!res || !res.data || res.data.status.toLowerCase() !== 'active');
590 vm.set('subscriptionActive', subscription);
591 me.getController().updateState();
592 },
593 });
594 },
595
596 updateStandardRepos: function(standardRepos) {
597 let me = this;
598 let vm = me.getViewModel();
599
600 let addButton = me.down('button[name=addRepo]');
601
602 addButton.repoInfo = [];
603 for (const standardRepo of standardRepos) {
604 const handle = standardRepo.handle;
605 const status = standardRepo.status;
606
607 if (handle === "enterprise") {
608 vm.set('enterpriseRepo', status);
609 } else if (handle === "no-subscription") {
610 vm.set('noSubscriptionRepo', status);
611 } else if (handle === 'test') {
612 vm.set('testRepo', status);
613 }
614 me.getController().updateState();
615
616 addButton.repoInfo.push(standardRepo);
617 addButton.digest = me.digest;
618 }
619
620 addButton.setDisabled(false);
621 },
622
623 reload: function() {
624 let me = this;
625 let vm = me.getViewModel();
626 let repoGrid = me.down('proxmoxNodeAPTRepositoriesGrid');
627
628 me.store.load(function(records, operation, success) {
629 let gridData = [];
630 let errors = [];
631 let digest;
632 let suitesWarning = false;
633
634 if (success && records.length > 0) {
635 let data = records[0].data;
636 let files = data.files;
637 errors = data.errors;
638 digest = data.digest;
639
640 let infos = {};
641 for (const info of data.infos) {
642 let path = info.path;
643 let idx = info.index;
644
645 if (!infos[path]) {
646 infos[path] = {};
647 }
648 if (!infos[path][idx]) {
649 infos[path][idx] = {
650 origin: '',
651 warnings: [],
652 };
653 }
654
655 if (info.kind === 'origin') {
656 infos[path][idx].origin = info.message;
657 } else if (info.kind === 'warning' ||
658 (info.kind === 'ignore-pre-upgrade-warning' && !repoGrid.majorUpgradeAllowed)
659 ) {
660 infos[path][idx].warnings.push(info);
661 } else {
662 throw 'unknown info';
663 }
664 }
665
666
667 files.forEach(function(file) {
668 for (let n = 0; n < file.repositories.length; n++) {
669 let repo = file.repositories[n];
670 repo.Path = file.path;
671 repo.Index = n;
672 if (infos[file.path] && infos[file.path][n]) {
673 repo.Origin = infos[file.path][n].origin || Proxmox.Utils.UnknownText;
674 repo.warnings = infos[file.path][n].warnings || [];
675
676 if (repo.Enabled && repo.warnings.some(w => w.property === 'Suites')) {
677 suitesWarning = true;
678 }
679 }
680 gridData.push(repo);
681 }
682 });
683
684 repoGrid.store.loadData(gridData);
685
686 me.updateStandardRepos(data['standard-repos']);
687 }
688
689 me.digest = digest;
690
691 vm.set('errors', errors);
692 vm.set('suitesWarning', suitesWarning);
693 me.getController().updateState();
694 });
695
696 me.check_subscription();
697 },
698
699 listeners: {
700 activate: function() {
701 let me = this;
702 me.reload();
703 },
704 },
705
706 initComponent: function() {
707 let me = this;
708
709 if (!me.nodename) {
710 throw "no node name specified";
711 }
712
713 let store = Ext.create('Ext.data.Store', {
714 proxy: {
715 type: 'proxmox',
716 url: `/api2/json/nodes/${me.nodename}/apt/repositories`,
717 },
718 });
719
720 Ext.apply(me, { store: store });
721
722 Proxmox.Utils.monStoreErrors(me, me.store, true);
723
724 me.callParent();
725
726 me.getViewModel().set('product', me.product);
727 },
728 });