Narrative Radar

const RadarTopicCard = ({ topic }) => (
  <Card className="radar-card hover:shadow-lg transition-shadow">
    <CardImage src={topic.thumbnail} alt={topic.title} />
    
    <CardContent>
      <div className="flex items-start justify-between">
        <h3 className="font-bold text-lg">{topic.title}</h3>
        <CredibilityBadge score={topic.credibilityScore} />
      </div>
      
      <p className="text-muted-foreground">{topic.description}</p>
      
      <div className="flex gap-2 flex-wrap mt-2">
        {topic.categories.map(cat => (
          <Badge variant="secondary">{cat}</Badge>
        ))}
      </div>
      
      <div className="flex items-center gap-4 mt-4 text-sm">
        <Metric icon="newspaper">{topic.sourceCount} sources</Metric>
        <Metric icon="warning">{topic.fallacyCount} fallacies</Metric>
        <Metric icon="clock">{formatRelativeTime(topic.updatedAt)}</Metric>
      </div>
    </CardContent>
    
    <CardFooter>
      <Button asChild className="w-full">
        <Link href={`/radar/${topic.id}`}>Explore Analysis</Link>
      </Button>
    </CardFooter>
  </Card>
);

const [selectedCategory, setSelectedCategory] = useState<string | null>(null);
const [minCredibility, setMinCredibility] = useState(0);
const [sortBy, setSortBy] = useState<'newest' | 'credibility' | 'engagement'>('newest');

const filteredTopics = topics
  .filter(t => !selectedCategory || t.categories.includes(selectedCategory))
  .filter(t => t.credibilityScore >= minCredibility)
  .sort((a, b) => {
    switch (sortBy) {
      case 'newest': return b.updatedAt - a.updatedAt;
      case 'credibility': return b.credibilityScore - a.credibilityScore;
      case 'engagement': return b.tweetCount - a.tweetCount;
    }
  });

interface RadarTopic {
  id: string;
  title: string;
  description: string;
  thumbnail: string;
  categories: string[];
  
  // Analysis data
  blueprint: ArgumentNode[];
  credibilityScore: number;
  fallacies: DetectedFallacy[];
  tweets: Tweet[];
  socialPulse: string;
  
  // Metadata
  sourceCount: number;
  fallacyCount: number;
  tweetCount: number;
  
  // Timestamps
  createdAt: Timestamp;
  updatedAt: Timestamp;
  
  // Curation
  curatedBy?: string; // Editor or "auto"
  featured: boolean; // Show in hero section
  archived: boolean; // Historical topic
}