clickroom 0.1.0 → 0.3.0

package/README.md

@@ -98,6 +98,28 @@ Each `clickroom` terminal is a live **session**. The dashboard (`/`, team only)
 
 In a review, the project name in the toolbar is a switcher with the same list. `clickroom list` prints it in the terminal.
 
+## Workspaces
+
+On clickroom.dev every team has a workspace at its own address, `<workspace>.clickroom.dev`, with its own people, projects, comments and builds. Each review is at `<workspace>.clickroom.dev/<project>`.
+
+- **The quickest start:** `npx clickroom` in a project's folder, nothing set up. It opens clickroom.dev, where you sign in (Google, or a link by email). New people name their workspace there, filled in for them (`olga@acme.com` → *Acme*, `acme.clickroom.dev`; a personal address → *Olga's workspace*); people with a workspace pick it. That one click connects the computer. The browser lands on the workspace's setup page, which opens v1 when the terminal has pushed it.
+- **Signing up:** on clickroom.dev, *Start a workspace* signs you in with your email address (a link, or Google). Someone without a workspace goes straight to step 1, its name and address (filled in the same way). The rest of the setup is at `<workspace>.clickroom.dev/welcome`.
+  Step 2, share your first prototype: one command in the project's folder, `npx clickroom --workspace <slug>`. The first run opens the site to connect the computer (one click), then builds the project and pushes v1. The page ticks off when the computer connects and when v1 arrives.
+
+  Teammates and clients are invited later, from the dashboard.
+
+  Until the owner finishes or skips the setup, the dashboard offers to continue it. Teammates land on the same page from their invite, with only the install-and-connect step.
+- **Your workspaces:** clickroom.dev lists every workspace your address is in, as an owner, teammate or client. *Open* signs you in there. Each workspace's dashboard has *Switch* next to its name.
+- **Sharing from a computer:** `npx clickroom --workspace <workspace>` in a project's folder: it connects the computer the first time, then shares the project. `clickroom login <workspace>` only connects. Builds are uploaded. Live dev servers (the relay) belong to the first workspace only.
+- **Separate by design:** a sign-in, a CLI key or a share link of one workspace opens nothing in another, even for a project with the same name (`test/workspaces.test.js`). The admin key and the Slack webhook belong to the first workspace.
+
+How it's set up:
+- `APP_HOST` (`{ws}.clickroom.dev`) and `DEFAULT_WS` (`yna`) turn workspaces on. The first workspace keeps its storage from before workspaces (Registry `registry`, rooms and builds by project name). Others use Registry `ws:<slug>`, and rooms and builds under `<slug>/`.
+- The `Directory` Durable Object knows every workspace and which email addresses are in each. Each workspace's Registry keeps that list up to date.
+- The bare domain (`AUTH_URL`) has the public pages, `/login` and the list of your workspaces. It also keeps the API for CLIs set up before, and Google's return address.
+- Prototypes run on `{name}--{ws}.clickroom-preview.dev` (`PROTO_HOST`), a separate site. Each review address frames the review from there.
+- `PASSTHROUGH_HOSTS` lists hosts under the wildcard route that aren't the app's, such as the relay's tunnel.
+
 ## People
 
 Everyone except share-link clients signs in as themselves, by email address. A browser stays signed in for 30 days from its last visit; signing in again while signed in (clickroom.dev's *Sign in*) goes straight to the dashboard.
@@ -130,12 +152,12 @@ Teammates share their own builds with you through your clickroom (for example cl
 
 ```sh
 npm install -g clickroom
-clickroom login              # opens clickroom in the browser: approve this computer
+clickroom login              # opens clickroom in the browser: sign in, approve this computer
 cd ~/code/their-app
 clickroom                    # builds it, uploads it as v1; p pushes the next version
 ```
 
-- **`clickroom login`** asks clickroom for a login and opens a page where they approve this computer. They sign in from their invite there, as a teammate. Clients can't connect the command. The page and the terminal show the same code to compare.
+- **`clickroom login`** asks clickroom for a login and opens a page where they approve this computer. They sign in there with the address they were invited with, and pick the workspace if they're in several (`clickroom login acme` goes straight to acme). Clients can't connect the command. The page and the terminal show the same code to compare.
   - The terminal then gets a key of its own in `~/.clickroom/credentials.json` (readable only by them). It lasts 90 days from its last use.
   - `clickroom logout` ends it. *Revoke* on the People panel ends it as well, along with their browser sign-ins.
   - `clickroom login https://other.example` connects to another clickroom server; `clickroom whoami` shows who's connected.

package/bin/clickroom.js

@@ -7,11 +7,12 @@ import { call } from '../cli/client.js';
 
 const HELP = `clickroom: multiplayer review for locally built prototypes
 
-On a teammate's computer
-  clickroom login [url]       connect this computer to your team's clickroom (default https://clickroom.dev):
-                              approve it in the browser where you're signed in from your invite
-  clickroom                   then, in a project: builds it, uploads it as v1 and keeps the session open
-                              (p pushes the next version). The team sees it on the dashboard.
+Share a project with your workspace
+  npx clickroom               in a project: the first time it opens clickroom.dev to connect this
+                              computer (sign in, pick or name your workspace), then builds the project,
+                              uploads it as v1 and keeps the session open (p pushes the next version)
+  npx clickroom --workspace acme   the same, straight to acme.clickroom.dev
+  clickroom login [workspace] only connect; then run clickroom in a project
   clickroom logout | whoami
 
 Share the project you're in (run inside any project folder)
@@ -80,6 +81,7 @@ const { values: opts, positionals } = parseArgs({
     build: { type: 'string' },
     live: { type: 'boolean' },
     'no-open': { type: 'boolean' },
+    workspace: { type: 'string', short: 'w' },
     print: { type: 'boolean' },
     'no-comments': { type: 'boolean' },
     'no-questions': { type: 'boolean' },

package/cli/gaps.js

@@ -18,7 +18,7 @@ const questionCount = async (name) =>
 
 // Resolves to the number of questions it added (drafts), or throws.
 export async function findGaps(name, root) {
-  if (!hasClaude()) throw new Error('Claude Code (`claude`) is not installed on this Mac');
+  if (!hasClaude()) throw new Error('Claude Code (`claude`) is not installed on the computer running `clickroom` for this project');
   const before = await questionCount(name);
   const mcp = JSON.stringify({ mcpServers: { clickroom: { command: process.execPath, args: [path.join(ROOT, 'bin', 'clickroom.js'), 'mcp'] } } });
   const args = ['-p', gapsPrompt(name), '--mcp-config', mcp, '--strict-mcp-config', '--tools', 'Read,Glob,Grep', '--allowedTools', TOOLS.join(','), '--disallowedTools', NEVER.join(','), '--no-session-persistence'];

package/cli/login.js

@@ -5,14 +5,47 @@ import { bold, dim } from './dev.js';
 
 export const DEFAULT_URL = 'https://clickroom.dev';
 
-// `clickroom login [url]`: connects this computer to a clickroom server as you. It opens a page in
-// your browser (where you're signed in from your invite) to approve this computer, then keeps a
-// key of its own in ~/.clickroom/credentials.json.
+// `clickroom login [workspace|url]`: connects this computer to a clickroom workspace as you
+// ("acme" means https://acme.clickroom.dev; none: clickroom.dev asks). It opens a page in your
+// browser to approve this computer, then keeps a key of its own in ~/.clickroom/credentials.json.
+// "acme" → https://acme.clickroom.dev; a URL stays as it is.
+export function workspaceUrl(arg) {
+  if (/^[a-z][a-z0-9-]{1,19}$/.test(arg)) return `https://${arg}.${new URL(DEFAULT_URL).hostname}`;
+  return String(arg).replace(/\/$/, '');
+}
+
 export async function login(arg) {
-  const url = (arg || process.env.CLICKROOM_URL || credentials()?.url || DEFAULT_URL).replace(/\/$/, '');
-  if (!/^https?:\/\//.test(url)) throw new Error('usage: clickroom login [https://clickroom.example]');
+  if (arg) arg = workspaceUrl(arg);
+  const known = arg || process.env.CLICKROOM_URL || credentials()?.url;
+  // No workspace given (and none from before): clickroom.dev asks in the browser, where you sign
+  // in and pick yours, or name a new one.
+  if (!known) return connect();
+  const url = known.replace(/\/$/, '');
+  if (!/^https?:\/\//.test(url)) throw new Error('usage: clickroom login <workspace>   (or a URL: clickroom login https://acme.clickroom.dev)');
   if (adminToken() && !process.env.CLICKROOM_TOKEN) console.log(dim('  This computer has the admin key (.dev.vars), which the clickroom command uses first.'));
-  const res = await fetch(`${url}/__ps/api/cli-login`, {
+  const start = await begin(`${url}/__ps/api/cli-login`, url);
+  console.log(`\n  Approve this computer in your browser:\n  ${bold(start.url)}\n`);
+  console.log(`  Check that the page shows ${bold(start.code)}.`);
+  console.log(dim('  Not signed in there? Sign in with the email address you were invited with.\n'));
+  openUrl(start.url);
+  const d = await wait(`${url}/__ps/api/cli-login/poll`, start);
+  done(url, d);
+}
+
+// The first `npx clickroom` on a computer: started on clickroom.dev, approved in the browser
+// (signing in with Google is most of it), connected to the workspace picked or made there.
+async function connect() {
+  const auth = (process.env.CLICKROOM_AUTH_URL || DEFAULT_URL).replace(/\/$/, '');
+  const start = await begin(`${auth}/__ps/api/connect`, auth);
+  console.log(`\n  Opening clickroom in your browser to connect this computer:\n  ${bold(start.url)}\n`);
+  console.log(dim(`  Sign in there (new here? you name your workspace next). It shows ${start.code}.\n`));
+  openUrl(start.url);
+  const d = await wait(`${auth}/__ps/api/connect/poll`, start);
+  done(d.url.replace(/\/$/, ''), d);
+}
+
+async function begin(endpoint, url) {
+  const res = await fetch(endpoint, {
     method: 'POST',
     headers: { 'content-type': 'application/json' },
     body: JSON.stringify({ label: `${os.userInfo().username} on ${os.hostname().replace(/\.local$/, '')}` }),
@@ -20,16 +53,14 @@ export async function login(arg) {
   if (!res) throw new Error(`Can't reach ${url}.`);
   const start = await res.json().catch(() => ({}));
   if (!res.ok) throw new Error(start.error || `${url} answered ${res.status}`);
+  return start;
+}
 
-  console.log(`\n  Approve this computer in your browser:\n  ${bold(start.url)}\n`);
-  console.log(`  Check that the page shows ${bold(start.code)}.`);
-  console.log(dim('  Not signed in there? Sign in with the email address you were invited with.\n'));
-  openUrl(start.url);
-
+async function wait(endpoint, start) {
   const until = Date.now() + start.expiresIn * 1000;
   while (Date.now() < until) {
     await new Promise((r) => setTimeout(r, 2000));
-    const r = await fetch(`${url}/__ps/api/cli-login/poll`, {
+    const r = await fetch(endpoint, {
       method: 'POST',
       headers: { 'content-type': 'application/json' },
       body: JSON.stringify({ poll: start.poll }),
@@ -37,14 +68,14 @@ export async function login(arg) {
     if (!r?.ok) continue;
     const d = await r.json();
     if (d.status === 'expired') break;
-    if (d.status === 'approved') {
-      saveCredentials({ url, token: d.token, name: d.me.name, email: d.me.email || null, at: new Date().toISOString() });
-      console.log(`${bold('✔')} Signed in to ${url} as ${bold(d.me.name)}${d.me.email ? ` (${d.me.email})` : ''}.`);
-      console.log(dim('  Run `clickroom` in a project to share it.'));
-      return;
-    }
+    if (d.status === 'approved') return d;
   }
-  throw new Error('The approval link expired. Run `clickroom login` again.');
+  throw new Error('The approval link expired. Run it again.');
+}
+
+function done(url, d) {
+  saveCredentials({ url, token: d.token, name: d.me.name, email: d.me.email || null, at: new Date().toISOString() });
+  console.log(`${bold('✔')} Connected to ${bold(url.replace(/^https?:\/\//, ''))} as ${bold(d.me.name)}${d.me.email ? ` (${d.me.email})` : ''}.`);
 }
 
 export async function logout() {

package/cli/note.js

@@ -3,7 +3,7 @@ import { call } from './client.js';
 import { changedSource, folderChanges } from './changes.js';
 
 // The version note when a push comes without one ("Push v16" on the dashboard, or an empty
-// answer in the terminal): Claude Code on this Mac (`claude -p`) describes the source changes
+// answer in the terminal): Claude Code on this computer (`claude -p`) describes the source changes
 // since the last push as reviewers will notice them, plus the comments fixed in this version.
 // Without git, Claude or a usable answer: the fixed comments, else the changed file names.
 // CLICKROOM_AUTO_NOTE=off never asks Claude.

package/cli/share.js

@@ -2,7 +2,7 @@ import fs from 'node:fs';
 import readline from 'node:readline';
 import { spawn } from 'node:child_process';
 import path from 'node:path';
-import { readLocal, writeLocal, copyBuild, cloudUrl, baseUrl, isTeammate, adminToken, ROOT } from './config.js';
+import { readLocal, writeLocal, copyBuild, cloudUrl, baseUrl, isTeammate, adminToken, credentials, ROOT } from './config.js';
 import { call, isUp, signinLink } from './client.js';
 import { projectRoot, projectName, parseTarget, detectTarget } from './detect.js';
 import { startServer, bold, dim } from './dev.js';
@@ -26,10 +26,18 @@ export async function share(arg, opts) {
   const port = Number(opts.port || cfg.port || 8787);
   // In cloud mode comments, versions and links live on the deployed worker; this Mac only
   // relays Live views and API calls (the local server, usually the background service).
+  // Not connected to a workspace yet (`npx clickroom` in a fresh project): connect first (signing in
+  // in the browser; --workspace acme skips picking it there), then share, in the same run.
+  const hasServer = fs.existsSync(path.join(ROOT, 'node_modules', '.bin', 'wrangler'));
+  if (!opts.local && !adminToken() && !process.env.CLICKROOM_TOKEN) {
+    const { login, workspaceUrl } = await import('./login.js');
+    const want = opts.workspace ? workspaceUrl(opts.workspace) : null;
+    if (want ? credentials()?.url !== want : !credentials() && !hasServer) await login(opts.workspace);
+  }
   // A teammate's computer (`clickroom login`): their builds go to the team's clickroom server.
   const teammate = isTeammate() && !opts.local;
-  if (!teammate && !adminToken() && !fs.existsSync(path.join(ROOT, 'node_modules', '.bin', 'wrangler'))) {
-    throw new Error('Not signed in. Run `clickroom login` first (it opens clickroom in your browser).');
+  if (!teammate && !adminToken() && !hasServer) {
+    throw new Error('Not connected to a workspace. Run `npx clickroom` (it opens clickroom in your browser).');
   }
   const cloud = opts.local ? null : cloudUrl();
   if (!cloud) process.env.CLICKROOM_URL = `http://localhost:${port}`;
@@ -102,8 +110,9 @@ export async function share(arg, opts) {
   let base, teamUrl, clientUrl;
   const links = () => {
     base = tunnelUrl || `http://localhost:${port}`;
-    teamUrl = `${base}/s/${encodeURIComponent(name)}`;
-    clientUrl = `${project.origin || base}/s/${encodeURIComponent(name)}?t=${project.token}`;
+    // The review's own address when the server has one (APP_URL/<name>), else /s/<name>.
+    teamUrl = project.reviewUrl || `${base}/s/${encodeURIComponent(name)}`;
+    clientUrl = `${project.reviewUrl || `${project.origin || base}/s/${encodeURIComponent(name)}`}?t=${project.token}`;
     console.log('');
     console.log(`  ${bold('Review (you, team)')}  ${teamUrl} ${dim('(press o to open it signed in)')}`);
     console.log(`  ${bold('Client link')}         ${clientUrl}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clickroom",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "Share prototype builds for review: pins, region comments, threads, versions, and agent hand-off (MCP). Teammates push builds to their team’s clickroom with `clickroom login`.",
   "type": "module",
   "bin": {