secubox-openwrt/package/secubox/luci-app-secubox-admin/htdocs/luci-static/resources/view/secubox-admin/updates.js

'use strict';
'require view';
'require secubox-admin/api as API';
'require secubox-admin/components as Components';
'require secubox-admin/data-utils as DataUtils';
'require ui';
'require poll';
'require secubox-theme/theme as Theme';
'require secubox-portal/header as SbHeader';
'require secubox/kiss-theme as KissTheme';

var lang = (typeof L !== 'undefined' && L.env && L.env.lang) ||
	(document.documentElement && document.documentElement.getAttribute('lang')) ||
	(navigator.language ? navigator.language.split('-')[0] : 'en');
Theme.init({ language: lang });

var ADMIN_NAV = [
	{ id: 'dashboard', icon: '🎛️', label: 'Control Panel' },
	{ id: 'cyber-dashboard', icon: '🔮', label: 'Cyber Console' },
	{ id: 'apps', icon: '📦', label: 'Apps Manager' },
	{ id: 'updates', icon: '🔄', label: 'Updates' },
	{ id: 'catalog-sources', icon: '📚', label: 'Catalog' },
	{ id: 'health', icon: '💚', label: 'Health' },
	{ id: 'logs', icon: '📋', label: 'Logs' },
	{ id: 'settings', icon: '⚙️', label: 'Settings' }
];

function renderAdminNav(activeId) {
	return E('div', {
		'class': 'sb-app-nav',
		'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;flex-wrap:wrap;'
	}, ADMIN_NAV.map(function(item) {
		var isActive = activeId === item.id;
		return E('a', {
			'href': L.url('admin', 'secubox', 'admin', item.id),
			'style': 'display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:500;transition:all 0.2s;' +
				(isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;background:transparent;')
		}, [
			E('span', {}, item.icon),
			E('span', {}, _(item.label))
		]);
	}));
}

return view.extend({
	load: function() {
		console.log('[UPDATES-DEBUG] ========== LOAD START ==========');
		console.log('[UPDATES-DEBUG] Starting Promise.all with 3 API calls...');

		var checkUpdatesPromise = API.checkUpdates().then(function(result) {
			console.log('[UPDATES-DEBUG] checkUpdates() raw result:', result);
			console.log('[UPDATES-DEBUG] checkUpdates() result type:', typeof result);
			console.log('[UPDATES-DEBUG] checkUpdates() keys:', Object.keys(result || {}));
			return DataUtils.normalizeUpdates(result);
		}).catch(function(err) {
			console.error('[UPDATES-DEBUG] checkUpdates() ERROR:', err);
			console.error('[UPDATES-DEBUG] checkUpdates() error message:', err.message);
			console.error('[UPDATES-DEBUG] checkUpdates() error stack:', err.stack);
			return { updates: [] };
		});

		var getAppsPromise = API.getApps().then(function(result) {
			console.log('[UPDATES-DEBUG] getApps() raw result:', result);
			console.log('[UPDATES-DEBUG] getApps() result type:', typeof result);
			console.log('[UPDATES-DEBUG] getApps() keys:', Object.keys(result || {}));
			return DataUtils.normalizeApps(result);
		}).catch(function(err) {
			console.error('[UPDATES-DEBUG] getApps() ERROR:', err);
			return [];
		});

		var getModulesPromise = API.getModules().then(function(result) {
			console.log('[UPDATES-DEBUG] getModules() raw result:', result);
			return DataUtils.normalizeModules(result);
		}).catch(function(err) {
			console.error('[UPDATES-DEBUG] getModules() ERROR:', err);
			return {};
		});

		return Promise.all([
			L.resolveDefault(checkUpdatesPromise, { updates: [] }),
			L.resolveDefault(getAppsPromise, []),
			L.resolveDefault(getModulesPromise, {})
		]).then(function(results) {
			console.log('[UPDATES-DEBUG] ========== ALL PROMISES RESOLVED ==========');
			console.log('[UPDATES-DEBUG] Result[0] (updates):', results[0]);
			console.log('[UPDATES-DEBUG] Result[1] (apps):', results[1]);
			console.log('[UPDATES-DEBUG] Result[2] (modules):', results[2]);
			console.log('[UPDATES-DEBUG] ========== LOAD COMPLETE ==========');
			return results;
		}).catch(function(err) {
			console.error('[UPDATES-DEBUG] ========== PROMISE.ALL ERROR ==========');
			console.error('[UPDATES-DEBUG] Error:', err);
			console.error('[UPDATES-DEBUG] Error message:', err.message);
			console.error('[UPDATES-DEBUG] Error stack:', err.stack);
			return [{ updates: [] }, { apps: [] }, { modules: {} }];
		});
	},

	render: function(data) {
		console.log('[UPDATES-DEBUG] ========== RENDER START ==========');
		console.log('[UPDATES-DEBUG] Render data (raw):', data);
		console.log('[UPDATES-DEBUG] Render data type:', typeof data);
		console.log('[UPDATES-DEBUG] Render data length:', data ? data.length : 'null');

		var updateData = DataUtils.normalizeUpdates(data[0]);
		var apps = DataUtils.normalizeApps(data[1]);
		var modules = DataUtils.normalizeModules(data[2]);
		var self = this;

		console.log('[UPDATES-DEBUG] updateData:', updateData);
		console.log('[UPDATES-DEBUG] updateData.updates:', updateData.updates);
		console.log('[UPDATES-DEBUG] apps:', apps);
		console.log('[UPDATES-DEBUG] apps length:', apps.length);
		console.log('[UPDATES-DEBUG] modules:', modules);

		var updatesAvailable = updateData.updates || [];
		var totalUpdates = updatesAvailable.length;

		console.log('[UPDATES-DEBUG] updatesAvailable:', updatesAvailable);
		console.log('[UPDATES-DEBUG] totalUpdates:', totalUpdates);
		console.log('[UPDATES-DEBUG] ========== RENDER PROCESSING ==========');

		var container = E('div', { 'class': 'cyberpunk-mode secubox-updates' }, [
			E('link', { 'rel': 'stylesheet', 'type': 'text/css',
				'href': L.resource('secubox-admin/cyberpunk.css') + '?v=' + Date.now() }),
			E('link', { 'rel': 'stylesheet',
				'href': L.resource('secubox-admin/common.css') }),
			E('link', { 'rel': 'stylesheet',
				'href': L.resource('secubox-admin/admin.css') }),

			// Cyberpunk header
			E('div', { 'class': 'cyber-header' }, [
				E('div', { 'class': 'cyber-header-title' }, '⚡ AVAILABLE UPDATES'),
				E('div', { 'class': 'cyber-header-subtitle' },
					totalUpdates + ' update' + (totalUpdates !== 1 ? 's' : '') + ' available · Keep your system current')
			]),

			// Summary stats panel
			E('div', { 'class': 'cyber-panel' }, [
				E('div', { 'class': 'cyber-panel-header' }, [
					E('span', { 'class': 'cyber-panel-title' }, 'UPDATE STATUS'),
					E('span', { 'class': 'cyber-panel-badge ' + (totalUpdates > 0 ? 'warning' : 'success') }, 
						totalUpdates > 0 ? totalUpdates + ' PENDING' : 'UP TO DATE')
				]),
				E('div', { 'class': 'cyber-panel-body' }, [
					E('div', { 'class': 'cyber-quick-actions' }, [
						totalUpdates > 0 ? E('button', {
							'class': 'cyber-action-btn',
							'click': function() {
								console.log('[UPDATES] Update all apps');
								self.updateAllApps(updatesAvailable);
							}
						}, [
							E('span', { 'class': 'cyber-action-icon' }, '⚡'),
							E('span', { 'class': 'cyber-action-label' }, 'UPDATE ALL (' + totalUpdates + ')'),
							E('span', { 'class': 'cyber-action-arrow' }, '→')
						]) : null,
						E('button', {
							'class': 'cyber-action-btn',
							'click': function() {
								console.log('[UPDATES] Check for updates');
								self.checkForUpdates();
							}
						}, [
							E('span', { 'class': 'cyber-action-icon' }, '🔍'),
							E('span', { 'class': 'cyber-action-label' }, 'CHECK FOR UPDATES'),
							E('span', { 'class': 'cyber-action-arrow' }, '→')
						])
					])
				])
			]),

			// Updates list
			totalUpdates > 0 ?
				E('div', { 'class': 'cyber-list', 'id': 'updates-list' },
					updatesAvailable.map(function(update) {
						var app = apps.find(function(a) { return a.id === update.app_id; });
						console.log('[UPDATES] Rendering update for:', update.app_id);
						return self.renderUpdateCard(update, app);
					})
				) :
				E('div', { 'class': 'cyber-panel' }, [
					E('div', { 'class': 'cyber-panel-body', 'style': 'text-align: center; padding: 40px;' }, [
						E('div', { 'style': 'font-size: 48px; margin-bottom: 20px;' }, '✓'),
						E('div', { 'style': 'color: var(--cyber-primary); font-size: 18px; margin-bottom: 10px;' }, 
							'ALL APPLICATIONS UP TO DATE'),
						E('div', { 'style': 'color: var(--cyber-text-dim); font-size: 12px;' },
							'Check back later or click "CHECK FOR UPDATES"')
					])
				])
		]);

		// Auto-refresh every 60s
		poll.add(function() {
			console.log('[UPDATES] Polling for updates...');
			return API.checkUpdates().then(function(result) {
				var normalized = DataUtils.normalizeUpdates(result);
				if ((normalized.updates || []).length !== totalUpdates) {
					console.log('[UPDATES] Update count changed, reloading');
					window.location.reload();
				}
			}).catch(function(err) {
				console.error('[UPDATES] Poll error:', err);
			});
		}, 60);

		var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
		wrapper.appendChild(SbHeader.render());
		wrapper.appendChild(renderAdminNav('updates'));
		wrapper.appendChild(container);
		return KissTheme.wrap([wrapper], 'admin/secubox/admin/updates');
	},

	renderUpdateCard: function(update, app) {
		var self = this;

		if (!app) {
			app = {
				id: update.app_id,
				name: update.app_id,
				description: 'Application',
				icon: '📦'
			};
		}

		return E('div', { 'class': 'cyber-list-item', 'data-app-id': update.app_id }, [
			E('div', { 'class': 'cyber-list-icon' }, app.icon || '📦'),
			E('div', { 'class': 'cyber-list-content' }, [
				E('div', { 'class': 'cyber-list-title' }, [
					app.name,
					E('span', { 'class': 'cyber-badge warning' }, '⚡ UPDATE')
				]),
				E('div', { 'class': 'cyber-list-meta' }, [
					E('span', { 'class': 'cyber-list-meta-item' }, [
						E('span', {}, '📊 '),
						'v' + (update.installed_version || '?') + ' → v' + (update.catalog_version || '?')
					]),
					E('span', { 'class': 'cyber-list-meta-item' }, [
						E('span', {}, '📁 '),
						app.category || 'application'
					])
				])
			]),
			E('div', { 'class': 'cyber-list-actions' }, [
				E('button', {
					'class': 'cyber-btn warning',
					'click': function() {
						console.log('[UPDATES] Update app:', update.app_id);
						self.updateApp(update.app_id, app.name);
					}
				}, '⚡ UPDATE'),
				E('button', {
					'class': 'cyber-btn',
					'click': function() {
						console.log('[UPDATES] View changelog:', update.app_id);
						self.viewFullChangelog(update.app_id, update.installed_version, update.catalog_version);
					}
				}, '📋 CHANGELOG')
			])
		]);
	},

	updateApp: function(appId, appName) {
		console.log('[UPDATES] Updating app:', appId);
		ui.showModal('Updating Application', [
			Components.renderLoader('Updating ' + appName + '...')
		]);

		API.installApp(appId).then(function(result) {
			console.log('[UPDATES] Update result:', result);
			ui.hideModal();
			if (result.success) {
				ui.addNotification(null, E('p', appName + ' updated successfully'), 'success');
				setTimeout(function() { window.location.reload(); }, 1000);
			} else {
				ui.addNotification(null, E('p', 'Update failed: ' + (result.error || 'Unknown')), 'error');
			}
		}).catch(function(err) {
			console.error('[UPDATES] Update error:', err);
			ui.hideModal();
			ui.addNotification(null, E('p', 'Update error: ' + err.message), 'error');
		});
	},

	updateAllApps: function(updates) {
		console.log('[UPDATES] Updating all apps:', updates.length);
		if (updates.length === 0) return;

		ui.showModal('Updating Applications', [
			Components.renderLoader('Updating ' + updates.length + ' applications...')
		]);

		var currentIndex = 0;
		function updateNext() {
			if (currentIndex >= updates.length) {
				ui.hideModal();
				ui.addNotification(null, E('p', 'All applications updated'), 'success');
				setTimeout(function() { window.location.reload(); }, 1000);
				return;
			}

			var update = updates[currentIndex];
			console.log('[UPDATES] Batch update:', update.app_id, '(' + (currentIndex + 1) + '/' + updates.length + ')');
			
			API.installApp(update.app_id).then(function() {
				currentIndex++;
				updateNext();
			}).catch(function(err) {
				console.error('[UPDATES] Batch update error:', err);
				ui.hideModal();
				ui.addNotification(null, E('p', 'Failed: ' + update.app_id), 'error');
			});
		}

		updateNext();
	},

	viewFullChangelog: function(appId, fromVersion, toVersion) {
		console.log('[UPDATES] Viewing changelog:', appId, fromVersion, '→', toVersion);
		API.getChangelog(appId, fromVersion, toVersion).then(function(changelog) {
			ui.showModal('Changelog: ' + appId, [
				E('pre', {}, JSON.stringify(changelog, null, 2)),
				E('div', { 'class': 'right' }, [
					E('button', { 'class': 'btn', 'click': ui.hideModal }, 'Close')
				])
			]);
		}).catch(function(err) {
			console.error('[UPDATES] Changelog error:', err);
			ui.addNotification(null, E('p', 'Changelog failed: ' + err.message), 'error');
		});
	},

	checkForUpdates: function() {
		console.log('[UPDATES] Checking for updates');
		ui.showModal('Checking for Updates', [
			Components.renderLoader('Syncing catalog and checking for updates...')
		]);

		API.syncCatalog(null).then(function() {
			return API.checkUpdates();
		}).then(function(result) {
			console.log('[UPDATES] Check result:', result);
			ui.hideModal();
			ui.addNotification(null, E('p', 'Found ' + (result.updates || []).length + ' updates'), 'success');
			window.location.reload();
		}).catch(function(err) {
			console.error('[UPDATES] Check error:', err);
			ui.hideModal();
			ui.addNotification(null, E('p', 'Check failed: ' + err.message), 'error');
		});
	},

	handleSaveApply: null,
	handleSave: null,
	handleReset: null
});