1 files changed, 62 insertions, 0 deletions
diff --git a/packages/meshbay-hub/src/meshbay_hub/static/helloworld-app.js b/packages/meshbay-hub/src/meshbay_hub/static/helloworld-app.js
new file mode 100644
index 0000000..01b4ed4
--- /dev/null
+++ b/packages/meshbay-hub/src/meshbay_hub/static/helloworld-app.js
@@ -0,0 +1,62 @@
+import { html, useMemo } from './vendor/htm-preact.js';
+import { t } from './i18n.js';
+import { Icon } from './icon.js';
+import { formatSize } from './file-utils.js';
+
+/**
+ * The smallest application this platform can host, and the proof that adding
+ * one costs nothing outside its own two files.
+ *
+ * Everything else in `docs/refactor-groups.md` §3 is asserted by tests that
+ * read source. This is the other kind of evidence: an app nobody wrote a line
+ * of plumbing for, that stores directories, appears as a tab, and lists files —
+ * because the registry entry beside it is genuinely all there is.
+ *
+ * **Not shipped to operators.** It is registered with `dev: true`, which keeps
+ * it out of the tab bar and the settings page unless the reader opts in with
+ * `?dev=1` (same shape as transport.js's `?trace=1`). Deleting the flag would
+ * put a toy app in everybody's group; deleting the app would leave the claim
+ * resting entirely on tests that read text.
+ *
+ * It takes the standard props — see `docs/apps.md` §2 — and reads
+ * `helloworldDirectories`, which nothing on the node knows about by name:
+ * `ops.set_app_directories` keys the row by whatever the app is called.
+ */
+function HelloWorldApp({ entries, availableEntries, helloworldDirectories, status }) {
+  const dirs = helloworldDirectories || [];
+  const pool = availableEntries || entries || [];
+
+  const files = useMemo(() => pool.filter((e) => {
+    const p = e.path || '';
+    return dirs.some((d) => p === d || p.startsWith(d + '/'));
+  }).slice(0, 200), [pool, dirs]);
+
+  if (status !== 'connected') {
+    return html`<p class="page-message">${t('status.connecting_short')}</p>`;
+  }
+
+  return html`
+    <div class="page-content">
+      <h2>${t('helloworld.greeting')}</h2>
+      ${dirs.length === 0 ? html`
+        <p class="page-message">${t('helloworld.no_directory')}</p>
+      ` : html`
+        <p class="settings-hint">
+          ${t('helloworld.counted', { n: files.length })}
+          ${' — '}${dirs.join(', ')}
+        </p>
+        <ul class="hw-list">
+          ${files.map((e) => html`
+            <li key=${e.id} class="hw-item">
+              <${Icon} name="folder" />
+              <span class="hw-name">${e.name}</span>
+              <span class="hw-size">${formatSize(e.size || 0)}</span>
+            </li>
+          `)}
+        </ul>
+      `}
+    </div>
+  `;
+}
+
+export { HelloWorldApp };