@prover-coder-ai/docker-git 1.0.23 → 1.0.24

package/src/docker-git/menu-render-layout.ts

@@ -1,30 +0,0 @@
-import { Box, Text } from "ink"
-import React from "react"
-
-const renderMessage = (message: string | null): React.ReactElement | null => {
-  if (!message) {
-    return null
-  }
-  return React.createElement(
-    Box,
-    { marginTop: 1 },
-    React.createElement(Text, { color: "magenta" }, message)
-  )
-}
-
-export const renderLayout = (
-  title: string,
-  body: ReadonlyArray<React.ReactElement>,
-  message: string | null
-): React.ReactElement => {
-  const el = React.createElement
-  const messageView = renderMessage(message)
-  const tail = messageView ? [messageView] : []
-  return el(
-    Box,
-    { flexDirection: "column", padding: 1, borderStyle: "round" },
-    el(Text, { color: "cyan", bold: true }, title),
-    ...body,
-    ...tail
-  )
-}

package/src/docker-git/menu-render-project-auth.ts

@@ -1,70 +0,0 @@
-import { Box, Text } from "ink"
-import React from "react"
-
-import { projectAuthMenuLabels, projectAuthViewSteps } from "./menu-project-auth-data.js"
-import {
-  renderMenuHelp,
-  renderPromptLayout,
-  renderSelectableMenuList,
-  resolvePromptState
-} from "./menu-render-common.js"
-import { renderLayout } from "./menu-render-layout.js"
-import type { ProjectAuthSnapshot, ViewState } from "./menu-types.js"
-
-const renderActiveLabel = (value: string | null): string => value ?? "(not set)"
-
-const renderCountLine = (title: string, count: number): string => `${title}: ${count}`
-
-export const renderProjectAuthMenu = (
-  snapshot: ProjectAuthSnapshot,
-  selected: number,
-  message: string | null
-): React.ReactElement => {
-  const el = React.createElement
-  const list = renderSelectableMenuList(projectAuthMenuLabels(), selected)
-
-  return renderLayout(
-    "docker-git / Project auth",
-    [
-      el(Text, null, `Project: ${snapshot.projectName}`),
-      el(Text, { color: "gray" }, `Dir: ${snapshot.projectDir}`),
-      el(Text, { color: "gray" }, `Project env: ${snapshot.envProjectPath}`),
-      el(Text, { color: "gray" }, `Global env: ${snapshot.envGlobalPath}`),
-      el(Text, { color: "gray" }, `Claude auth: ${snapshot.claudeAuthPath}`),
-      el(
-        Box,
-        { marginTop: 1, flexDirection: "column" },
-        el(Text, { color: "gray" }, `GitHub label: ${renderActiveLabel(snapshot.activeGithubLabel)}`),
-        el(Text, { color: "gray" }, renderCountLine("Available GitHub tokens", snapshot.githubTokenEntries)),
-        el(Text, { color: "gray" }, `Git label: ${renderActiveLabel(snapshot.activeGitLabel)}`),
-        el(Text, { color: "gray" }, renderCountLine("Available Git tokens", snapshot.gitTokenEntries)),
-        el(Text, { color: "gray" }, `Claude label: ${renderActiveLabel(snapshot.activeClaudeLabel)}`),
-        el(Text, { color: "gray" }, renderCountLine("Available Claude logins", snapshot.claudeAuthEntries))
-      ),
-      el(Box, { flexDirection: "column", marginTop: 1 }, ...list),
-      renderMenuHelp("Use arrows + Enter, or type a number from the list.")
-    ],
-    message
-  )
-}
-
-export const renderProjectAuthPrompt = (
-  view: Extract<ViewState, { readonly _tag: "ProjectAuthPrompt" }>,
-  message: string | null
-): React.ReactElement => {
-  const el = React.createElement
-  const { prompt, visibleBuffer } = resolvePromptState(projectAuthViewSteps(view.flow), view.step, view.buffer)
-
-  return renderPromptLayout({
-    title: "docker-git / Project auth / Set label",
-    header: [
-      el(Text, { color: "gray" }, `Project: ${view.snapshot.projectName}`),
-      el(Text, { color: "gray" }, `Project env: ${view.snapshot.envProjectPath}`),
-      el(Text, { color: "gray" }, `Global env: ${view.snapshot.envGlobalPath}`)
-    ],
-    prompt,
-    visibleBuffer,
-    helpLine: "Enter = apply, Esc = cancel.",
-    message
-  })
-}

package/src/docker-git/menu-render-select.ts

@@ -1,250 +0,0 @@
-import { Match } from "effect"
-import { Text } from "ink"
-import type React from "react"
-
-import type { ProjectItem } from "@effect-template/lib/usecases/projects"
-import type { SelectProjectRuntime } from "./menu-types.js"
-
-export type SelectPurpose = "Connect" | "Down" | "Info" | "Delete" | "Auth"
-
-const formatRepoRef = (repoRef: string): string => {
-  const trimmed = repoRef.trim()
-  const prPrefix = "refs/pull/"
-  if (trimmed.startsWith(prPrefix)) {
-    const rest = trimmed.slice(prPrefix.length)
-    const number = rest.split("/")[0] ?? rest
-    return `PR#${number}`
-  }
-  return trimmed.length > 0 ? trimmed : "main"
-}
-
-const stoppedRuntime = (): SelectProjectRuntime => ({
-  running: false,
-  sshSessions: 0,
-  startedAtIso: null,
-  startedAtEpochMs: null
-})
-
-const pad2 = (value: number): string => value.toString().padStart(2, "0")
-
-const formatUtcTimestamp = (epochMs: number, withSeconds: boolean): string => {
-  const date = new Date(epochMs)
-  const seconds = withSeconds ? `:${pad2(date.getUTCSeconds())}` : ""
-  return `${date.getUTCFullYear()}-${pad2(date.getUTCMonth() + 1)}-${pad2(date.getUTCDate())} ${
-    pad2(
-      date.getUTCHours()
-    )
-  }:${pad2(date.getUTCMinutes())}${seconds} UTC`
-}
-
-const renderStartedAtCompact = (runtime: SelectProjectRuntime): string =>
-  runtime.startedAtEpochMs === null ? "-" : formatUtcTimestamp(runtime.startedAtEpochMs, false)
-
-const renderStartedAtDetailed = (runtime: SelectProjectRuntime): string =>
-  runtime.startedAtEpochMs === null ? "not available" : formatUtcTimestamp(runtime.startedAtEpochMs, true)
-
-const runtimeForProject = (
-  runtimeByProject: Readonly<Record<string, SelectProjectRuntime>>,
-  item: ProjectItem
-): SelectProjectRuntime => runtimeByProject[item.projectDir] ?? stoppedRuntime()
-
-const renderRuntimeLabel = (runtime: SelectProjectRuntime): string =>
-  `${runtime.running ? "running" : "stopped"}, ssh=${runtime.sshSessions}, started=${
-    renderStartedAtCompact(
-      runtime
-    )
-  }`
-
-export const selectTitle = (purpose: SelectPurpose): string =>
-  Match.value(purpose).pipe(
-    Match.when("Connect", () => "docker-git / Select project"),
-    Match.when("Auth", () => "docker-git / Project auth"),
-    Match.when("Down", () => "docker-git / Stop container"),
-    Match.when("Info", () => "docker-git / Show connection info"),
-    Match.when("Delete", () => "docker-git / Delete project"),
-    Match.exhaustive
-  )
-
-export const selectHint = (
-  purpose: SelectPurpose,
-  connectEnableMcpPlaywright: boolean
-): string =>
-  Match.value(purpose).pipe(
-    Match.when(
-      "Connect",
-      () => `Enter = select + SSH, P = toggle Playwright MCP (${connectEnableMcpPlaywright ? "on" : "off"}), Esc = back`
-    ),
-    Match.when("Auth", () => "Enter = open project auth menu, Esc = back"),
-    Match.when("Down", () => "Enter = stop container, Esc = back"),
-    Match.when("Info", () => "Use arrows to browse details, Enter = set active, Esc = back"),
-    Match.when("Delete", () => "Enter = ask/confirm delete, Esc = cancel"),
-    Match.exhaustive
-  )
-
-export const buildSelectLabels = (
-  items: ReadonlyArray<ProjectItem>,
-  selected: number,
-  purpose: SelectPurpose,
-  runtimeByProject: Readonly<Record<string, SelectProjectRuntime>>
-): ReadonlyArray<string> =>
-  items.map((item, index) => {
-    const prefix = index === selected ? ">" : " "
-    const refLabel = formatRepoRef(item.repoRef)
-    const runtime = runtimeForProject(runtimeByProject, item)
-    const runtimeSuffix = purpose === "Down" || purpose === "Delete"
-      ? ` [${renderRuntimeLabel(runtime)}]`
-      : ` [started=${renderStartedAtCompact(runtime)}]`
-    return `${prefix} ${index + 1}. ${item.displayName} (${refLabel})${runtimeSuffix}`
-  })
-
-export type SelectListWindow = {
-  readonly start: number
-  readonly end: number
-}
-
-export const buildSelectListWindow = (
-  total: number,
-  selected: number,
-  maxVisible: number
-): SelectListWindow => {
-  if (total <= 0) {
-    return { start: 0, end: 0 }
-  }
-  const visible = Math.max(1, maxVisible)
-  if (total <= visible) {
-    return { start: 0, end: total }
-  }
-  const boundedSelected = Math.min(Math.max(selected, 0), total - 1)
-  const half = Math.floor(visible / 2)
-  const maxStart = total - visible
-  const start = Math.min(Math.max(boundedSelected - half, 0), maxStart)
-  return { start, end: start + visible }
-}
-
-type SelectDetailsContext = {
-  readonly item: ProjectItem
-  readonly refLabel: string
-  readonly authSuffix: string
-  readonly runtime: SelectProjectRuntime
-  readonly sshSessionsLabel: string
-}
-
-const buildDetailsContext = (
-  item: ProjectItem,
-  runtimeByProject: Readonly<Record<string, SelectProjectRuntime>>
-): SelectDetailsContext => {
-  const runtime = runtimeForProject(runtimeByProject, item)
-  return {
-    item,
-    refLabel: formatRepoRef(item.repoRef),
-    authSuffix: item.authorizedKeysExists ? "" : " (missing)",
-    runtime,
-    sshSessionsLabel: runtime.sshSessions === 1
-      ? "1 active SSH session"
-      : `${runtime.sshSessions} active SSH sessions`
-  }
-}
-
-const titleRow = (el: typeof React.createElement, value: string): React.ReactElement =>
-  el(Text, { color: "cyan", bold: true, wrap: "truncate" }, value)
-
-const commonRows = (
-  el: typeof React.createElement,
-  context: SelectDetailsContext
-): ReadonlyArray<React.ReactElement> => [
-  el(Text, { wrap: "wrap" }, `Project directory: ${context.item.projectDir}`),
-  el(Text, { wrap: "wrap" }, `Container: ${context.item.containerName}`),
-  el(Text, { wrap: "wrap" }, `State: ${context.runtime.running ? "running" : "stopped"}`),
-  el(Text, { wrap: "wrap" }, `Started at: ${renderStartedAtDetailed(context.runtime)}`),
-  el(Text, { wrap: "wrap" }, `SSH sessions now: ${context.sshSessionsLabel}`)
-]
-
-const renderInfoDetails = (
-  el: typeof React.createElement,
-  context: SelectDetailsContext,
-  common: ReadonlyArray<React.ReactElement>
-): ReadonlyArray<React.ReactElement> => [
-  titleRow(el, "Connection info"),
-  ...common,
-  el(Text, { wrap: "wrap" }, `Service: ${context.item.serviceName}`),
-  el(Text, { wrap: "wrap" }, `SSH command: ${context.item.sshCommand}`),
-  el(Text, { wrap: "wrap" }, `Repo: ${context.item.repoUrl} (${context.refLabel})`),
-  el(Text, { wrap: "wrap" }, `Workspace: ${context.item.targetDir}`),
-  el(Text, { wrap: "wrap" }, `Authorized keys: ${context.item.authorizedKeysPath}${context.authSuffix}`),
-  el(Text, { wrap: "wrap" }, `Env global: ${context.item.envGlobalPath}`),
-  el(Text, { wrap: "wrap" }, `Env project: ${context.item.envProjectPath}`),
-  el(Text, { wrap: "wrap" }, `Codex auth: ${context.item.codexAuthPath} -> ${context.item.codexHome}`)
-]
-
-const renderDefaultDetails = (
-  el: typeof React.createElement,
-  context: SelectDetailsContext
-): ReadonlyArray<React.ReactElement> => [
-  titleRow(el, "Details"),
-  el(Text, { wrap: "truncate" }, `Repo: ${context.item.repoUrl}`),
-  el(Text, { wrap: "truncate" }, `Ref: ${context.item.repoRef}`),
-  el(Text, { wrap: "truncate" }, `Project dir: ${context.item.projectDir}`),
-  el(Text, { wrap: "truncate" }, `Workspace: ${context.item.targetDir}`),
-  el(Text, { wrap: "truncate" }, `SSH: ${context.item.sshCommand}`)
-]
-
-const renderConnectDetails = (
-  el: typeof React.createElement,
-  context: SelectDetailsContext,
-  common: ReadonlyArray<React.ReactElement>,
-  connectEnableMcpPlaywright: boolean
-): ReadonlyArray<React.ReactElement> => [
-  titleRow(el, "Connect + SSH"),
-  ...common,
-  el(
-    Text,
-    { color: connectEnableMcpPlaywright ? "green" : "gray", wrap: "wrap" },
-    connectEnableMcpPlaywright
-      ? "Playwright MCP: will be enabled before SSH (P to disable)."
-      : "Playwright MCP: keep current project setting (P to enable before SSH)."
-  ),
-  el(Text, { wrap: "wrap" }, `Repo: ${context.item.repoUrl} (${context.refLabel})`),
-  el(Text, { wrap: "wrap" }, `SSH command: ${context.item.sshCommand}`)
-]
-
-export const renderSelectDetails = (
-  el: typeof React.createElement,
-  purpose: SelectPurpose,
-  item: ProjectItem | undefined,
-  runtimeByProject: Readonly<Record<string, SelectProjectRuntime>>,
-  connectEnableMcpPlaywright: boolean
-): ReadonlyArray<React.ReactElement> => {
-  if (!item) {
-    return [el(Text, { color: "gray", wrap: "truncate" }, "No project selected.")]
-  }
-  const context = buildDetailsContext(item, runtimeByProject)
-  const common = commonRows(el, context)
-
-  return Match.value(purpose).pipe(
-    Match.when("Connect", () => renderConnectDetails(el, context, common, connectEnableMcpPlaywright)),
-    Match.when("Auth", () => [
-      titleRow(el, "Project auth"),
-      ...common,
-      el(Text, { wrap: "wrap" }, `Repo: ${context.item.repoUrl} (${context.refLabel})`),
-      el(Text, { wrap: "wrap" }, `Env global: ${context.item.envGlobalPath}`),
-      el(Text, { wrap: "wrap" }, `Env project: ${context.item.envProjectPath}`),
-      el(Text, { color: "gray", wrap: "wrap" }, "Press Enter to manage labels for this project.")
-    ]),
-    Match.when("Info", () => renderInfoDetails(el, context, common)),
-    Match.when("Down", () => [
-      titleRow(el, "Stop container"),
-      ...common,
-      el(Text, { wrap: "wrap" }, `Repo: ${context.item.repoUrl} (${context.refLabel})`)
-    ]),
-    Match.when("Delete", () => [
-      titleRow(el, "Delete project"),
-      ...common,
-      context.runtime.sshSessions > 0
-        ? el(Text, { color: "yellow", wrap: "wrap" }, "Warning: project has active SSH sessions.")
-        : el(Text, { color: "gray", wrap: "wrap" }, "No active SSH sessions detected."),
-      el(Text, { wrap: "wrap" }, `Repo: ${context.item.repoUrl} (${context.refLabel})`),
-      el(Text, { wrap: "wrap" }, "Removes project folder and runs docker compose down -v.")
-    ]),
-    Match.orElse(() => renderDefaultDetails(el, context))
-  )
-}

package/src/docker-git/menu-render.ts

@@ -1,292 +0,0 @@
-import { Match } from "effect"
-import { Box, Text } from "ink"
-import React from "react"
-
-import type { ProjectItem } from "@effect-template/lib/usecases/projects"
-import { renderLayout } from "./menu-render-layout.js"
-import {
-  buildSelectLabels,
-  buildSelectListWindow,
-  renderSelectDetails,
-  selectHint,
-  type SelectPurpose,
-  selectTitle
-} from "./menu-render-select.js"
-import type { CreateInputs, CreateStep, SelectProjectRuntime } from "./menu-types.js"
-import { createSteps, menuItems } from "./menu-types.js"
-
-// CHANGE: render menu views with Ink without JSX
-// WHY: keep UI logic separate from input/state reducers
-// QUOTE(ТЗ): "TUI? Красивый, удобный"
-// REF: user-request-2026-02-01-tui
-// SOURCE: n/a
-// FORMAT THEOREM: forall v: view(v) -> render(v)
-// PURITY: SHELL
-// EFFECT: n/a
-// INVARIANT: menu renders all items once
-// COMPLEXITY: O(n)
-
-export const renderStepLabel = (step: CreateStep, defaults: CreateInputs): string =>
-  Match.value(step).pipe(
-    Match.when("repoUrl", () => "Repo URL (optional for empty workspace)"),
-    Match.when("repoRef", () => `Repo ref [${defaults.repoRef}]`),
-    Match.when("outDir", () => `Output dir [${defaults.outDir}]`),
-    Match.when("runUp", () => `Run docker compose up now? [${defaults.runUp ? "Y" : "n"}]`),
-    Match.when(
-      "mcpPlaywright",
-      () => `Enable Playwright MCP (Chromium sidecar)? [${defaults.enableMcpPlaywright ? "y" : "N"}]`
-    ),
-    Match.when(
-      "force",
-      () => `Force recreate (overwrite files + wipe volumes)? [${defaults.force ? "y" : "N"}]`
-    ),
-    Match.exhaustive
-  )
-
-const compactElements = (
-  items: ReadonlyArray<React.ReactElement | null>
-): ReadonlyArray<React.ReactElement> => items.filter((item): item is React.ReactElement => item !== null)
-
-const renderMenuHints = (el: typeof React.createElement): React.ReactElement =>
-  el(
-    Box,
-    { marginTop: 1, flexDirection: "column" },
-    el(Text, { color: "gray" }, "Hints:"),
-    el(Text, { color: "gray" }, "  - Paste repo URL to create directly."),
-    el(
-      Text,
-      { color: "gray" },
-      "  - Aliases: create/c, select/s, auth/a, project-auth/pa, info/i, status/ps, logs/l, down/d, down-all/da, delete/del, quit/q"
-    ),
-    el(Text, { color: "gray" }, "  - Use arrows and Enter to run.")
-  )
-
-const renderMenuMessage = (
-  el: typeof React.createElement,
-  message: string | null
-): React.ReactElement | null => {
-  if (!message || message.length === 0) {
-    return null
-  }
-  return el(
-    Box,
-    { marginTop: 1, flexDirection: "column" },
-    ...message
-      .split("\n")
-      .map((line, index) => el(Text, { key: `${index}-${line}`, color: "magenta" }, line))
-  )
-}
-
-type MenuRenderInput = {
-  readonly cwd: string
-  readonly activeDir: string | null
-  readonly runningDockerGitContainers: number
-  readonly selected: number
-  readonly busy: boolean
-  readonly message: string | null
-}
-
-export const renderMenu = (input: MenuRenderInput): React.ReactElement => {
-  const { activeDir, busy, cwd, message, runningDockerGitContainers, selected } = input
-  const el = React.createElement
-  const activeLabel = `Active: ${activeDir ?? "(none)"}`
-  const runningLabel = `Running docker-git containers: ${runningDockerGitContainers}`
-  const cwdLabel = `CWD: ${cwd}`
-  const items = menuItems.map((item, index) => {
-    const indexLabel = `${index + 1})`
-    const prefix = index === selected ? ">" : " "
-    return el(
-      Text,
-      { key: item.label, color: index === selected ? "green" : "white" },
-      `${prefix} ${indexLabel} ${item.label}`
-    )
-  })
-
-  const busyView = busy
-    ? el(Box, { marginTop: 1 }, el(Text, { color: "yellow" }, "Running..."))
-    : null
-
-  const messageView = renderMenuMessage(el, message)
-  const hints = renderMenuHints(el)
-
-  return renderLayout(
-    "docker-git",
-    compactElements([
-      el(Text, null, activeLabel),
-      el(Text, null, runningLabel),
-      el(Text, null, cwdLabel),
-      el(Box, { flexDirection: "column", marginTop: 1 }, ...items),
-      hints,
-      busyView,
-      messageView
-    ]),
-    null
-  )
-}
-
-export const renderCreate = (
-  label: string,
-  buffer: string,
-  message: string | null,
-  stepIndex: number,
-  defaults: CreateInputs
-): React.ReactElement => {
-  const el = React.createElement
-  const steps = createSteps.map((step, index) =>
-    el(
-      Text,
-      { key: step, color: index === stepIndex ? "green" : "gray" },
-      `${index === stepIndex ? ">" : " "} ${renderStepLabel(step, defaults)}`
-    )
-  )
-  return renderLayout(
-    "docker-git / Create",
-    [
-      el(Box, { flexDirection: "column", marginTop: 1 }, ...steps),
-      el(
-        Box,
-        { marginTop: 1 },
-        el(Text, null, `${label}: `),
-        el(Text, { color: "green" }, buffer)
-      ),
-      el(Box, { marginTop: 1 }, el(Text, { color: "gray" }, "Enter = next, Esc = cancel."))
-    ],
-    message
-  )
-}
-
-export { renderAuthMenu, renderAuthPrompt } from "./menu-render-auth.js"
-export { renderProjectAuthMenu, renderProjectAuthPrompt } from "./menu-render-project-auth.js"
-
-const computeListWidth = (labels: ReadonlyArray<string>): number => {
-  const maxLabelWidth = labels.length > 0 ? Math.max(...labels.map((label) => label.length)) : 24
-  return Math.min(Math.max(maxLabelWidth + 2, 28), 54)
-}
-
-const readStdoutRows = (): number | null => {
-  const rows = process.stdout.rows
-  if (typeof rows !== "number" || !Number.isFinite(rows) || rows <= 0) {
-    return null
-  }
-  return rows
-}
-
-const computeSelectListMaxRows = (): number => {
-  const rows = readStdoutRows()
-  if (rows === null) {
-    return 12
-  }
-  return Math.max(6, rows - 14)
-}
-
-const renderSelectListBox = (
-  el: typeof React.createElement,
-  items: ReadonlyArray<ProjectItem>,
-  selected: number,
-  labels: ReadonlyArray<string>,
-  width: number
-): React.ReactElement => {
-  const window = buildSelectListWindow(labels.length, selected, computeSelectListMaxRows())
-  const hiddenAbove = window.start
-  const hiddenBelow = labels.length - window.end
-  const visibleLabels = labels.slice(window.start, window.end)
-  const list = visibleLabels.map((label, offset) => {
-    const index = window.start + offset
-    return el(
-      Text,
-      {
-        key: items[index]?.projectDir ?? String(index),
-        color: index === selected ? "green" : "white",
-        wrap: "truncate"
-      },
-      label
-    )
-  })
-
-  const before = hiddenAbove > 0
-    ? [el(Text, { color: "gray", wrap: "truncate" }, `[scroll] ${hiddenAbove} more above`)]
-    : []
-  const after = hiddenBelow > 0
-    ? [el(Text, { color: "gray", wrap: "truncate" }, `[scroll] ${hiddenBelow} more below`)]
-    : []
-  const listBody = list.length > 0 ? list : [el(Text, { color: "gray" }, "No projects found.")]
-
-  return el(
-    Box,
-    { flexDirection: "column", width },
-    ...before,
-    ...listBody,
-    ...after
-  )
-}
-
-type SelectDetailsBoxInput = {
-  readonly purpose: SelectPurpose
-  readonly items: ReadonlyArray<ProjectItem>
-  readonly selected: number
-  readonly runtimeByProject: Readonly<Record<string, SelectProjectRuntime>>
-  readonly connectEnableMcpPlaywright: boolean
-}
-
-const renderSelectDetailsBox = (
-  el: typeof React.createElement,
-  input: SelectDetailsBoxInput
-): React.ReactElement => {
-  const details = renderSelectDetails(
-    el,
-    input.purpose,
-    input.items[input.selected],
-    input.runtimeByProject,
-    input.connectEnableMcpPlaywright
-  )
-  return el(
-    Box,
-    { flexDirection: "column", marginLeft: 2, flexGrow: 1 },
-    ...details
-  )
-}
-
-export const renderSelect = (
-  input: {
-    readonly purpose: SelectPurpose
-    readonly items: ReadonlyArray<ProjectItem>
-    readonly selected: number
-    readonly runtimeByProject: Readonly<Record<string, SelectProjectRuntime>>
-    readonly confirmDelete: boolean
-    readonly connectEnableMcpPlaywright: boolean
-    readonly message: string | null
-  }
-): React.ReactElement => {
-  const { confirmDelete, connectEnableMcpPlaywright, items, message, purpose, runtimeByProject, selected } = input
-  const el = React.createElement
-  const listLabels = buildSelectLabels(items, selected, purpose, runtimeByProject)
-  const listWidth = computeListWidth(listLabels)
-  const listBox = renderSelectListBox(el, items, selected, listLabels, listWidth)
-  const detailsBox = renderSelectDetailsBox(el, {
-    purpose,
-    items,
-    selected,
-    runtimeByProject,
-    connectEnableMcpPlaywright
-  })
-  const baseHint = selectHint(purpose, connectEnableMcpPlaywright)
-  const confirmHint = (() => {
-    if (purpose === "Delete" && confirmDelete) {
-      return "Confirm mode: Enter = delete now, Esc = cancel"
-    }
-    if (purpose === "Down" && confirmDelete) {
-      return "Confirm mode: Enter = stop now, Esc = cancel"
-    }
-    return baseHint
-  })()
-  const hints = el(Box, { marginTop: 1 }, el(Text, { color: "gray" }, confirmHint))
-
-  return renderLayout(
-    selectTitle(purpose),
-    [
-      el(Box, { flexDirection: "row", marginTop: 1 }, listBox, detailsBox),
-      hints
-    ],
-    message
-  )
-}