@webship.co/workspace 1.0.0 → 1.0.2

package/core/docs/releases.md

@@ -1,6 +1,6 @@
 # Releases
 
-Every package is versioned together: `@webship.co/workspace` (the core) and every `@webship.co/workspace-<name>`. Versions so far: 1.0.0-alpha1 (the first publish), 1.0.0-beta1.
+Every package is versioned together: `@webship.co/workspace` (the core) and every `@webship.co/workspace-<name>`. Versions so far: 1.0.0-alpha1 (the first publish), 1.0.0-beta1, 1.0.0-beta2, 1.0.0-rc1, 1.0.0, 1.0.1 (the core and the git, ide and graph plugins only), 1.0.2.
 
 ## How a change lands
 
@@ -10,7 +10,16 @@ Every package is versioned together: `@webship.co/workspace` (the core) and ever
 
 ## Publishing
 
-Bases first (`workspace-plugin-api`, `workspace-hosting`, `workspace-forge`, `workspace-container`), then the providers and the rest, then the core — one package at a time with a pause between them, within npm's publishing limits. A dependency on a sibling is a version range (`^1.0.0-beta1`), never a git URL.
+One package at a time, within npm's publishing limits, in this order: the types (`workspace-plugin-api`), the bases (`workspace-hosting`, `workspace-forge`, `workspace-container`), the providers and the other plugins, and the core last. A dependency on a sibling is a version range (`^1.0.2`), never a git URL.
+
+For each package:
+
+1. Set `version` in `package.json` and every `@webship.co/workspace-*` range to the version of the round.
+2. Run `npm install` so that `package-lock.json` resolves the siblings already published in this round, and commit the two files together. CI runs `npm ci`, which refuses a lock file that is out of step with `package.json`.
+3. Push `1.0.x` with the `v<version>` tag, publish with `npm publish --access public`, and create the GitHub release.
+4. Before moving on to a package that depends on this one, wait until `npm view @webship.co/workspace-<name>@<version> version` answers: the registry takes a minute or two to serve a new version, and a dependent pushed before that fails its CI with `No matching version found`.
+
+The 1.0.0 round pushed every version commit before any package was published and left the regenerated lock files uncommitted, so the CI of every plugin was red from that commit until 1.0.2.
 
 ## Upgrading a workspace
 

package/core/workspace-app/PLUGINS.md

@@ -205,7 +205,7 @@ it alike), so a lazy menu behaves like an inline one once open. A string return
 menu, inline. A plugin that must also run on a dashboard older than this form checks
 `api.capabilities && api.capabilities.has('row-menu-body')` and falls back to the string.
 
-The core's own menus take the same road: DDEV, COMPOSER, Tests and SCREENS are drawn as this shell and
+The core's own menus take the same road: DDEV, COMPOSER, Tests, SCREENS, NODE and More are drawn as this shell and
 answer at `/fragments/row-menu/<slot>/<ws>/<project>` with no `body` parameter, their items computed for
 that one project when the menu opens (a page of fifty rows is a third of what it was). A plugin's
 `body` must still name one of its own fragments; the core slots are not open to one.

package/core/workspace-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "workspace-dashboard",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "The Webship Workspace dashboard: a lean core (workspaces, builders, settings, the assistant shell, the plugin system) that every feature joins as a @webship.co/workspace-<name> plugin — required with npm, then activated, installed and configured.",
   "license": "ISC",
   "main": "server.js",

package/core/workspace-app/plugin-loader.js

@@ -414,7 +414,7 @@ function rowMenuHtml(slot, result, ctx = {}) {
 
 /**
  * The shell of a row menu whose body loads when it opens — the one markup for a plugin's lazy menu and for
- * the core's own (DDEV, COMPOSER, Tests, SCREENS): `<span class="act-with-status">` around the
+ * the core's own (DDEV, COMPOSER, Tests, SCREENS, NODE, More): `<span class="act-with-status">` around the
  * `.uk-inline.act-menu.act-menu-<slot>` wrapper, the button (`html`), an empty `uk-dropdown` shell and the
  * caption. The shell fetches `/fragments/row-menu/<slot>/<ws>/<project><query>` on `menu-opened` (the relay
  * of UIkit's `beforeshow` in public/ui.js) and swaps the answer in as its inner HTML; `triggers` adds more

package/core/workspace-app/server.js

@@ -1018,13 +1018,36 @@ function composerMenuBody(key, p, projectPath, isDdev, mode = 'manifest') {
  * left, a package and the package.json scripts on the right. What runs lives in actions/node.js.
  */
 function nodeMenuHtml(key, p, projectPath, isDdev) {
-  const { MANAGERS, NODE_GROUPS, NODE_RUN_ACTIONS, NODE_PACKAGE_ACTIONS, NODE_SCRIPT_ROUTE,
-    hasPackageJson, nodeInfo, nodeArgsFor, nodeScripts } = require('./actions/node');
-  if (!hasPackageJson(projectPath)) return '';
+  const state = nodeMenuState(projectPath);
+  if (!state) return '';
+  // The row carries the button and the caption; the body (nodeMenuBody) arrives from
+  // /fragments/row-menu/node/<ws>/<project> when the menu opens — fifty rows, fifty buttons, no menu (#111).
+  return menuShellHtml('node', {
+    key, project: p, caption: state.caption, dropdownClasses: 'node-dropdown',
+    html: '<button class="uk-button uk-button-default uk-button-small" type="button" title="npm and yarn for this folder"><span uk-icon="icon: nut; ratio: .7"></span> NODE <span uk-icon="icon: chevron-down; ratio: .6"></span></button>',
+  });
+}
+
+/** What the NODE caption says: package.json parsed (or not), and which lock files sit beside it. Null without a package.json. */
+function nodeMenuState(projectPath) {
+  const { hasPackageJson, nodeInfo } = require('./actions/node');
+  if (!hasPackageJson(projectPath)) return null;
   const info = nodeInfo(projectPath);
-  const lockFile = { yarn: 'yarn.lock', npm: 'package-lock.json' };
   const caption = !info.valid ? 'bad json'
     : (info.locks.yarn && info.locks.npm ? '2 locks' : (info.locks.yarn ? 'yarn.lock' : (info.locks.npm ? 'npm lock' : 'no lock')));
+  return { info, caption };
+}
+
+/**
+ * The NODE menu's body — what used to sit inside the dropdown on every row — for one project, served by
+ * /fragments/row-menu/node/<ws>/<project> when the menu opens. '' for a folder without package.json.
+ */
+function nodeMenuBody(key, p, projectPath, isDdev) {
+  const { MANAGERS, NODE_GROUPS, NODE_RUN_ACTIONS, NODE_PACKAGE_ACTIONS, NODE_SCRIPT_ROUTE, nodeArgsFor, nodeScripts } = require('./actions/node');
+  const state = nodeMenuState(projectPath);
+  if (!state) return '';
+  const { info } = state;
+  const lockFile = { yarn: 'yarn.lock', npm: 'package-lock.json' };
   const vals = (m, extra = '') => `hx-vals='{"workspace":"${esc(key)}","projectName":"${esc(p)}","manager":"${m}"${extra}}' hx-target="#webship-workspace-output" hx-swap="innerHTML"`;
   const scripts = info.valid ? nodeScripts(info.pkg) : [];
   const panel = (m) => {
@@ -1063,17 +1086,12 @@ function nodeMenuHtml(key, p, projectPath, isDdev) {
     </div></li>`;
   };
   const tabs = MANAGERS.map((m) => `<li><a href="#">${m} <span class="uk-text-meta">· ${info.locks[m] ? 'lock ✓' : 'no lock'}</span></a></li>`).join('');
-  return `<span class="act-with-status"><div class="uk-inline act-menu act-menu-node">
-    <button class="uk-button uk-button-default uk-button-small" type="button" title="npm and yarn for this folder"><span uk-icon="icon: nut; ratio: .7"></span> NODE <span uk-icon="icon: chevron-down; ratio: .6"></span></button>
-    <div uk-dropdown="mode: click; pos: bottom-right" class="node-dropdown">
-      <ul class="uk-nav uk-dropdown-nav">
+  return `<ul class="uk-nav uk-dropdown-nav">
         <li class="uk-nav-header">Node · ${esc((info.pkg && typeof info.pkg.name === 'string' && info.pkg.name) || p)}</li>
         <li data-entry="how it runs"><span class="uk-text-meta">${isDdev ? 'Runs as ddev npm / ddev yarn in this project.' : "Not a DDEV project — runs in the dashboard's DDEV container."}${info.pinned ? ` packageManager: ${esc(info.pinned.spec)}.` : ''}${info.nodeModules ? ' node_modules is here.' : ' No node_modules yet.'}${info.valid ? '' : ' package.json is not valid JSON.'}</span></li>
       </ul>
       <ul class="uk-tab node-tabs" data-keep-open uk-tab="active: ${Math.max(0, MANAGERS.indexOf(info.preferred))}">${tabs}</ul>
-      <ul class="uk-switcher">${MANAGERS.map(panel).join('')}</ul>
-    </div>
-  </div><span class="act-status uk-text-meta">${esc(caption)}</span></span>`;
+      <ul class="uk-switcher">${MANAGERS.map(panel).join('')}</ul>`;
 }
 
 
@@ -3285,6 +3303,46 @@ function ddevMenuItemsHtml({ key, p, meta, projectPath, gates, ddev }) {
  * workspace's type must WANT the action (policy — `type:` in its settings file). Read once per page by
  * the rows, and once per request by a menu body served on its own.
  */
+/**
+ * The More menu's items for one project — the changelog, the recordings, the backups and the remove —
+ * before the Buttons settings arrange them. The row builds them to count what the caption says
+ * ("3 actions") and /fragments/row-menu/more/<ws>/<project> builds them again when the menu opens (#111).
+ * Both verbs of the teardown also live in the DDEV menu, where a DDEV project's teardown belongs. They
+ * stay here too: More is where someone looks for them, and a folder DDEV does not manage has no other home.
+ */
+function moreMenuItemsHtml({ key, p, gates }) {
+  const { canBackup, canRemove } = gates;
+  const items = [];
+  // What this product shipped, read from the CHANGELOG it already keeps. It belongs to the
+  // row rather than to the rail: a changelog is a fact about one product, and the question
+  // people ask is "what went into 1.0.3 of THIS", standing in front of it in its folder.
+  // The latest version is in the label, so the menu answers the common case unopened.
+  const cl = changelog.changelogFor(key, p);
+  if (cl) {
+    const latest = (changelog.changelogIndex().find((r) => r.workspace === key && r.item === p) || {}).latest || '';
+    items.push(`<li><a href hx-get="/fragments/changelog/${encodeURIComponent(key)}/${encodeURIComponent(p)}"
+      hx-target="#editor-modal-body" hx-swap="innerHTML" uk-toggle="target: #editor-modal"
+      title="Releases, newest first, from ${esc(cl.file)}"><span uk-icon="icon: history; ratio: .7"></span> Changelog${latest ? ` <span class="uk-text-meta">${esc(latest)}</span>` : ''}</a></li>`);
+  }
+  // Recordings about this project: a video, or audio, started from a set of pre-prompts.
+  if (projectMake.WORKSPACES.includes(key)) {
+    const makeLink = (kind, icon, label, hint) => `<li data-entry="${esc(label.toLowerCase())}"><a href hx-get="/fragments/projects/make-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}?kind=${kind}"
+      hx-target="#editor-modal-body" hx-swap="innerHTML" hx-on::after:request="UIkit.modal('#editor-modal').show()"
+      title="${esc(hint)}"><span uk-icon="icon: ${icon}; ratio: .7"></span> ${esc(label)}…</a></li>`;
+    items.push(makeLink('video', 'play-circle', 'Create a video', 'A narrated video about this project, from a set of pre-prompts'));
+    items.push(makeLink('audio', 'microphone', 'Create audio', 'A spoken recording about this project, from a set of pre-prompts'));
+    items.push('<li class="uk-nav-divider"></li>');
+  }
+  if (canBackup) items.push(`<li><a href="${wsUrl(key, '/backups')}"><span uk-icon="icon: album; ratio: .7"></span> Backups for this workspace</a></li>`);
+  if (canRemove) {
+    items.push('<li class="uk-nav-divider"></li>');
+    items.push(`<li><a href class="uk-text-danger" hx-get="/fragments/projects/remove-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}" hx-target="#editor-modal-body" hx-swap="innerHTML"
+      hx-on::after:request="UIkit.modal('#editor-modal').show()"
+      title="Asks about a backup, then confirms, then removes"><span uk-icon="icon: trash; ratio: .7"></span> Remove the project…</a></li>`);
+  }
+  return items.join('');
+}
+
 function rowGates(dir, meta) {
   const allowed = meta.typeActions;
   return {
@@ -3462,7 +3520,8 @@ async function screensMenuBody(ws, project) {
 
 // The row menus the core draws itself whose bodies load when they open — the slots
 // /fragments/row-menu/<slot>/<ws>/<project> answers with no `body` parameter (coreRowMenuBody).
-const CORE_ROW_MENUS = new Set(['ddev', 'composer', 'tests', 'screens']);
+// NODE and More joined in #111: a row carries their buttons and captions, not their dropdowns.
+const CORE_ROW_MENUS = new Set(['ddev', 'composer', 'tests', 'screens', 'node', 'more']);
 
 /**
  * The body of one of the core's row menus for one project, as `{ status, html }`: the dropdown's inner
@@ -3498,19 +3557,27 @@ async function coreRowMenuBody(slot, key, project) {
     const { nav, oob } = await screensMenuBody(key, project);
     return { status: 200, html: `<ul class="uk-nav uk-dropdown-nav">${nav}</ul>${oob}` };
   }
+  if (slot === 'node') {
+    const body = nodeMenuBody(key, project, projectPath, isDdev);
+    return body ? { status: 200, html: body } : none('No package.json here.');
+  }
+  if (slot === 'more') {
+    const items = moreMenuItemsHtml({ key, p: project, gates });
+    return items ? { status: 200, html: `<ul class="uk-nav uk-dropdown-nav">${items}</ul>` } : none('Nothing more to offer here.');
+  }
   return none('No such menu.');
 }
 
 /**
  * The Buttons settings page lists what each menu has been seen to hold (row-layout's seen record). A
  * menu whose body loads when it opens (coreRowMenuBody) is recorded when one opens, so on a dashboard
- * where nobody has opened COMPOSER or Tests yet the page would list nothing for them: before it is drawn,
+ * where nobody has opened COMPOSER, Tests or NODE yet the page would list nothing for them: before it is drawn,
  * each such menu with nothing on record is built once, for the first project that carries it, and
  * arranged — which is what records it. DDEV is counted on every row, so it is on record already, and
  * SCREENS lists whatever sessions happen to run, which is nothing to learn from.
  */
 async function learnCoreMenus() {
-  for (const slot of ['composer', 'tests']) {
+  for (const slot of ['composer', 'tests', 'node']) {
     if (Object.keys(rowLayout.seenMenu(slot).groups).length) continue;
     let learned = false;
     for (const [key, meta] of Object.entries(loadWorkspaces())) {
@@ -3727,47 +3794,17 @@ async function projectRowsHtml(key, dir, state) {
             </div><span class="act-status uk-text-meta">${!rag.up ? 'offline' : built ? 'indexed' : 'none'}</span></span>`;
           })() : '';
     const moreMenu = (() => {
-            // Both verbs also live in the DDEV menu, where a DDEV project's
-            // teardown belongs. They stay here too: More is where someone looks
-            // for them, and a folder DDEV does not manage has no other home.
-            const items = [];
-            // What this product shipped, read from the CHANGELOG it already keeps. It belongs to the
-            // row rather than to the rail: a changelog is a fact about one product, and the question
-            // people ask is "what went into 1.0.3 of THIS", standing in front of it in its folder.
-            // The latest version is in the label, so the menu answers the common case unopened.
-            const cl = changelog.changelogFor(key, p);
-            if (cl) {
-              const latest = (changelog.changelogIndex().find((r) => r.workspace === key && r.item === p) || {}).latest || '';
-              items.push(`<li><a href hx-get="/fragments/changelog/${encodeURIComponent(key)}/${encodeURIComponent(p)}"
-                hx-target="#editor-modal-body" hx-swap="innerHTML" uk-toggle="target: #editor-modal"
-                title="Releases, newest first, from ${esc(cl.file)}"><span uk-icon="icon: history; ratio: .7"></span> Changelog${latest ? ` <span class="uk-text-meta">${esc(latest)}</span>` : ''}</a></li>`);
-            }
-            // Recordings about this project: a video, or audio, started from a set of pre-prompts.
-            if (projectMake.WORKSPACES.includes(key)) {
-              const makeLink = (kind, icon, label, hint) => `<li data-entry="${esc(label.toLowerCase())}"><a href hx-get="/fragments/projects/make-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}?kind=${kind}"
-                hx-target="#editor-modal-body" hx-swap="innerHTML" hx-on::after:request="UIkit.modal('#editor-modal').show()"
-                title="${esc(hint)}"><span uk-icon="icon: ${icon}; ratio: .7"></span> ${esc(label)}…</a></li>`;
-              items.push(makeLink('video', 'play-circle', 'Create a video', 'A narrated video about this project, from a set of pre-prompts'));
-              items.push(makeLink('audio', 'microphone', 'Create audio', 'A spoken recording about this project, from a set of pre-prompts'));
-              items.push('<li class="uk-nav-divider"></li>');
-            }
-            if (canBackup) items.push(`<li><a href="${wsUrl(key, '/backups')}"><span uk-icon="icon: album; ratio: .7"></span> Backups for this workspace</a></li>`);
-            if (canRemove) {
-              items.push('<li class="uk-nav-divider"></li>');
-              items.push(`<li><a href class="uk-text-danger" hx-get="/fragments/projects/remove-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}" hx-target="#editor-modal-body" hx-swap="innerHTML"
-                hx-on::after:request="UIkit.modal('#editor-modal').show()"
-                title="Asks about a backup, then confirms, then removes"><span uk-icon="icon: trash; ratio: .7"></span> Remove the project…</a></li>`);
-            }
             // Arranged before it is counted, like DDEV — and whether there is a More at all is decided after,
-            // since hiding can empty it and a custom action can fill it.
-            const arranged = rowLayout.arrangeNavInner('more', items.join(''), rowCtx);
+            // since hiding can empty it and a custom action can fill it. The row carries the button and the
+            // count; the items arrive from /fragments/row-menu/more/<ws>/<project> when the menu opens.
+            const arranged = rowLayout.arrangeNavInner('more', moreMenuItemsHtml({ key, p, gates }), rowCtx);
             if (!/<li\b/.test(arranged)) return '';
             // Dividers are not actions — count only what can be clicked.
             const n = (arranged.match(/<a /g) || []).length;
-            return `<span class="act-with-status"><div class="uk-inline act-menu act-menu-more">
-              <button class="uk-button uk-button-default uk-button-small" type="button" title="More actions"><span uk-icon="icon: more; ratio: .7"></span> More <span uk-icon="icon: chevron-down; ratio: .6"></span></button>
-              <div uk-dropdown="mode: click; pos: bottom-right"><ul class="uk-nav uk-dropdown-nav">${arranged}</ul></div>
-            </div><span class="act-status uk-text-meta">${n} action${n === 1 ? '' : 's'}</span></span>`;
+            return menuShellHtml('more', {
+              key, project: p, caption: `${n} action${n === 1 ? '' : 's'}`,
+              html: '<button class="uk-button uk-button-default uk-button-small" type="button" title="More actions"><span uk-icon="icon: more; ratio: .7"></span> More <span uk-icon="icon: chevron-down; ratio: .6"></span></button>',
+            });
           })();
     // SCREENS is drawn beside the running state in the card's head, so the tool strip leaves it out.
     const screensOnTools = '';
@@ -5783,7 +5820,7 @@ const server = http.createServer(async (req, res) => {
       // The body of a plugin's row menu that loads when it opens (plugin-loader's rowMenuHtml): the
       // plugin's own fragment, arranged like an inline menu's items — the Buttons settings hide, order
       // and add to it the same way, and the settings page sees its entries once one has been opened.
-      // The core's own menus (DDEV, COMPOSER, Tests, SCREENS) take the same route with no `body`: their
+      // The core's own menus (DDEV, COMPOSER, Tests, SCREENS, NODE, More) take the same route with no `body`: their
       // bodies come from coreRowMenuBody, computed for this one project when the menu opens.
       if (pathname.startsWith('/fragments/row-menu/')) {
         const m = pathname.match(/^\/fragments\/row-menu\/([a-z0-9-]+)\/([a-z0-9_-]+)\/([a-zA-Z0-9_-]+)$/);

package/core/workspace-app/tests/unit/images-svg.test.js

@@ -168,10 +168,16 @@ test('a drawing that lost shapes to the sanitiser is drawn again; one that never
   }
 });
 
-test('Gemini and Anthropic need a real key; Claude Code draws in a session, retried by its finish step', async () => {
+test('Gemini and Anthropic need a real key; Claude Code draws in a session, retried by its finish step', async (t) => {
   const noKey = await svg.generateSvg({ prompt: 'x', provider: 'anthropic', confirm: 'yes' });
   assert.equal(noKey.status, 503);
   assert.match(noKey.error, /ai_providers\.anthropic\.api_key/);
+  // The rest drives Claude Code, which needs the claude CLI on this machine (#113).
+  const claude = require('../../images-providers').get('claude_code_cli').available();
+  if (!claude.ok) {
+    t.skip(`needs Claude Code: ${claude.why}`);
+    return;
+  }
   const calls = [];
   const dir = fs.mkdtempSync(path.join(os.tmpdir(), 'svgcc-'));
   try {

package/core/workspace-app/tests/unit/node-menu.test.js

@@ -153,7 +153,11 @@ test('the row shows NODE right after COMPOSER, only where there is a package.jso
   assert.strictEqual(DEFAULT_LINES[1][DEFAULT_LINES[1].indexOf('composer') + 1], 'node', 'NODE must come right after COMPOSER by default');
   assert.strictEqual((src.match(/\bnode: nodeMenu\b/g) || []).length, 1, 'handed to the layout once per row');
   const fn = src.slice(src.indexOf('function nodeMenuHtml'), src.indexOf('function openWithMenuHtml'));
-  assert.match(fn, /if \(!hasPackageJson\(projectPath\)\) return '';/, 'no package.json, no button');
+  assert.match(fn, /if \(!hasPackageJson\(projectPath\)\) return null;/, 'no package.json, no button');
+  // The row carries the button and the caption; the tabs arrive when the menu opens (#111).
+  assert.match(fn, /return menuShellHtml\('node', \{/, 'the row draws the lazy shell');
+  assert.match(src, /const CORE_ROW_MENUS = new Set\(\[[^\]]*'node'[^\]]*\]\);/, 'the core serves the NODE body itself');
+  assert.match(src, /if \(slot === 'node'\) \{\s*const body = nodeMenuBody\(key, project, projectPath, isDdev\);/, 'coreRowMenuBody answers NODE');
   assert.match(fn, /uk-tab="active: \$\{Math\.max\(0, MANAGERS\.indexOf\(info\.preferred\)\)\}"/, 'opens on the manager the project uses');
   assert.match(fn, /info\.locks\[m\] \? 'lock ✓' : 'no lock'/, 'each tab says whether its lock file is there');
   assert.match(fn, /hx-include="closest \.node-package"/);

package/core/workspace-app/tests/unit/row-menu-fragments.test.js

@@ -47,7 +47,7 @@ before(async () => {
   fs.writeFileSync(path.join(site, 'composer.lock'), '{}');
   fs.writeFileSync(path.join(site, 'package.json'), JSON.stringify({ name: 'site-one', scripts: { 'lint:js': 'eslint .' } }));
   fs.mkdirSync(path.join(root, 'dev/plain-folder'), { recursive: true });
-  for (const f of ['cmd-tools-testing.sh', 'cmd-tools-checks.sh', 'cmd-tools-add-users.sh']) fs.writeFileSync(path.join(root, 'dev', f), '#!/usr/bin/env bash\n');
+  for (const f of ['cmd-tools-testing.sh', 'cmd-tools-checks.sh', 'cmd-tools-add-users.sh', 'cmd-tools-remove.sh']) fs.writeFileSync(path.join(root, 'dev', f), '#!/usr/bin/env bash\n');
   // A package: no DDEV, a package.json that declares checks.
   const pkg = path.join(root, 'products/pkg-one');
   fs.mkdirSync(pkg, { recursive: true });
@@ -90,7 +90,7 @@ test('a project row carries the button, the caption and an empty shell for each
   const { status, html } = await text('/dev');
   assert.strictEqual(status, 200);
   const row = rowOf(html, 'site-one');
-  for (const slot of ['ddev', 'composer', 'tests', 'screens']) {
+  for (const slot of ['ddev', 'composer', 'tests', 'screens', 'node', 'more']) {
     const menu = menuOf(row, slot);
     assert.ok(menu, `${slot}: the row has the menu`);
     assert.match(menu, new RegExp(`hx-get="/fragments/row-menu/${slot}/dev/site-one"`), `${slot}: the shell asks the core route for its body`);
@@ -108,8 +108,12 @@ test('a project row carries the button, the caption and an empty shell for each
   assert.match(menuOf(row, 'tests'), /uk-button-secondary/, 'the Tests button as it was');
   assert.match(menuOf(row, 'screens'), /hx-trigger="menu-opened, load, every 30s, screens-changed from:body"/, 'SCREENS still polls: the hand and the agent badge ride on its answer');
   assert.match(menuOf(row, 'screens'), /<span class="act-status uk-text-meta">none<\/span>/);
+  // NODE says which lock files are there; More counts what it holds (#111).
+  assert.match(menuOf(row, 'node'), /<span class="act-status uk-text-meta">no lock<\/span>/);
+  assert.match(menuOf(row, 'node'), /class="act-menu-lazy node-dropdown"/, 'the NODE width class rides on the shell');
+  assert.match(menuOf(row, 'more'), /<span class="act-status uk-text-meta">\d+ actions?<\/span>/, 'the More caption counts the actions the body will hold');
   // Nothing of the bodies is on the page.
-  for (const inner of ['/actions/ddev-restart', '/actions/ddev-describe', '/actions/composer-install', '/actions/testing-configure', '/actions/checks-plan', 'composer-package', 'checks-sub', 'ddev-nav-columns']) {
+  for (const inner of ['/actions/ddev-restart', '/actions/ddev-describe', '/actions/composer-install', '/actions/testing-configure', '/actions/checks-plan', 'composer-package', 'checks-sub', 'ddev-nav-columns', 'node-tabs', 'node-col-commands', 'Scripts in package.json', '/fragments/projects/remove-form/dev/site-one', 'Remove the project']) {
     assert.ok(!row.includes(inner), `${inner} is not on the page before a menu opens`);
   }
   // A folder with no DDEV config has the Configure DDEV button and no DDEV menu; no composer.json, no COMPOSER.
@@ -174,7 +178,8 @@ test('the Tests body for a package is the checks alone, and a plain folder in a
   assert.match(pkg.html, /<span class="checks-alias">css<\/span>/);
   assert.ok(!pkg.html.includes('/actions/testing-configure') && !pkg.html.includes('/actions/add-users'), 'a packages workspace has no suite and no test users');
   const page = (await text('/products')).html;
-  assert.match(menuOf(rowOf(page, 'pkg-one'), 'tests'), /<span class="act-status uk-text-meta">(2 declared|deps missing)<\/span>/, 'the caption says what the package declares');
+  // Nothing on a package row posts with its name any more (NODE's body is served, #111): found by its Tests shell.
+  assert.match(menuOf(rowOf(page, 'pkg-one', '/fragments/row-menu/tests/products/pkg-one'), 'tests'), /<span class="act-status uk-text-meta">(2 declared|deps missing)<\/span>/, 'the caption says what the package declares');
   const plain = await text('/fragments/row-menu/tests/dev/plain-folder');
   assert.strictEqual(plain.status, 200);
   assert.match(plain.html, /hx-post="\/actions\/testing-configure"/);
@@ -197,13 +202,40 @@ test('the SCREENS body lists the sessions (none here), the ways to start one, an
   assert.match(legacy.html, /^\s*<li class="uk-nav-header">No screens in this project<\/li>/);
 });
 
+test('the NODE body for a site is the header, the yarn and npm tabs and the scripts of package.json (#111)', async () => {
+  const { status, html } = await text('/fragments/row-menu/node/dev/site-one');
+  assert.strictEqual(status, 200);
+  assert.match(html, /^<ul class="uk-nav uk-dropdown-nav">/);
+  assert.match(html, /Node · site-one/);
+  assert.match(html, /Runs as ddev npm \/ ddev yarn in this project\./);
+  assert.match(html, /<ul class="uk-tab node-tabs" data-keep-open uk-tab="active: \d+">/, 'the tabs keep the menu open');
+  assert.match(html, /<ul class="uk-switcher">/);
+  assert.match(html, /yarn\.lock is not here/);
+  assert.match(html, /package-lock\.json is not here/);
+  assert.match(html, /hx-include="closest \.node-package"/);
+  assert.match(html, /Scripts in package\.json/);
+  assert.match(html, /"script":"lint:js"/, 'the script from package.json is offered');
+  assert.match(html, /hx-vals='\{"workspace":"dev","projectName":"site-one","manager":"npm"\}'/, 'the items post for this project');
+});
+
+test('the More body for a site holds the remove, arranged, and the row counted it (#111)', async () => {
+  const { status, html } = await text('/fragments/row-menu/more/dev/site-one');
+  assert.strictEqual(status, 200);
+  assert.match(html, /^<ul class="uk-nav uk-dropdown-nav">/);
+  assert.match(html, /hx-get="\/fragments\/projects\/remove-form\/dev\/site-one"/);
+  assert.match(html, /Remove the project…/);
+  const page = (await text('/dev')).html;
+  const count = Number(/(\d+) actions?/.exec(menuOf(rowOf(page, 'site-one'), 'more'))[1]);
+  assert.strictEqual((html.match(/<a /g) || []).length, count, 'the row counts the actions the body holds');
+});
+
 test('a project that is not there, a menu the row would not draw, and a slot that is not a menu are 404', async () => {
   for (const [p, why] of [
     ['/fragments/row-menu/ddev/dev/no-such-project', 'no such project'],
     ['/fragments/row-menu/ddev/dev/plain-folder', 'not a DDEV project'],
     ['/fragments/row-menu/composer/dev/plain-folder', 'no composer.json'],
     ['/fragments/row-menu/ddev/products/pkg-one', 'a packages workspace has no DDEV'],
-    ['/fragments/row-menu/more/dev/site-one', 'More is drawn inline, not served'],
+    ['/fragments/row-menu/node/dev/plain-folder', 'no package.json'],
     ['/fragments/row-menu/ddev/nope/site-one', 'no such workspace'],
     ['/fragments/row-menu/ddev/dev/site-one?body=/fragments/p/x/menu', 'a core slot takes no plugin body'],
     ['/fragments/row-menu/x-plugin/dev/site-one', 'a plugin slot nobody registered'],
@@ -226,4 +258,6 @@ test('the Buttons settings page learns the lazy menus\' entries without anyone o
   assert.ok(seen.composer && Object.keys(seen.composer.groups).length > 0, 'COMPOSER has groups on record');
   assert.ok(seen.tests && Object.keys(seen.tests.groups).length > 0, 'Tests has groups on record');
   assert.ok(seen.ddev && Object.keys(seen.ddev.groups).length > 0, 'DDEV is on record from the rows themselves');
+  assert.ok(seen.node && Object.keys(seen.node.groups).length > 0, 'NODE has groups on record (learned, #111)');
+  assert.ok(seen.more && Object.keys(seen.more.groups).length > 0, 'More is on record from the rows themselves');
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webship.co/workspace",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Webship Workspace: a container-based development workspace with a web dashboard. The core ships empty; workspace folders, hosting providers, git forges, container runtimes and features are @webship.co/workspace-<name> plugins you add one at a time.",
   "license": "GPL-2.0-or-later",
   "repository": {