feat(client): HelloWorld, the reference application

Every other test of the plugin architecture reads source for the *absence* of
app names. That proves nobody wrote a special case for Videos; it cannot prove
a genuinely new application works, because there was no new application.

This is one. It stores directories, appears as a tab, has a settings pane and
lists files, and the node has never heard its name outside a single allow-list
entry. Two files and one registry line, which is the claim
`docs/refactor-groups.md` §4.1 makes.

It ships hidden behind `?dev=1` (`dev: true` in the registry, the same opt-in
shape as transport.js's `?trace=1`). Registering it normally would put a toy
app in every operator's group; not registering it would prove nothing, since
registration is exactly what is claimed to be sufficient.

**Adding it found two places where the claim was nearly true rather than true,
and both are fixed by making the code less app-specific:**

`group-settings.js` fell back to the whole registry when a group had no
`enabled_apps` yet — which would have turned a hidden app on for everyone. It
asks `availableApps()` now.

`group-page.js` wrote out `videoDirectories` / `musicDirectories` /
`photoDirectories` by hand, so a fifth app would have needed that file edited.
It derives `<key>Directories` from the registry.

Neither was found by reading; both were found by adding the app, which is the
whole reason it exists.

Verified in a real Electron window as well as by the tests: hidden by default,
present with the flag, offered its own settings section, and listing exactly
the files under its configured folder and its subfolders — not the ones beside
it.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011pvMdvLBG92jyhvD5pD6us

1 files changed, 43 insertions, 4 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/apps.js b/packages/meshbay-hub/src/meshbay_hub/static/apps.js
index 6e62a42..461bd57 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/apps.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/apps.js
@@ -7,6 +7,33 @@ import { ChatSettings } from './chat-app-settings.js';
 import { VideoSettings } from './video-app-settings.js';
 import { MusicSettings } from './music-app-settings.js';
 import { PhotoSettings } from './photos-app-settings.js';
+import { HelloWorldApp } from './helloworld-app.js';
+import { HelloWorldSettings } from './helloworld-app-settings.js';
+
+/**
+ * Whether apps marked `dev` are shown. Opt in once with `?dev=1`, off with
+ * `?dev=0` — persisted, the same shape as transport.js's `?trace=1`.
+ *
+ * HelloWorld exists to prove that adding an application is a registry entry
+ * and two files. Registering it normally would put a toy app in every
+ * operator's group; leaving it unregistered would prove nothing, since the
+ * claim is precisely that registration is enough. So it is registered, and
+ * hidden behind a flag that changes nothing else.
+ */
+const DEV_KEY = 'mb_dev_apps';
+(function _initDevFlag() {
+  try {
+    const params = new URLSearchParams(location.search);
+    if (params.has('dev')) {
+      if (params.get('dev') === '0') localStorage.removeItem(DEV_KEY);
+      else localStorage.setItem(DEV_KEY, '1');
+    }
+  } catch { /* localStorage unavailable — dev apps stay hidden */ }
+})();
+
+function devAppsShown() {
+  try { return localStorage.getItem(DEV_KEY) === '1'; } catch { return false; }
+}
 
 /**
  * Every group "application", in tab order.
@@ -43,18 +70,30 @@ const APPS = [
     Component: MusicApp, Settings: MusicSettings },
   { key: 'photo', icon: 'image', labelKey: 'group.tab_photos',
     Component: PhotosApp, Settings: PhotoSettings },
+  // The reference implementation (docs/refactor-groups.md §4.1). `dev` keeps
+  // it out of an operator's way; everything else about it is an ordinary
+  // entry, which is the point.
+  { key: 'helloworld', icon: 'chat', labelKey: 'group.tab_helloworld',
+    Component: HelloWorldApp, Settings: HelloWorldSettings, dev: true },
 ];
 
+/** Everything a reader of this page is allowed to see, in registry order. */
+function availableApps() {
+  const dev = devAppsShown();
+  return APPS.filter(a => dev || !a.dev);
+}
+
 /** The registry filtered to what this group has enabled, in registry order. */
 function visibleApps(enabledKeys) {
+  const registered = availableApps();
   const enabled = new Set(
-    enabledKeys && enabledKeys.length ? enabledKeys : APPS.map(a => a.key));
-  return APPS.filter(a => a.alwaysEnabled || enabled.has(a.key));
+    enabledKeys && enabledKeys.length ? enabledKeys : registered.map(a => a.key));
+  return registered.filter(a => a.alwaysEnabled || enabled.has(a.key));
 }
 
 /** The apps the Settings page offers a section for, in registry order. */
 function configurableApps() {
-  return APPS.filter(a => !a.alwaysEnabled && a.Settings);
+  return availableApps().filter(a => !a.alwaysEnabled && a.Settings);
 }
 
-export { APPS, visibleApps, configurableApps };
+export { APPS, availableApps, visibleApps, configurableApps };