// components/apps/index.js — the App Center: the grid (/apps, /apps/) // AND the per-app detail page (/app/[/]). One feature owns both route // sets; mount() dispatches by path. Both render the shared apps-unified-layout // and drive system-loader singletons — appsManager for the grid, appTabbedManager // for detail — via .initialize(), never `new`. (app-detail used to be a separate // sibling component; it's the same feature, so it lives here.) LP.features.register({ id: 'apps', routes: ['/apps', '/apps*', '/app', '/app*', '/overview', '/overview*'], async mount(ctx) { // /overview* -> fleet Overview; /apps* -> grid; everything else (/app*) -> // detail. Check '/apps' before '/app' (since '/apps'.startsWith('/app')). if (window.location.pathname.startsWith('/overview')) { return this._mountOverview(ctx); } if (window.location.pathname.startsWith('/apps')) { return this._mountGrid(ctx); } return this._mountDetail(ctx); }, // ---- grid (/apps, /apps/) ---- async _mountGrid(ctx) { const seg = window.location.pathname.replace(/^\/apps\/?/, '').split('/')[0]; if (seg) { window.appsCategory = decodeURIComponent(seg); } else { const search = window.location.search || ''; if (search.includes('?=')) { window.appsCategory = (window.location.pathname + search).split('?=')[1] || 'all'; } else { window.appsCategory = new URLSearchParams(search).get('apps') || 'all'; } } // Load the unified layout only if it isn't already present — preserves grid // state when moving between categories / back from detail (legacy behaviour). if (!document.querySelector('.apps-layout')) { const html = await ctx.loadFragment('/components/apps/core/html/apps-unified-layout.html'); ctx.setContent(html, 'Applications'); } if (!window.appsManager) throw new Error('AppsManager not initialized by SystemLoader'); await window.appsManager.initialize(); }, // ---- per-app detail (/app/[/]) ---- async _mountDetail(ctx) { const url = new URL(window.location); let appName = url.pathname.replace(/^\/app\/?/, '').split('/')[0]; appName = appName ? decodeURIComponent(appName) : ''; if (!appName) appName = url.searchParams.get('app'); // Old format ?=appname&tab=tabname if (!appName && url.search.includes('?=')) { const queryPart = url.search.replace('?', ''); for (const part of queryPart.split('&')) { if (part.startsWith('=')) { appName = part.substring(1); break; } } } if (!appName) { return ctx.nav('/apps', false); } // Back-compat: rewrite legacy ?tab=/?config= to the canonical path shape // before the page reads URL state (replaceState — no extra history entry). const legacyTab = url.searchParams.get('tab'); const legacyConfig = url.searchParams.get('config'); if (legacyTab || legacyConfig) { const tab = legacyTab === 'logs' ? 'tasks' : (legacyTab || 'config'); const sub = (tab === 'config') ? legacyConfig : null; const taskId = url.searchParams.get('task'); const canonical = ctx.services.router.appPath(appName, tab, sub, taskId); if (canonical !== url.pathname + url.search) { window.history.replaceState({ route: canonical }, '', canonical); } } const html = await ctx.loadFragment('/components/apps/core/html/apps-unified-layout.html'); ctx.setContent(html, appName); if (!window.appTabbedManager) throw new Error('AppTabbedManager not initialized by SystemLoader'); await window.appTabbedManager.initialize(); }, // ---- fleet Overview (/overview[/]) ---- async _mountOverview(ctx) { // Lazy-load the fleet controller + its deps. Guard by typeof so re-entry // never re-declares the classes (loadScripts dedupes by URL too). The // headless UpdaterPage supplies all update/CVE/improvement data + rendering. const need = []; if (typeof TabController === 'undefined') need.push('/core/ui-state/js/tab-controller.js'); if (typeof UpdaterPage === 'undefined') need.push('/components/updater/js/updater-page.js'); if (typeof OverviewManager === 'undefined') need.push('/components/apps/overview/js/overview-manager.js'); if (need.length) await ctx.loadScripts(need); // Reuse the shared apps layout (keeps the sidebar persistent), same as grid. if (!document.querySelector('.apps-layout')) { const html = await ctx.loadFragment('/components/apps/core/html/apps-unified-layout.html'); ctx.setContent(html, 'Overview'); } // Render the apps sidebar (search + categories) but show the Overview pane // and highlight the Overview entry instead of any category. if (window.appsManager) { window.appsManager.currentView = 'overview'; try { window.appsManager.setupSidebar('__overview__'); } catch (_) {} window.appsManager.showView('overview'); } document.querySelectorAll('.apps-layout .category.active').forEach((c) => c.classList.remove('active')); const entry = document.getElementById('sidebar-overview-entry'); if (entry) entry.classList.add('active'); if (typeof OverviewManager === 'undefined') throw new Error('OverviewManager failed to load'); if (!window.overviewManager) window.overviewManager = new OverviewManager(ctx.services); await window.overviewManager.initialize(); }, async unmount(ctx) { // appsManager / appTabbedManager are shared singletons (never null them), but // the detail view's per-mount resources DO need releasing: the reconcile loop, // the watchdog window/document listeners, and the active tab's Services // intervals + log SSE. dispose() handles all of it (re-armed on next mount). // The dirty-config nav guard still fires in navigate() before unmount. try { window.appTabbedManager && window.appTabbedManager.dispose && window.appTabbedManager.dispose(); } catch (_) {} // Drop the Overview task-refresh registration when leaving the apps feature // so a finished update/backup task can't repaint a torn-down pane. The // overviewManager singleton + its DOM persist with the layout; its run() // self-guards, but unregistering is the clean release. try { ctx && ctx.services.tasks.refresh && ctx.services.tasks.refresh.unregister('overview'); } catch (_) {} // The Backups tab embeds a BackupPage; release its document listeners + // task-refresh registration on the way out (the "stacks on revisit" bug). try { window.overviewBackupPage && window.overviewBackupPage.dispose && window.overviewBackupPage.dispose(); } catch (_) {} window.overviewBackupPage = null; // Migrate tab sub-controllers (Restore + Peers) — release their listeners. try { window.migratePage && window.migratePage.dispose && window.migratePage.dispose(); } catch (_) {} window.migratePage = null; try { window.peersPage && window.peersPage.dispose && window.peersPage.dispose(); } catch (_) {} window.peersPage = null; }, });