local-kanban 1.8.1 → 1.8.2

package/CHANGELOG.md

@@ -3,6 +3,29 @@
 Notable changes, newest first. The format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/)
 and the project uses [semantic versioning](https://semver.org/).
 
+## [1.8.2]
+
+### Added
+
+- **The README now opens with how you actually use the thing.** It described what the board is and
+  how to install it, and left the loop itself — the part someone came for — to be inferred: write
+  the task in *Backlog*, move it to *To do*, copy that column as a job for Claude, and let it work
+  until it stops at *Review* for you to accept. Including the trick that makes it pay off: let
+  *Review* pile up, then ask for the whole column to be checked in one pass, from a fresh chat.
+
+### Fixed
+
+- **The update line no longer draws over itself.** With both a status and a button on the right,
+  the two together were wider than the row had left, and the status — which was not allowed to
+  shrink — spilled leftwards across the label: 104 pixels of one text printed on top of another.
+  The status and the button now wrap onto their own line, and the command hint next to the button
+  is gone, because the button is the action and two instructions for one thing only made the row
+  longer.
+- **Pressing the button now visibly does something.** `npm install -g` takes tens of seconds and
+  says nothing while it runs, so the board looked frozen and inviting a second click. It counts
+  out loud instead — *installing… 12s*, then *restarting… 3s* — and the button reads *Updating…*
+  until the page reloads itself.
+
 ## [1.8.1]
 
 ### Changed

package/README.md

@@ -10,6 +10,24 @@ A local kanban board built for working **in tandem with Claude Code**: the human
 
 ![Dashboard](docs/screenshot-dashboard.png)
 
+## How you use it
+
+1. **Write the task** in the project's **Backlog** — a title is enough, the description can come later.
+2. **Move it to *To do*** once it is ready to be picked up. That column is the queue.
+3. **Press the copy button on the *To do* column** (*"Copy the tasks as a job for Claude"*) and paste
+   what it copied into Claude Code — the chat or the terminal, either works.
+4. **Claude takes it from there.** It reads the task, does the work, leaves comments as it goes,
+   commits and pushes, deploys if the project has a deploy skill, ties the commit to a GitHub issue
+   if sync is on — and stops at **Review**. It never marks anything done.
+5. **You accept.** Look at what came out and move the card to **Done**, or send it back with a note.
+   That note is the first thing Claude reads when it picks the task up again.
+
+**A trick worth knowing.** Let *Review* pile up — ten, twenty, thirty cards. Then add one more task to
+the board: *go through everything in Review, try to break it, move what survives to Done*. Claude will
+take the whole column in one pass, and it saves a lot of clicking. Do that one **in a fresh chat**: the
+session that just wrote the code is the worst judge of it, because it remembers what it meant rather
+than what it actually shipped.
+
 ## Why
 
 - **A queue for Claude, not just a board.** Statuses model the real loop: `backlog → todo → prep → doing → deploy → review → done`. Claude pulls the next task with `kb take`, works, and stops at *review* — accepting is always the human's call.

package/README.ru.md

@@ -10,6 +10,24 @@ English version — [README.md](README.md).
 
 ![Дашборд](docs/screenshot-dashboard.png)
 
+## Как этим пользоваться
+
+1. **Пишешь задачу** в **Бэклог** проекта — достаточно заголовка, описание можно добавить позже.
+2. **Перекладываешь в «Сделать»**, когда задача готова к работе. Эта колонка и есть очередь.
+3. **Жмёшь кнопку копирования на колонке «Сделать»** (*«Скопировать задачи как задание для Claude»*)
+   и отдаёшь скопированное в Claude Code — в чат или в терминал, без разницы.
+4. **Дальше Claude ведёт задачу сам.** Читает её, делает работу, по ходу пишет комментарии, коммитит
+   и пушит, деплоит, если у проекта задан деплой-скилл, привязывает коммит к issue на GitHub, если
+   включён синк, — и останавливается на **«Проверяю»**. В «Готово» он не переводит ничего и никогда.
+5. **Принимаешь ты.** Смотришь, что получилось, и двигаешь карточку в **«Готово»** — или возвращаешь
+   с замечанием. Это замечание Claude прочитает первым, когда возьмёт задачу снова.
+
+**Приём, который сильно ускоряет.** Дай «Проверяю» накопиться — десять, двадцать, тридцать карточек.
+Потом заведи на доске одну задачу: *пройди всё в «Проверяю», попробуй сломать, что выдержало — переведи
+в «Готово»*. Claude разберёт всю колонку за один заход. Только запускай её **в новом чате**: сессия,
+которая только что писала этот код, — худший его проверяющий, потому что помнит, что хотела сделать,
+а не то, что получилось.
+
 ## Зачем
 
 - **Очередь для Claude, а не просто доска.** Статусы повторяют реальный цикл: `бэклог → сделать → подготовка → делаю → деплою → проверяю → готово`. Claude берёт следующую задачу через `kb take`, работает и останавливается на «Проверяю» — принимает всегда человек.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "local-kanban",
-  "version": "1.8.1",
+  "version": "1.8.2",
   "license": "MIT",
   "author": "Dannylamao",
   "repository": {

package/public/js/core.js

@@ -285,6 +285,7 @@ const I18N_RU = {
   'in the backlog': 'в бэклоге',
   'Install the kb command for Claude like this:': 'Команда kb для Claude ставится так:',
   'Install the update': 'Установить обновление',
+  'installing…': 'ставлю обновление…',
   'Interface language': 'Язык интерфейса',
   'is gone from disk. Archive the project? Tasks are kept.': 'удалена с диска. Архивировать проект? Задачи сохранятся.',
   'it has to go through work first': 'сначала через работу',
@@ -381,7 +382,9 @@ const I18N_RU = {
   'Overwrite this file?': 'Перезаписать этот файл?',
   'own skill': 'свой скилл',
   'Paths & deploy': 'Пути и деплой',
+  'restarting…': 'перезапускаюсь…',
   'Revert': 'Вернуть как в файле',
+  's': 'с',
   'Save to the file': 'Сохранить в файл',
   'saved ✓': 'сохранено ✓',
   'saved ✓ · the previous version is kept as': 'сохранено ✓ · прежняя версия осталась как',
@@ -598,6 +601,7 @@ const I18N_RU = {
   'updated — start the board again to pick it up': 'обновлено — запусти доску заново, чтобы она подхватила новую версию',
   'updated, but the board did not come back — start it yourself': 'обновлено, но доска не поднялась — запусти её сам',
   'updating…': 'обновляю…',
+  'Updating…': 'Обновляю…',
   'Upload': 'Загрузить',
   'used by': 'используют',
   'Using the board at work': 'Пользуешься доской в работе',

package/public/js/settings.js

@@ -409,7 +409,7 @@ async function renderSection(sec) {
   } else {
     body.innerHTML = `<div class="sm-h">${tr('About')}</div>`
       + `<div class="set-row"><span class="set-lab">${tr('Code version')}<small id="about-ver">…</small></span><span class="about-fresh" id="about-fresh"></span></div>`
-      + `<div class="set-row"><span class="set-lab"><span id="about-branch-lab">${tr('Board updates')}</span><small id="about-upd-sub">…</small></span>`
+      + `<div class="set-row upd-row"><span class="set-lab"><span id="about-branch-lab">${tr('Board updates')}</span><small id="about-upd-sub">…</small></span>`
       + `<span class="about-upd-side"><span class="about-fresh" id="about-upd"></span>`
       + `<button class="btn-ghost hidden" id="about-do-upd">${tr('Install the update')}</button></span></div>`
       + `<div class="set-row hidden" id="about-dev-row"><span class="set-lab">${tr('dev branch')}<small id="about-dev-sub">…</small></span><span class="about-fresh" id="about-dev"></span></div>`
@@ -449,7 +449,7 @@ async function renderSection(sec) {
       else if (u.update_available) {
         el.textContent = `⟳ ${tr('update available')} ${u.local} → ${u.remote}`;
         el.classList.add('stale-ver');
-        sub.textContent = `${what} ${u.local}${tag} · ${updateHint()}`;
+        sub.textContent = `${what} ${u.local}${tag}`;
         $('about-do-upd')?.classList.remove('hidden');
       }
       else if (u.dev?.ahead) { el.textContent = `${tr('in dev')} ${u.dev.ahead} ${commitsWord(u.dev.ahead)} ${tr('awaiting release')}`; el.classList.add('stale-ver'); sub.textContent = `${tr('commit')} ${u.local}${tag} · ${tr('matches GitHub')}`; }
@@ -468,19 +468,31 @@ async function renderSection(sec) {
       .then(() => api('GET', '/api/update-check')).then(renderUpd)
       .catch(() => { const s = $('about-upd-sub'); if (s) s.textContent = '—'; });
     $('about-do-upd').onclick = async () => {
-      const btn = $('about-do-upd'); const sub = $('about-upd-sub');
+      const btn = $('about-do-upd'); const sub = $('about-upd-sub'); const el = $('about-upd');
       if (!(await styledConfirm(tr('Update the board now? It will restart.')))) return;
-      btn.disabled = true; sub.textContent = tr('updating…');
+      const label = btn.textContent;
+      let phase = tr('installing…'); let sec = 0;
+      const paint = () => { el.textContent = `${phase} ${sec}${tr('s')}`; };
+      btn.disabled = true; btn.textContent = tr('Updating…');
+      el.classList.add('stale-ver'); paint();
+      const timer = setInterval(() => { sec += 1; paint(); }, 1000);
+      const stop = (text, keepAccent) => {
+        clearInterval(timer);
+        el.textContent = text || '';
+        el.classList.toggle('stale-ver', !!keepAccent);
+        btn.textContent = label;
+      };
       let r;
       try { r = await api('POST', '/api/update', null, { quiet: true }); }
-      catch (err) { sub.textContent = `${tr('the update did not go through')}: ${err.message || err}`; btn.disabled = false; return; }
-      if (!r?.ok) { sub.textContent = `${tr('the update did not go through')}: ${(r?.output || '').split('\n').pop() || '—'}`; btn.disabled = false; return; }
-      if (r.restart !== 'pm2') { sub.textContent = tr('updated — start the board again to pick it up'); return; }
-      sub.textContent = tr('waiting for the board to come back…');
+      catch (err) { stop(tr('Did not work out'), true); sub.textContent = `${tr('the update did not go through')}: ${err.message || err}`; btn.disabled = false; return; }
+      if (!r?.ok) { stop(tr('Did not work out'), true); sub.textContent = `${tr('the update did not go through')}: ${(r?.output || '').split('\n').pop() || '—'}`; btn.disabled = false; return; }
+      if (r.restart !== 'pm2') { stop('', false); sub.textContent = tr('updated — start the board again to pick it up'); return; }
+      phase = tr('restarting…'); sec = 0; paint();
       for (let i = 0; i < 60; i++) {
         await new Promise((ok) => setTimeout(ok, 1000));
-        try { await api('GET', '/api/about', null, { quiet: true }); location.reload(); return; } catch {  }
+        try { await api('GET', '/api/about', null, { quiet: true }); clearInterval(timer); location.reload(); return; } catch {  }
       }
+      stop(tr('Did not work out'), true);
       sub.textContent = tr('updated, but the board did not come back — start it yourself');
     };
 

package/public/style.css

@@ -141,7 +141,10 @@ body {
 }
 .btn-ghost:hover { color: var(--text); }
 a.btn-ghost { text-decoration: none; }
-.about-upd-side { display: flex; align-items: center; gap: 10px; justify-content: flex-end; }
+.about-upd-side { display: flex; align-items: center; gap: 10px; justify-content: flex-end; flex-shrink: 0; }
+.set-row.upd-row { flex-wrap: wrap; }
+.set-row.upd-row .set-lab { flex: 1 1 200px; min-width: 0; }
+.set-row.upd-row .set-lab small { overflow-wrap: anywhere; }
 .btn-danger {
   background: none; border: 1px solid var(--border); border-radius: 7px;
   padding: 7px 10px; cursor: pointer; color: var(--danger);