feat(client): fetch the media apps, the player, settings and search on first use

apps.js registers Videos, Music, Photos and every settings pane through
lazy.js; the group page does the same for the video player and the
settings panel, and the shell for the search page. The first download
goes from 49 modules / 386 KB gzip to 37 / 289 KB; opening Music now
fetches music-app.js and media-tiles.js and nothing of Videos.
test_first_load_is_lean holds the eager graph; test_spa_imports checks
that every on-demand load names an export that exists.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

1 files changed, 6 insertions, 2 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/group-page.js b/packages/meshbay-hub/src/meshbay_hub/static/group-page.js
index f0a98e4..2ee6e05 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/group-page.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/group-page.js
@@ -13,8 +13,12 @@ import { APPS, visibleApps } from './apps.js';
 import { GroupName } from './group-name.js';
 import { useStickyBand } from './sticky.js';
 import { FilePreview } from './files-app.js';
-import { VideoPlayer } from './video-player.js';
-import { GroupSettingsPanel } from './group-settings.js';
+import { lazy } from './lazy.js';
+
+// Fetched the first time a video is played / the Settings tab is opened.
+const VideoPlayer = lazy(() => import('./video-player.js'), 'VideoPlayer',
+  html`<div class="video-overlay"><p class="page-message"><span class="spinner"></span></p></div>`);
+const GroupSettingsPanel = lazy(() => import('./group-settings.js'), 'GroupSettingsPanel');
 import { reportIndexPush } from './index-dock.js';
 import { clearPending, nodePkFromLink, pendingFor } from './invite-link.js';