@alumbwe/anvil 1.0.0 → 1.0.1

package/src/components/session-ended-banner.tsx

@@ -1,226 +0,0 @@
-import {
-  FALLBACK_FREEBUFF_MODEL_ID,
-  isFreebuffPremiumModelId,
-  SUPPORTED_FREEBUFF_MODELS,
-  type FreebuffModelOption,
-} from '@anvil/common/constants/freebuff-models'
-import { getRateLimitsByModel } from '@anvil/common/types/freebuff-session'
-import { TextAttributes } from '@opentui/core'
-import { useKeyboard } from '@opentui/react'
-import React, { useCallback, useState } from 'react'
-
-import { Button } from './button'
-import {
-  refreshFreebuffSession,
-  returnToFreebuffLanding,
-} from '../hooks/use-freebuff-session'
-import { useTheme } from '../hooks/use-theme'
-import { useFreebuffModelStore } from '../state/freebuff-model-store'
-import { useFreebuffSessionStore } from '../state/freebuff-session-store'
-import { formatSessionUnits } from '../utils/format-session-units'
-import { isPlainEnterKey } from '../utils/terminal-enter-detection'
-import { BORDER_CHARS } from '../utils/ui-constants'
-
-import type { KeyEvent } from '@opentui/core'
-
-interface SessionEndedBannerProps {
-  /** True while an agent request is still streaming under the server-side
-   *  grace window. Swaps the Enter-to-rejoin affordance for a "let it
-   *  finish" hint so the user doesn't abort their in-flight work. */
-  isStreaming: boolean
-}
-
-/**
- * Replaces the chat input when the freebuff session has ended. Captures
- * Enter to start a new same-chat session. Esc returns to model selection
- * once no in-flight work needs the global stream-interrupt handler.
- */
-export const SessionEndedBanner: React.FC<SessionEndedBannerProps> = ({
-  isStreaming,
-}) => {
-  const theme = useTheme()
-  const [pendingAction, setPendingAction] = useState<
-    'landing' | 'same-chat' | null
-  >(null)
-
-  // All premium models share one daily pool; the server replicates the same
-  // snapshot under each premium model id, so the first entry has the right
-  // count.
-  const premiumQuota = useFreebuffSessionStore(
-    (s) => Object.values(getRateLimitsByModel(s.session) ?? {})[0] ?? null,
-  )
-  const isQuotaExhausted = premiumQuota
-    ? premiumQuota.recentCount >= premiumQuota.limit
-    : false
-  const accessTier = useFreebuffSessionStore((s) =>
-    s.session && 'accessTier' in s.session ? s.session.accessTier : 'full',
-  )
-  const quotaLabel = accessTier === 'limited' ? 'sessions' : 'premium sessions'
-  const bannerTitle = premiumQuota
-    ? `Session ended  ·  ${formatSessionUnits(premiumQuota.recentCount)} of ${premiumQuota.limit} ${quotaLabel} used today`
-    : 'Session ended'
-  const landingButtonLabel = 'Change model'
-  const landingPendingLabel = 'Opening model selection…'
-
-  // With the shared premium pool spent, rejoining on the still-selected
-  // premium model would be rejected server-side and dead-end on the terminal
-  // rate-limited screen. Continue on the unlimited fallback (DeepSeek V4
-  // Flash) instead — the same flip the landing picker's recommendation makes.
-  // Limited tier is excluded: its models all share the one exhausted pool, so
-  // there is nothing to flip to.
-  const selectedModel = useFreebuffModelStore((s) => s.selectedModel)
-  const continueOnFallback =
-    isQuotaExhausted &&
-    accessTier !== 'limited' &&
-    isFreebuffPremiumModelId(selectedModel)
-  const fallbackModel: FreebuffModelOption | undefined =
-    SUPPORTED_FREEBUFF_MODELS.find((m) => m.id === FALLBACK_FREEBUFF_MODEL_ID)
-  const fallbackModelName = fallbackModel?.displayName ?? 'DeepSeek V4 Flash'
-  // Remind the user of the fallback's data-collection policy before they
-  // continue on it — the landing picker shows this caveat on the model row,
-  // but this banner is a one-keypress continue, so surface it here too.
-  const fallbackWarning = fallbackModel?.warning
-
-  // While a request is still streaming, restart is disabled: it would
-  // unmount <Chat> and abort the in-flight agent run. The promise is "we
-  // let the agent finish" — honoring that means Enter does nothing until
-  // the stream ends or the user hits Esc.
-  const canRestart = !isStreaming && pendingAction === null
-  const pickNewModel = useCallback(() => {
-    if (!canRestart) return
-    setPendingAction('landing')
-    // Drop back to the landing picker (status: 'none') so the user picks a
-    // model and hits Enter again to commit, instead of silently starting a
-    // new session. app.tsx swaps us into <FreebuffLandingScreen> on the
-    // transition, unmounting this banner — no need to clear the pending state on
-    // success.
-    returnToFreebuffLanding({ resetChat: true }).catch(() =>
-      setPendingAction(null),
-    )
-  }, [canRestart])
-
-  const startSameChatSession = useCallback(() => {
-    if (!canRestart) return
-    setPendingAction('same-chat')
-    if (continueOnFallback) {
-      // In-memory flip only (like the server-driven model flips): today's
-      // exhausted pool must not overwrite the user's saved preference. The
-      // rejoin POST reads the store at tick time, so it picks this up.
-      useFreebuffModelStore
-        .getState()
-        .setSelectedModel(FALLBACK_FREEBUFF_MODEL_ID)
-    }
-    // Re-POST with the currently selected model and keep the chat/run state
-    // intact so the next prompt continues the same conversation.
-    refreshFreebuffSession().catch(() => setPendingAction(null))
-  }, [canRestart, continueOnFallback])
-
-  useKeyboard(
-    useCallback(
-      (key: KeyEvent) => {
-        if (!canRestart) return
-        if (isPlainEnterKey(key)) {
-          key.preventDefault?.()
-          startSameChatSession()
-          return
-        }
-        if (key.name === 'escape') {
-          key.preventDefault?.()
-          pickNewModel()
-        }
-      },
-      [startSameChatSession, pickNewModel, canRestart],
-    ),
-  )
-
-  return (
-    <box
-      title={bannerTitle}
-      titleAlignment="center"
-      style={{
-        width: '100%',
-        borderStyle: 'single',
-        // Amber border doubles as the "you've hit the cap" signal now that
-        // the quota count lives in the title (which can't carry per-char
-        // color); muted otherwise.
-        borderColor: isQuotaExhausted ? theme.secondary : theme.muted,
-        customBorderChars: BORDER_CHARS,
-        paddingLeft: 1,
-        paddingRight: 1,
-        paddingTop: 0,
-        paddingBottom: 0,
-        flexDirection: 'column',
-        gap: 0,
-      }}
-    >
-      {isStreaming ? (
-        <text style={{ fg: theme.muted, wrapMode: 'word' }}>
-          Agent is wrapping up. Rejoin the wait room after it's finished.
-        </text>
-      ) : (
-        <box
-          style={{
-            width: '100%',
-            flexDirection: 'row',
-            alignItems: 'center',
-            gap: 2,
-          }}
-        >
-          <Button onClick={startSameChatSession}>
-            <text
-              style={{
-                fg:
-                  pendingAction === 'same-chat'
-                    ? theme.muted
-                    : theme.foreground,
-              }}
-              attributes={TextAttributes.BOLD}
-            >
-              {pendingAction === 'same-chat'
-                ? 'Starting…'
-                : continueOnFallback
-                  ? `Press Enter to continue with ${fallbackModelName}`
-                  : 'Press Enter to continue in a new session'}
-            </text>
-          </Button>
-          <box style={{ flexGrow: 1 }} />
-          <Button
-            onClick={pickNewModel}
-            style={{
-              borderStyle: 'single',
-              borderColor:
-                pendingAction === 'landing' ? theme.muted : theme.border,
-              customBorderChars: BORDER_CHARS,
-              paddingLeft: 1,
-              paddingRight: 1,
-            }}
-            border={['top', 'bottom', 'left', 'right']}
-          >
-            <text
-              style={{
-                fg:
-                  pendingAction === 'landing'
-                    ? theme.muted
-                    : theme.foreground,
-              }}
-            >
-              {pendingAction === 'landing' ? (
-                landingPendingLabel
-              ) : (
-                <>
-                  {landingButtonLabel}
-                  <span fg={theme.muted}>{'   Esc'}</span>
-                </>
-              )}
-            </text>
-          </Button>
-        </box>
-      )}
-      {!isStreaming && continueOnFallback && fallbackWarning && (
-        <text style={{ fg: theme.secondary, wrapMode: 'word' }}>
-          {`${fallbackModelName} ${fallbackWarning.toLowerCase()}.`}
-        </text>
-      )}
-    </box>
-  )
-}

package/src/components/shimmer-text.tsx

@@ -1,248 +0,0 @@
-import { TextAttributes } from '@opentui/core'
-import React, { useEffect, useMemo, useState } from 'react'
-
-import { useTheme } from '../hooks/use-theme'
-
-const clamp = (value: number, min: number, max: number): number =>
-  Math.min(max, Math.max(min, value))
-
-const normalizeHex = (hex: string): string | null => {
-  const trimmed = hex.trim()
-  const withoutHash = trimmed.startsWith('#') ? trimmed.slice(1) : trimmed
-  if (withoutHash.length === 3) {
-    return withoutHash
-      .split('')
-      .map((char) => char + char)
-      .join('')
-  }
-  if (withoutHash.length === 6) {
-    return withoutHash
-  }
-  return null
-}
-
-const hexToRgb = (hex: string): { r: number; g: number; b: number } | null => {
-  const normalized = normalizeHex(hex)
-  if (!normalized) return null
-  const r = parseInt(normalized.slice(0, 2), 16) / 255
-  const g = parseInt(normalized.slice(2, 4), 16) / 255
-  const b = parseInt(normalized.slice(4, 6), 16) / 255
-  if (Number.isNaN(r) || Number.isNaN(g) || Number.isNaN(b)) return null
-  return { r, g, b }
-}
-
-const rgbToHsl = (
-  r: number,
-  g: number,
-  b: number,
-): { h: number; s: number; l: number } => {
-  const max = Math.max(r, g, b)
-  const min = Math.min(r, g, b)
-  const l = (max + min) / 2
-
-  let h = 0
-  let s = 0
-
-  if (max !== min) {
-    const d = max - min
-    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)
-    switch (max) {
-      case r:
-        h = (g - b) / d + (g < b ? 6 : 0)
-        break
-      case g:
-        h = (b - r) / d + 2
-        break
-      default:
-        h = (r - g) / d + 4
-    }
-    h /= 6
-  }
-
-  return { h, s, l }
-}
-
-const hueToRgb = (p: number, q: number, t: number): number => {
-  let temp = t
-  if (temp < 0) temp += 1
-  if (temp > 1) temp -= 1
-  if (temp < 1 / 6) return p + (q - p) * 6 * temp
-  if (temp < 1 / 2) return q
-  if (temp < 2 / 3) return p + (q - p) * (2 / 3 - temp) * 6
-  return p
-}
-
-const hslToRgb = (
-  h: number,
-  s: number,
-  l: number,
-): { r: number; g: number; b: number } => {
-  if (s === 0) {
-    return { r: l, g: l, b: l }
-  }
-
-  const q = l < 0.5 ? l * (1 + s) : l + s - l * s
-  const p = 2 * l - q
-
-  return {
-    r: hueToRgb(p, q, h + 1 / 3),
-    g: hueToRgb(p, q, h),
-    b: hueToRgb(p, q, h - 1 / 3),
-  }
-}
-
-const rgbToHex = (r: number, g: number, b: number): string => {
-  const toHex = (value: number) =>
-    Math.round(clamp(value, 0, 1) * 255)
-      .toString(16)
-      .padStart(2, '0')
-  return `#${toHex(r)}${toHex(g)}${toHex(b)}`
-}
-
-const generatePaletteFromPrimary = (
-  primaryColor: string,
-  size: number,
-  fallbackColor: string,
-): string[] => {
-  const baseRgb = hexToRgb(primaryColor)
-  if (!baseRgb) {
-    // If we can't parse the color, return a simple palette using the fallback
-    return Array.from({ length: size }, () => fallbackColor)
-  }
-
-  const { h, s, l } = rgbToHsl(baseRgb.r, baseRgb.g, baseRgb.b)
-  const palette: string[] = []
-  const paletteSize = Math.max(6, Math.min(24, size))
-  const lightnessRange = 0.22
-
-  for (let i = 0; i < paletteSize; i++) {
-    const ratio = paletteSize === 1 ? 0.5 : i / (paletteSize - 1)
-    const offset = (0.5 - ratio) * 2 * lightnessRange
-    const adjustedLightness = clamp(l + offset, 0.08, 0.92)
-    // Keep full saturation for vibrant colors, only vary lightness
-    const adjustedSaturation = s
-    const { r, g, b } = hslToRgb(h, adjustedSaturation, adjustedLightness)
-    palette.push(rgbToHex(r, g, b))
-  }
-
-  return palette
-}
-
-export const ShimmerText = ({
-  text,
-  interval = 180,
-  colors,
-  primaryColor,
-}: {
-  text: string
-  interval?: number
-  colors?: string[]
-  primaryColor?: string
-}) => {
-  const theme = useTheme()
-  const [pulse, setPulse] = useState<number>(0)
-  const chars = text.split('')
-  const numChars = chars.length
-
-  useEffect(() => {
-    const pulseInterval = setInterval(() => {
-      setPulse((prev) => (prev + 1) % numChars)
-    }, interval)
-
-    return () => clearInterval(pulseInterval)
-  }, [interval, numChars])
-
-  const generateColors = (length: number, colorPalette: string[]): string[] => {
-    if (length === 0) return []
-    if (colorPalette.length === 0) {
-      return Array.from({ length }, () => theme.muted)
-    }
-    if (colorPalette.length === 1) {
-      return Array.from({ length }, () => colorPalette[0])
-    }
-    const generatedColors: string[] = []
-    for (let i = 0; i < length; i++) {
-      const ratio = length === 1 ? 0 : i / (length - 1)
-      const colorIndex = Math.min(
-        colorPalette.length - 1,
-        Math.floor(ratio * (colorPalette.length - 1)),
-      )
-      generatedColors.push(colorPalette[colorIndex])
-    }
-    return generatedColors
-  }
-
-  const palette = useMemo(() => {
-    if (colors && colors.length > 0) {
-      return colors
-    }
-    if (primaryColor) {
-      const paletteSize = Math.max(8, Math.min(20, Math.ceil(numChars * 1.5)))
-      return generatePaletteFromPrimary(primaryColor, paletteSize, theme.muted)
-    }
-    // Use theme shimmer color as default
-    const paletteSize = Math.max(8, Math.min(20, Math.ceil(numChars * 1.5)))
-    return generatePaletteFromPrimary(theme.info, paletteSize, theme.muted)
-  }, [colors, primaryColor, numChars, theme.info, theme.muted])
-
-  const generateAttributes = (length: number): number[] => {
-    const attributes: number[] = []
-    for (let i = 0; i < length; i++) {
-      const ratio = length <= 1 ? 0 : i / (length - 1)
-      if (ratio < 0.23) {
-        attributes.push(TextAttributes.BOLD)
-      } else if (ratio < 0.69) {
-        attributes.push(TextAttributes.NONE)
-      } else {
-        attributes.push(TextAttributes.DIM)
-      }
-    }
-    return attributes
-  }
-
-  const generatedColors = useMemo(
-    () => generateColors(numChars, palette),
-    [numChars, palette],
-  )
-  const attributes = useMemo(() => generateAttributes(numChars), [numChars])
-
-  const parts: { text: string; color: string; attr: number }[] = []
-  let currentColor = generatedColors[0]
-  let currentAttr = attributes[0]
-  let currentText = ''
-
-  chars.forEach((char, index) => {
-    const phase = (pulse - index + numChars) % numChars
-    const charColor = generatedColors[phase]
-    const charAttr = attributes[phase]
-
-    if (charColor === currentColor && charAttr === currentAttr) {
-      currentText += char
-    } else {
-      if (currentText) {
-        parts.push({
-          text: currentText,
-          color: currentColor,
-          attr: currentAttr,
-        })
-      }
-      currentText = char
-      currentColor = charColor
-      currentAttr = charAttr
-    }
-  })
-
-  if (currentText) {
-    parts.push({ text: currentText, color: currentColor, attr: currentAttr })
-  }
-
-  return (
-    <>
-      {parts.map((part, index) => (
-        <span key={index} fg={part.color} attributes={part.attr}>
-          {part.text}
-        </span>
-      ))}
-    </>
-  )
-}