free-coding-models 0.3.55 → 0.3.57

package/src/render-helpers.js

@@ -47,7 +47,7 @@
  */
 
 import chalk from 'chalk'
-import { OVERLAY_PANEL_WIDTH, TABLE_FIXED_LINES } from './constants.js'
+import { OVERLAY_PANEL_WIDTH, TABLE_FIXED_LINES, TABLE_HEADER_LINES, TABLE_FOOTER_LINES } from './constants.js'
 import { sortResults } from './utils.js'
 
 // 📖 stripAnsi: Remove ANSI color/control sequences to estimate visible text width before padding.
@@ -65,13 +65,32 @@ export function maskApiKey(key) {
 
 // 📖 displayWidth: Calculate display width of a string in terminal columns.
 // 📖 Emojis and other wide characters occupy 2 columns, variation selectors (U+FE0F) are zero-width.
+// 📖 Keycap sequences (digit/# + FE0F + 20E3, e.g. 1️⃣) render as a single 2-cell glyph.
 // 📖 This avoids pulling in a full `string-width` dependency for a lightweight CLI tool.
 export function displayWidth(str) {
   const plain = stripAnsi(String(str))
+  const codepoints = [...plain]
   let w = 0
-  for (const ch of plain) {
+  for (let i = 0; i < codepoints.length; i++) {
+    const ch = codepoints[i]
     const cp = ch.codePointAt(0)
-    // Zero-width: variation selectors (FE00-FE0F), zero-width joiner/non-joiner, combining marks
+
+    // Keycap sequence detection: ASCII digit / # / * followed by optional FE0F then 20E3 → +2 (single emoji glyph)
+    const isKeycapBase = (cp >= 0x30 && cp <= 0x39) || cp === 0x23 || cp === 0x2A
+    if (isKeycapBase) {
+      let j = i + 1
+      let sawFe0f = false
+      if (j < codepoints.length && codepoints[j].codePointAt(0) === 0xFE0F) { sawFe0f = true; j++ }
+      if (j < codepoints.length && codepoints[j].codePointAt(0) === 0x20E3) {
+        w += 2
+        i = j // 📖 skip the consumed FE0F (if any) and the 20E3
+        continue
+      }
+      // 📖 Not a keycap, fall through to normal handling
+      void sawFe0f
+    }
+
+    // Zero-width: variation selectors (FE00-FE0F), zero-width joiner/non-joiner, lone combining keycap
     if ((cp >= 0xFE00 && cp <= 0xFE0F) || cp === 0x200D || cp === 0x200C || cp === 0x20E3) continue
     // Wide: CJK, emoji (most above U+1F000), fullwidth forms
     if (
@@ -146,14 +165,24 @@ export function sliceOverlayLines(lines, offset, terminalRows) {
 
 // ─── Table viewport calculation ────────────────────────────────────────────────
 
+// 📖 getTableFixedLines: Resolve the non-model line budget for the main table.
+// 📖 Header and full footer are always visible in the main table, with optional
+// 📖 extra fixed rows for temporary banners.
+export function getTableFixedLines({ extraFixedLines = 0 } = {}) {
+  return TABLE_HEADER_LINES + TABLE_FOOTER_LINES + Math.max(0, extraFixedLines)
+}
+
 // 📖 calculateViewport: Computes the visible slice of model rows that fits in the terminal.
 // 📖 When scroll indicators are needed, they each consume 1 line from the model budget.
-// 📖 `extraFixedLines` lets callers reserve temporary footer rows without shrinking the
-// 📖 viewport permanently for the normal case.
+// 📖 `lineBudget` lets callers reserve temporary footer/header rows without shrinking
+// 📖 the viewport permanently for the normal case.
 // 📖 Returns { startIdx, endIdx, hasAbove, hasBelow } for rendering.
-export function calculateViewport(terminalRows, scrollOffset, totalModels, extraFixedLines = 0) {
+export function calculateViewport(terminalRows, scrollOffset, totalModels, lineBudget = 0) {
   if (terminalRows <= 0) return { startIdx: 0, endIdx: totalModels, hasAbove: false, hasBelow: false }
-  let maxSlots = terminalRows - TABLE_FIXED_LINES - extraFixedLines
+  const fixedLines = typeof lineBudget === 'number'
+    ? TABLE_FIXED_LINES + Math.max(0, lineBudget)
+    : getTableFixedLines(lineBudget)
+  let maxSlots = terminalRows - fixedLines
   if (maxSlots < 1) maxSlots = 1
   if (totalModels <= maxSlots) return { startIdx: 0, endIdx: totalModels, hasAbove: false, hasBelow: false }
 
@@ -206,7 +235,8 @@ export function sortResultsWithPinnedFavorites(results, sortColumn, sortDirectio
 // 📖 Modifies st.scrollOffset in-place, returns undefined.
 export function adjustScrollOffset(st) {
   const total = st.visibleSorted ? st.visibleSorted.length : st.results.filter(r => !r.hidden).length
-  let maxSlots = st.terminalRows - TABLE_FIXED_LINES
+  const fixedLines = getTableFixedLines()
+  let maxSlots = st.terminalRows - fixedLines
   if (maxSlots < 1) maxSlots = 1
   if (total <= maxSlots) { st.scrollOffset = 0; return }
   // Ensure cursor is not above the visible window

package/src/render-table.js

@@ -36,19 +36,18 @@ import chalk from 'chalk'
 import { createRequire } from 'module'
 import { sources } from '../sources.js'
 import {
-  TABLE_FIXED_LINES,
   COL_MODEL,
   TIER_CYCLE,
   msCell,
   spinCell,
   PING_INTERVAL,
   WIDTH_WARNING_MIN_COLS,
+  TABLE_FOOTER_LINES,
   FRAMES
 } from './constants.js'
 import { themeColors, getProviderRgb, getTierRgb, getReadableTextRgb, getTheme } from './theme.js'
 import { TIER_COLOR } from './tier-colors.js'
 import { getAvg, getVerdict, getUptime, getStabilityScore, getVersionStatusInfo } from './utils.js'
-import { VERDICT_CYCLE } from './constants.js'
 import { usagePlaceholderForProvider } from './ping.js'
 import { calculateViewport, sortResultsWithPinnedFavorites, padEndDisplay, displayWidth } from './render-helpers.js'
 import { getToolMeta, TOOL_METADATA, TOOL_MODE_ORDER, isModelCompatibleWithTool } from './tool-metadata.js'
@@ -58,10 +57,6 @@ import { detectPackageManager, getManualInstallCmd } from './updater.js'
 const require = createRequire(import.meta.url)
 const { version: LOCAL_VERSION } = require('../package.json')
 
-// 📖 HEALTH_CYCLE: cycles through health/status states (local constant for render-table.js)
-// VERDICT_CYCLE is now imported from constants.js
-const HEALTH_CYCLE = [null, 'up', 'timeout', 'down', 'auth_error', 'noauth', 'pending']
-
 // 📖 Mouse support: column boundary map updated every frame by renderTable().
 // 📖 Each entry maps a column name to its display X-start and X-end (1-based, inclusive).
 // 📖 headerRow is the 1-based terminal row of the column header line.
@@ -109,9 +104,10 @@ export const PROVIDER_COLOR = new Proxy({}, {
 })
 
 // ─── renderTable: mode param controls footer hint text (opencode vs openclaw) ─────────
-export function renderTable(results, pendingPings, frame, cursor = null, sortColumn = 'avg', sortDirection = 'asc', pingInterval = PING_INTERVAL, lastPingTime = Date.now(), mode = 'opencode', tierFilterMode = 0, scrollOffset = 0, terminalRows = 0, terminalCols = 0, originFilterMode = 0, legacyStatus = null, pingMode = 'normal', pingModeSource = 'auto', hideUnconfiguredModels = false, widthWarningStartedAt = null, widthWarningDismissed = false, widthWarningShowCount = 0, settingsUpdateState = 'idle', settingsUpdateLatestVersion = null, legacyFlag = false, startupLatestVersion = null, versionAlertsEnabled = true, favoritesPinnedAndSticky = false, customTextFilter = null, lastReleaseDate = null, footerHidden = false, verdictFilterMode = 0, healthFilterMode = 0) {
+export function renderTable(results, pendingPings, frame, cursor = null, sortColumn = 'avg', sortDirection = 'asc', pingInterval = PING_INTERVAL, lastPingTime = Date.now(), mode = 'opencode', tierFilterMode = 0, scrollOffset = 0, terminalRows = 0, terminalCols = 0, originFilterMode = 0, legacyStatus = null, pingMode = 'normal', pingModeSource = 'auto', hideUnconfiguredModels = false, widthWarningStartedAt = null, widthWarningDismissed = false, widthWarningShowCount = 0, settingsUpdateState = 'idle', settingsUpdateLatestVersion = null, legacyFlag = false, startupLatestVersion = null, versionAlertsEnabled = true, favoritesPinnedAndSticky = false, customTextFilter = null, lastReleaseDate = null, legacyFooterHidden = false, verdictFilterMode = 0, healthFilterMode = 0, routerFooterRunning = false, routerFooterActiveSet = null, routerFooterTodayTokens = 0, routerFooterAllTimeTokens = 0, routerFooterRequests = 0) {
   // 📖 Filter out hidden models for display
   const visibleResults = results.filter(r => !r.hidden)
+  void legacyFooterHidden
 
   const up      = visibleResults.filter(r => r.status === 'up').length
   const down    = visibleResults.filter(r => r.status === 'down').length
@@ -323,80 +319,8 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
       themeColors.warning(`⏳ ${timeout}`) + themeColors.dim(' timeout  ') +
       themeColors.error(`❌ ${down}`) + themeColors.dim(' down  ') +
       '',
-    '',
   ]
 
-  // 📖 Filter bar — llmfit-style horizontal filter pills (1 dedicated row above table)
-  // 📖 Each block: title with hotkey hint + active value colored by filter state
-  {
-    const filterParts = []
-    const filterSep = themeColors.dim(' │ ')
-    const blockSep = ' │ '
-
-    // 📖 Search filter block — shows active text filter or prompt
-    if (customTextFilter && customTextFilter.trim()) {
-      const badgeText = ` Search "/" ${blockSep} ${customTextFilter.trim().slice(0, 20)} `
-      filterParts.push(themeColors.badge(badgeText, [52, 120, 88], [255, 255, 255]))
-    } else {
-      filterParts.push(themeColors.dim(' Search "/" '))
-    }
-
-    // 📖 Tier filter block — T key cycles through TIER_CYCLE
-    if (tierFilterMode > 0) {
-      const tierLabel = TIER_CYCLE_NAMES[tierFilterMode]
-      const tierBg = getTierRgb(tierLabel)
-      filterParts.push(themeColors.badge(` Tier (${tierLabel}) `, tierBg, [255, 255, 255]))
-    } else {
-      filterParts.push(themeColors.dim(' Tier (T) '))
-    }
-
-    // 📖 Provider filter block — D key cycles through providers
-    if (originFilterMode > 0) {
-      const originKeys = [null, ...Object.keys(sources)]
-      const activeOriginKey = originKeys[originFilterMode]
-      const activeOriginName = activeOriginKey ? sources[activeOriginKey]?.name ?? activeOriginKey : null
-      if (activeOriginName) {
-        const normName = normalizeOriginLabel(activeOriginName, activeOriginKey)
-        const providerRgb = PROVIDER_COLOR[activeOriginKey] || [255, 255, 255]
-        filterParts.push(themeColors.badge(` Provider (${normName}) `, providerRgb, [255, 255, 255]))
-      }
-    } else {
-      filterParts.push(themeColors.dim(' Provider (D) '))
-    }
-
-    // 📖 Verdict filter block — V key cycles through verdicts
-    if (verdictFilterMode > 0) {
-      const verdictLabel = VERDICT_CYCLE[verdictFilterMode]
-      const verdictColors = {
-        'Perfect': themeColors.success,
-        'Normal': themeColors.metricGood,
-        'Slow': (t) => chalk.bold.rgb(...getTierRgb('A-'))(t),
-        'Spiky': (t) => chalk.bold.rgb(...getTierRgb('A+'))(t),
-        'Very Slow': (t) => chalk.bold.rgb(...getTierRgb('B+'))(t),
-        'Overloaded': (t) => chalk.bold.rgb(...getTierRgb('B'))(t),
-        'Unstable': themeColors.errorBold,
-        'Not Active': themeColors.dim,
-        'Pending': themeColors.dim,
-      }
-      const vc = verdictColors[verdictLabel] || themeColors.accent
-      filterParts.push(themeColors.badge(` Verdict (${verdictLabel}) `, [20, 20, 20], vc === themeColors.dim ? [130, 130, 130] : [255, 255, 255]))
-    } else {
-      filterParts.push(themeColors.dim(' Verdict (V) '))
-    }
-
-    // 📖 Health filter block — H key cycles through health states
-    if (healthFilterMode > 0) {
-      const healthLabel = HEALTH_CYCLE[healthFilterMode]
-      const healthDisplay = healthLabel === 'auth_error' ? 'Auth Err' : healthLabel === 'noauth' ? 'No Key' : healthLabel.charAt(0).toUpperCase() + healthLabel.slice(1)
-      const healthBg = healthLabel === 'up' ? [52, 120, 88] : healthLabel === 'timeout' ? [180, 130, 0] : healthLabel === 'down' ? [120, 40, 40] : [60, 60, 60]
-      filterParts.push(themeColors.badge(` Health (${healthDisplay}) `, healthBg, [255, 255, 255]))
-    } else {
-      filterParts.push(themeColors.dim(' Health (H) '))
-    }
-
-    lines.push(filterParts.join(blockSep))
-  }
-
   // 📖 Header row with sorting indicators
   // 📖 NOTE: padEnd on chalk strings counts ANSI codes, breaking alignment
   // 📖 Solution: build plain text first, then colorize
@@ -495,8 +419,11 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
 
   // 📖 Viewport clipping: only render models that fit on screen
   const hasCustomFilter = typeof customTextFilter === 'string' && customTextFilter.trim().length > 0
-  const extraFooterLines = versionStatus.isOutdated ? 1 : 0
-  const vp = calculateViewport(terminalRows, scrollOffset, sorted.length, extraFooterLines)
+  const hasReleaseFooter = typeof lastReleaseDate === 'string' && lastReleaseDate.trim().length > 0
+  const extraFooterLines = (versionStatus.isOutdated ? 1 : 0) + (hasCustomFilter ? 1 : 0) + (hasReleaseFooter ? 1 : 0)
+  const vp = calculateViewport(terminalRows, scrollOffset, sorted.length, {
+    extraFixedLines: extraFooterLines,
+  })
   const paintSweScore = (score, paddedText) => {
     if (score >= 70) return chalk.bold.rgb(...getTierRgb('S+'))(paddedText)
     if (score >= 60) return chalk.bold.rgb(...getTierRgb('S'))(paddedText)
@@ -537,10 +464,14 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
       ? providerName.slice(0, 4) + '…'
       : providerName
     const source = themeColors.provider(r.providerKey, providerDisplay.padEnd(wSource))
-    // 📖 Favorites: always reserve 2 display columns at the start of Model column.
-    // 📖 🎯 (2 cols) for recommended, ⭐ (2 cols) for favorites, '  ' (2 spaces) for non-favorites — keeps alignment stable.
-    const favoritePrefix = r.isRecommended ? '🎯' : r.isFavorite ? '⭐' : '  '
-    const prefixDisplayWidth = 2
+    // 📖 Favorites marked with a single ⭐ — no ranking numbers
+    let favoritePrefix = ''
+    if (r.isRecommended) {
+      favoritePrefix = '🎯 '
+    } else if (r.isFavorite) {
+      favoritePrefix = '⭐ '
+    }
+    const prefixDisplayWidth = displayWidth(favoritePrefix)
     const nameWidth = Math.max(0, W_MODEL - prefixDisplayWidth)
     const name = favoritePrefix + r.label.slice(0, nameWidth).padEnd(nameWidth)
     const sweScore = r.sweScore ?? '—'
@@ -786,7 +717,13 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
     lines.push(themeColors.dim(`  ... ${sorted.length - vp.endIdx} more below ...`))
   }
 
-   lines.push('')
+  // 📖 Blank lines keep the footer glued to the bottom without touching the sticky header.
+  if (terminalRows > 0) {
+    const footerLineCount = TABLE_FOOTER_LINES + extraFooterLines
+    const blankCount = Math.max(0, terminalRows - lines.length - footerLineCount)
+    for (let i = 0; i < blankCount; i++) lines.push('')
+  }
+
   // 📖 Footer hints keep only navigation and secondary actions now that the
   // 📖 active tool target is already visible in the header badge.
   const hotkey = (keyLabel, text) => themeColors.hotkey(keyLabel) + themeColors.dim(text)
@@ -794,8 +731,6 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
   // 📖 states are obvious even when the user misses the smaller header badges.
   const configuredBadgeBg = getTheme() === 'dark' ? [52, 120, 88] : [195, 234, 206]
   const activeHotkey = (keyLabel, text, bg) => themeColors.badge(`${keyLabel}${text}`, bg, getReadableTextRgb(bg))
-  const favoritesModeBg = favoritesPinnedAndSticky ? [157, 122, 48] : [95, 95, 95]
-  const favoritesModeLabel = favoritesPinnedAndSticky ? ' Favorites Pinned' : ' Favorites Normal'
 
   // 📖 Mouse support: build footer hotkey zones alongside the footer lines.
   // 📖 Each zone records { key, row (1-based terminal row), xStart, xEnd (1-based display cols) }.
@@ -807,21 +742,19 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
   {
     const parts = [
       { text: '  ', key: null },
-      { text: 'F Toggle Favorite', key: 'f' },
+      { text: 'F Favorite', key: 'f' },
       { text: '  •  ', key: null },
-      { text: 'Y' + favoritesModeLabel, key: 'y' },
+      { text: 'Y  Fav Mode', key: 'y' },
       { text: '  •  ', key: null },
       { text: tierFilterMode > 0 ? `T Tier (${activeTierLabel})` : 'T Tier', key: 't' },
       { text: '  •  ', key: null },
       { text: originFilterMode > 0 ? `D Provider (${activeOriginLabel})` : 'D Provider', key: 'd' },
       { text: '  •  ', key: null },
-      { text: 'E Show only configured models', key: 'e' },
+      { text: 'E Active only', key: 'e' },
       { text: '  •  ', key: null },
       { text: 'P Settings', key: 'p' },
       { text: '  •  ', key: null },
-      { text: 'J/K Navigate', key: null },
-      { text: '  •  ', key: null },
-      { text: 'Ctrl+H Help', key: 'ctrl+h' },
+      { text: 'I Help', key: 'i' },
     ]
     const footerRow1 = lines.length + 1 // 📖 1-based terminal row (line hasn't been pushed yet)
     let xPos = 1
@@ -832,170 +765,108 @@ export function renderTable(results, pendingPings, frame, cursor = null, sortCol
     }
   }
 
-  if (!footerHidden) {
-    // 📖 Full footer — all hint lines hidden when footerHidden=true to maximize table space
-    lines.push(
-      '  ' + hotkey('F', ' Toggle Favorite') +
-      themeColors.dim(`  •  `) +
-      activeHotkey('Y', favoritesModeLabel, favoritesModeBg) +
-      themeColors.dim(`  •  `) +
-      (tierFilterMode > 0
-        ? activeHotkey('T', ` Tier (${activeTierLabel})`, getTierRgb(activeTierLabel))
-        : hotkey('T', ' Tier')) +
-      themeColors.dim(`  •  `) +
-      (originFilterMode > 0
-        ? activeHotkey('D', ` Provider (${activeOriginLabel})`, PROVIDER_COLOR[[null, ...Object.keys(sources)][originFilterMode]] || [255, 255, 255])
-        : hotkey('D', ' Provider')) +
-      themeColors.dim(`  •  `) +
-      (hideUnconfiguredModels ? activeHotkey('E', ' Show only configured models', configuredBadgeBg) : hotkey('E', ' Show only configured models')) +
-      themeColors.dim(`  •  `) +
-      hotkey('P', ' Settings') +
-      themeColors.dim(`  •  `) +
-      themeColors.dim('J/K Navigate') +
-      themeColors.dim(`  •  `) +
-      themeColors.dim('Ctrl+H Help')
-    )
-
-    // 📖 Line 2: command palette, recommend, feedback, theme
-    {
-      const cpText = ' CTRL+P ⚡️ Command Palette '
-      const parts = [
-        { text: '  ', key: null },
-        { text: cpText, key: 'ctrl+p' },
-        { text: '  •  ', key: null },
-        { text: 'Q Smart Recommend', key: 'q' },
-        { text: '  •  ', key: null },
-        { text: 'G Theme', key: 'g' },
-        { text: '  •  ', key: null },
-        { text: 'I Feedback, bugs & requests', key: 'i' },
-      ]
-      const footerRow2 = lines.length + 1
-      let xPos = 1
-      for (const part of parts) {
-        const w = displayWidth(part.text)
-        if (part.key) footerHotkeys.push({ key: part.key, row: footerRow2, xStart: xPos, xEnd: xPos + w - 1 })
-        xPos += w
-      }
-    }
-
-    // 📖 Line 2: command palette (highlighted as new), recommend, feedback, and extended hints.
-    // 📖 CTRL+P ⚡️ Command Palette uses neon-green-on-dark-green background to highlight the feature.
-    const paletteLabel = chalk.bgRgb(0, 60, 0).rgb(57, 255, 20).bold(' CTRL+P ⚡️ Command Palette ')
-    lines.push(
-      '  ' + paletteLabel + themeColors.dim(`  •  `) +
-      hotkey('Q', ' Smart Recommend') + themeColors.dim(`  •  `) +
-      hotkey('G', ' Theme') + themeColors.dim(`  •  `) +
-      hotkey('I', ' Feedback, bugs & requests')
-    )
-    // 📖 Proxy status is now shown via the badge in line 2 above — no need for a dedicated line
-    const footerLine =
-      themeColors.footerLove('  Made with 💖 & ☕ by \x1b]8;;https://github.com/vava-nessa\x1b\\vava-nessa\x1b]8;;\x1b\\') +
-      themeColors.dim('  •  ') +
-      '⭐ ' +
-      themeColors.link('\x1b]8;;https://github.com/vava-nessa/free-coding-models\x1b\\Star on GitHub\x1b]8;;\x1b\\') +
-      themeColors.dim('  •  ') +
-      '🤝 ' +
-      themeColors.warning('\x1b]8;;https://github.com/vava-nessa/free-coding-models/graphs/contributors\x1b\\Contributors\x1b]8;;\x1b\\') +
-      themeColors.dim('  •  ') +
-      '☕ ' +
-      themeColors.footerCoffee('\x1b]8;;https://buymeacoffee.com/vavanessadev\x1b\\Buy me a coffee\x1b]8;;\x1b\\')
-    lines.push(footerLine)
-
-    if (versionStatus.isOutdated) {
-      const updateMsg = `  🚀⬆️ UPDATE AVAILABLE — v${LOCAL_VERSION} → v${versionStatus.latestVersion}  •  Click here or press Shift+U to update  🚀⬆️  `
-      const paddedBanner = terminalCols > 0
-        ? updateMsg + ' '.repeat(Math.max(0, terminalCols - displayWidth(updateMsg)))
-        : updateMsg
-      const fluoGreenBanner = chalk.bgRgb(57, 255, 20).rgb(0, 0, 0).bold(paddedBanner)
-      const updateBannerRow = lines.length + 1
-      _lastLayout.updateBannerRow = updateBannerRow
-      footerHotkeys.push({ key: 'update-click', row: updateBannerRow, xStart: 1, xEnd: Math.max(terminalCols, displayWidth(updateMsg)) })
-      lines.push(fluoGreenBanner)
-    } else {
-      _lastLayout.updateBannerRow = 0
+  lines.push(
+    '  ' + hotkey('F', ' Favorite') +
+    themeColors.dim(`  •  `) +
+    hotkey('Y', ' Fav Mode') +
+    themeColors.dim(`  •  `) +
+    (tierFilterMode > 0
+      ? activeHotkey('T', ` Tier (${activeTierLabel})`, getTierRgb(activeTierLabel))
+      : hotkey('T', ' Tier')) +
+    themeColors.dim(`  •  `) +
+    (originFilterMode > 0
+      ? activeHotkey('D', ` Provider (${activeOriginLabel})`, PROVIDER_COLOR[[null, ...Object.keys(sources)][originFilterMode]] || [255, 255, 255])
+      : hotkey('D', ' Provider')) +
+    themeColors.dim(`  •  `) +
+    (hideUnconfiguredModels ? activeHotkey('E', ' Active only', configuredBadgeBg) : hotkey('E', ' Active only')) +
+    themeColors.dim(`  •  `) +
+    hotkey('P', ' Settings') +
+    themeColors.dim(`  •  `) +
+    hotkey('I', ' Help')
+  )
+
+  // 📖 Line 2: command palette + GitHub
+  {
+    const cpText = ' Ctrl+P Cmd Palette '
+    const parts = [
+      { text: '  ', key: null },
+      { text: cpText, key: 'ctrl+p' },
+      { text: '  ', key: null },
+    ]
+    const footerRow2 = lines.length + 1
+    let xPos = 1
+    for (const part of parts) {
+      const w = displayWidth(part.text)
+      if (part.key) footerHotkeys.push({ key: part.key, row: footerRow2, xStart: xPos, xEnd: xPos + w - 1 })
+      xPos += w
     }
+  }
 
-    // 📖 Final footer line: changelog + optional active text-filter badge + exit hint.
-    let filterBadge = ''
-    if (hasCustomFilter) {
-      const normalizedFilter = customTextFilter.trim().replace(/\s+/g, ' ')
-      const filterPrefix = 'X Disable filter: "'
-      const filterSuffix = '"'
-      const separatorPlain = '  •  '
-      const baseFooterPlain = '  N Changelog' + separatorPlain + 'Ctrl+C Exit'
-      const baseBadgeWidth = displayWidth(` ${filterPrefix}${filterSuffix} `)
-      const availableFilterWidth = terminalCols > 0
-        ? Math.max(8, terminalCols - displayWidth(baseFooterPlain) - displayWidth(separatorPlain) - baseBadgeWidth)
-        : normalizedFilter.length
-      const visibleFilter = normalizedFilter.length > availableFilterWidth
-        ? `${normalizedFilter.slice(0, Math.max(3, availableFilterWidth - 3))}...`
-        : normalizedFilter
-      filterBadge = chalk.bgYellow.black.bold(` ${filterPrefix}${visibleFilter}${filterSuffix} `)
-    }
+  // 📖 Line 2: command palette (highlighted as new) + GitHub link.
+  // 📖 Ctrl+P Cmd Palette uses neon-green-on-dark-green background to highlight the feature.
+  const paletteLabel = chalk.bgRgb(0, 60, 0).rgb(57, 255, 20).bold(' Ctrl+P Cmd Palette ')
+  const starLink = '⭐ ' + themeColors.link('\x1b]8;;https://github.com/vava-nessa/free-coding-models\x1b\\GitHub\x1b]8;;\x1b\\')
+  lines.push(
+    '  ' + paletteLabel + themeColors.dim(`  •  `) + starLink + themeColors.dim(`  •  `) +
+    chalk.rgb(255, 168, 209).bold('\x1b]8;;https://x.com/vavanessadev\x1b\\Support me by following me on X ! @vavanessadev\x1b]8;;\x1b\\')
+  )
+
+  if (versionStatus.isOutdated) {
+    const updateMsg = `  🚀⬆️ UPDATE AVAILABLE — v${LOCAL_VERSION} → v${versionStatus.latestVersion}  •  Click here or press Shift+U to update  🚀⬆️  `
+    const paddedBanner = terminalCols > 0
+      ? updateMsg + ' '.repeat(Math.max(0, terminalCols - displayWidth(updateMsg)))
+      : updateMsg
+    const fluoGreenBanner = chalk.bgRgb(57, 255, 20).rgb(0, 0, 0).bold(paddedBanner)
+    const updateBannerRow = lines.length + 1
+    _lastLayout.updateBannerRow = updateBannerRow
+    footerHotkeys.push({ key: 'update-click', row: updateBannerRow, xStart: 1, xEnd: Math.max(terminalCols, displayWidth(updateMsg)) })
+    lines.push(fluoGreenBanner)
+  } else {
+    _lastLayout.updateBannerRow = 0
+  }
 
-    // 📖 Mouse support: track last footer line hotkey zones
-    {
-      const lastFooterRow = lines.length + 1 // 📖 1-based terminal row (line about to be pushed)
-      const parts = [
-        { text: '  ', key: null },
-        { text: 'N Changelog', key: 'n' },
-      ]
-      if (hasCustomFilter) {
-        parts.push({ text: '  •  ', key: null })
-        // 📖 X key clears filter — compute width from rendered badge text
-        const badgePlain = `X Disable filter: "${customTextFilter.trim().replace(/\s+/g, ' ')}"`
-        parts.push({ text: ` ${badgePlain} `, key: 'x' })
-      }
-      let xPos = 1
-      for (const part of parts) {
-        const w = displayWidth(part.text)
-        if (part.key) footerHotkeys.push({ key: part.key, row: lastFooterRow, xStart: xPos, xEnd: xPos + w - 1 })
-        xPos += w
-      }
-    }
+  // 📖 Optional active text-filter badge — surfaced inline if a custom filter is active.
+  // 📖 Changelog moved to Settings (P), Ctrl+C Exit moved to Help (Ctrl+H), Discord
+  // 📖 moved to onboarding + Settings — no more orphan hint lines down here.
+  let filterBadge = ''
+  if (hasCustomFilter) {
+    const normalizedFilter = customTextFilter.trim().replace(/\s+/g, ' ')
+    const filterPrefix = 'X Disable filter: "'
+    const filterSuffix = '"'
+    const baseBadgeWidth = displayWidth(` ${filterPrefix}${filterSuffix} `)
+    const availableFilterWidth = terminalCols > 0
+      ? Math.max(8, terminalCols - 4 - baseBadgeWidth)
+      : normalizedFilter.length
+    const visibleFilter = normalizedFilter.length > availableFilterWidth
+      ? `${normalizedFilter.slice(0, Math.max(3, availableFilterWidth - 3))}...`
+      : normalizedFilter
+    filterBadge = chalk.bgYellow.black.bold(` ${filterPrefix}${visibleFilter}${filterSuffix} `)
+  }
 
-    const releaseLabel = lastReleaseDate
-      ? chalk.rgb(255, 182, 193)(`Last release: ${lastReleaseDate}`)
-      : ''
-
-    lines.push(
-      '  ' + themeColors.hotkey('N') + themeColors.dim(' Changelog') +
-      (filterBadge
-        ? themeColors.dim('  •  ') + filterBadge
-        : '') +
-      themeColors.dim('  •  ') +
-      themeColors.dim('Ctrl+C Exit') +
-      (releaseLabel ? themeColors.dim('  •  ') + releaseLabel : '')
-    )
-
-    // 📖 Discord link at the very bottom of the TUI
-    lines.push(
-      '  💬 ' +
-      themeColors.footerDiscord('\x1b]8;;https://discord.gg/ZTNFHvvCkU\x1b\\Join the Discord\x1b]8;;\x1b\\') +
-      themeColors.dim(' → ') +
-      themeColors.footerDiscord('https://discord.gg/ZTNFHvvCkU')
-    )
-  } else {
-    // 📖 Collapsed footer: single line with toggle hint
-    lines.push(
-      '  ' + themeColors.hotkey('Ctrl+O') + themeColors.dim(' Toggle Footer') +
-      themeColors.dim('  •  Ctrl+C Exit')
-    )
+  if (hasCustomFilter) {
+    // 📖 Mouse support: register click zone for the X-clear filter badge
+    const lastFooterRow = lines.length + 1
+    const badgePlain = `X Disable filter: "${customTextFilter.trim().replace(/\s+/g, ' ')}"`
+    const fullText = '  ' + ` ${badgePlain} `
+    const xStart = 3 // 📖 after the leading 2 spaces
+    const xEnd = xStart + displayWidth(` ${badgePlain} `) - 1
+    footerHotkeys.push({ key: 'x', row: lastFooterRow, xStart, xEnd })
+    void fullText
+    lines.push('  ' + filterBadge)
   }
 
+  const releaseLabel = lastReleaseDate
+    ? chalk.rgb(255, 182, 193)(`Last release: ${lastReleaseDate}`)
+    : ''
+
+  if (releaseLabel) lines.push('  ' + releaseLabel)
   _lastLayout.footerHotkeys = footerHotkeys
 
   // 📖 Append \x1b[K (erase to EOL) to each line so leftover chars from previous
-  // 📖 frames are cleared. \x1b[J (erase from cursor to end of screen) clears any
-  // 📖 stale content below when footer is hidden.
+  // 📖 frames are cleared. \x1b[J clears stale content below without adding a
+  // 📖 newline that could scroll the alternate screen.
   const EL = '\x1b[K'
   const cleared = lines.map(l => l + EL)
-  if (footerHidden) {
-    // 📖 When footer is hidden, \x1b[J erases stale footer content below the cursor
-    cleared.push('\x1b[J')
-  } else {
-    const remaining = terminalRows > 0 ? Math.max(0, terminalRows - cleared.length) : 0
-    for (let i = 0; i < remaining; i++) cleared.push(EL)
-  }
+  if (cleared.length > 0) cleared[cleared.length - 1] += '\x1b[J'
   return cleared.join('\n')
 }