@bakapiano/ccsm 0.5.0 → 0.6.0
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.
- package/lib/config.js +1 -0
- package/lib/focus.js +90 -14
- package/lib/labels.js +49 -0
- package/lib/workspace.js +8 -4
- package/package.json +1 -1
- package/public/app.js +556 -97
- package/public/favicon.svg +18 -0
- package/public/index.html +135 -23
- package/public/styles.css +464 -29
- package/server.js +28 -1
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
|
|
2
|
+
<!-- terminal window body -->
|
|
3
|
+
<rect x="2" y="4" width="28" height="24" rx="3" fill="#c45f3f"/>
|
|
4
|
+
<!-- title bar divider -->
|
|
5
|
+
<line x1="2" y1="10" x2="30" y2="10" stroke="#faf9f5" stroke-width="0.6" opacity="0.45"/>
|
|
6
|
+
<!-- traffic-light dots -->
|
|
7
|
+
<circle cx="6" cy="7" r="1" fill="#faf9f5"/>
|
|
8
|
+
<circle cx="9.5" cy="7" r="1" fill="#faf9f5" opacity="0.65"/>
|
|
9
|
+
<circle cx="13" cy="7" r="1" fill="#faf9f5" opacity="0.4"/>
|
|
10
|
+
<!-- ccsm prompt text -->
|
|
11
|
+
<text x="16" y="19.5"
|
|
12
|
+
text-anchor="middle"
|
|
13
|
+
dominant-baseline="central"
|
|
14
|
+
font-family="'Cascadia Mono', 'Consolas', 'Courier New', monospace"
|
|
15
|
+
font-weight="700"
|
|
16
|
+
font-size="10"
|
|
17
|
+
fill="#faf9f5">ccsm</text>
|
|
18
|
+
</svg>
|
package/public/index.html
CHANGED
|
@@ -3,7 +3,8 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8" />
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
6
|
-
<title>
|
|
6
|
+
<title>CCSM — Claude CLI Sessions Manager</title>
|
|
7
|
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
7
8
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
8
9
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
9
10
|
<link
|
|
@@ -18,13 +19,23 @@
|
|
|
18
19
|
<aside class="sidebar" id="sidebar" data-collapsed="false">
|
|
19
20
|
<div class="sidebar-brand">
|
|
20
21
|
<span class="brand-mark" aria-hidden="true">
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
<
|
|
24
|
-
<
|
|
22
|
+
<!-- terminal window with ccsm inside · matches favicon -->
|
|
23
|
+
<svg viewBox="0 0 32 32" width="32" height="32">
|
|
24
|
+
<rect x="2" y="4" width="28" height="24" rx="3" fill="#c45f3f"/>
|
|
25
|
+
<line x1="2" y1="10" x2="30" y2="10" stroke="#faf9f5" stroke-width="0.6" opacity="0.45"/>
|
|
26
|
+
<circle cx="6" cy="7" r="1" fill="#faf9f5"/>
|
|
27
|
+
<circle cx="9.5" cy="7" r="1" fill="#faf9f5" opacity="0.65"/>
|
|
28
|
+
<circle cx="13" cy="7" r="1" fill="#faf9f5" opacity="0.4"/>
|
|
29
|
+
<text x="16" y="19.5"
|
|
30
|
+
text-anchor="middle"
|
|
31
|
+
dominant-baseline="central"
|
|
32
|
+
font-family="'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace"
|
|
33
|
+
font-weight="700"
|
|
34
|
+
font-size="10"
|
|
35
|
+
fill="#faf9f5">ccsm</text>
|
|
25
36
|
</svg>
|
|
26
37
|
</span>
|
|
27
|
-
<span class="brand-name">
|
|
38
|
+
<span class="brand-name">CCSM<span class="brand-dot">.</span></span>
|
|
28
39
|
</div>
|
|
29
40
|
|
|
30
41
|
<nav class="sidebar-nav" role="tablist" aria-label="Sections">
|
|
@@ -72,15 +83,6 @@
|
|
|
72
83
|
</span>
|
|
73
84
|
<span class="nav-label">Refresh</span>
|
|
74
85
|
</button>
|
|
75
|
-
<button class="util-item util-accent" id="finderBtn" title="open a Claude session pointed at ccsm data">
|
|
76
|
-
<span class="nav-icon" aria-hidden="true">
|
|
77
|
-
<svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
|
|
78
|
-
<circle cx="11" cy="11" r="7"/>
|
|
79
|
-
<line x1="21" y1="21" x2="16.65" y2="16.65"/>
|
|
80
|
-
</svg>
|
|
81
|
-
</span>
|
|
82
|
-
<span class="nav-label">Ask Claude</span>
|
|
83
|
-
</button>
|
|
84
86
|
</div>
|
|
85
87
|
|
|
86
88
|
<div class="sidebar-foot">
|
|
@@ -100,6 +102,11 @@
|
|
|
100
102
|
<p class="page-subtitle" id="pageSubtitle">Live and recently-closed Claude Code sessions on this machine.</p>
|
|
101
103
|
</div>
|
|
102
104
|
<div class="page-head-meta">
|
|
105
|
+
<span class="server-status" id="serverStatus" data-state="connecting" title="backend status">
|
|
106
|
+
<span class="status-pulse" aria-hidden="true"></span>
|
|
107
|
+
<span class="server-status-label" id="serverStatusLabel">connecting…</span>
|
|
108
|
+
</span>
|
|
109
|
+
<span class="ph-divider">·</span>
|
|
103
110
|
<span class="ph-stat"><span class="ph-key">Port</span> <span class="ph-val" id="hdPort">—</span></span>
|
|
104
111
|
<span class="ph-divider">·</span>
|
|
105
112
|
<span class="ph-stat"><span class="ph-key">Terminal</span> <span class="ph-val" id="hdTerminal">—</span></span>
|
|
@@ -122,14 +129,17 @@
|
|
|
122
129
|
</button>
|
|
123
130
|
</div>
|
|
124
131
|
|
|
125
|
-
<article class="card" id="favoritesCard">
|
|
132
|
+
<article class="card" id="favoritesCard" data-fold-key="favorites">
|
|
126
133
|
<header class="card-head">
|
|
134
|
+
<button class="card-fold" data-fold aria-label="collapse">
|
|
135
|
+
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>
|
|
136
|
+
</button>
|
|
127
137
|
<div class="card-titles">
|
|
128
138
|
<h2 class="card-title">
|
|
129
|
-
|
|
139
|
+
Favorites
|
|
140
|
+
<svg class="title-icon title-icon-after" viewBox="0 0 24 24" width="14" height="14" fill="currentColor" stroke="none" aria-hidden="true">
|
|
130
141
|
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/>
|
|
131
142
|
</svg>
|
|
132
|
-
Favorites
|
|
133
143
|
</h2>
|
|
134
144
|
<p class="card-meta" id="favoritesMeta">click ☆ on any row to pin sessions here</p>
|
|
135
145
|
</div>
|
|
@@ -150,11 +160,24 @@
|
|
|
150
160
|
</table>
|
|
151
161
|
</div>
|
|
152
162
|
<div class="empty" id="favoritesEmpty">No favorites yet. Star a session row to pin it here.</div>
|
|
163
|
+
<footer class="pagination" id="favoritesPagination" hidden>
|
|
164
|
+
<button class="action subtle small" id="favPrevBtn" disabled>← Prev</button>
|
|
165
|
+
<span class="pagination-info">Page <strong id="favPageNum">1</strong> of <strong id="favPageTotal">1</strong> · <span id="favTotal">0</span> total</span>
|
|
166
|
+
<button class="action subtle small" id="favNextBtn" disabled>Next →</button>
|
|
167
|
+
<select id="favPageSize" class="input" style="max-width: 100px;">
|
|
168
|
+
<option value="10" selected>10 / page</option>
|
|
169
|
+
<option value="20">20 / page</option>
|
|
170
|
+
<option value="50">50 / page</option>
|
|
171
|
+
</select>
|
|
172
|
+
</footer>
|
|
153
173
|
</div>
|
|
154
174
|
</article>
|
|
155
175
|
|
|
156
|
-
<article class="card">
|
|
176
|
+
<article class="card" data-fold-key="sessions">
|
|
157
177
|
<header class="card-head">
|
|
178
|
+
<button class="card-fold" data-fold aria-label="collapse">
|
|
179
|
+
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>
|
|
180
|
+
</button>
|
|
158
181
|
<div class="card-titles">
|
|
159
182
|
<h2 class="card-title">Live sessions</h2>
|
|
160
183
|
<p class="card-meta" id="sessionsMeta">awaiting…</p>
|
|
@@ -178,11 +201,24 @@
|
|
|
178
201
|
</table>
|
|
179
202
|
</div>
|
|
180
203
|
<div class="empty" id="sessionsEmpty" hidden>No live sessions detected.</div>
|
|
204
|
+
<footer class="pagination" id="sessionsPagination" hidden>
|
|
205
|
+
<button class="action subtle small" id="sessPrevBtn" disabled>← Prev</button>
|
|
206
|
+
<span class="pagination-info">Page <strong id="sessPageNum">1</strong> of <strong id="sessPageTotal">1</strong> · <span id="sessTotal">0</span> total</span>
|
|
207
|
+
<button class="action subtle small" id="sessNextBtn" disabled>Next →</button>
|
|
208
|
+
<select id="sessPageSize" class="input" style="max-width: 100px;">
|
|
209
|
+
<option value="10" selected>10 / page</option>
|
|
210
|
+
<option value="20">20 / page</option>
|
|
211
|
+
<option value="50">50 / page</option>
|
|
212
|
+
</select>
|
|
213
|
+
</footer>
|
|
181
214
|
</div>
|
|
182
215
|
</article>
|
|
183
216
|
|
|
184
|
-
<article class="card">
|
|
217
|
+
<article class="card" data-fold-key="recent">
|
|
185
218
|
<header class="card-head">
|
|
219
|
+
<button class="card-fold" data-fold aria-label="collapse">
|
|
220
|
+
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>
|
|
221
|
+
</button>
|
|
186
222
|
<div class="card-titles">
|
|
187
223
|
<h2 class="card-title">Recently closed</h2>
|
|
188
224
|
<p class="card-meta" id="recentMeta">…</p>
|
|
@@ -210,9 +246,8 @@
|
|
|
210
246
|
<span class="pagination-info">Page <strong id="recentPageNum">1</strong> of <strong id="recentPageTotal">1</strong> · <span id="recentTotal">0</span> total</span>
|
|
211
247
|
<button class="action subtle small" id="recentNextBtn" disabled>Next →</button>
|
|
212
248
|
<select id="recentPageSize" class="input" style="max-width: 100px;">
|
|
213
|
-
<option value="10">10 / page</option>
|
|
214
|
-
<option value="
|
|
215
|
-
<option value="25">25 / page</option>
|
|
249
|
+
<option value="10" selected>10 / page</option>
|
|
250
|
+
<option value="20">20 / page</option>
|
|
216
251
|
<option value="50">50 / page</option>
|
|
217
252
|
</select>
|
|
218
253
|
</footer>
|
|
@@ -287,6 +322,12 @@
|
|
|
287
322
|
|
|
288
323
|
<!-- ─── Configure tab ─── -->
|
|
289
324
|
<section class="tab-panel" data-panel="configure">
|
|
325
|
+
<div class="dirty-banner" id="configDirtyBanner" hidden>
|
|
326
|
+
<span class="dirty-dot"></span>
|
|
327
|
+
<span class="dirty-text">You have unsaved changes</span>
|
|
328
|
+
<button class="action small primary" id="dirtyBannerSaveBtn">Save now</button>
|
|
329
|
+
<button class="action small subtle" id="dirtyBannerDiscardBtn">Discard</button>
|
|
330
|
+
</div>
|
|
290
331
|
<article class="card">
|
|
291
332
|
<header class="card-head">
|
|
292
333
|
<div class="card-titles">
|
|
@@ -345,6 +386,13 @@
|
|
|
345
386
|
<span class="hint">raise newly-launched terminal window</span>
|
|
346
387
|
</span>
|
|
347
388
|
</label>
|
|
389
|
+
<label class="field toggle">
|
|
390
|
+
<input id="cfgFocusCenter" type="checkbox" />
|
|
391
|
+
<span class="toggle-text">
|
|
392
|
+
<span class="label">Move focused window to screen center</span>
|
|
393
|
+
<span class="hint">centers the focused window on whichever monitor the cursor is on</span>
|
|
394
|
+
</span>
|
|
395
|
+
</label>
|
|
348
396
|
<label class="field full">
|
|
349
397
|
<span class="label">Finder prompt</span>
|
|
350
398
|
<textarea id="cfgFinderPrompt" rows="3"></textarea>
|
|
@@ -387,6 +435,70 @@
|
|
|
387
435
|
</main>
|
|
388
436
|
</div>
|
|
389
437
|
|
|
438
|
+
<!-- Floating "new session" action button — always visible bottom-right -->
|
|
439
|
+
<button class="fab" id="newSessionFab" title="Launch new session" aria-label="Launch new session">
|
|
440
|
+
<svg viewBox="0 0 24 24" width="22" height="22" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
441
|
+
<line x1="12" y1="5" x2="12" y2="19"/>
|
|
442
|
+
<line x1="5" y1="12" x2="19" y2="12"/>
|
|
443
|
+
</svg>
|
|
444
|
+
</button>
|
|
445
|
+
|
|
446
|
+
<!-- New-session modal -->
|
|
447
|
+
<div class="modal-backdrop" id="newSessionModal" hidden role="dialog" aria-modal="true" aria-labelledby="modalTitle">
|
|
448
|
+
<div class="modal">
|
|
449
|
+
<header class="modal-head">
|
|
450
|
+
<h2 id="modalTitle">Launch new session</h2>
|
|
451
|
+
<button class="modal-close" id="modalCloseBtn" aria-label="close">
|
|
452
|
+
<svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
|
|
453
|
+
</button>
|
|
454
|
+
</header>
|
|
455
|
+
<div class="modal-body">
|
|
456
|
+
<p class="modal-hint">Pick an unused workspace, clone any missing repos, open <code>claude</code> in a fresh terminal.</p>
|
|
457
|
+
|
|
458
|
+
<div class="form-row">
|
|
459
|
+
<span class="form-label">Repos</span>
|
|
460
|
+
<div class="chip-row" id="modalRepoPicker"></div>
|
|
461
|
+
</div>
|
|
462
|
+
|
|
463
|
+
<details class="repos-inline-config">
|
|
464
|
+
<summary>Manage repos</summary>
|
|
465
|
+
<div class="repos-inline-body">
|
|
466
|
+
<table class="data repos-table" id="modalReposTable">
|
|
467
|
+
<thead>
|
|
468
|
+
<tr>
|
|
469
|
+
<th>Name</th>
|
|
470
|
+
<th>URL</th>
|
|
471
|
+
<th class="num">Default</th>
|
|
472
|
+
<th class="col-actions"></th>
|
|
473
|
+
</tr>
|
|
474
|
+
</thead>
|
|
475
|
+
<tbody></tbody>
|
|
476
|
+
</table>
|
|
477
|
+
<div class="repos-inline-actions">
|
|
478
|
+
<button class="action small" id="modalAddRepoBtn">+ Add repo</button>
|
|
479
|
+
<button class="action small primary" id="modalSaveReposBtn">Save changes</button>
|
|
480
|
+
<span class="muted-text" id="modalReposSavedAt"></span>
|
|
481
|
+
</div>
|
|
482
|
+
</div>
|
|
483
|
+
</details>
|
|
484
|
+
|
|
485
|
+
<div class="form-row">
|
|
486
|
+
<label class="form-label" for="modalWorkspaceSelect">Workspace</label>
|
|
487
|
+
<select id="modalWorkspaceSelect" class="input narrow">
|
|
488
|
+
<option value="">auto — find or create unused</option>
|
|
489
|
+
</select>
|
|
490
|
+
</div>
|
|
491
|
+
|
|
492
|
+
<div id="modalProgress" class="progress-list"></div>
|
|
493
|
+
<div class="post-result" id="modalResult"></div>
|
|
494
|
+
</div>
|
|
495
|
+
<footer class="modal-foot">
|
|
496
|
+
<button class="action" id="modalCancelBtn">Cancel</button>
|
|
497
|
+
<button class="action primary" id="modalLaunchBtn">Launch new session</button>
|
|
498
|
+
</footer>
|
|
499
|
+
</div>
|
|
500
|
+
</div>
|
|
501
|
+
|
|
390
502
|
<div id="toast" class="toast" role="status" aria-live="polite"></div>
|
|
391
503
|
|
|
392
504
|
<script src="/app.js" defer></script>
|