free-coding-models 0.5.11 → 0.5.12

package/src/tui/render-helpers.js

@@ -31,6 +31,8 @@
  *   - `calculateViewport`: Compute visible slice of model rows
  *   - `sortResultsWithPinnedFavorites`: Sort with pinned items at top
  *   - `adjustScrollOffset`: Clamp scrollOffset so cursor stays visible
+ *   - `fadedRow`: Multiply every 24-bit RGB channel by a factor to fade an
+ *     entire ANSI-colored line uniformly — used for "unusable" rows.
  *
  *   📦 Dependencies:
  *   - chalk: Terminal colors and formatting
@@ -56,6 +58,39 @@ export function stripAnsi(input) {
   return String(input).replace(/\x1b\[[0-9;]*m/g, '').replace(/\x1b\][^\x1b]*\x1b\\/g, '')
 }
 
+// 📖 fadedRow: Multiply every 24-bit RGB channel inside an ANSI-colored string by `factor`
+// 📖 (default 0.8 = 80% opacity, i.e. 20% less opaque) so the whole line reads as
+// 📖 uniformly faded. Only foreground/background 24-bit SGR codes (38;2;R;G;B and
+// 📖 48;2;R;G;B) are touched — bold, dim, reset codes, hyperlinks, and cursor SGRs
+// 📖 pass through unchanged so the structural styling stays intact.
+// 📖 Used to make "unusable" rows (NO KEY / AUTH FAIL) visually de-emphasized at
+// 📖 the row level rather than dimming a single cell, which is easier to miss at
+// 📖 a glance when scanning the table.
+// 📖 Channels are clamped to 0–255 and rounded to integers so terminal parsers
+// 📖 never receive an out-of-range byte. When `factor >= 1` the input is returned
+// 📖 untouched (identity fast path) so callers can wire this in without paying
+// 📖 the cost on every row.
+export function fadedRow(input, factor = 0.8) {
+  const text = String(input)
+  if (factor >= 1) return text
+  // 📖 Pre-clamp factor to [0, 1] to avoid negative channel values that would
+  // 📖 confuse downstream regex replacements; we still respect very small values
+  // 📖 so a caller can pass e.g. 0.1 to almost black-out a row.
+  const safeFactor = Math.max(0, Math.min(1, factor))
+  return text.replace(
+    /\x1b\[(38|48);2;(\d+);(\d+);(\d+)m/g,
+    (_match, kind, rStr, gStr, bStr) => {
+      const r = parseInt(rStr, 10)
+      const g = parseInt(gStr, 10)
+      const b = parseInt(bStr, 10)
+      const nr = Math.max(0, Math.min(255, Math.round(r * safeFactor)))
+      const ng = Math.max(0, Math.min(255, Math.round(g * safeFactor)))
+      const nb = Math.max(0, Math.min(255, Math.round(b * safeFactor)))
+      return `\x1b[${kind};2;${nr};${ng};${nb}m`
+    }
+  )
+}
+
 // 📖 maskApiKey: Mask all but first 4 and last 3 characters of an API key.
 // 📖 Prevents accidental disclosure of secrets in TUI display.
 export function maskApiKey(key) {

package/src/tui/render-table.js

@@ -17,6 +17,8 @@
  *   - High-visibility active text-filter banner with one-key clear action (`X`)
  *   - Full-width red outdated-version banner when a newer npm release is known
  *   - Distinct auth-failure vs missing-key health labels so configured providers stay honest
+ *   - 80%-opacity row fade for "unusable" models (NO KEY / AUTH FAIL) so the user can spot at a glance
+ *     which rows are not actually reachable, even when the cursor is parked elsewhere
  *
  *   → Functions:
  *   - `renderTable` — Render the full TUI table as a string (no side effects)
@@ -27,7 +29,7 @@
  *   - ../src/tier-colors.js: TIER_COLOR
  *   - ../src/utils.js: getAvg, getVerdict, getUptime, getStabilityScore
  *   - ../src/ping.js: usagePlaceholderForProvider
- *   - ../src/render-helpers.js: calculateViewport, sortResultsWithPinnedFavorites, padEndDisplay
+ *   - ../src/render-helpers.js: calculateViewport, sortResultsWithPinnedFavorites, padEndDisplay, fadedRow
  *
  *   @see bin/free-coding-models.js — main entry point that calls renderTable
  */
@@ -50,7 +52,7 @@ import { TIER_COLOR } from './tier-colors.js'
 import { getAvg, getVerdict, getUptime, getStabilityScore, getVersionStatusInfo } from '../core/utils.js'
 import { usagePlaceholderForProvider } from '../core/ping.js'
 import { formatBenchmarkLatency, formatBenchmarkTps } from '../core/benchmark.js'
-import { calculateViewport, sortResultsWithPinnedFavorites, padEndDisplay, displayWidth, stripAnsi } from './render-helpers.js'
+import { calculateViewport, sortResultsWithPinnedFavorites, padEndDisplay, displayWidth, stripAnsi, fadedRow } from './render-helpers.js'
 import { getToolMeta, TOOL_METADATA, TOOL_MODE_ORDER, isModelCompatibleWithTool } from '../core/tool-metadata.js'
 import { getColumnSpacing } from './ui-config.js'
 import { detectPackageManager, getManualInstallCmd } from '../core/updater.js'
@@ -946,20 +948,33 @@ export function renderTable({
     if (showBenchmarkColumns) rowParts.push(latencyCell, tpsCell)
     const row = '  ' + rowParts.join(COL_SEP)
 
+    // 📖 "Unusable" models (no key / bad key) are visually de-emphasized at the
+    // 📖 row level. The user cannot actually send a request to these models, so
+    // 📖 we drop the whole line to 80% opacity (20% less opaque) so it stands
+    // 📖 out from working rows at a glance, even if the cursor is parked on a
+    // 📖 different model. The cursor always wins so the user never loses track
+    // 📖 of their active selection. fadedRow multiplies every 24-bit RGB
+    // 📖 channel by 0.8 so the result works on every terminal that supports
+    // 📖 truecolor (no reliance on the SGR 2 "faint" code, which is ignored by
+    // 📖 some terminals).
+    const isUnusable = r.status === 'noauth' || r.status === 'auth_error'
+
+    let renderedRow
     if (isCursor) {
-      lines.push(themeColors.bgModelCursor(row))
+      renderedRow = themeColors.bgModelCursor(row)
     } else if (isIncompatible) {
       // 📖 Dark red background for models incompatible with the active tool mode.
       // 📖 This visually warns the user that selecting this model won't work with their current tool.
-      lines.push(chalk.bgRgb(60, 15, 15).rgb(180, 130, 130)(row))
+      renderedRow = chalk.bgRgb(60, 15, 15).rgb(180, 130, 130)(row)
     } else if (r.isRecommended) {
       // 📖 Medium green background for recommended models (distinguishable from favorites)
-      lines.push(themeColors.bgModelRecommended(row))
+      renderedRow = themeColors.bgModelRecommended(row)
     } else if (r.isFavorite) {
-      lines.push(themeColors.bgModelFavorite(row))
+      renderedRow = themeColors.bgModelFavorite(row)
     } else {
-      lines.push(row)
+      renderedRow = row
     }
+    lines.push(isUnusable ? fadedRow(renderedRow, 0.8) : renderedRow)
   }
 
   // 📖 Mouse support: record the 1-based terminal row range of model data rows.