corporateai 0.0.1

package/ui/src/lib/instance-settings.test.ts

@@ -0,0 +1,26 @@
+import { describe, expect, it } from "vitest";
+import {
+  DEFAULT_INSTANCE_SETTINGS_PATH,
+  normalizeRememberedInstanceSettingsPath,
+} from "./instance-settings";
+
+describe("normalizeRememberedInstanceSettingsPath", () => {
+  it("keeps known instance settings pages", () => {
+    expect(normalizeRememberedInstanceSettingsPath("/instance/settings/general")).toBe(
+      "/instance/settings/general",
+    );
+    expect(normalizeRememberedInstanceSettingsPath("/instance/settings/experimental")).toBe(
+      "/instance/settings/experimental",
+    );
+    expect(normalizeRememberedInstanceSettingsPath("/instance/settings/plugins/example?tab=config#logs")).toBe(
+      "/instance/settings/plugins/example?tab=config#logs",
+    );
+  });
+
+  it("falls back to the default page for unknown paths", () => {
+    expect(normalizeRememberedInstanceSettingsPath("/instance/settings/nope")).toBe(
+      DEFAULT_INSTANCE_SETTINGS_PATH,
+    );
+    expect(normalizeRememberedInstanceSettingsPath(null)).toBe(DEFAULT_INSTANCE_SETTINGS_PATH);
+  });
+});

package/ui/src/lib/instance-settings.ts

@@ -0,0 +1,25 @@
+export const DEFAULT_INSTANCE_SETTINGS_PATH = "/instance/settings/general";
+
+export function normalizeRememberedInstanceSettingsPath(rawPath: string | null): string {
+  if (!rawPath) return DEFAULT_INSTANCE_SETTINGS_PATH;
+
+  const match = rawPath.match(/^([^?#]*)(\?[^#]*)?(#.*)?$/);
+  const pathname = match?.[1] ?? rawPath;
+  const search = match?.[2] ?? "";
+  const hash = match?.[3] ?? "";
+
+  if (
+    pathname === "/instance/settings/general" ||
+    pathname === "/instance/settings/heartbeats" ||
+    pathname === "/instance/settings/plugins" ||
+    pathname === "/instance/settings/experimental"
+  ) {
+    return `${pathname}${search}${hash}`;
+  }
+
+  if (/^\/instance\/settings\/plugins\/[^/?#]+$/.test(pathname)) {
+    return `${pathname}${search}${hash}`;
+  }
+
+  return DEFAULT_INSTANCE_SETTINGS_PATH;
+}

package/ui/src/lib/issueDetailBreadcrumb.ts

@@ -0,0 +1,24 @@
+type IssueDetailBreadcrumb = {
+  label: string;
+  href: string;
+};
+
+type IssueDetailLocationState = {
+  issueDetailBreadcrumb?: IssueDetailBreadcrumb;
+};
+
+function isIssueDetailBreadcrumb(value: unknown): value is IssueDetailBreadcrumb {
+  if (typeof value !== "object" || value === null) return false;
+  const candidate = value as Partial<IssueDetailBreadcrumb>;
+  return typeof candidate.label === "string" && typeof candidate.href === "string";
+}
+
+export function createIssueDetailLocationState(label: string, href: string): IssueDetailLocationState {
+  return { issueDetailBreadcrumb: { label, href } };
+}
+
+export function readIssueDetailBreadcrumb(state: unknown): IssueDetailBreadcrumb | null {
+  if (typeof state !== "object" || state === null) return null;
+  const candidate = (state as IssueDetailLocationState).issueDetailBreadcrumb;
+  return isIssueDetailBreadcrumb(candidate) ? candidate : null;
+}

package/ui/src/lib/legacy-agent-config.test.ts

@@ -0,0 +1,40 @@
+import { describe, expect, it } from "vitest";
+import {
+  hasLegacyWorkingDirectory,
+  shouldShowLegacyWorkingDirectoryField,
+} from "./legacy-agent-config";
+
+describe("legacy agent config helpers", () => {
+  it("treats non-empty cwd values as legacy working directories", () => {
+    expect(hasLegacyWorkingDirectory("/tmp/workspace")).toBe(true);
+    expect(hasLegacyWorkingDirectory("  /tmp/workspace  ")).toBe(true);
+  });
+
+  it("ignores nullish and blank cwd values", () => {
+    expect(hasLegacyWorkingDirectory("")).toBe(false);
+    expect(hasLegacyWorkingDirectory("   ")).toBe(false);
+    expect(hasLegacyWorkingDirectory(null)).toBe(false);
+    expect(hasLegacyWorkingDirectory(undefined)).toBe(false);
+  });
+
+  it("shows the deprecated field only for edit forms with an existing cwd", () => {
+    expect(
+      shouldShowLegacyWorkingDirectoryField({
+        isCreate: true,
+        adapterConfig: { cwd: "/tmp/workspace" },
+      }),
+    ).toBe(false);
+    expect(
+      shouldShowLegacyWorkingDirectoryField({
+        isCreate: false,
+        adapterConfig: { cwd: "" },
+      }),
+    ).toBe(false);
+    expect(
+      shouldShowLegacyWorkingDirectoryField({
+        isCreate: false,
+        adapterConfig: { cwd: "/tmp/workspace" },
+      }),
+    ).toBe(true);
+  });
+});

package/ui/src/lib/legacy-agent-config.ts

@@ -0,0 +1,17 @@
+function asNonEmptyString(value: unknown): string | null {
+  if (typeof value !== "string") return null;
+  const trimmed = value.trim();
+  return trimmed.length > 0 ? trimmed : null;
+}
+
+export function hasLegacyWorkingDirectory(value: unknown): boolean {
+  return asNonEmptyString(value) !== null;
+}
+
+export function shouldShowLegacyWorkingDirectoryField(input: {
+  isCreate: boolean;
+  adapterConfig: Record<string, unknown> | null | undefined;
+}): boolean {
+  if (input.isCreate) return false;
+  return hasLegacyWorkingDirectory(input.adapterConfig?.cwd);
+}

package/ui/src/lib/mention-aware-link-node.test.ts

@@ -0,0 +1,50 @@
+import { describe, expect, it } from "vitest";
+import { $createLinkNode } from "@lexical/link";
+import { createEditor } from "lexical";
+import {
+  MentionAwareLinkNode,
+  getMentionAwareLinkNodeInit,
+  mentionAwareLinkNodeReplacement,
+} from "./mention-aware-link-node";
+
+function createTestEditor() {
+  return createEditor({
+    namespace: "mention-aware-link-node-test",
+    nodes: [MentionAwareLinkNode, mentionAwareLinkNodeReplacement],
+    onError(error: Error) {
+      throw error;
+    },
+  });
+}
+
+describe("getMentionAwareLinkNodeInit", () => {
+  it("copies link attributes without carrying over a node key", () => {
+    const init = getMentionAwareLinkNodeInit({
+      getURL: () => "agent://agent-123",
+      getRel: () => "noreferrer",
+      getTarget: () => "_blank",
+      getTitle: () => "Agent mention",
+    });
+
+    expect(Object.keys(init)).toEqual(["url", "attributes"]);
+    expect(init).toEqual({
+      url: "agent://agent-123",
+      attributes: {
+        rel: "noreferrer",
+        target: "_blank",
+        title: "Agent mention",
+      },
+    });
+  });
+
+  it("replaces LinkNode creation with MentionAwareLinkNode without throwing", () => {
+    const editor = createTestEditor();
+    let created: unknown;
+
+    editor.update(() => {
+      created = $createLinkNode("agent://agent-123");
+    });
+
+    expect(created).toBeInstanceOf(MentionAwareLinkNode);
+  });
+});

package/ui/src/lib/mention-aware-link-node.ts

@@ -0,0 +1,67 @@
+import {
+  LinkNode,
+  type LinkAttributes,
+  type SerializedLinkNode,
+} from "@lexical/link";
+
+const CUSTOM_MENTION_URL_RE = /^(agent|project):\/\//;
+
+export class MentionAwareLinkNode extends LinkNode {
+  static getType(): string {
+    return "mention-aware-link";
+  }
+
+  static clone(node: MentionAwareLinkNode): MentionAwareLinkNode {
+    return new MentionAwareLinkNode(
+      node.getURL(),
+      {
+        rel: node.getRel(),
+        target: node.getTarget(),
+        title: node.getTitle(),
+      },
+      node.getKey(),
+    );
+  }
+
+  static importJSON(serializedNode: SerializedLinkNode): MentionAwareLinkNode {
+    return new MentionAwareLinkNode(
+      serializedNode.url ?? "",
+      {
+        rel: serializedNode.rel ?? null,
+        target: serializedNode.target ?? null,
+        title: serializedNode.title ?? null,
+      },
+    );
+  }
+
+  constructor(url?: string, attributes?: LinkAttributes, key?: string) {
+    super(url, attributes, key);
+  }
+
+  sanitizeUrl(url: string): string {
+    if (CUSTOM_MENTION_URL_RE.test(url)) return url;
+    return super.sanitizeUrl(url);
+  }
+}
+
+type MentionAwareLinkSource = Pick<LinkNode, "getURL" | "getRel" | "getTarget" | "getTitle">;
+
+export function getMentionAwareLinkNodeInit(node: MentionAwareLinkSource) {
+  return {
+    url: node.getURL(),
+    attributes: {
+      rel: node.getRel(),
+      target: node.getTarget(),
+      title: node.getTitle(),
+    },
+  };
+}
+
+export const mentionAwareLinkNodeReplacement = {
+  replace: LinkNode,
+  with: (node: LinkNode) => {
+    const { url, attributes } = getMentionAwareLinkNodeInit(node);
+    return new MentionAwareLinkNode(url, attributes);
+  },
+  withKlass: MentionAwareLinkNode,
+} as const;

package/ui/src/lib/mention-chips.ts

@@ -0,0 +1,168 @@
+import type { CSSProperties } from "react";
+import { parseAgentMentionHref, parseProjectMentionHref } from "@corporateai/shared";
+import { getAgentIcon } from "./agent-icons";
+import { hexToRgb, pickTextColorForPillBg } from "./color-contrast";
+
+export type ParsedMentionChip =
+  | {
+      kind: "agent";
+      agentId: string;
+      icon: string | null;
+    }
+  | {
+      kind: "project";
+      projectId: string;
+      color: string | null;
+    };
+
+const iconMaskCache = new Map<string, string>();
+
+export function parseMentionChipHref(href: string): ParsedMentionChip | null {
+  const agent = parseAgentMentionHref(href);
+  if (agent) {
+    return {
+      kind: "agent",
+      agentId: agent.agentId,
+      icon: agent.icon,
+    };
+  }
+
+  const project = parseProjectMentionHref(href);
+  if (project) {
+    return {
+      kind: "project",
+      projectId: project.projectId,
+      color: project.color,
+    };
+  }
+
+  return null;
+}
+
+export function mentionChipInlineStyle(mention: ParsedMentionChip): CSSProperties | undefined {
+  const style: CSSProperties & Record<string, string> = {};
+
+  if (mention.kind === "project" && mention.color) {
+    const projectStyle = projectMentionColors(mention.color);
+    Object.assign(style, projectStyle);
+    style["--paperclip-mention-project-color"] = mention.color;
+  }
+
+  if (mention.kind === "agent") {
+    const iconMask = buildAgentIconMask(mention.icon);
+    if (iconMask) {
+      style["--paperclip-mention-icon-mask"] = iconMask;
+    }
+  }
+
+  return Object.keys(style).length > 0 ? (style as CSSProperties) : undefined;
+}
+
+export function applyMentionChipDecoration(element: HTMLElement, mention: ParsedMentionChip) {
+  clearMentionChipDecoration(element);
+  element.dataset.mentionKind = mention.kind;
+  element.setAttribute("contenteditable", "false");
+  element.classList.add("paperclip-mention-chip", `paperclip-mention-chip--${mention.kind}`);
+  if (mention.kind === "project") {
+    element.classList.add("paperclip-project-mention-chip");
+  }
+
+  const style = mentionChipInlineStyle(mention);
+  if (!style) return;
+  for (const [key, value] of Object.entries(style)) {
+    if (typeof value === "string") {
+      if (key.startsWith("--")) {
+        element.style.setProperty(key, value);
+      } else {
+        (element.style as CSSStyleDeclaration & Record<string, string>)[key] = value;
+      }
+    }
+  }
+}
+
+export function clearMentionChipDecoration(element: HTMLElement) {
+  delete element.dataset.mentionKind;
+  element.classList.remove(
+    "paperclip-mention-chip",
+    "paperclip-mention-chip--agent",
+    "paperclip-mention-chip--project",
+    "paperclip-project-mention-chip",
+  );
+  element.removeAttribute("contenteditable");
+  element.style.removeProperty("border-color");
+  element.style.removeProperty("background-color");
+  element.style.removeProperty("color");
+  element.style.removeProperty("--paperclip-mention-project-color");
+  element.style.removeProperty("--paperclip-mention-icon-mask");
+}
+
+function projectMentionColors(color: string): Pick<CSSProperties, "borderColor" | "backgroundColor" | "color"> {
+  const rgb = hexToRgb(color);
+  if (!rgb) return {};
+  return {
+    borderColor: color,
+    backgroundColor: `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.22)`,
+    color: pickTextColorForPillBg(color),
+  };
+}
+
+function buildAgentIconMask(iconName: string | null): string | null {
+  const cacheKey = iconName ?? "__default__";
+  const cached = iconMaskCache.get(cacheKey);
+  if (cached) return cached;
+
+  const Icon = getAgentIcon(iconName);
+  const iconNode = resolveLucideIconNode(Icon);
+  if (!Array.isArray(iconNode) || iconNode.length === 0) return null;
+
+  const body = iconNode.map(([tag, attrs]) => {
+    const attrString = Object.entries(attrs)
+      .filter(([key]) => key !== "key")
+      .map(([key, value]) => `${key}="${escapeAttribute(String(value))}"`)
+      .join(" ");
+    return `<${tag}${attrString ? ` ${attrString}` : ""}></${tag}>`;
+  }).join("");
+
+  const svg =
+    `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" ` +
+    `fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" ` +
+    `stroke-linejoin="round">${body}</svg>`;
+  const url = `url("data:image/svg+xml,${encodeURIComponent(svg)}")`;
+  iconMaskCache.set(cacheKey, url);
+  return url;
+}
+
+function resolveLucideIconNode(
+  icon: unknown,
+): Array<[string, Record<string, string>]> | null {
+  const staticIconNode = (
+    icon as {
+      iconNode?: Array<[string, Record<string, string>]>;
+    }
+  ).iconNode;
+  if (Array.isArray(staticIconNode) && staticIconNode.length > 0) {
+    return staticIconNode;
+  }
+
+  const render = (
+    icon as {
+      render?: (props: Record<string, unknown>, ref: unknown) => {
+        props?: { iconNode?: Array<[string, Record<string, string>]> };
+      } | null;
+    }
+  ).render;
+  const rendered = typeof render === "function" ? render({}, null) : null;
+  const renderedIconNode = rendered?.props?.iconNode;
+  return Array.isArray(renderedIconNode) && renderedIconNode.length > 0
+    ? renderedIconNode
+    : null;
+}
+
+function escapeAttribute(value: string): string {
+  return value
+    .replaceAll("&", "&amp;")
+    .replaceAll('"', "&quot;")
+    .replaceAll("<", "&lt;")
+    .replaceAll(">", "&gt;");
+}
+

package/ui/src/lib/mention-deletion.test.ts

@@ -0,0 +1,87 @@
+import { describe, expect, it } from "vitest";
+import { $createLinkNode, LinkNode } from "@lexical/link";
+import { buildAgentMentionHref } from "@corporateai/shared";
+import {
+  createEditor,
+  $createParagraphNode,
+  $createTextNode,
+  $getRoot,
+  $getSelection,
+  $isRangeSelection,
+} from "lexical";
+import { deleteSelectedMentionChip } from "./mention-deletion";
+
+function createTestEditor() {
+  return createEditor({
+    namespace: "mention-deletion-test",
+    nodes: [LinkNode],
+    onError(error: Error) {
+      throw error;
+    },
+  });
+}
+
+describe("mention deletion", () => {
+  it("removes the full mention when backspacing from inside the chip", () => {
+    const editor = createTestEditor();
+
+    editor.update(() => {
+      const root = $getRoot();
+      const paragraph = $createParagraphNode();
+      const before = $createTextNode("Hello ");
+      const mention = $createLinkNode(buildAgentMentionHref("agent-123", "code"));
+      const mentionText = $createTextNode("@QA");
+      const after = $createTextNode(" world");
+
+      mention.append(mentionText);
+      paragraph.append(before, mention, after);
+      root.append(paragraph);
+
+      mentionText.selectEnd();
+
+      expect(deleteSelectedMentionChip("backward")).toBe(true);
+      expect(root.getTextContent()).toBe("Hello  world");
+
+      const selection = $getSelection();
+      expect($isRangeSelection(selection)).toBe(true);
+      if (!$isRangeSelection(selection)) {
+        throw new Error("Expected range selection after backward mention deletion");
+      }
+      expect(selection.isCollapsed()).toBe(true);
+      expect(selection.anchor.getNode().is(before)).toBe(true);
+      expect(selection.anchor.offset).toBe(before.getTextContentSize());
+    });
+  });
+
+  it("removes the full mention when deleting forward from adjacent text", () => {
+    const editor = createTestEditor();
+
+    editor.update(() => {
+      const root = $getRoot();
+      const paragraph = $createParagraphNode();
+      const before = $createTextNode("Hello ");
+      const mention = $createLinkNode(buildAgentMentionHref("agent-123", "code"));
+      const mentionText = $createTextNode("@QA");
+      const after = $createTextNode(" world");
+
+      mention.append(mentionText);
+      paragraph.append(before, mention, after);
+      root.append(paragraph);
+
+      before.selectEnd();
+
+      expect(deleteSelectedMentionChip("forward")).toBe(true);
+      expect(root.getTextContent()).toBe("Hello  world");
+
+      const selection = $getSelection();
+      expect($isRangeSelection(selection)).toBe(true);
+      if (!$isRangeSelection(selection)) {
+        throw new Error("Expected range selection after forward mention deletion");
+      }
+      expect(selection.isCollapsed()).toBe(true);
+      expect(selection.anchor.getNode().is(after)).toBe(true);
+      expect(selection.anchor.offset).toBe(0);
+    });
+  });
+});
+

package/ui/src/lib/mention-deletion.ts

@@ -0,0 +1,143 @@
+import { createRootEditorSubscription$, realmPlugin } from "@mdxeditor/editor";
+import { $isLinkNode, type LinkNode } from "@lexical/link";
+import {
+  $getSelection,
+  $isElementNode,
+  $isNodeSelection,
+  $isRangeSelection,
+  $isTextNode,
+  COMMAND_PRIORITY_HIGH,
+  KEY_BACKSPACE_COMMAND,
+  KEY_DELETE_COMMAND,
+  type LexicalNode,
+  type PointType,
+} from "lexical";
+import { parseMentionChipHref } from "./mention-chips";
+
+export type MentionDeletionDirection = "backward" | "forward";
+
+function isMentionLinkNode(node: LexicalNode | null | undefined): node is LinkNode {
+  return Boolean(node && $isLinkNode(node) && parseMentionChipHref(node.getURL()));
+}
+
+function findMentionLinkNode(node: LexicalNode | null | undefined): LinkNode | null {
+  if (!node) return null;
+  if (isMentionLinkNode(node)) return node;
+
+  let parent = node.getParent();
+  while (parent) {
+    if (isMentionLinkNode(parent)) return parent;
+    parent = parent.getParent();
+  }
+
+  return null;
+}
+
+function findMentionLinkNodeAtPoint(point: PointType, direction: MentionDeletionDirection): LinkNode | null {
+  const node = point.getNode();
+  const directMention = findMentionLinkNode(node);
+  if (directMention) return directMention;
+
+  if (point.type === "element" && $isElementNode(node)) {
+    const childIndex = direction === "backward" ? point.offset - 1 : point.offset;
+    if (childIndex < 0) return null;
+    return findMentionLinkNode(node.getChildAtIndex(childIndex));
+  }
+
+  if (point.type === "text" && $isTextNode(node)) {
+    if (direction === "backward" && point.offset === 0) {
+      return findMentionLinkNode(node.getPreviousSibling());
+    }
+
+    if (direction === "forward" && point.offset === node.getTextContentSize()) {
+      return findMentionLinkNode(node.getNextSibling());
+    }
+  }
+
+  return null;
+}
+
+export function findMentionLinkForDeletion(direction: MentionDeletionDirection): LinkNode | null {
+  const selection = $getSelection();
+  if (!selection) return null;
+
+  if ($isNodeSelection(selection)) {
+    const [selectedNode] = selection.getNodes();
+    return selectedNode ? findMentionLinkNode(selectedNode) : null;
+  }
+
+  if (!$isRangeSelection(selection)) return null;
+
+  const anchorMention = findMentionLinkNode(selection.anchor.getNode());
+  const focusMention = findMentionLinkNode(selection.focus.getNode());
+  if (anchorMention && focusMention && anchorMention.is(focusMention)) {
+    return anchorMention;
+  }
+
+  if (!selection.isCollapsed()) return null;
+
+  return findMentionLinkNodeAtPoint(selection.anchor, direction);
+}
+
+export function deleteSelectedMentionChip(direction: MentionDeletionDirection): boolean {
+  const mentionNode = findMentionLinkForDeletion(direction);
+  if (!mentionNode) return false;
+
+  const previousSibling = mentionNode.getPreviousSibling();
+  const nextSibling = mentionNode.getNextSibling();
+  const parent = mentionNode.getParentOrThrow();
+
+  mentionNode.remove();
+
+  if (direction === "backward") {
+    if (previousSibling) {
+      previousSibling.selectEnd();
+      return true;
+    }
+    if (nextSibling) {
+      nextSibling.selectStart();
+      return true;
+    }
+    parent.selectStart();
+    return true;
+  }
+
+  if (nextSibling) {
+    nextSibling.selectStart();
+    return true;
+  }
+  if (previousSibling) {
+    previousSibling.selectEnd();
+    return true;
+  }
+  parent.selectEnd();
+  return true;
+}
+
+function handleMentionDelete(direction: MentionDeletionDirection, event: KeyboardEvent | null): boolean {
+  const didDelete = deleteSelectedMentionChip(direction);
+  if (!didDelete) return false;
+
+  event?.preventDefault();
+  event?.stopPropagation();
+  return true;
+}
+
+export const mentionDeletionPlugin = realmPlugin({
+  init(realm) {
+    realm.pub(createRootEditorSubscription$, [
+      (editor) =>
+        editor.registerCommand(
+          KEY_BACKSPACE_COMMAND,
+          (event) => handleMentionDelete("backward", event as KeyboardEvent | null),
+          COMMAND_PRIORITY_HIGH,
+        ),
+      (editor) =>
+        editor.registerCommand(
+          KEY_DELETE_COMMAND,
+          (event) => handleMentionDelete("forward", event as KeyboardEvent | null),
+          COMMAND_PRIORITY_HIGH,
+        ),
+    ]);
+  },
+});

package/ui/src/lib/model-utils.ts

@@ -0,0 +1,16 @@
+export function extractProviderId(modelId: string): string | null {
+  const trimmed = modelId.trim();
+  if (!trimmed.includes("/")) return null;
+  const provider = trimmed.slice(0, trimmed.indexOf("/")).trim();
+  return provider || null;
+}
+
+export function extractProviderIdWithFallback(modelId: string, fallback = "other"): string {
+  return extractProviderId(modelId) ?? fallback;
+}
+
+export function extractModelName(modelId: string): string {
+  const trimmed = modelId.trim();
+  if (!trimmed.includes("/")) return trimmed;
+  return trimmed.slice(trimmed.indexOf("/") + 1).trim();
+}

package/ui/src/lib/onboarding-goal.test.ts

@@ -0,0 +1,22 @@
+import { describe, expect, it } from "vitest";
+import { parseOnboardingGoalInput } from "./onboarding-goal";
+
+describe("parseOnboardingGoalInput", () => {
+  it("uses a single-line goal as the title only", () => {
+    expect(parseOnboardingGoalInput("Ship the MVP")).toEqual({
+      title: "Ship the MVP",
+      description: null,
+    });
+  });
+
+  it("splits a multiline goal into title and description", () => {
+    expect(
+      parseOnboardingGoalInput(
+        "Ship the MVP\nLaunch to 10 design partners\nMeasure retention",
+      ),
+    ).toEqual({
+      title: "Ship the MVP",
+      description: "Launch to 10 design partners\nMeasure retention",
+    });
+  });
+});