clay-server 5.2.0-beta.10 → 5.2.0-beta.12

package/lib/public/modules/project-start-dialog.js

@@ -0,0 +1,130 @@
+// project-start-dialog.js - One fixed-size dialog for choosing how to start a project
+
+import { store } from './store.js';
+import { iconHtml, refreshIcons } from './icons.js';
+import { openState, closeState, selectView } from './project-start-state.js';
+import { folderViewHtml, bindFolderView, renderFolderView, startFolderBrowse, resetFolderState, handleBrowseDirResult } from './project-start-folder-view.js';
+import { formViewHtml, bindFormView, renderFormView } from './project-start-forms.js';
+import { submitFolder, handleAddProjectResult, handleCloneProgress } from './project-start-submit.js';
+
+export { handleBrowseDirResult, handleAddProjectResult, handleCloneProgress };
+
+var TITLES = { choices: 'Start a project', open: 'Open a folder', create: 'Create a project', clone: 'Clone a repository' };
+var CHOICES = [
+  { view: 'open', icon: 'folder-open', title: 'Open an existing folder', text: 'Use a directory on the machine running Clay.' },
+  { view: 'create', icon: 'plus', title: 'Create a new project', text: 'Start in a new, empty project directory.' },
+  { view: 'clone', icon: 'git-branch', title: 'Clone a repository', text: 'Bring an existing Git repository into Clay.' },
+];
+var shownGen = -1;
+var opener = null;
+
+function modal() { return document.getElementById('project-start-modal'); }
+function body() { return document.getElementById('project-start-body'); }
+function current() { return store.get('projectStart'); }
+
+function choicesHtml() {
+  var html = '<div class="project-start-view" data-view="choices"><div class="project-start-scroll"><ul class="project-start-rows project-start-choices" role="list">';
+  for (var i = 0; i < CHOICES.length; i++) {
+    var c = CHOICES[i];
+    html += '<li><button type="button" class="project-start-row project-start-choice" data-choice="' + c.view + '">' +
+      iconHtml(c.icon, 'project-start-choice-icon') + '<span class="project-start-choice-text"><strong>' + c.title + '</strong><span>' + c.text + '</span></span>' +
+      iconHtml('chevron-right') + '</button></li>';
+  }
+  return html + '</ul></div></div>';
+}
+
+function focusFirst(view) {
+  var target = null;
+  if (view === 'choices') target = body().querySelector('[data-choice]');
+  else if (view === 'open') target = body().querySelector('[data-ps="list"]');
+  else target = body().querySelector('[data-ps="field"]');
+  if (!target) target = modal().querySelector('.project-start-dialog');
+  target.focus({ preventScroll: true });
+}
+
+function renderShell(view) {
+  var container = body();
+  document.getElementById('project-start-title').textContent = TITLES[view];
+  document.getElementById('project-start-back').hidden = view === 'choices';
+  document.getElementById('project-start-subtitle').hidden = view !== 'choices';
+  if (view === 'choices') container.innerHTML = choicesHtml();
+  else if (view === 'open') { container.innerHTML = folderViewHtml(); bindFolderView(submitFolder); }
+  else { container.innerHTML = formViewHtml(view); bindFormView(view); }
+  refreshIcons();
+}
+
+function render(state, previous) {
+  var overlay = modal();
+  if (!overlay) return;
+  if (state.view === null) {
+    if (!overlay.classList.contains('hidden')) hide();
+    return;
+  }
+  if (state.gen !== shownGen || previous.view === null) {
+    shownGen = state.gen;
+    overlay.classList.remove('hidden');
+    renderShell(state.view);
+    if (state.view === 'open') { resetFolderState(); startFolderBrowse(); }
+    if (state.view === 'create' || state.view === 'clone') renderFormView(state.view);
+    focusFirst(state.view);
+    return;
+  }
+  if (state.view === 'open') renderFolderView();
+  else if (state.view === 'create' || state.view === 'clone') renderFormView(state.view);
+}
+
+function hide() {
+  modal().classList.add('hidden');
+  body().innerHTML = '';
+  shownGen = -1;
+  resetFolderState();
+  var target = opener;
+  opener = null;
+  if (target && document.contains(target) && typeof target.focus === 'function') target.focus({ preventScroll: true });
+}
+
+export function openAddProjectModal(mode) {
+  if (current().view === null) opener = document.activeElement;
+  store.set({ projectStart: openState(current(), mode) });
+}
+
+export function closeAddProjectModal() {
+  if (current().view === null) return;
+  store.set({ projectStart: closeState(current()) });
+}
+
+function trapTab(event, dialog) {
+  var items = dialog.querySelectorAll('button:not([disabled]):not([hidden]), input:not([disabled]):not([hidden]), [tabindex="-1"][data-ps="list"]');
+  var focusable = [];
+  for (var i = 0; i < items.length; i++) if (items[i].offsetParent !== null && items[i].tabIndex >= 0) focusable.push(items[i]);
+  if (!focusable.length) { event.preventDefault(); dialog.focus(); return; }
+  var first = focusable[0];
+  var last = focusable[focusable.length - 1];
+  var active = document.activeElement;
+  if (event.shiftKey && (active === first || active === dialog)) { event.preventDefault(); last.focus(); }
+  else if (!event.shiftKey && active === last) { event.preventDefault(); first.focus(); }
+}
+
+export function initProjectStart() {
+  var overlay = modal();
+  var dialog = overlay.querySelector('.project-start-dialog');
+  store.subscribe(function (state, previous) {
+    if (state.projectStart !== previous.projectStart) render(state.projectStart, previous.projectStart);
+    else if (state.projectStartFolder !== previous.projectStartFolder && state.projectStart.view === 'open') renderFolderView();
+  });
+  overlay.querySelector('.project-start-backdrop').addEventListener('click', closeAddProjectModal);
+  document.getElementById('project-start-close').addEventListener('click', closeAddProjectModal);
+  document.getElementById('project-start-back').addEventListener('click', function () {
+    store.set({ projectStart: selectView(current(), 'choices') });
+  });
+  body().addEventListener('click', function (event) {
+    var choice = event.target.closest('[data-choice]');
+    if (choice) store.set({ projectStart: selectView(current(), choice.dataset.choice) });
+  });
+  dialog.addEventListener('keydown', function (event) {
+    if (event.key === 'Escape') { event.preventDefault(); closeAddProjectModal(); }
+    else if (event.key === 'Tab') trapTab(event, dialog);
+  });
+  var addButton = document.getElementById('project-list-add');
+  if (addButton) addButton.addEventListener('click', function () { openAddProjectModal(); });
+}

package/lib/public/modules/project-start-folder-state.js

@@ -0,0 +1,78 @@
+// project-start-folder-state.js - Pure state transitions for the open-folder browser.
+// A reply is applied only when its requestId matches the single in-flight request.
+
+export function emptyFolderState() {
+  return {
+    status: "idle", dir: null, parent: null, entries: [], error: null, errorKind: null,
+    requestId: null, requestedPath: null, candidates: [], candidateIdx: 0, initial: false, pathOpen: false,
+  };
+}
+
+export function beginInitial(candidates, requestId) {
+  var next = emptyFolderState();
+  next.status = "loading";
+  next.candidates = candidates.slice();
+  next.initial = true;
+  next.requestId = requestId;
+  next.requestedPath = candidates[0] || "~";
+  return next;
+}
+
+export function beginNavigate(prev, path, requestId) {
+  return Object.assign({}, prev, {
+    status: "loading", requestId: requestId, requestedPath: path, error: null, errorKind: null, initial: false,
+  });
+}
+
+function errorKindOf(message) {
+  return /not permitted|permission|EACCES|EPERM/i.test(message || "") ? "denied" : "failed";
+}
+
+function cleanEntries(entries) {
+  var out = [];
+  for (var i = 0; i < (entries || []).length; i++) {
+    var e = entries[i];
+    if (e && typeof e.name === "string" && typeof e.path === "string") out.push({ name: e.name, path: e.path });
+  }
+  return out;
+}
+
+// Returns { state, retryPath }. retryPath is set when the initial candidate failed and another remains.
+export function applyBrowseResult(prev, msg, nextRequestId) {
+  if (!msg || prev.status !== "loading" || !prev.requestId || msg.requestId !== prev.requestId) {
+    return { state: prev, retryPath: null };
+  }
+  var failed = !!msg.error;
+  var wrongTarget = !failed && (typeof msg.dir !== "string" || (msg.prefix || "") !== "");
+  if (failed || wrongTarget) {
+    var idx = prev.candidateIdx + 1;
+    if (prev.initial && idx < prev.candidates.length) {
+      var retry = Object.assign({}, prev, { candidateIdx: idx, requestId: nextRequestId, requestedPath: prev.candidates[idx] });
+      return { state: retry, retryPath: prev.candidates[idx] };
+    }
+    return {
+      state: Object.assign({}, prev, {
+        status: "error",
+        error: failed ? msg.error : "That folder was not found.",
+        errorKind: failed ? errorKindOf(msg.error) : "missing",
+      }),
+      retryPath: null,
+    };
+  }
+  return {
+    state: Object.assign({}, prev, {
+      status: "ready", dir: msg.dir, parent: typeof msg.parent === "string" ? msg.parent : null,
+      entries: cleanEntries(msg.entries), error: null, errorKind: null, initial: false,
+    }),
+    retryPath: null,
+  };
+}
+
+export function failLocally(prev, message) {
+  if (prev.status !== "loading") return prev;
+  return Object.assign({}, prev, { status: "error", error: message, errorKind: "failed" });
+}
+
+export function canOpenFolder(state) {
+  return state.status === "ready" && typeof state.dir === "string" && state.dir.length > 0;
+}

package/lib/public/modules/project-start-folder-view.js

@@ -0,0 +1,190 @@
+// project-start-folder-view.js - Open-folder step: browse_dir navigation and add_project submit
+
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { escapeHtml } from './utils.js';
+import { iconHtml, refreshIcons } from './icons.js';
+import { baseName, breadcrumbSegments, initialCandidates } from './project-start-path.js';
+import {
+  beginInitial, beginNavigate, applyBrowseResult, failLocally, canOpenFolder, emptyFolderState,
+} from './project-start-folder-state.js';
+
+var seq = 0;
+var onSubmit = null;
+
+function nextId() { seq += 1; return "browse-" + seq; }
+function folder() { return store.get('projectStartFolder'); }
+function setFolder(next) { store.set({ projectStartFolder: next }); }
+function root() { return document.querySelector('#project-start-body [data-view="open"]'); }
+
+export function resetFolderState() { setFolder(emptyFolderState()); }
+
+function send(path, requestId) {
+  var ws = getWs();
+  if (!ws || ws.readyState !== 1) {
+    setFolder(failLocally(folder(), "Not connected to the server."));
+    return;
+  }
+  ws.send(JSON.stringify({ type: "browse_dir", path: path, requestId: requestId }));
+}
+
+export function startFolderBrowse() {
+  var next = beginInitial(initialCandidates(store.snap()), nextId());
+  setFolder(next);
+  send(next.requestedPath, next.requestId);
+}
+
+export function navigateTo(path) {
+  if (!path) return;
+  var next = beginNavigate(folder(), path, nextId());
+  setFolder(next);
+  send(path, next.requestId);
+}
+
+export function handleBrowseDirResult(msg) {
+  if (store.get('projectStart').view !== 'open') return;
+  var out = applyBrowseResult(folder(), msg, nextId());
+  if (out.state === folder()) return;
+  setFolder(out.state);
+  if (out.retryPath) send(out.retryPath, out.state.requestId);
+}
+
+export function folderViewHtml() {
+  return '<div class="project-start-view" data-view="open">' +
+    '<div class="project-start-location">' +
+      '<button type="button" class="project-start-icon-btn" data-ps="up" aria-label="Up one folder">' + iconHtml('arrow-up') + '</button>' +
+      '<nav class="project-start-crumbs" aria-label="Current folder"></nav>' +
+      '<button type="button" class="project-start-link-btn" data-ps="toggle-path" aria-expanded="false" aria-controls="project-start-pathform">Enter path</button>' +
+    '</div>' +
+    '<form class="project-start-pathform" id="project-start-pathform" hidden>' +
+      '<input type="text" class="project-start-input" data-ps="path-input" aria-label="Folder path" placeholder="/path/to/folder" autocomplete="off" spellcheck="false">' +
+      '<button type="submit" class="project-start-secondary">Go</button>' +
+    '</form>' +
+    '<div class="project-start-scroll project-start-list" data-ps="list" tabindex="-1" aria-live="polite"></div>' +
+    '<div class="project-start-footer">' +
+      '<p class="project-start-error" data-ps="error" role="alert" hidden></p>' +
+      '<button type="button" class="project-start-primary" data-ps="open" disabled>Open</button>' +
+    '</div></div>';
+}
+
+function stateBlock(kind, title, text, actions) {
+  return '<div class="project-start-state project-start-state-' + kind + '">' +
+    (kind === 'loading' ? '<span class="project-start-spinner" aria-hidden="true"></span>' : '') +
+    '<strong>' + escapeHtml(title) + '</strong>' + (text ? '<span>' + escapeHtml(text) + '</span>' : '') +
+    (actions || '') + '</div>';
+}
+
+function errorTitle(kind) {
+  if (kind === 'denied') return "You can't open this folder";
+  if (kind === 'missing') return "Folder not found";
+  return "Couldn't load folders";
+}
+
+function listHtml(state) {
+  if (state.status === 'loading') return stateBlock('loading', 'Loading folders…');
+  if (state.status === 'error') {
+    var actions = '<div class="project-start-state-actions">' +
+      '<button type="button" class="project-start-secondary" data-ps="retry">Try again</button>' +
+      (state.dir ? '<button type="button" class="project-start-secondary" data-ps="back-to-dir">Back to ' + escapeHtml(baseName(state.dir)) + '</button>' : '') + '</div>';
+    return stateBlock('error', errorTitle(state.errorKind), state.error, actions);
+  }
+  if (state.status !== 'ready') return '';
+  if (state.entries.length === 0) return stateBlock('empty', 'No folders here', 'This folder has no sub-folders. You can still open it.');
+  var html = '<ul class="project-start-rows" role="list">';
+  for (var i = 0; i < state.entries.length; i++) {
+    html += '<li><button type="button" class="project-start-row project-start-folder-row" data-ps="enter" data-path="' + escapeHtml(state.entries[i].path) + '">' +
+      iconHtml('folder') + '<span class="project-start-row-name">' + escapeHtml(state.entries[i].name) + '</span>' + iconHtml('chevron-right') + '</button></li>';
+  }
+  return html + '</ul>';
+}
+
+function crumbsHtml(state) {
+  if (!state.dir) return '<span class="project-start-crumb-muted">' + (state.status === 'error' ? 'No folder selected' : 'Loading…') + '</span>';
+  var info = breadcrumbSegments(state.dir, 3);
+  var html = info.truncated ? '<span class="project-start-crumb-muted">…</span><span class="project-start-crumb-sep">/</span>' : '';
+  for (var i = 0; i < info.segments.length; i++) {
+    var last = i === info.segments.length - 1;
+    html += '<span class="' + (last ? 'project-start-crumb-current' : 'project-start-crumb') + '"' + (last ? ' aria-current="location"' : '') + '>' + escapeHtml(info.segments[i]) + '</span>';
+    if (!last) html += '<span class="project-start-crumb-sep">/</span>';
+  }
+  return html;
+}
+
+export function renderFolderView() {
+  var view = root();
+  if (!view) return;
+  var state = folder();
+  var crumbs = view.querySelector('.project-start-crumbs');
+  crumbs.innerHTML = crumbsHtml(state);
+  crumbs.title = state.dir || '';
+  view.querySelector('[data-ps="up"]').disabled = !(state.status === 'ready' && state.parent);
+  var list = view.querySelector('[data-ps="list"]');
+  var listHadFocus = list.contains(document.activeElement);
+  list.innerHTML = listHtml(state);
+  if (listHadFocus) list.focus({ preventScroll: true });
+  list.setAttribute('aria-busy', state.status === 'loading' ? 'true' : 'false');
+  var pathInput = view.querySelector('[data-ps="path-input"]');
+  if (state.status === 'ready' && document.activeElement !== pathInput) pathInput.value = state.dir;
+  var submit = store.get('projectStart').submit;
+  var busy = submit.status === 'busy';
+  var open = view.querySelector('[data-ps="open"]');
+  var name = state.dir ? baseName(state.dir) : '';
+  open.innerHTML = busy ? 'Opening…' : 'Open ' + (name ? '<span class="project-start-open-name">' + escapeHtml(name) + '</span>' : 'folder');
+  open.disabled = busy || !canOpenFolder(state);
+  open.title = state.dir && canOpenFolder(state) ? state.dir : '';
+  var error = view.querySelector('[data-ps="error"]');
+  error.textContent = submit.error || '';
+  error.hidden = !submit.error;
+  refreshIcons();
+}
+
+function togglePath(view, force) {
+  var form = view.querySelector('.project-start-pathform');
+  var open = typeof force === 'boolean' ? force : form.hidden;
+  form.hidden = !open;
+  view.querySelector('[data-ps="toggle-path"]').setAttribute('aria-expanded', open ? 'true' : 'false');
+  if (open) {
+    var input = form.querySelector('input');
+    input.value = folder().dir || '';
+    input.focus();
+    input.select();
+  }
+}
+
+export function bindFolderView(submitFolder) {
+  onSubmit = submitFolder;
+  var view = root();
+  view.addEventListener('click', function (event) {
+    var target = event.target.closest('[data-ps]');
+    if (!target || target.disabled) return;
+    var action = target.dataset.ps;
+    var state = folder();
+    if (action === 'up' && state.parent) navigateTo(state.parent);
+    else if (action === 'enter') navigateTo(target.dataset.path);
+    else if (action === 'retry') navigateTo(state.requestedPath);
+    else if (action === 'back-to-dir') navigateTo(state.dir);
+    else if (action === 'toggle-path') togglePath(view);
+    else if (action === 'open' && canOpenFolder(state) && onSubmit) onSubmit(state.dir);
+  });
+  view.querySelector('.project-start-pathform').addEventListener('submit', function (event) {
+    event.preventDefault();
+    var value = view.querySelector('[data-ps="path-input"]').value.trim();
+    if (value) navigateTo(value);
+  });
+  view.addEventListener('keydown', function (event) {
+    if (event.key === 'Escape' && !view.querySelector('.project-start-pathform').hidden) {
+      event.stopPropagation();
+      togglePath(view, false);
+      view.querySelector('[data-ps="toggle-path"]').focus();
+      return;
+    }
+    var rows = view.querySelectorAll('[data-ps="enter"]');
+    var index = Array.prototype.indexOf.call(rows, document.activeElement);
+    if (index < 0 || !rows.length) return;
+    var key = event.key;
+    if (key !== 'ArrowDown' && key !== 'ArrowUp' && key !== 'Home' && key !== 'End') return;
+    event.preventDefault();
+    var next = key === 'Home' ? 0 : key === 'End' ? rows.length - 1 : Math.max(0, Math.min(rows.length - 1, index + (key === 'ArrowDown' ? 1 : -1)));
+    rows[next].focus();
+  });
+}

package/lib/public/modules/project-start-forms.js

@@ -0,0 +1,66 @@
+// project-start-forms.js - Create and clone steps (name or URL only)
+
+import { store } from './store.js';
+import { escapeHtml } from './utils.js';
+import { submitCreate, submitClone } from './project-start-submit.js';
+
+var FORMS = {
+  create: {
+    label: 'Project name', field: 'name', placeholder: 'my-project', action: 'Create project', busy: 'Creating…',
+    hint: 'Letters, numbers, dashes and underscores.', submit: submitCreate,
+  },
+  clone: {
+    label: 'GitHub repository URL', field: 'url', placeholder: 'https://github.com/user/repo', action: 'Clone repository', busy: 'Cloning…',
+    hint: 'Paste the repository address to bring it into Clay.', submit: submitClone,
+  },
+};
+
+export function formViewHtml(kind) {
+  var form = FORMS[kind];
+  return '<form class="project-start-view" data-view="' + kind + '" novalidate>' +
+    '<div class="project-start-scroll project-start-formbody">' +
+      '<label class="project-start-label" for="project-start-field">' + form.label + '</label>' +
+      '<input type="text" id="project-start-field" class="project-start-input" data-ps="field" placeholder="' + form.placeholder + '" autocomplete="off" spellcheck="false" aria-describedby="project-start-hint">' +
+      '<p class="project-start-hint" id="project-start-hint">' + form.hint + '</p>' +
+      '<p class="project-start-progress" data-ps="progress" role="status" hidden><span class="project-start-spinner" aria-hidden="true"></span>Cloning repository…</p>' +
+      '<p class="project-start-error" data-ps="error" role="alert" hidden></p>' +
+    '</div>' +
+    '<div class="project-start-footer"><button type="submit" class="project-start-primary" data-ps="submit">' + escapeHtml(form.action) + '</button></div>' +
+  '</form>';
+}
+
+function root(kind) { return document.querySelector('#project-start-body [data-view="' + kind + '"]'); }
+
+export function renderFormView(kind) {
+  var view = root(kind);
+  if (!view) return;
+  var form = FORMS[kind];
+  var current = store.get('projectStart');
+  var submit = current.submit;
+  var busy = submit.status === 'busy';
+  var field = view.querySelector('[data-ps="field"]');
+  if (field.value !== current[form.field]) field.value = current[form.field];
+  field.readOnly = busy;
+  var button = view.querySelector('[data-ps="submit"]');
+  button.disabled = busy;
+  button.textContent = busy ? form.busy : form.action;
+  view.querySelector('[data-ps="progress"]').hidden = !(busy && kind === 'clone' && submit.cloning);
+  var error = view.querySelector('[data-ps="error"]');
+  error.textContent = submit.error || '';
+  error.hidden = !submit.error;
+  view.setAttribute('aria-busy', busy ? 'true' : 'false');
+}
+
+export function bindFormView(kind) {
+  var view = root(kind);
+  var form = FORMS[kind];
+  view.querySelector('[data-ps="field"]').addEventListener('input', function (event) {
+    var patch = {};
+    patch[form.field] = event.target.value;
+    store.set({ projectStart: Object.assign({}, store.get('projectStart'), patch) });
+  });
+  view.addEventListener('submit', function (event) {
+    event.preventDefault();
+    form.submit();
+  });
+}

package/lib/public/modules/project-start-path.js

@@ -0,0 +1,60 @@
+// project-start-path.js - Pure path helpers for the project-start dialog (no DOM, no store)
+
+function trimTrailing(p) {
+  var out = String(p || "");
+  while (out.length > 1 && /[\\/]$/.test(out) && !/^[A-Za-z]:[\\/]$/.test(out)) out = out.slice(0, -1);
+  return out;
+}
+
+export function baseName(dir) {
+  var p = trimTrailing(dir);
+  if (p === "/" || /^[A-Za-z]:[\\/]$/.test(p)) return p;
+  var parts = p.split(/[\\/]/);
+  return parts[parts.length - 1] || p;
+}
+
+export function parentOf(dir) {
+  var p = trimTrailing(dir);
+  var idx = Math.max(p.lastIndexOf("/"), p.lastIndexOf("\\"));
+  if (idx < 0) return null;
+  if (idx === 0) return p.length > 1 ? "/" : null;
+  if (/^[A-Za-z]:$/.test(p.slice(0, idx))) return p.slice(0, idx + 1);
+  return p.slice(0, idx);
+}
+
+// Last `max` segments of a directory, with a flag when earlier segments are hidden.
+export function breadcrumbSegments(dir, max) {
+  var p = trimTrailing(dir);
+  var limit = max || 3;
+  var parts = p.split(/[\\/]/).filter(function (part) { return part.length > 0; });
+  if (parts.length === 0) return { truncated: false, segments: [p || "/"] };
+  return { truncated: parts.length > limit, segments: parts.slice(-limit) };
+}
+
+function ordinaryProjectParent(state) {
+  var projects = Array.isArray(state.projectsHubList) ? state.projectsHubList : [];
+  for (var i = 0; i < projects.length; i++) {
+    var project = projects[i];
+    if (project && project.slug === state.currentSlug && !project.isMate && typeof project.path === "string" && project.path) {
+      return parentOf(project.path);
+    }
+  }
+  return null;
+}
+
+// Ordered starting directories to try. Each one is only a request; the server decides whether
+// the signed-in user may list it, and the next candidate is tried when it cannot.
+export function initialCandidates(state) {
+  var out = [];
+  var users = Array.isArray(state.cachedAllUsers) ? state.cachedAllUsers : [];
+  var me = null;
+  for (var i = 0; i < users.length; i++) if (users[i].id === state.myUserId) me = users[i];
+  if (state.isOsUsers && me && me.role !== "admin" && me.linuxUser) {
+    out.push("/home/" + me.linuxUser);
+    return out;
+  }
+  var near = ordinaryProjectParent(state);
+  if (near) out.push(near);
+  out.push("~");
+  return out;
+}

package/lib/public/modules/project-start-state.js

@@ -0,0 +1,54 @@
+// project-start-state.js - Pure state transitions for the project-start dialog
+
+var VIEWS = { choices: true, open: true, create: true, clone: true };
+
+export function idleSubmit() {
+  return { status: 'idle', kind: null, requestId: null, error: null, cloning: false };
+}
+
+export function initialProjectStart() {
+  return { view: null, gen: 0, name: '', url: '', submit: idleSubmit() };
+}
+
+// Deep links: "existing" lands on the folder step, "create"/"clone" on theirs, anything else on the choices.
+export function viewForMode(mode) {
+  if (mode === 'existing') return 'open';
+  return mode === 'create' || mode === 'clone' ? mode : 'choices';
+}
+
+export function openState(prev, mode) {
+  return { view: viewForMode(mode), gen: prev.gen + 1, name: '', url: '', submit: idleSubmit() };
+}
+
+export function closeState(prev) {
+  return { view: null, gen: prev.gen + 1, name: '', url: '', submit: idleSubmit() };
+}
+
+export function selectView(prev, view) {
+  if (!VIEWS[view] || prev.view === null) return prev;
+  return { view: view, gen: prev.gen + 1, name: '', url: '', submit: idleSubmit() };
+}
+
+export function beginSubmit(prev, kind, requestId) {
+  if (prev.view === null || prev.submit.status === 'busy') return prev;
+  return Object.assign({}, prev, { submit: { status: 'busy', kind: kind, requestId: requestId, error: null, cloning: false } });
+}
+
+export function applyProgress(prev, msg) {
+  var s = prev.submit;
+  if (s.status !== 'busy' || s.kind !== 'clone' || !msg || msg.status !== 'cloning' || s.cloning || typeof msg.requestId !== 'string' || msg.requestId !== s.requestId) return prev;
+  return Object.assign({}, prev, { submit: Object.assign({}, s, { cloning: true }) });
+}
+
+// outcome: 'success' | 'error' for the submission this dialog is waiting on,
+// 'orphan' for any other reply (the dialog was closed or moved on), which never touches the dialog.
+export function resolveSubmit(prev, msg) {
+  var s = prev.submit;
+  var matches = prev.view !== null && s.status === 'busy' && msg && typeof msg.requestId === 'string' && msg.requestId === s.requestId;
+  if (!matches) return { state: prev, outcome: 'orphan', kind: null };
+  if (msg.ok) return { state: closeState(prev), outcome: 'success', kind: s.kind };
+  return {
+    state: Object.assign({}, prev, { submit: Object.assign({}, idleSubmit(), { error: msg.error || 'Could not add this project.' }) }),
+    outcome: 'error', kind: s.kind,
+  };
+}

package/lib/public/modules/project-start-submit.js

@@ -0,0 +1,67 @@
+// project-start-submit.js - add_project / create_project / clone_project requests and replies
+
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { showToast } from './utils.js';
+import { switchProject } from './app-projects.js';
+import { beginSubmit, applyProgress, resolveSubmit, idleSubmit } from './project-start-state.js';
+
+var seq = 0;
+
+function state() { return store.get('projectStart'); }
+function setState(next) { store.set({ projectStart: next }); }
+
+function failSubmit(message) {
+  var current = state();
+  setState(Object.assign({}, current, { submit: Object.assign({}, idleSubmit(), { error: message }) }));
+}
+
+function submit(kind, payload) {
+  var begun = beginSubmit(state(), kind, 'start-' + (seq += 1));
+  if (begun === state()) return;
+  var ws = getWs();
+  if (!ws || ws.readyState !== 1) {
+    setState(begun);
+    failSubmit('Not connected to the server.');
+    return;
+  }
+  setState(begun);
+  ws.send(JSON.stringify(Object.assign({ requestId: begun.submit.requestId }, payload)));
+}
+
+export function submitFolder(dir) {
+  if (typeof dir !== 'string' || !dir) return;
+  submit('open', { type: 'add_project', path: dir });
+}
+
+export function submitCreate() {
+  var name = state().name.trim();
+  if (name) submit('create', { type: 'create_project', name: name });
+}
+
+export function submitClone() {
+  var url = state().url.trim();
+  if (url) submit('clone', { type: 'clone_project', url: url });
+}
+
+export function handleCloneProgress(msg) {
+  var next = applyProgress(state(), msg);
+  if (next !== state()) setState(next);
+}
+
+var SUCCESS_TOASTS = { open: 'Project added', create: 'Project created', clone: 'Project cloned' };
+
+export function handleAddProjectResult(msg) {
+  var out = resolveSubmit(state(), msg);
+  if (out.outcome === 'orphan') {
+    // The dialog was closed or moved on; report the outcome without touching or reopening it.
+    if (msg.ok) showToast(msg.existing ? 'Project already registered' : 'Project added', msg.existing ? 'info' : 'success');
+    else showToast(msg.error || 'Failed to add project', 'error');
+    return;
+  }
+  setState(out.state);
+  if (out.outcome === 'success') {
+    showToast(msg.existing ? 'Project already registered' : SUCCESS_TOASTS[out.kind], msg.existing ? 'info' : 'success');
+    if (msg.slug) switchProject(msg.slug);
+  }
+}