git-watchtower 1.8.0 → 1.8.2

package/bin/git-watchtower.js

@@ -74,7 +74,7 @@ const { formatTimeAgo } = require('../src/utils/time');
 const { openInBrowser: openUrl } = require('../src/utils/browser');
 const { playSound: playSoundEffect } = require('../src/utils/sound');
 const { parseArgs: parseCliArgs, applyCliArgsToConfig: mergeCliArgs, getHelpText, PACKAGE_VERSION } = require('../src/cli/args');
-const { checkForUpdate } = require('../src/utils/version-check');
+const { checkForUpdate, startPeriodicUpdateCheck } = require('../src/utils/version-check');
 const { parseRemoteUrl, buildBranchUrl, detectPlatform, buildWebUrl, extractSessionUrl } = require('../src/git/remote');
 const { parseGitHubPr, parseGitLabMr, parseGitHubPrList, parseGitLabMrList, isBaseBranch } = require('../src/git/pr');
 
@@ -1232,6 +1232,11 @@ function render() {
   if (state.stashConfirmMode) {
     renderer.renderStashConfirm(state, write);
   }
+
+  // Update notification modal renders on top of everything
+  if (state.updateModalVisible) {
+    renderer.renderUpdateModal(state, write);
+  }
 }
 
 function showFlash(message) {
@@ -2438,6 +2443,71 @@ function setupKeyboardInput() {
       return; // Ignore other keys in cleanup mode
     }
 
+    // Handle update notification modal
+    if (store.get('updateModalVisible')) {
+      if (store.get('updateInProgress')) {
+        return; // Block all keys while update is running
+      }
+      if (key === '\u001b') {
+        store.setState({ updateModalVisible: false, updateModalSelectedIndex: 0 });
+        render();
+        return;
+      }
+      if (key === '\u001b[A' || key === 'k') { // Up
+        const idx = store.get('updateModalSelectedIndex');
+        if (idx > 0) {
+          store.setState({ updateModalSelectedIndex: idx - 1 });
+          render();
+        }
+        return;
+      }
+      if (key === '\u001b[B' || key === 'j') { // Down
+        const idx = store.get('updateModalSelectedIndex');
+        if (idx < 1) {
+          store.setState({ updateModalSelectedIndex: idx + 1 });
+          render();
+        }
+        return;
+      }
+      if (key === '\r' || key === '\n') {
+        const selectedIdx = store.get('updateModalSelectedIndex') || 0;
+        if (selectedIdx === 0) {
+          // Update now — run npm i -g git-watchtower
+          store.setState({ updateInProgress: true });
+          render();
+          const { spawn } = require('child_process');
+          const child = spawn('npm', ['i', '-g', 'git-watchtower'], {
+            stdio: 'ignore',
+            detached: false,
+          });
+          child.on('close', (code) => {
+            store.setState({ updateInProgress: false, updateModalVisible: false, updateModalSelectedIndex: 0 });
+            if (code === 0) {
+              store.setState({ updateAvailable: null });
+              addLog('Successfully updated git-watchtower! Restart to use new version.', 'update');
+              showFlash('Updated! Restart to use new version.');
+            } else {
+              addLog(`Update failed (exit code ${code}). Run manually: npm i -g git-watchtower`, 'error');
+              showFlash('Update failed. Try manually: npm i -g git-watchtower');
+            }
+            render();
+          });
+          child.on('error', (err) => {
+            store.setState({ updateInProgress: false, updateModalVisible: false, updateModalSelectedIndex: 0 });
+            addLog(`Update failed: ${err.message}. Run manually: npm i -g git-watchtower`, 'error');
+            showFlash('Update failed. Try manually: npm i -g git-watchtower');
+            render();
+          });
+        } else {
+          // Show update command — dismiss modal with flash showing the command
+          store.setState({ updateModalVisible: false, updateModalSelectedIndex: 0 });
+          showFlash('Run: npm i -g git-watchtower');
+        }
+        return;
+      }
+      return; // Block all other keys while modal is shown
+    }
+
     // Handle stash confirmation dialog
     if (store.get('stashConfirmMode')) {
       if (key === '\u001b[A' || key === 'k') { // Up
@@ -2958,11 +3028,26 @@ async function start() {
   // Check for newer version on npm (non-blocking, silent on failure)
   checkForUpdate().then((latestVersion) => {
     if (latestVersion) {
-      store.setState({ updateAvailable: latestVersion });
+      store.setState({ updateAvailable: latestVersion, updateModalVisible: true });
       addLog(`New version available: ${latestVersion} \u2192 npm i -g git-watchtower`, 'update');
       render();
     }
   }).catch(() => {});
+
+  // Re-check for updates periodically (every 4 hours) while running
+  const periodicCheck = startPeriodicUpdateCheck((latestVersion) => {
+    const alreadyKnown = store.get('updateAvailable');
+    store.setState({ updateAvailable: latestVersion });
+    if (!alreadyKnown) {
+      // First time discovering an update during this session — show modal
+      store.setState({ updateModalVisible: true });
+      addLog(`New version available: ${latestVersion} \u2192 npm i -g git-watchtower`, 'update');
+    }
+    render();
+  });
+
+  // Clean up periodic check on exit
+  process.on('exit', () => periodicCheck.stop());
 }
 
 start().catch(err => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "git-watchtower",
-  "version": "1.8.0",
+  "version": "1.8.2",
   "description": "Terminal-based Git branch monitor with activity sparklines and optional dev server with live reload",
   "main": "bin/git-watchtower.js",
   "bin": {

package/src/state/store.js

@@ -102,6 +102,9 @@
  * @property {string} projectName - Project name
  * @property {number} clientCount - Connected SSE clients
  * @property {string|null} updateAvailable - Latest version if update available, or null
+ * @property {boolean} updateModalVisible - Whether the update notification modal is shown
+ * @property {number} updateModalSelectedIndex - Selected option index in the update modal
+ * @property {boolean} updateInProgress - Whether an update is currently being installed
  */
 
 /**
@@ -184,6 +187,9 @@ function getInitialState() {
 
     // Version check
     updateAvailable: null,
+    updateModalVisible: false,
+    updateModalSelectedIndex: 0,
+    updateInProgress: false,
   };
 }
 

package/src/ui/renderer.js

@@ -96,19 +96,19 @@ function renderHeader(state, write) {
   }
 
   let serverInfo = '';
-  let serverInfoVisible = '';
+  let serverInfoVisibleLen = 0;
   if (state.serverMode === 'none') {
-    serverInfoVisible = '';
+    serverInfoVisibleLen = 0;
   } else {
     const statusDot = state.serverRunning
       ? ansi.green + '\u25CF'
       : (state.serverCrashed ? ansi.red + '\u25CF' : ansi.gray + '\u25CB');
-    serverInfoVisible = `localhost:${state.port} `;
+    serverInfoVisibleLen = 2 + `localhost:${state.port} `.length; // dot + space + "localhost:PORT "
     serverInfo = statusDot + ansi.white + ` localhost:${state.port} `;
   }
 
   const rightContent = `${modeBadge} ${serverInfo}${statusIcon}${ansi.bgBlue} ${soundIcon}${ansi.bgBlue} `;
-  const rightVisibleLen = modeLabel.length + 1 + serverInfoVisible.length + 5;
+  const rightVisibleLen = modeLabel.length + 1 + serverInfoVisibleLen + 5;
 
   const usedSpace = leftVisibleLen + badgesVisibleLen + rightVisibleLen;
   const padding = Math.max(1, width - usedSpace);
@@ -1311,6 +1311,111 @@ function renderCleanupConfirm(state, write) {
   }
 }
 
+// ---------------------------------------------------------------------------
+// renderUpdateModal
+// ---------------------------------------------------------------------------
+
+/**
+ * Render a prominent update-available notification modal.
+ *
+ * @param {object} state
+ * @param {function} write
+ */
+function renderUpdateModal(state, write) {
+  if (!state.updateModalVisible || !state.updateAvailable) return;
+
+  const latestVersion = state.updateAvailable;
+  const currentVer = PACKAGE_VERSION;
+  const updateCmd = 'npm i -g git-watchtower';
+
+  const options = [
+    'Update now',
+    'Show update command',
+  ];
+  const selectedIdx = state.updateModalSelectedIndex || 0;
+
+  const width = Math.min(52, state.terminalWidth - 4);
+  const col = Math.floor((state.terminalWidth - width) / 2);
+  const row = Math.max(2, Math.floor((state.terminalHeight - 14) / 2));
+
+  const lines = [];
+  lines.push('Update Available');
+  lines.push('');
+  lines.push(`Current version:  v${currentVer}`);
+  lines.push(`Latest version:   v${latestVersion}`);
+  lines.push('');
+
+  if (state.updateInProgress) {
+    lines.push('Updating...');
+    lines.push('');
+    lines.push(`  ${updateCmd}`);
+    lines.push('');
+    lines.push('Please wait...');
+  } else {
+    // Option lines
+    const optionStartIdx = lines.length;
+    for (const opt of options) {
+      lines.push(opt);
+    }
+    lines.push('');
+    lines.push('[Enter] Select  [Esc] Dismiss');
+  }
+
+  const optionStartIdx = state.updateInProgress ? -1 : 5;
+  const height = lines.length + 2;
+
+  // Draw magenta double-border box
+  write(ansi.moveTo(row, col));
+  write(ansi.magenta + ansi.bold);
+  write(box.dTopLeft + box.dHorizontal.repeat(width - 2) + box.dTopRight);
+
+  for (let i = 1; i < height - 1; i++) {
+    write(ansi.moveTo(row + i, col));
+    write(ansi.magenta + box.dVertical + ansi.reset + '  ' + ' '.repeat(width - 6) + '  ' + ansi.magenta + box.dVertical + ansi.reset);
+  }
+
+  write(ansi.moveTo(row + height - 1, col));
+  write(ansi.magenta + box.dBottomLeft + box.dHorizontal.repeat(width - 2) + box.dBottomRight);
+  write(ansi.reset);
+
+  // Render content
+  let contentRow = row + 1;
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    write(ansi.moveTo(contentRow, col + 3));
+
+    if (i === 0) {
+      // Title — centered, bold magenta
+      const titlePadding = Math.floor((width - 6 - line.length) / 2);
+      write(' '.repeat(titlePadding) + ansi.magenta + ansi.bold + line + ansi.reset + ' '.repeat(Math.max(0, width - 6 - titlePadding - line.length)));
+    } else if (i >= optionStartIdx && optionStartIdx >= 0 && i < optionStartIdx + options.length) {
+      // Selectable option
+      const optIdx = i - optionStartIdx;
+      const isSelected = optIdx === selectedIdx;
+      const prefix = isSelected ? '\u25b8 ' : '  ';
+      const optText = prefix + line;
+      if (isSelected) {
+        write(ansi.bold + ansi.cyan + padRight(optText, width - 6) + ansi.reset);
+      } else {
+        write(ansi.gray + padRight(optText, width - 6) + ansi.reset);
+      }
+    } else if (line === '[Enter] Select  [Esc] Dismiss') {
+      // Keyboard hints — centered, dim
+      const lPadding = Math.floor((width - 6 - line.length) / 2);
+      write(ansi.dim + ' '.repeat(Math.max(0, lPadding)) + line + ' '.repeat(Math.max(0, width - 6 - lPadding - line.length)) + ansi.reset);
+    } else if (line === 'Updating...') {
+      write(ansi.bold + ansi.yellow + padRight(line, width - 6) + ansi.reset);
+    } else if (line === 'Please wait...') {
+      const lPadding = Math.floor((width - 6 - line.length) / 2);
+      write(ansi.dim + ' '.repeat(Math.max(0, lPadding)) + line + ' '.repeat(Math.max(0, width - 6 - lPadding - line.length)) + ansi.reset);
+    } else {
+      // Regular content
+      write(padRight(line, width - 6));
+    }
+    contentRow++;
+  }
+}
+
 // ---------------------------------------------------------------------------
 // Exports
 // ---------------------------------------------------------------------------
@@ -1330,4 +1435,5 @@ module.exports = {
   renderActionModal,
   renderStashConfirm,
   renderCleanupConfirm,
+  renderUpdateModal,
 };

package/src/utils/version-check.js

@@ -54,4 +54,25 @@ function checkForUpdate() {
   });
 }
 
-module.exports = { checkForUpdate, compareVersions };
+/** Default interval between periodic update checks (4 hours in ms) */
+const UPDATE_CHECK_INTERVAL = 4 * 60 * 60 * 1000;
+
+/**
+ * Create a periodic update checker that re-checks npm at a fixed interval.
+ * @param {(latestVersion: string) => void} onUpdateFound - Called when a new version is detected
+ * @param {number} [interval] - Check interval in ms (default: 4 hours)
+ * @returns {{ stop: () => void }} Controller with stop() to clear the timer
+ */
+function startPeriodicUpdateCheck(onUpdateFound, interval = UPDATE_CHECK_INTERVAL) {
+  const timerId = setInterval(() => {
+    checkForUpdate()
+      .then((latestVersion) => {
+        if (latestVersion) onUpdateFound(latestVersion);
+      })
+      .catch(() => {});
+  }, interval);
+
+  return { stop: () => clearInterval(timerId) };
+}
+
+module.exports = { checkForUpdate, compareVersions, startPeriodicUpdateCheck, UPDATE_CHECK_INTERVAL };