codexmate 0.0.21 → 0.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (114) hide show
  1. package/README.md +389 -284
  2. package/README.zh.md +321 -0
  3. package/cli/agents-files.js +224 -162
  4. package/cli/archive-helpers.js +446 -446
  5. package/cli/auth-profiles.js +359 -359
  6. package/cli/builtin-proxy.js +1044 -580
  7. package/cli/claude-proxy.js +998 -998
  8. package/cli/config-bootstrap.js +384 -384
  9. package/cli/config-health.js +338 -338
  10. package/cli/openai-bridge.js +950 -0
  11. package/cli/openclaw-config.js +629 -629
  12. package/cli/session-usage.concurrent.js +28 -0
  13. package/cli/session-usage.js +112 -0
  14. package/cli/session-usage.models.js +176 -0
  15. package/cli/skills.js +1141 -1141
  16. package/cli/zip-commands.js +510 -510
  17. package/cli.js +13214 -13129
  18. package/lib/cli-file-utils.js +151 -151
  19. package/lib/cli-models-utils.js +419 -419
  20. package/lib/cli-network-utils.js +164 -164
  21. package/lib/cli-path-utils.js +69 -69
  22. package/lib/cli-session-utils.js +121 -121
  23. package/lib/cli-sessions.js +386 -386
  24. package/lib/cli-utils.js +155 -155
  25. package/lib/download-artifacts.js +77 -77
  26. package/lib/mcp-stdio.js +440 -440
  27. package/lib/task-orchestrator.js +869 -869
  28. package/lib/text-diff.js +303 -303
  29. package/lib/workflow-engine.js +340 -340
  30. package/package.json +74 -74
  31. package/res/json5.min.js +1 -1
  32. package/res/logo.png +0 -0
  33. package/res/vue.global.prod.js +13 -13
  34. package/web-ui/app.js +575 -530
  35. package/web-ui/index.html +34 -33
  36. package/web-ui/logic.agents-diff.mjs +386 -386
  37. package/web-ui/logic.claude.mjs +168 -168
  38. package/web-ui/logic.mjs +5 -5
  39. package/web-ui/logic.runtime.mjs +128 -124
  40. package/web-ui/logic.sessions.mjs +614 -581
  41. package/web-ui/modules/api.mjs +90 -90
  42. package/web-ui/modules/app.computed.dashboard.mjs +126 -113
  43. package/web-ui/modules/app.computed.index.mjs +17 -15
  44. package/web-ui/modules/app.computed.main-tabs.mjs +198 -195
  45. package/web-ui/modules/app.computed.session.mjs +653 -507
  46. package/web-ui/modules/app.constants.mjs +15 -15
  47. package/web-ui/modules/app.methods.agents.mjs +544 -493
  48. package/web-ui/modules/app.methods.claude-config.mjs +174 -174
  49. package/web-ui/modules/app.methods.codex-config.mjs +795 -640
  50. package/web-ui/modules/app.methods.index.mjs +92 -88
  51. package/web-ui/modules/app.methods.install.mjs +161 -149
  52. package/web-ui/modules/app.methods.navigation.mjs +619 -619
  53. package/web-ui/modules/app.methods.openclaw-core.mjs +814 -814
  54. package/web-ui/modules/app.methods.openclaw-editing.mjs +372 -372
  55. package/web-ui/modules/app.methods.openclaw-persist.mjs +369 -369
  56. package/web-ui/modules/app.methods.providers.mjs +404 -363
  57. package/web-ui/modules/app.methods.runtime.mjs +323 -323
  58. package/web-ui/modules/app.methods.session-actions.mjs +537 -520
  59. package/web-ui/modules/app.methods.session-browser.mjs +626 -626
  60. package/web-ui/modules/app.methods.session-timeline.mjs +448 -448
  61. package/web-ui/modules/app.methods.session-trash.mjs +422 -422
  62. package/web-ui/modules/app.methods.startup-claude.mjs +405 -412
  63. package/web-ui/modules/app.methods.task-orchestration.mjs +471 -471
  64. package/web-ui/modules/config-mode.computed.mjs +126 -126
  65. package/web-ui/modules/config-template-confirm-pref.mjs +33 -0
  66. package/web-ui/modules/i18n.mjs +1609 -0
  67. package/web-ui/modules/plugins.computed.mjs +220 -0
  68. package/web-ui/modules/plugins.methods.mjs +620 -0
  69. package/web-ui/modules/plugins.storage.mjs +37 -0
  70. package/web-ui/modules/skills.computed.mjs +107 -107
  71. package/web-ui/modules/skills.methods.mjs +481 -481
  72. package/web-ui/partials/index/layout-footer.html +13 -13
  73. package/web-ui/partials/index/layout-header.html +461 -402
  74. package/web-ui/partials/index/modal-config-template-agents.html +175 -125
  75. package/web-ui/partials/index/modal-confirm-toast.html +32 -32
  76. package/web-ui/partials/index/modal-health-check.html +72 -72
  77. package/web-ui/partials/index/modal-openclaw-config.html +280 -280
  78. package/web-ui/partials/index/modal-skills.html +200 -184
  79. package/web-ui/partials/index/modals-basic.html +165 -156
  80. package/web-ui/partials/index/panel-config-claude.html +138 -126
  81. package/web-ui/partials/index/panel-config-codex.html +234 -237
  82. package/web-ui/partials/index/panel-config-openclaw.html +78 -78
  83. package/web-ui/partials/index/panel-docs.html +147 -130
  84. package/web-ui/partials/index/panel-market.html +174 -174
  85. package/web-ui/partials/index/panel-orchestration.html +397 -397
  86. package/web-ui/partials/index/panel-plugins.html +243 -0
  87. package/web-ui/partials/index/panel-sessions.html +292 -292
  88. package/web-ui/partials/index/panel-settings.html +258 -190
  89. package/web-ui/partials/index/panel-usage.html +353 -213
  90. package/web-ui/session-helpers.mjs +573 -559
  91. package/web-ui/source-bundle.cjs +233 -233
  92. package/web-ui/styles/base-theme.css +264 -271
  93. package/web-ui/styles/controls-forms.css +362 -360
  94. package/web-ui/styles/docs-panel.css +247 -182
  95. package/web-ui/styles/feedback.css +108 -108
  96. package/web-ui/styles/health-check-dialog.css +144 -144
  97. package/web-ui/styles/layout-shell.css +596 -376
  98. package/web-ui/styles/modals-core.css +464 -464
  99. package/web-ui/styles/navigation-panels.css +382 -348
  100. package/web-ui/styles/openclaw-structured.css +266 -266
  101. package/web-ui/styles/plugins-panel.css +518 -0
  102. package/web-ui/styles/responsive.css +456 -450
  103. package/web-ui/styles/sessions-list.css +400 -400
  104. package/web-ui/styles/sessions-preview.css +411 -411
  105. package/web-ui/styles/sessions-toolbar-trash.css +268 -243
  106. package/web-ui/styles/sessions-usage.css +851 -628
  107. package/web-ui/styles/settings-panel.css +166 -0
  108. package/web-ui/styles/skills-list.css +303 -296
  109. package/web-ui/styles/skills-market.css +396 -335
  110. package/web-ui/styles/task-orchestration.css +776 -776
  111. package/web-ui/styles/titles-cards.css +408 -408
  112. package/web-ui/styles.css +20 -18
  113. package/web-ui.html +17 -17
  114. package/README.en.md +0 -349
package/web-ui/partials/index/panel-sessions.html CHANGED
@@ -1,292 +1,292 @@
1
- <!-- 会话浏览模式 -->
2
- <div
3
- v-show="mainTab === 'sessions'"
4
- class="mode-content"
5
- id="panel-sessions"
6
- role="tabpanel"
7
- :aria-labelledby="'tab-sessions'">
8
- <div v-if="sessionStandalone" class="session-standalone-page">
9
- <div v-if="sessionStandaloneLoading" class="state-message">
10
- 加载中...
11
- </div>
12
- <div v-else-if="sessionStandaloneError" class="state-message error">
13
- {{ sessionStandaloneError }}
14
- </div>
15
- <div v-else>
16
- <div class="session-standalone-title">
17
- {{ sessionStandaloneTitle }}
18
- <span v-if="sessionStandaloneSourceLabel"> · {{ sessionStandaloneSourceLabel }}</span>
19
- </div>
20
- <pre class="session-standalone-text">{{ sessionStandaloneText }}</pre>
21
- </div>
22
- </div>
23
- <div v-else>
24
- <div class="selector-section">
25
- <div class="selector-header">
26
- <span class="selector-title">会话来源</span>
27
- <div class="selector-actions">
28
- <button class="btn-tool btn-tool-compact" @click="loadSessions({ forceRefresh: true })" :disabled="sessionsLoading">
29
- {{ sessionsLoading ? '刷新中...' : '刷新会话' }}
30
- </button>
31
- </div>
32
- </div>
33
- <div class="session-toolbar">
34
- <div class="session-toolbar-group">
35
- <select class="session-source-select" v-model="sessionFilterSource" @change="onSessionSourceChange" :disabled="sessionsLoading">
36
- <option value="all">全部</option>
37
- <option value="codex">Codex</option>
38
- <option value="claude">Claude Code</option>
39
- </select>
40
- <select
41
- class="session-path-select"
42
- v-model="sessionPathFilter"
43
- @change="onSessionPathFilterChange"
44
- @focus="loadSessionPathOptions({ source: sessionFilterSource })"
45
- :disabled="sessionsLoading">
46
- <option value="">全部路径</option>
47
- <option v-for="cwd in sessionPathOptions" :key="cwd" :value="cwd">{{ cwd }}</option>
48
- </select>
49
- </div>
50
- <div class="session-toolbar-group session-toolbar-grow">
51
- <input
52
- class="session-query-input"
53
- v-model="sessionQuery"
54
- @keyup.enter="loadSessions"
55
- :disabled="sessionsLoading || !isSessionQueryEnabled"
56
- :placeholder="sessionQueryPlaceholder">
57
- </div>
58
- <div class="session-toolbar-group">
59
- <select
60
- class="session-role-select"
61
- v-model="sessionRoleFilter"
62
- @change="onSessionFilterChange"
63
- disabled>
64
- <option value="all">全部角色</option>
65
- <option value="user">仅 User</option>
66
- <option value="assistant">仅 Assistant</option>
67
- <option value="system">仅 System</option>
68
- </select>
69
- <select
70
- class="session-time-select"
71
- v-model="sessionTimePreset"
72
- @change="onSessionFilterChange"
73
- disabled>
74
- <option value="all">全部时间</option>
75
- <option value="7d">近 7 天</option>
76
- <option value="30d">近 30 天</option>
77
- <option value="90d">近 90 天</option>
78
- </select>
79
- </div>
80
- </div>
81
- <div class="session-toolbar-footer">
82
- <label class="quick-option">
83
- <input
84
- type="checkbox"
85
- v-model="sessionResumeWithYolo"
86
- @change="onSessionResumeYoloChange"
87
- >
88
- 复制恢复命令附带 --yolo
89
- </label>
90
- </div>
91
- </div>
92
-
93
- <div v-if="sessionsLoading" class="state-message">
94
- 会话加载中...
95
- </div>
96
-
97
- <div v-else-if="sessionsList.length === 0" class="session-empty">
98
- 暂无可用会话记录
99
- </div>
100
-
101
- <div v-else class="session-layout">
102
- <div
103
- v-if="sessionListRenderEnabled"
104
- class="session-list"
105
- :ref="setSessionListRef"
106
- @scroll.passive="onSessionListScroll">
107
- <div
108
- v-for="session in visibleSessionsList"
109
- :key="session.source + '-' + session.sessionId + '-' + session.filePath"
110
- v-memo="[activeSessionExportKey === getSessionExportKey(session), session.messageCount, session.updatedAt, session.title, session.sourceLabel, isSessionPinned(session), sessionsLoading]"
111
- :class="[
112
- 'session-item',
113
- {
114
- active: activeSessionExportKey === getSessionExportKey(session),
115
- pinned: isSessionPinned(session)
116
- }
117
- ]"
118
- @click="selectSession(session)"
119
- @keydown.enter.self.prevent="selectSession(session)"
120
- @keydown.space.self.prevent="selectSession(session)"
121
- tabindex="0"
122
- role="button"
123
- :aria-current="activeSessionExportKey === getSessionExportKey(session) ? 'true' : null">
124
- <div class="session-item-header">
125
- <div class="session-item-main">
126
- <div class="session-item-title">{{ session.title || session.sessionId }}</div>
127
- <span class="session-count-badge">{{ session.messageCount ?? 0 }}</span>
128
- </div>
129
- <div class="session-item-actions">
130
- <button
131
- class="session-item-copy session-item-pin"
132
- @click.stop="toggleSessionPin(session)"
133
- :disabled="sessionsLoading"
134
- :aria-label="isSessionPinned(session) ? '取消置顶' : '置顶'"
135
- :title="isSessionPinned(session) ? '取消置顶' : '置顶'"
136
- :aria-pressed="isSessionPinned(session)">
137
- <svg v-if="isSessionPinned(session)" class="pin-icon" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="1.6">
138
- <path d="M12 22s8-6 8-12a8 8 0 1 0-16 0c0 6 8 12 8 12z"></path>
139
- </svg>
140
- <svg v-else class="pin-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6">
141
- <path d="M12 22s8-6 8-12a8 8 0 1 0-16 0c0 6 8 12 8 12z"></path>
142
- </svg>
143
- </button>
144
- <button
145
- v-if="isResumeCommandAvailable(session)"
146
- class="session-item-copy"
147
- @click.stop="copyResumeCommand(session)"
148
- :disabled="sessionsLoading"
149
- aria-label="复制恢复命令"
150
- title="复制恢复命令">
151
- <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
152
- <rect x="8" y="8" width="12" height="12" rx="2"></rect>
153
- <path d="M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2"></path>
154
- </svg>
155
- </button>
156
- </div>
157
- </div>
158
- <div class="session-item-meta">
159
- <span class="session-source">{{ session.sourceLabel }}</span>
160
- <span class="session-item-time">{{ session.updatedAt || 'unknown time' }}</span>
161
- </div>
162
- </div>
163
- </div>
164
- <div v-else class="session-list session-list-placeholder"></div>
165
-
166
- <div :class="['session-preview', { active: !!activeSession }]" :ref="setSessionPreviewContainerRef">
167
- <template v-if="activeSession">
168
- <div class="session-preview-scroll" :ref="setSessionPreviewScrollRef" @scroll="onSessionPreviewScroll">
169
- <div class="session-preview-header" :ref="setSessionPreviewHeaderRef">
170
- <div>
171
- <div class="session-preview-title">{{ activeSession.title || activeSession.sessionId }}</div>
172
- <div class="session-preview-meta">
173
- <span class="session-preview-meta-item">{{ activeSession.sourceLabel }}</span>
174
- <span class="session-preview-meta-item">{{ activeSession.updatedAt || 'unknown time' }}</span>
175
- </div>
176
- <div class="session-preview-meta" v-if="activeSession.cwd">
177
- <span class="session-preview-meta-item">{{ activeSession.cwd }}</span>
178
- </div>
179
- </div>
180
- <div class="session-actions">
181
- <button class="btn-session-refresh" @click="loadActiveSessionDetail" :disabled="sessionDetailLoading || !activeSession">
182
- {{ sessionDetailLoading ? '加载中...' : '刷新内容' }}
183
- </button>
184
- <button
185
- v-if="isDeleteAvailable(activeSession)"
186
- class="btn-session-delete"
187
- @click="deleteSession(activeSession)"
188
- :disabled="!activeSession || sessionsLoading || sessionDeleting[getSessionExportKey(activeSession)]">
189
- {{ (activeSession && sessionDeleting[getSessionExportKey(activeSession)]) ? (sessionTrashEnabled === false ? '删除中...' : '移入中...') : (sessionTrashEnabled === false ? '直接删除' : '移入回收站') }}
190
- </button>
191
- <button
192
- class="btn-session-export"
193
- @click="exportSession(activeSession)"
194
- :disabled="!activeSession || sessionExporting[getSessionExportKey(activeSession)]">
195
- {{ (activeSession && sessionExporting[getSessionExportKey(activeSession)]) ? '导出中...' : '导出记录' }}
196
- </button>
197
- <button
198
- class="btn-session-open"
199
- @click="openSessionStandalone(activeSession)"
200
- :disabled="!activeSession">
201
- 新页查看
202
- </button>
203
- </div>
204
- </div>
205
-
206
- <div v-if="sessionDetailLoading && !sessionPreviewLoadingMore" class="session-preview-empty">
207
- 正在加载会话内容...
208
- </div>
209
-
210
- <div v-else-if="activeSessionDetailError" class="session-preview-empty">
211
- {{ activeSessionDetailError }}
212
- </div>
213
-
214
- <div v-else-if="!activeSessionMessages.length" class="session-preview-empty">
215
- 当前会话暂无可展示消息
216
- </div>
217
-
218
- <div v-else-if="sessionPreviewRenderEnabled && !activeSessionVisibleMessages.length" class="session-preview-empty">
219
- <span>正在渲染会话内容...</span>
220
- <button class="btn-session-refresh" @click="primeSessionPreviewMessageRender" :disabled="sessionDetailLoading">
221
- 重新渲染
222
- </button>
223
- </div>
224
-
225
- <div v-else-if="!sessionPreviewRenderEnabled" class="session-preview-empty">
226
- 正在准备会话内容...
227
- </div>
228
-
229
- <div v-else class="session-preview-body">
230
- <div class="session-preview-messages">
231
- <div v-if="activeSessionDetailClipped" class="session-item-sub session-item-wrap">
232
- 仅展示最近 {{ activeSessionMessages.length }} 条消息。
233
- </div>
234
- <div
235
- v-if="canLoadMoreSessionMessages"
236
- class="session-item-sub session-item-wrap"
237
- style="display:flex;align-items:center;justify-content:space-between;gap:8px;">
238
- <span>已显示 {{ activeSessionVisibleMessages.length }} / {{ activeSessionMessages.length }} 条</span>
239
- <button class="btn-session-refresh" @click="loadMoreSessionMessages()" :disabled="sessionDetailLoading || sessionPreviewLoadingMore">
240
- {{ sessionPreviewLoadingMore ? '加载中...' : ('加载更多（剩余 ' + sessionPreviewRemainingCount + '）') }}
241
- </button>
242
- </div>
243
- <div
244
- v-if="sessionPreviewLoadingMore"
245
- class="session-item-sub session-item-wrap">
246
- 正在加载更早消息...
247
- </div>
248
- <div
249
- v-for="(msg, idx) in activeSessionVisibleMessages"
250
- :key="getRecordRenderKey(msg, idx)"
251
- v-memo="[msg.text, msg.timestamp, msg.roleLabel, msg.normalizedRole]"
252
- :data-message-key="getRecordRenderKey(msg, idx)"
253
- :ref="getSessionMessageRefBinder(getRecordRenderKey(msg, idx))"
254
- :class="['session-msg', msg.normalizedRole === 'user' ? 'user' : (msg.normalizedRole === 'system' ? 'system' : 'assistant')]">
255
- <div class="session-msg-header">
256
- <div class="session-msg-meta">
257
- <span class="session-msg-role">{{ msg.roleLabel || (msg.normalizedRole === 'user' ? 'User' : (msg.normalizedRole === 'system' ? 'System' : 'Assistant')) }}</span>
258
- <span class="session-msg-time">{{ msg.timestamp || '' }}</span>
259
- </div>
260
- </div>
261
- <div class="session-msg-content">{{ msg.text || '' }}</div>
262
- </div>
263
- </div>
264
- </div>
265
- </div>
266
- <aside v-if="sessionPreviewRenderEnabled && sessionTimelineNodes.length" class="session-timeline" aria-label="会话时间轴">
267
- <div class="session-timeline-track"></div>
268
- <button
269
- v-for="node in sessionTimelineNodes"
270
- :key="'timeline-' + node.key"
271
- v-memo="[sessionTimelineActiveKey === node.key, node.safePercent, node.title]"
272
- type="button"
273
- :class="['session-timeline-node', { active: sessionTimelineActiveKey === node.key }]"
274
- :aria-current="sessionTimelineActiveKey === node.key ? 'true' : null"
275
- :style="{ top: `${node.safePercent}%` }"
276
- :title="node.title"
277
- @click="jumpToSessionTimelineNode(node.key)">
278
- <span class="sr-only">{{ node.title }}</span>
279
- </button>
280
- <div class="session-timeline-current" v-if="sessionTimelineActiveTitle">
281
- {{ sessionTimelineActiveTitle }}
282
- </div>
283
- </aside>
284
- </template>
285
-
286
- <div v-else class="session-preview-empty">
287
- <span>请先在左侧选择一个会话</span>
288
- </div>
289
- </div>
290
- </div>
291
- </div>
292
- </div>
1
+ <!-- 会话浏览模式 -->
2
+ <div
3
+ v-show="mainTab === 'sessions'"
4
+ class="mode-content"
5
+ id="panel-sessions"
6
+ role="tabpanel"
7
+ :aria-labelledby="'tab-sessions'">
8
+ <div v-if="sessionStandalone" class="session-standalone-page">
9
+ <div v-if="sessionStandaloneLoading" class="state-message">
10
+ {{ t('sessions.loading') }}
11
+ </div>
12
+ <div v-else-if="sessionStandaloneError" class="state-message error">
13
+ {{ sessionStandaloneError }}
14
+ </div>
15
+ <div v-else>
16
+ <div class="session-standalone-title">
17
+ {{ sessionStandaloneTitle }}
18
+ <span v-if="sessionStandaloneSourceLabel"> · {{ sessionStandaloneSourceLabel }}</span>
19
+ </div>
20
+ <pre class="session-standalone-text">{{ sessionStandaloneText }}</pre>
21
+ </div>
22
+ </div>
23
+ <div v-else>
24
+ <div class="selector-section">
25
+ <div class="selector-header">
26
+ <span class="selector-title">{{ t('sessions.sourceTitle') }}</span>
27
+ <div class="selector-actions">
28
+ <button class="btn-tool btn-tool-compact" @click="loadSessions({ forceRefresh: true })" :disabled="sessionsLoading">
29
+ {{ sessionsLoading ? t('sessions.refreshing') : t('sessions.refresh') }}
30
+ </button>
31
+ </div>
32
+ </div>
33
+ <div class="session-toolbar">
34
+ <div class="session-toolbar-group session-toolbar-primary">
35
+ <select class="session-source-select" v-model="sessionFilterSource" @change="onSessionSourceChange" :disabled="sessionsLoading">
36
+ <option value="all">{{ t('common.all') }}</option>
37
+ <option value="codex">{{ t('sessions.source.codex') }}</option>
38
+ <option value="claude">{{ t('sessions.source.claudeCode') }}</option>
39
+ </select>
40
+ <select
41
+ class="session-path-select"
42
+ v-model="sessionPathFilter"
43
+ @change="onSessionPathFilterChange"
44
+ @focus="loadSessionPathOptions({ source: sessionFilterSource })"
45
+ :disabled="sessionsLoading">
46
+ <option value="">{{ t('sessions.allPaths') }}</option>
47
+ <option v-for="cwd in sessionPathOptions" :key="cwd" :value="cwd">{{ cwd }}</option>
48
+ </select>
49
+ </div>
50
+ <div class="session-toolbar-group session-toolbar-grow">
51
+ <input
52
+ class="session-query-input"
53
+ v-model="sessionQuery"
54
+ @keyup.enter="loadSessions"
55
+ :disabled="sessionsLoading || !isSessionQueryEnabled"
56
+ :placeholder="sessionQueryPlaceholder">
57
+ </div>
58
+ <div class="session-toolbar-group session-toolbar-secondary">
59
+ <select
60
+ class="session-role-select"
61
+ v-model="sessionRoleFilter"
62
+ @change="onSessionFilterChange"
63
+ disabled>
64
+ <option value="all">{{ t('sessions.role.all') }}</option>
65
+ <option value="user">{{ t('sessions.role.user') }}</option>
66
+ <option value="assistant">{{ t('sessions.role.assistant') }}</option>
67
+ <option value="system">{{ t('sessions.role.system') }}</option>
68
+ </select>
69
+ <select
70
+ class="session-time-select"
71
+ v-model="sessionTimePreset"
72
+ @change="onSessionFilterChange"
73
+ disabled>
74
+ <option value="all">{{ t('sessions.time.all') }}</option>
75
+ <option value="7d">{{ t('sessions.time.7d') }}</option>
76
+ <option value="30d">{{ t('sessions.time.30d') }}</option>
77
+ <option value="90d">{{ t('sessions.time.90d') }}</option>
78
+ </select>
79
+ </div>
80
+ </div>
81
+ <div class="session-toolbar-footer">
82
+ <label class="quick-option">
83
+ <input
84
+ type="checkbox"
85
+ v-model="sessionResumeWithYolo"
86
+ @change="onSessionResumeYoloChange"
87
+ >
88
+ {{ t('sessions.resumeYolo') }}
89
+ </label>
90
+ </div>
91
+ </div>
92
+
93
+ <div v-if="sessionsLoading" class="state-message">
94
+ {{ t('sessions.loadingList') }}
95
+ </div>
96
+
97
+ <div v-else-if="sessionsList.length === 0" class="session-empty">
98
+ {{ t('sessions.empty') }}
99
+ </div>
100
+
101
+ <div v-else class="session-layout">
102
+ <div
103
+ v-if="sessionListRenderEnabled"
104
+ class="session-list"
105
+ :ref="setSessionListRef"
106
+ @scroll.passive="onSessionListScroll">
107
+ <div
108
+ v-for="session in visibleSessionsList"
109
+ :key="session.source + '-' + session.sessionId + '-' + session.filePath"
110
+ v-memo="[activeSessionExportKey === getSessionExportKey(session), session.messageCount, session.updatedAt, session.title, session.sourceLabel, isSessionPinned(session), sessionsLoading]"
111
+ :class="[
112
+ 'session-item',
113
+ {
114
+ active: activeSessionExportKey === getSessionExportKey(session),
115
+ pinned: isSessionPinned(session)
116
+ }
117
+ ]"
118
+ @click="selectSession(session)"
119
+ @keydown.enter.self.prevent="selectSession(session)"
120
+ @keydown.space.self.prevent="selectSession(session)"
121
+ tabindex="0"
122
+ role="button"
123
+ :aria-current="activeSessionExportKey === getSessionExportKey(session) ? 'true' : null">
124
+ <div class="session-item-header">
125
+ <div class="session-item-main">
126
+ <div class="session-item-title">{{ session.title || session.sessionId }}</div>
127
+ <span class="session-count-badge">{{ session.messageCount == null ? 0 : session.messageCount }}</span>
128
+ </div>
129
+ <div class="session-item-actions">
130
+ <button
131
+ class="session-item-copy session-item-pin"
132
+ @click.stop="toggleSessionPin(session)"
133
+ :disabled="sessionsLoading"
134
+ :aria-label="isSessionPinned(session) ? t('sessions.unpin') : t('sessions.pin')"
135
+ :title="isSessionPinned(session) ? t('sessions.unpin') : t('sessions.pin')"
136
+ :aria-pressed="isSessionPinned(session)">
137
+ <svg v-if="isSessionPinned(session)" class="pin-icon" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="1.6">
138
+ <path d="M12 22s8-6 8-12a8 8 0 1 0-16 0c0 6 8 12 8 12z"></path>
139
+ </svg>
140
+ <svg v-else class="pin-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6">
141
+ <path d="M12 22s8-6 8-12a8 8 0 1 0-16 0c0 6 8 12 8 12z"></path>
142
+ </svg>
143
+ </button>
144
+ <button
145
+ v-if="isResumeCommandAvailable(session)"
146
+ class="session-item-copy"
147
+ @click.stop="copyResumeCommand(session)"
148
+ :disabled="sessionsLoading"
149
+ :aria-label="t('sessions.copyResume')"
150
+ :title="t('sessions.copyResume')">
151
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
152
+ <rect x="8" y="8" width="12" height="12" rx="2"></rect>
153
+ <path d="M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2"></path>
154
+ </svg>
155
+ </button>
156
+ </div>
157
+ </div>
158
+ <div class="session-item-meta">
159
+ <span class="session-source">{{ session.sourceLabel }}</span>
160
+ <span class="session-item-time">{{ session.updatedAt || t('sessions.unknownTime') }}</span>
161
+ </div>
162
+ </div>
163
+ </div>
164
+ <div v-else class="session-list session-list-placeholder"></div>
165
+
166
+ <div :class="['session-preview', { active: !!activeSession }]" :ref="setSessionPreviewContainerRef">
167
+ <template v-if="activeSession">
168
+ <div class="session-preview-scroll" :ref="setSessionPreviewScrollRef" @scroll="onSessionPreviewScroll">
169
+ <div class="session-preview-header" :ref="setSessionPreviewHeaderRef">
170
+ <div>
171
+ <div class="session-preview-title">{{ activeSession.title || activeSession.sessionId }}</div>
172
+ <div class="session-preview-meta">
173
+ <span class="session-preview-meta-item">{{ activeSession.sourceLabel }}</span>
174
+ <span class="session-preview-meta-item">{{ activeSession.updatedAt || t('sessions.unknownTime') }}</span>
175
+ </div>
176
+ <div class="session-preview-meta" v-if="activeSession.cwd">
177
+ <span class="session-preview-meta-item">{{ activeSession.cwd }}</span>
178
+ </div>
179
+ </div>
180
+ <div class="session-actions">
181
+ <button class="btn-session-refresh" @click="loadActiveSessionDetail" :disabled="sessionDetailLoading || !activeSession">
182
+ {{ sessionDetailLoading ? t('sessions.preview.loading') : t('sessions.preview.refresh') }}
183
+ </button>
184
+ <button
185
+ v-if="isDeleteAvailable(activeSession)"
186
+ class="btn-session-delete"
187
+ @click="deleteSession(activeSession)"
188
+ :disabled="!activeSession || sessionsLoading || sessionDeleting[getSessionExportKey(activeSession)]">
189
+ {{ (activeSession && sessionDeleting[getSessionExportKey(activeSession)]) ? (sessionTrashEnabled === false ? t('sessions.preview.deleting') : t('sessions.preview.moving')) : (sessionTrashEnabled === false ? t('sessions.preview.deleteHard') : t('sessions.preview.moveToTrash')) }}
190
+ </button>
191
+ <button
192
+ class="btn-session-export"
193
+ @click="exportSession(activeSession)"
194
+ :disabled="!activeSession || sessionExporting[getSessionExportKey(activeSession)]">
195
+ {{ (activeSession && sessionExporting[getSessionExportKey(activeSession)]) ? t('sessions.preview.exporting') : t('sessions.preview.export') }}
196
+ </button>
197
+ <button
198
+ class="btn-session-open"
199
+ @click="openSessionStandalone(activeSession)"
200
+ :disabled="!activeSession">
201
+ {{ t('sessions.preview.openStandalone') }}
202
+ </button>
203
+ </div>
204
+ </div>
205
+
206
+ <div v-if="sessionDetailLoading && !sessionPreviewLoadingMore" class="session-preview-empty">
207
+ {{ t('sessions.preview.loadingBody') }}
208
+ </div>
209
+
210
+ <div v-else-if="activeSessionDetailError" class="session-preview-empty">
211
+ {{ activeSessionDetailError }}
212
+ </div>
213
+
214
+ <div v-else-if="!activeSessionMessages.length" class="session-preview-empty">
215
+ {{ t('sessions.preview.emptyMsgs') }}
216
+ </div>
217
+
218
+ <div v-else-if="sessionPreviewRenderEnabled && !activeSessionVisibleMessages.length" class="session-preview-empty">
219
+ <span>{{ t('sessions.preview.rendering') }}</span>
220
+ <button class="btn-session-refresh" @click="primeSessionPreviewMessageRender" :disabled="sessionDetailLoading">
221
+ {{ t('sessions.preview.rerender') }}
222
+ </button>
223
+ </div>
224
+
225
+ <div v-else-if="!sessionPreviewRenderEnabled" class="session-preview-empty">
226
+ {{ t('sessions.preview.preparing') }}
227
+ </div>
228
+
229
+ <div v-else class="session-preview-body">
230
+ <div class="session-preview-messages">
231
+ <div v-if="activeSessionDetailClipped" class="session-item-sub session-item-wrap">
232
+ {{ t('sessions.preview.clipped', { count: activeSessionMessages.length }) }}
233
+ </div>
234
+ <div
235
+ v-if="canLoadMoreSessionMessages"
236
+ class="session-item-sub session-item-wrap"
237
+ style="display:flex;align-items:center;justify-content:space-between;gap:8px;">
238
+ <span>{{ t('sessions.preview.shownCount', { shown: activeSessionVisibleMessages.length, total: activeSessionMessages.length }) }}</span>
239
+ <button class="btn-session-refresh" @click="loadMoreSessionMessages()" :disabled="sessionDetailLoading || sessionPreviewLoadingMore">
240
+ {{ sessionPreviewLoadingMore ? t('sessions.preview.loading') : t('sessions.preview.loadMore', { remain: sessionPreviewRemainingCount }) }}
241
+ </button>
242
+ </div>
243
+ <div
244
+ v-if="sessionPreviewLoadingMore"
245
+ class="session-item-sub session-item-wrap">
246
+ {{ t('sessions.preview.loadingMore') }}
247
+ </div>
248
+ <div
249
+ v-for="(msg, idx) in activeSessionVisibleMessages"
250
+ :key="getRecordRenderKey(msg, idx)"
251
+ v-memo="[msg.text, msg.timestamp, msg.roleLabel, msg.normalizedRole]"
252
+ :data-message-key="getRecordRenderKey(msg, idx)"
253
+ :ref="getSessionMessageRefBinder(getRecordRenderKey(msg, idx))"
254
+ :class="['session-msg', msg.normalizedRole === 'user' ? 'user' : (msg.normalizedRole === 'system' ? 'system' : 'assistant')]">
255
+ <div class="session-msg-header">
256
+ <div class="session-msg-meta">
257
+ <span class="session-msg-role">{{ msg.roleLabel || (msg.normalizedRole === 'user' ? t('sessions.roleLabel.user') : (msg.normalizedRole === 'system' ? t('sessions.roleLabel.system') : t('sessions.roleLabel.assistant'))) }}</span>
258
+ <span class="session-msg-time">{{ msg.timestamp || '' }}</span>
259
+ </div>
260
+ </div>
261
+ <div class="session-msg-content">{{ msg.text || '' }}</div>
262
+ </div>
263
+ </div>
264
+ </div>
265
+ </div>
266
+ <aside v-if="sessionPreviewRenderEnabled && sessionTimelineNodes.length" class="session-timeline" :aria-label="t('sessions.timeline.aria')">
267
+ <div class="session-timeline-track"></div>
268
+ <button
269
+ v-for="node in sessionTimelineNodes"
270
+ :key="'timeline-' + node.key"
271
+ v-memo="[sessionTimelineActiveKey === node.key, node.safePercent, node.title]"
272
+ type="button"
273
+ :class="['session-timeline-node', { active: sessionTimelineActiveKey === node.key }]"
274
+ :aria-current="sessionTimelineActiveKey === node.key ? 'true' : null"
275
+ :style="{ top: `${node.safePercent}%` }"
276
+ :title="node.title"
277
+ @click="jumpToSessionTimelineNode(node.key)">
278
+ <span class="sr-only">{{ node.title }}</span>
279
+ </button>
280
+ <div class="session-timeline-current" v-if="sessionTimelineActiveTitle">
281
+ {{ sessionTimelineActiveTitle }}
282
+ </div>
283
+ </aside>
284
+ </template>
285
+
286
+ <div v-else class="session-preview-empty">
287
+ <span>{{ t('sessions.selectHint') }}</span>
288
+ </div>
289
+ </div>
290
+ </div>
291
+ </div>
292
+ </div>