← Назадimport { TrendingUp, Activity, Signal, Database, ExternalLink, FolderOpen } from 'lucide-react';
import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from '../ui/card';
import { Button } from '../ui/button';
import { Badge } from '../ui/badge';
import { useProject } from '../../hooks/useProjects';
interface ScreenerCardProps {
onViewDetails: () => void;
onViewTasks: () => void;
onViewFiles?: () => void;
}
export function ScreenerCard({ onViewDetails, onViewTasks, onViewFiles }: ScreenerCardProps) {
const { data, isLoading, refetch } = useProject('futures-screener');
if (isLoading) {
return <Card className="animate-pulse"><div className="h-64" /></Card>;
}
const { kpis } = data || {};
const serviceStatus = kpis?.service?.status || 'unknown';
const totalSymbols = kpis?.symbols?.total || 0;
const totalLevels = kpis?.signals?.totalLevels || 0;
const strongLevels = kpis?.signals?.strongLevels || 0;
const topPairs = kpis?.signals?.topPairs || [];
const isReal = kpis?._realData === true;
const isUp = serviceStatus === 'ok' || serviceStatus === 'up';
return (
<Card className={`border-l-4 ${isUp ? 'border-l-screener' : 'border-l-danger'} transition-all duration-300 hover:-translate-y-1 hover:shadow-lg hover:shadow-screener/10`}>
<CardHeader>
<div className="flex items-start justify-between">
<div className="flex items-center gap-3">
<div className="p-3 rounded-xl bg-screener/20">
<TrendingUp className="w-6 h-6 text-screener" />
</div>
<div>
<CardTitle>Futures Screener</CardTitle>
<CardDescription>Order book density analysis</CardDescription>
</div>
</div>
<Badge variant={isUp ? 'success' : 'danger'}>
{isUp ? 'ONLINE' : 'OFFLINE'}
</Badge>
</div>
</CardHeader>
<CardContent>
<div className="grid grid-cols-3 gap-4">
<div className="bg-white/5 rounded-xl p-4 border border-white/5">
<div className="flex items-center gap-2 text-xs text-gray-400 uppercase mb-2">
<Database className="w-4 h-4" />
Symbols
</div>
<div className="text-2xl font-bold text-white">{totalSymbols}</div>
</div>
<div className="bg-white/5 rounded-xl p-4 border border-white/5">
<div className="flex items-center gap-2 text-xs text-gray-400 uppercase mb-2">
<Signal className="w-4 h-4" />
Levels
</div>
<div className="text-2xl font-bold text-white">{totalLevels}</div>
<div className="text-xs text-gray-500">density levels</div>
</div>
<div className="bg-white/5 rounded-xl p-4 border border-white/5">
<div className="flex items-center gap-2 text-xs text-gray-400 uppercase mb-2">
<TrendingUp className="w-4 h-4" />
Strong
</div>
<div className="text-2xl font-bold text-screener">{strongLevels}</div>
<div className="text-xs text-gray-500">score 70+</div>
</div>
</div>
{/* Top pairs */}
{topPairs.length > 0 && (
<div className="mt-4 flex flex-wrap gap-2">
{topPairs.map((pair: string) => (
<div key={pair} className="px-2 py-1 bg-screener/10 text-screener text-xs rounded-lg border border-screener/20">
{pair}
</div>
))}
</div>
)}
{!isReal && (
<div className="mt-3 text-xs text-gray-500 italic">No live data — service may be loading</div>
)}
</CardContent>
<CardFooter className="gap-2">
<Button variant="primary" size="sm" onClick={() => refetch()}>
<Activity className="w-4 h-4" />
Обновить
</Button>
<Button variant="ghost" size="sm" onClick={onViewDetails}>
Детали
</Button>
<Button variant="ghost" size="sm" onClick={onViewTasks}>
Задачи
</Button>
{onViewFiles && (
<Button variant="ghost" size="sm" onClick={onViewFiles}>
<FolderOpen className="w-4 h-4" />
Файлы
</Button>
)}
<Button
variant="ghost"
size="sm"
onClick={() => window.open('https://futures-screener.szhub.space', '_blank')}
>
<ExternalLink className="w-4 h-4" />
Open
</Button>
</CardFooter>
</Card>
);
}