keet-tui / lib / components / status-bar.js

import * as style from '../style.js'

export function statusBarView (model, width) {
  const parts = []

  // Connection status
  if (model.connected) {
    parts.push(style.green('\u25cf') + ' Connected')
  } else {
    parts.push(style.red('\u25cf') + ' Disconnected')
  }

  // Identity
  if (model.identity) {
    const name = model.identity.name || model.identity.memberId?.slice(0, 8) || '?'
    parts.push(style.cyan(name))
  }

  // Room count
  const roomCount = (model.rooms || []).length
  parts.push(roomCount + ' room' + (roomCount !== 1 ? 's' : ''))

  // Focus mode
  const mode = model.focus === 'rooms' ? '[Rooms]' : model.focus === 'chat' ? '[Chat]' : '[Members]'
  parts.push(style.dim(mode))

  // Help hint
  const help = style.bold(style.yellow('?:help')) + style.dim('  Tab:switch  Ctrl+C:quit')

  const left = ' ' + parts.join(style.brightBlack(' \u2502 '))
  const right = style.dim(help) + ' '

  const leftLen = style.visibleLength(left)
  const rightLen = style.visibleLength(right)
  const gap = Math.max(1, width - leftLen - rightLen)

  const bar = left + ' '.repeat(gap) + right
  return style.bg256(236, style.padRight(bar, width))
}