oxios 1.5.2

Oxios Agent OS — Agent Operating System powered by oxi-sdk
import { Moon, Sunrise } from 'lucide-react'
import { useTranslation } from 'react-i18next'
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { useDreamStatus } from '@/hooks/use-memory'
import { formatRelativeDate } from '@/lib/utils'

/**
 * Dream (memory consolidation) status card for the dashboard.
 *
 * Shows whether Dream is currently running, last/next run time,
 * and cycles completed. Always renders — shows a placeholder
 * when Dream data is unavailable to keep the grid stable.
 */
export function DreamCard({ className }: { className?: string }) {
  const { t } = useTranslation()
  const { data: dream, isLoading } = useDreamStatus()

  const isRunning = dream?.running ?? false
  const lastRun = dream?.last_run ? formatRelativeDate(dream.last_run, t) : '—'
  const nextRun = dream?.next_run ? formatRelativeDate(dream.next_run, t) : '—'

  return (
    <Card className={className}>
      <CardHeader className="flex flex-row items-center justify-between pb-2">
        <CardTitle className="flex items-center gap-2 text-base">
          {isRunning ? (
            <Sunrise className="h-4 w-4 text-info animate-pulse" />
          ) : (
            <Moon className="h-4 w-4" />
          )}
          {t('dashboard.dream')}
        </CardTitle>
        {isRunning && (
          <span className="text-2xs font-medium text-info animate-pulse">
            {t('dashboard.running')}
          </span>
        )}
      </CardHeader>
      <CardContent className="pt-0">
        {isLoading ? (
          <p className="text-xs text-muted-foreground py-1">{t('common.loading')}</p>
        ) : !dream ? (
          <p className="text-xs text-muted-foreground py-1">{t('dashboard.dreamUnavailable')}</p>
        ) : (
          <div className="space-y-1.5">
            <div className="flex items-center justify-between text-xs">
              <span className="text-muted-foreground">{t('dashboard.lastRun')}</span>
              <span>{lastRun}</span>
            </div>
            <div className="flex items-center justify-between text-xs">
              <span className="text-muted-foreground">{t('dashboard.nextRun')}</span>
              <span>{nextRun}</span>
            </div>
            <div className="flex items-center justify-between text-xs">
              <span className="text-muted-foreground">{t('dashboard.cyclesCompleted')}</span>
              <span className="font-semibold">{dream.cycles_completed}</span>
            </div>
          </div>
        )}
      </CardContent>
    </Card>
  )
}