wave-code 1.0.7 → 1.0.8

package/dist/daemon/jsonRpcClient.d.ts

@@ -0,0 +1,38 @@
+/**
+ * JsonRpcClient — minimal JSON-RPC transport over a line-delimited duplex
+ * stream (one JSON object per line).
+ *
+ * Used by `wave daemon` subcommands to talk to the wave daemon's unix socket.
+ * Mirrors packages/desktop/src/main/stdio/jsonRpcClient.ts (packages/code
+ * cannot import from packages/desktop). Subclasses own the transport and hook
+ * in:
+ * - `writeLine(message)` writes one JSON line to the peer.
+ * - `attachReadable(readable)` wires the inbound half (socket).
+ * - `handleClosed(reason)` marks the transport dead and rejects every pending
+ *   request. Idempotent — safe to call from both dispose() and an exit/close
+ *   event on the underlying transport.
+ */
+import type { Readable } from "stream";
+export type NotificationHandler = (params: unknown, sessionId?: string) => void;
+export declare abstract class JsonRpcClient {
+    private nextId;
+    private pending;
+    private handlers;
+    private closedHandlers;
+    private closed;
+    protected abstract writeLine(message: string): void;
+    /** Wire an inbound Readable (socket) to the line parser. */
+    protected attachReadable(readable: Readable): void;
+    /** Mark the transport closed: reject every pending request. Idempotent. */
+    protected handleClosed(reason: string): void;
+    protected get isClosed(): boolean;
+    /** Close the transport and reject pending requests (subclass tears down its stream). */
+    abstract dispose(): void;
+    /** Observe transport teardown (dispose or unexpected close), fired once. */
+    onClosed(handler: () => void): void;
+    request(method: string, params?: unknown, sessionId?: string): Promise<unknown>;
+    notify(method: string, params?: unknown, sessionId?: string): void;
+    onNotification(method: string, handler: NotificationHandler): void;
+    offNotification(method: string, handler: NotificationHandler): void;
+    private handleLine;
+}

package/dist/daemon/jsonRpcClient.js

@@ -0,0 +1,129 @@
+/**
+ * JsonRpcClient — minimal JSON-RPC transport over a line-delimited duplex
+ * stream (one JSON object per line).
+ *
+ * Used by `wave daemon` subcommands to talk to the wave daemon's unix socket.
+ * Mirrors packages/desktop/src/main/stdio/jsonRpcClient.ts (packages/code
+ * cannot import from packages/desktop). Subclasses own the transport and hook
+ * in:
+ * - `writeLine(message)` writes one JSON line to the peer.
+ * - `attachReadable(readable)` wires the inbound half (socket).
+ * - `handleClosed(reason)` marks the transport dead and rejects every pending
+ *   request. Idempotent — safe to call from both dispose() and an exit/close
+ *   event on the underlying transport.
+ */
+import { createInterface } from "readline";
+export class JsonRpcClient {
+    constructor() {
+        this.nextId = 1;
+        this.pending = new Map();
+        this.handlers = new Map();
+        this.closedHandlers = [];
+        this.closed = false;
+    }
+    /** Wire an inbound Readable (socket) to the line parser. */
+    attachReadable(readable) {
+        const rl = createInterface({ input: readable });
+        rl.on("line", (line) => this.handleLine(line));
+        // readline re-emits input errors on the Interface; the transport subclass
+        // already handles errors on the underlying stream, swallow them here so
+        // they never surface as an uncaught 'error' on the Interface.
+        rl.on("error", () => { });
+    }
+    /** Mark the transport closed: reject every pending request. Idempotent. */
+    handleClosed(reason) {
+        if (this.closed)
+            return;
+        this.closed = true;
+        const error = new Error(reason);
+        for (const p of this.pending.values())
+            p.reject(error);
+        this.pending.clear();
+        for (const handler of this.closedHandlers)
+            handler();
+        this.closedHandlers = [];
+    }
+    get isClosed() {
+        return this.closed;
+    }
+    /** Observe transport teardown (dispose or unexpected close), fired once. */
+    onClosed(handler) {
+        this.closedHandlers.push(handler);
+    }
+    async request(method, params, sessionId) {
+        if (this.closed) {
+            throw new Error("连接已断开。wave 进程已退出，请重启编辑器或检查 CLI 安装。");
+        }
+        const id = this.nextId++;
+        const envelope = { id, method, params };
+        if (sessionId)
+            envelope.sessionId = sessionId;
+        const message = JSON.stringify(envelope) + "\n";
+        return new Promise((resolve, reject) => {
+            this.pending.set(id, { resolve, reject });
+            this.writeLine(message);
+        });
+    }
+    notify(method, params, sessionId) {
+        if (this.closed)
+            return;
+        const envelope = { method, params };
+        if (sessionId)
+            envelope.sessionId = sessionId;
+        this.writeLine(JSON.stringify(envelope) + "\n");
+    }
+    onNotification(method, handler) {
+        let set = this.handlers.get(method);
+        if (!set) {
+            set = new Set();
+            this.handlers.set(method, set);
+        }
+        set.add(handler);
+    }
+    offNotification(method, handler) {
+        this.handlers.get(method)?.delete(handler);
+    }
+    // ── Internal ──────────────────────────────────────────────────
+    handleLine(line) {
+        let msg;
+        try {
+            msg = JSON.parse(line);
+        }
+        catch {
+            console.error("[wave-jsonrpc] Failed to parse:", line);
+            return;
+        }
+        if (typeof msg !== "object" || msg === null)
+            return;
+        const obj = msg;
+        // Response (has id + result/error)
+        if ("id" in obj && ("result" in obj || "error" in obj)) {
+            const id = Number(obj.id);
+            const pending = this.pending.get(id);
+            if (pending) {
+                this.pending.delete(id);
+                if (obj.error) {
+                    const err = obj.error;
+                    pending.reject(new Error(err.message));
+                }
+                else {
+                    pending.resolve(obj.result);
+                }
+            }
+            return;
+        }
+        // Notification (has method, no id)
+        if ("method" in obj && !("id" in obj)) {
+            const method = obj.method;
+            const params = obj.params;
+            const sessionId = typeof obj.sessionId === "string" ? obj.sessionId : undefined;
+            const set = this.handlers.get(method);
+            if (set) {
+                for (const handler of set) {
+                    handler(params, sessionId);
+                }
+            }
+            return;
+        }
+    }
+}

package/dist/daemon/socketClient.d.ts

@@ -0,0 +1,13 @@
+/**
+ * SocketClient — JSON-RPC transport over a unix socket connection to the wave
+ * daemon. Mirrors packages/desktop/src/main/stdio/socketClient.ts (packages/code
+ * cannot import from packages/desktop).
+ */
+import type { Socket } from "net";
+import { JsonRpcClient } from "./jsonRpcClient.js";
+export declare class SocketClient extends JsonRpcClient {
+    private socket;
+    constructor(socket: Socket);
+    protected writeLine(message: string): void;
+    dispose(): void;
+}

package/dist/daemon/socketClient.js

@@ -0,0 +1,26 @@
+/**
+ * SocketClient — JSON-RPC transport over a unix socket connection to the wave
+ * daemon. Mirrors packages/desktop/src/main/stdio/socketClient.ts (packages/code
+ * cannot import from packages/desktop).
+ */
+import { JsonRpcClient } from "./jsonRpcClient.js";
+export class SocketClient extends JsonRpcClient {
+    constructor(socket) {
+        super();
+        this.socket = socket;
+        this.attachReadable(socket);
+        socket.on("close", () => {
+            this.handleClosed("远端连接已断开。");
+        });
+        socket.on("error", (err) => {
+            console.error("[wave-daemon] Socket error:", err.message);
+        });
+    }
+    writeLine(message) {
+        this.socket.write(message);
+    }
+    dispose() {
+        this.handleClosed("远端连接已断开。");
+        this.socket.destroy();
+    }
+}

package/dist/index.js

@@ -178,6 +178,94 @@ export async function main() {
                 const { updatePluginCommand } = await import("./commands/plugin/update.js");
                 await updatePluginCommand(argv);
             });
+        })
+            .command("daemon", "Manage the wave daemon (client subcommands — to START a daemon use `wave --daemon <socket>` instead)", (yargs) => {
+            return yargs
+                .help()
+                .command("list", "List sessions hosted by the daemon (in-memory registry)", {}, async () => {
+                const { daemonListCommand, DEFAULT_DAEMON_SOCKET } = await import("./daemon/commands.js");
+                await daemonListCommand(DEFAULT_DAEMON_SOCKET);
+            })
+                .command("status <sessionId>", "Show a session's progress and recent messages", (yargs) => {
+                return yargs
+                    .positional("sessionId", {
+                    describe: "Session ID hosted by the daemon",
+                    type: "string",
+                })
+                    .option("lines", {
+                    describe: "Number of recent messages to show",
+                    default: 20,
+                    type: "number",
+                });
+            }, async (argv) => {
+                const { daemonStatusCommand, DEFAULT_DAEMON_SOCKET } = await import("./daemon/commands.js");
+                await daemonStatusCommand(DEFAULT_DAEMON_SOCKET, argv.sessionId, argv.lines);
+            })
+                .command("send <sessionId> <message>", "Inject a message into a session and wait for the reply", (yargs) => {
+                return yargs
+                    .positional("sessionId", {
+                    describe: "Session ID hosted by the daemon",
+                    type: "string",
+                })
+                    .positional("message", {
+                    describe: "Message to send",
+                    type: "string",
+                })
+                    .option("timeout", {
+                    describe: "Seconds to wait for the reply (0 = no limit)",
+                    default: 600,
+                    type: "number",
+                });
+            }, async (argv) => {
+                const { daemonSendCommand, DEFAULT_DAEMON_SOCKET } = await import("./daemon/commands.js");
+                await daemonSendCommand(DEFAULT_DAEMON_SOCKET, argv.sessionId, argv.message, { timeout: argv.timeout });
+            })
+                .command("respond <sessionId> <requestId>", "Respond to a pending permission request", (yargs) => {
+                return yargs
+                    .positional("sessionId", {
+                    describe: "Session ID hosting the pending request",
+                    type: "string",
+                })
+                    .positional("requestId", {
+                    describe: "Pending permission request ID",
+                    type: "string",
+                })
+                    .option("allow", {
+                    describe: "Allow the operation",
+                    type: "boolean",
+                })
+                    .option("deny", {
+                    describe: "Deny the operation",
+                    type: "boolean",
+                })
+                    .option("reason", {
+                    describe: "Reason for the decision (deny)",
+                    type: "string",
+                })
+                    .option("answer", {
+                    describe: "Answers JSON for AskUserQuestion requests",
+                    type: "string",
+                })
+                    .option("rule", {
+                    describe: "Persist an allowed rule (e.g. Bash(ls))",
+                    type: "string",
+                })
+                    .option("mode", {
+                    describe: "Switch the session's permission mode",
+                    type: "string",
+                });
+            }, async (argv) => {
+                const { daemonRespondCommand, DEFAULT_DAEMON_SOCKET } = await import("./daemon/commands.js");
+                await daemonRespondCommand(DEFAULT_DAEMON_SOCKET, argv.sessionId, argv.requestId, {
+                    allow: argv.allow,
+                    deny: argv.deny,
+                    reason: argv.reason,
+                    answer: argv.answer,
+                    rule: argv.rule,
+                    mode: argv.mode,
+                });
+            })
+                .demandCommand(1, "Please specify a daemon subcommand");
         })
             .command("update", "Update WAVE Code to the latest version", {}, async () => {
             const { updateCommand } = await import("./commands/update.js");

package/dist/stdio/agentBridge.d.ts

@@ -59,6 +59,15 @@ export declare class AgentBridge {
     private getConfiguredModels;
     private setModel;
     private sendMessage;
+    /**
+     * Webview hosts (desktop/vscode/jetbrains) send pasted images as inline
+     * data URLs — there is no local file behind them. Persist each to a temp
+     * file so the model gets a real path it can reference with tools (aligned
+     * with Claude Code's `[Image source: <path>]` metadata). Real paths pass
+     * through untouched; unparseable data URLs pass through as-is and are
+     * skipped by the SDK rather than blocking the message.
+     */
+    private persistDataUrlImages;
     private bang;
     private askBtw;
     private abortMessage;
@@ -99,6 +108,9 @@ export declare class AgentBridge {
      * client disconnected (daemon mode). Responding to any listed requestId
      * resolves the in-process promise. */
     private listPendingPermissions;
+    /** Daemon list: expose the in-memory session registry (live sessions only,
+     * not disk-scanning). Registration order is preserved. */
+    private listDaemonSessions;
     private getAuthStatus;
     private login;
     private logout;

package/dist/stdio/agentBridge.js

@@ -59,6 +59,8 @@ export class AgentBridge {
                 return this.getSessionInfo(sessionId);
             case "listPendingPermissions":
                 return this.listPendingPermissions();
+            case "listDaemonSessions":
+                return this.listDaemonSessions();
             case "updateConfig":
                 return this.updateConfig(p, sessionId);
             case "getConfiguredModels":
@@ -474,9 +476,39 @@ export class AgentBridge {
         catch {
             // Best-effort; don't block message sending on history save failure
         }
-        await entry.agent.sendMessage(params.text, params.images);
+        await entry.agent.sendMessage(params.text, this.persistDataUrlImages(params.images));
         return null;
     }
+    /**
+     * Webview hosts (desktop/vscode/jetbrains) send pasted images as inline
+     * data URLs — there is no local file behind them. Persist each to a temp
+     * file so the model gets a real path it can reference with tools (aligned
+     * with Claude Code's `[Image source: <path>]` metadata). Real paths pass
+     * through untouched; unparseable data URLs pass through as-is and are
+     * skipped by the SDK rather than blocking the message.
+     */
+    persistDataUrlImages(images) {
+        if (!images || images.length === 0)
+            return images;
+        return images.map((img) => {
+            if (!img.path.startsWith("data:"))
+                return img;
+            const match = /^data:([^;,]+);base64,(.*)$/s.exec(img.path);
+            if (!match)
+                return img;
+            try {
+                const mimeType = match[1];
+                const ext = mimeType.split("/")[1]?.replace("jpeg", "jpg") || "png";
+                const filePath = join(tmpdir(), `wave-image-${Date.now()}-${Math.random().toString(36).slice(2, 8)}.${ext}`);
+                writeFileSync(filePath, Buffer.from(match[2], "base64"));
+                return { path: filePath, mimeType };
+            }
+            catch (error) {
+                logger.warn("Failed to persist pasted image to temp file:", error);
+                return img;
+            }
+        });
+    }
     async bang(command, sessionId) {
         const entry = this.requireSession(sessionId);
         await entry.agent.bang(command);
@@ -511,7 +543,10 @@ export class AgentBridge {
     async rewindToMessage(messageId, sessionId) {
         const entry = this.requireSession(sessionId);
         const { messages } = await entry.agent.getFullMessageThread();
-        const index = messages.findIndex((m) => m.id === messageId);
+        // 压缩是 append-only：同 id 消息（压缩前历史 + 压缩后 append 的重复）会
+        // 在磁盘完整线程中出现多次。用户看到的折叠视图对应最后一次出现，
+        // 因此匹配最后一个而非第一个，避免回滚时连压缩摘要一起删掉。
+        const index = messages.map((m) => m.id).lastIndexOf(messageId);
         if (index === -1) {
             throw new RpcError(PROTOCOL_INTERNAL_ERROR, `Message not found: ${messageId}`);
         }
@@ -523,13 +558,19 @@ export class AgentBridge {
     async listRewindCheckpoints(sessionId) {
         const entry = this.requireSession(sessionId);
         const { messages } = await entry.agent.getFullMessageThread();
-        const checkpoints = messages
-            .filter((m) => isUserCheckpointMessage(m) && m.id)
-            .map((m) => ({
-            id: m.id,
-            content: getMessageContent(m).replace(/\s+/g, " ").trim(),
-        }));
-        return { checkpoints };
+        // 压缩 append-only 后同 id 消息在磁盘完整线程中重复出现（压缩前历史 +
+        // 压缩后 append 的重复）。按 id 去重并保留最后一次出现（与折叠后的
+        // UI/内存视图一致），避免弹窗把同一条用户消息显示两遍。
+        const checkpointMap = new Map();
+        for (const m of messages) {
+            if (isUserCheckpointMessage(m) && m.id) {
+                checkpointMap.set(m.id, {
+                    id: m.id,
+                    content: getMessageContent(m).replace(/\s+/g, " ").trim(),
+                });
+            }
+        }
+        return { checkpoints: Array.from(checkpointMap.values()) };
     }
     deleteQueuedMessage(index, sessionId) {
         const entry = this.requireSession(sessionId);
@@ -540,7 +581,7 @@ export class AgentBridge {
         const entry = this.requireSession(sessionId);
         const ok = entry.agent.updateQueuedMessageById(id, {
             content: text,
-            images,
+            images: this.persistDataUrlImages(images),
         });
         return { ok };
     }
@@ -698,6 +739,18 @@ export class AgentBridge {
             })),
         };
     }
+    /** Daemon list: expose the in-memory session registry (live sessions only,
+     * not disk-scanning). Registration order is preserved. */
+    listDaemonSessions() {
+        return {
+            sessions: [...this.sessions.entries()].map(([sessionId, entry]) => ({
+                sessionId,
+                workingDirectory: entry.agent.workingDirectory,
+                isLoading: entry.agent.isLoading,
+                messageCount: entry.agent.messages.length,
+            })),
+        };
+    }
     // ── Auth (global) ────────────────────────────────────────────
     async getAuthStatus() {
         const authService = AuthService.getInstance();

package/dist/stdio/protocol.d.ts

@@ -34,7 +34,7 @@ export declare const INVALID_REQUEST = -32600;
 export declare const METHOD_NOT_FOUND = -32601;
 export declare const INVALID_PARAMS = -32602;
 export declare const INTERNAL_ERROR = -32603;
-export type RequestMethod = "initialize" | "destroy" | "restoreSession" | "listSessions" | "getSessionInfo" | "sendMessage" | "bang" | "askBtw" | "abortMessage" | "clearMessages" | "rewindToMessage" | "listRewindCheckpoints" | "deleteQueuedMessage" | "updateQueuedMessage" | "deleteQueuedMessageById" | "getMessages" | "getFullMessageThread" | "setPermissionMode" | "getPermissionMode" | "getMcpServers" | "connectMcpServer" | "disconnectMcpServer" | "getSlashCommands" | "searchFiles" | "writeArtifactFile" | "getPromptHistory" | "searchPromptHistory" | "updateConfig" | "getConfiguredModels" | "setModel" | "listPendingPermissions" | "getAuthStatus" | "login" | "logout" | "listPlugins" | "installPlugin" | "uninstallPlugin" | "enablePlugin" | "disablePlugin" | "updatePlugin" | "listMarketplaces" | "addMarketplace" | "removeMarketplace" | "updateMarketplace" | "compact" | "getBackgroundTaskOutput" | "stopBackgroundTask" | "getWorkflowRuns" | "stopWorkflowRun" | "listGitBranches" | "createWorktree" | "removeWorktree";
+export type RequestMethod = "initialize" | "destroy" | "restoreSession" | "listSessions" | "getSessionInfo" | "sendMessage" | "bang" | "askBtw" | "abortMessage" | "clearMessages" | "rewindToMessage" | "listRewindCheckpoints" | "deleteQueuedMessage" | "updateQueuedMessage" | "deleteQueuedMessageById" | "getMessages" | "getFullMessageThread" | "setPermissionMode" | "getPermissionMode" | "getMcpServers" | "connectMcpServer" | "disconnectMcpServer" | "getSlashCommands" | "searchFiles" | "writeArtifactFile" | "getPromptHistory" | "searchPromptHistory" | "updateConfig" | "getConfiguredModels" | "setModel" | "listPendingPermissions" | "listDaemonSessions" | "getAuthStatus" | "login" | "logout" | "listPlugins" | "installPlugin" | "uninstallPlugin" | "enablePlugin" | "disablePlugin" | "updatePlugin" | "listMarketplaces" | "addMarketplace" | "removeMarketplace" | "updateMarketplace" | "compact" | "getBackgroundTaskOutput" | "stopBackgroundTask" | "getWorkflowRuns" | "stopWorkflowRun" | "listGitBranches" | "createWorktree" | "removeWorktree";
 export type ClientNotificationMethod = "permissionResponse";
 export type ServerNotificationMethod = "userMessageAdded" | "assistantMessageAdded" | "assistantContentUpdated" | "assistantReasoningUpdated" | "toolBlockUpdated" | "errorBlockAdded" | "loadingChange" | "commandRunningChange" | "queuedMessagesChange" | "tasksChange" | "sessionIdChange" | "permissionModeChange" | "mcpServersChange" | "workdirChange" | "bangMessageAdded" | "bangMessageUpdated" | "bangMessageCompleted" | "notificationMessageAdded" | "permissionRequest" | "authUrl" | "compactBlockAdded" | "compactionStateChange" | "backgroundTasksChange" | "btwContent";
 export declare function isRequest(msg: unknown): msg is JsonRpcRequest;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wave-code",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "CLI-based code assistant powered by AI, built with React and Ink",
   "repository": {
     "type": "git",
@@ -43,7 +43,7 @@
     "wrap-ansi": "^10.0.0",
     "yargs": "^17.7.2",
     "zod": "^3.23.8",
-    "wave-agent-sdk": "1.0.7"
+    "wave-agent-sdk": "1.0.8"
   },
   "devDependencies": {
     "@types/react": "^19.1.8",

package/src/components/ChatInterface.tsx

@@ -142,6 +142,7 @@ export const ChatInterface: React.FC = () => {
                   toolName={confirmingTool!.name}
                   toolInput={confirmingTool!.input}
                   planContent={confirmingTool!.planContent}
+                  warning={confirmingTool!.warning}
                   isExpanded={isExpanded}
                 />
               )}
@@ -151,6 +152,7 @@ export const ChatInterface: React.FC = () => {
               toolName={confirmingTool!.name}
               toolInput={confirmingTool!.input}
               planContent={confirmingTool!.planContent}
+              warning={confirmingTool!.warning}
               isExpanded={isExpanded}
             />
           )}

package/src/components/ConfirmationDetails.tsx

@@ -7,6 +7,7 @@ import {
   EXIT_PLAN_MODE_TOOL_NAME,
   ENTER_PLAN_MODE_TOOL_NAME,
   ASK_USER_QUESTION_TOOL_NAME,
+  ARTIFACT_TOOL_NAME,
 } from "wave-agent-sdk";
 import { DiffDisplay } from "./DiffDisplay.js";
 import { PlanDisplay } from "./PlanDisplay.js";
@@ -34,6 +35,8 @@ const getActionDescription = (
       return "Enter plan mode for complex task planning";
     case ASK_USER_QUESTION_TOOL_NAME:
       return "Answer questions to clarify intent";
+    case ARTIFACT_TOOL_NAME:
+      return `Publish file: ${toolInput.file_path || "unknown file"}`;
     default:
       return "Execute operation";
   }
@@ -43,6 +46,7 @@ export interface ConfirmationDetailsProps {
   toolName: string;
   toolInput?: Record<string, unknown>;
   planContent?: string;
+  warning?: string;
   isExpanded?: boolean;
 }
 
@@ -50,6 +54,7 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
   toolName,
   toolInput,
   planContent,
+  warning,
   isExpanded = false,
 }) => {
   const startLineNumber =
@@ -69,6 +74,7 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
         Tool: {toolName}
       </Text>
       <Text color="yellow">{getActionDescription(toolName, toolInput)}</Text>
+      {warning && <Text color="red">⚠ {warning}</Text>}
 
       <DiffDisplay
         toolName={toolName}

package/src/components/RewindCommand.tsx

@@ -34,10 +34,16 @@ export const RewindCommand: React.FC<RewindCommandProps> = ({
   }, [getFullMessageThread]);
 
   // Filter user messages as checkpoints, excluding meta messages and
-  // system-generated user-role messages (task notifications, hook injections)
-  const checkpoints = messages
-    .map((msg, index) => ({ msg, index }))
-    .filter(({ msg }) => isUserCheckpointMessage(msg));
+  // system-generated user-role messages (task notifications, hook injections).
+  // Compaction is append-only: the same message id appears twice on the full
+  // thread (pre-compact history + post-compact append), so dedupe by id and
+  // keep the last occurrence (matching the folded view the user sees).
+  const checkpointMap = new Map<string, { msg: Message; index: number }>();
+  messages.forEach((msg, index) => {
+    if (!isUserCheckpointMessage(msg)) return;
+    checkpointMap.set(msg.id ?? `index:${index}`, { msg, index });
+  });
+  const checkpoints = Array.from(checkpointMap.values());
 
   const MAX_VISIBLE_ITEMS = 3;