'use client'

import { useState, useEffect, useMemo } from 'react'
import { useLocale } from 'next-intl'
import type { TrumpPost } from '@/types'
import { getPosts } from '@/lib/api'
import PostRow from '@/components/dashboard/PostCards'

/**
 * Archive — legacy / test signals (rsi_reversal, sma_reclaim, breakout,
 * test, phase1…). NOT a live system. Kept only so old data is inspectable.
 */
export default function ArchivePage() {
  const locale = useLocale()
  const isZh = false  // i18n shelved — Chinese branches kept as dead code for future revival; see messages/zh.json
  const [posts, setPosts] = useState<TrumpPost[]>([])
  const [loading, setLoading] = useState(true)
  const [loadErr, setLoadErr] = useState('')
  const [src, setSrc] = useState<string>('all')

  useEffect(() => {
    getPosts(500, 1)
      .then(p => { setPosts(p); setLoadErr('') })
      .catch(e => setLoadErr(e instanceof Error ? e.message : (isZh ? '历史归档加载失败' : 'Failed to load archive')))
      .finally(() => setLoading(false))
  }, [isZh])

  // Archive = legacy / test data only. Exclude every live signal source so
  // active modules don't leak in here as users explore old experiments. Keep
  // this set in sync with sources emitted by app/services/scanners/*.
  const LIVE_SOURCES = new Set([
    'truth',
    'btc_bottom_reversal',
    'funding_reversal',
    'kol_divergence',
  ])
  const archivePosts = useMemo(
    () => posts.filter(p => !LIVE_SOURCES.has(p.source || '')),
    [posts],
  )
  const sources = useMemo(() => {
    const m: Record<string, number> = {}
    for (const p of archivePosts) m[p.source || '?'] = (m[p.source || '?'] || 0) + 1
    return Object.entries(m).sort((a, b) => b[1] - a[1])
  }, [archivePosts])
  const filtered = useMemo(
    () => src === 'all' ? archivePosts : archivePosts.filter(p => p.source === src),
    [archivePosts, src],
  )

  return (
    <div className="page">
      <div className="page-head">
        <div>
          <h1 className="page-title">Archive</h1>
          <p className="page-sub">{isZh ? '历史 / 测试数据，不属于实时系统。' : 'Legacy / test data — NOT a live system'}</p>
        </div>
      </div>

      <div style={{
        background: 'var(--bg-sunk)', borderRadius: 10, padding: '12px 16px',
        marginBottom: 16, borderLeft: '4px solid var(--ink-4)',
      }}>
        <div style={{ fontSize: 12, color: 'var(--ink-3)', lineHeight: 1.5 }}>
          {isZh
            ? '这些来源已经被 BTC 周期底部 2-of-3 共振系统替代，不再参与排程。这里只作为历史查阅使用，机器人不会根据它们执行交易。'
            : 'These sources were superseded by the BTC bottom-reversal 2-of-3 price confluence and are no longer scheduled. Shown here only for historical inspection — the bot does not act on them.'}
        </div>
      </div>

      <div style={{ display: 'flex', gap: 6, flexWrap: 'wrap', marginBottom: 12 }}>
        {[['all', archivePosts.length] as [string, number], ...sources].map(([s, n]) => (
          <button
            key={s}
            onClick={() => setSrc(s)}
            style={{
              padding: '4px 10px', borderRadius: 6, border: '1px solid var(--line)',
              background: src === s ? 'var(--ink)' : 'transparent',
              color: src === s ? 'var(--bg)' : 'var(--ink-3)',
              fontSize: 11, cursor: 'pointer', fontWeight: src === s ? 600 : 400,
            }}
          >
            {s} <span style={{ opacity: 0.6 }}>{n}</span>
          </button>
        ))}
      </div>

      {loading && <div style={{ textAlign: 'center', padding: 60, color: 'var(--ink-3)' }}>{isZh ? '加载中…' : 'Loading…'}</div>}
      {!loading && loadErr && (
        <div className="card" style={{ padding: 24, textAlign: 'center', color: 'var(--down)' }}>
          ⚠️ {isZh ? `无法加载归档：${loadErr}` : `Couldn’t load archive — ${loadErr}`}
          <div style={{ marginTop: 10 }}>
            <button className="btn ghost" style={{ fontSize: 12, padding: '6px 14px' }}
              onClick={() => location.reload()}>{isZh ? '重试' : 'Retry'}</button>
          </div>
        </div>
      )}
      {!loading && !loadErr && filtered.length === 0 && (
        <div className="card" style={{ padding: 48, textAlign: 'center', color: 'var(--ink-3)' }}>
          {isZh ? '没有可显示的历史信号。' : 'No archived signals.'}
        </div>
      )}
      {!loading && filtered.length > 0 && (
        <div className="post-stream">
          {filtered.map(p => <PostRow key={p.id} post={p} />)}
        </div>
      )}
    </div>
  )
}
