72 lines
3.1 KiB
TypeScript
72 lines
3.1 KiB
TypeScript
"use client"
|
|
|
|
export function RecentDevelopments() {
|
|
const developments = [
|
|
{
|
|
id: 1,
|
|
title: "European Registrations Plummet Despite EV Boom",
|
|
summary:
|
|
"Tesla registrations crashed 23% year-over-year in August across Europe to 14,831 units, while the broader European electric vehicle market surged 26%. European Automobile Manufacturers' Association data shows Tesla's eight-month European registration...",
|
|
timeAgo: "10 hours ago",
|
|
type: "negative",
|
|
avatar: "🇪🇺",
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Musk Acquires Billion-Dollar Stake After Compensation Vote",
|
|
summary:
|
|
"CEO Elon Musk purchased $1 billion worth of Tesla stock in mid-September, marking his first such acquisition since 2020. The move follows the board's proposed compensation package potentially worth $900 billion, which could make Musk the world's first...",
|
|
timeAgo: "4 hours ago",
|
|
type: "positive",
|
|
avatar: "💰",
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "CFO Taneja Divests Nearly Million Shares Recently",
|
|
summary:
|
|
"Tesla CFO Vaibhav Taneja sold shares worth approximately $918,000 in another recent divestment, marking the latest in a series of similar transactions over the past year. The sale occurs ahead of Tesla's November 5 annual shareholder meeting.",
|
|
timeAgo: "9 hours ago",
|
|
type: "neutral",
|
|
avatar: "👤",
|
|
},
|
|
]
|
|
|
|
return (
|
|
<div className="bg-card border border-border rounded-lg p-4">
|
|
<div className="flex items-center justify-between mb-4">
|
|
<h2 className="text-lg font-semibold">Recent Developments</h2>
|
|
<span className="text-sm text-muted-foreground">Updated 3 hours ago</span>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
|
{developments.map((item) => (
|
|
<div
|
|
key={item.id}
|
|
className="bg-accent/30 rounded-lg p-4 hover:bg-accent/50 transition-colors cursor-pointer"
|
|
>
|
|
<div className="flex items-start space-x-3 mb-3">
|
|
<div className="flex-shrink-0">
|
|
<div className="w-8 h-8 rounded-full bg-muted flex items-center justify-center text-sm">
|
|
{item.avatar}
|
|
</div>
|
|
</div>
|
|
<div className="flex-1 min-w-0">
|
|
<div className="flex items-center space-x-2 mb-1">
|
|
{item.type === "positive" && <div className="w-2 h-2 rounded-full bg-green-500"></div>}
|
|
{item.type === "negative" && <div className="w-2 h-2 rounded-full bg-red-500"></div>}
|
|
{item.type === "neutral" && <div className="w-2 h-2 rounded-full bg-gray-500"></div>}
|
|
<span className="text-xs text-muted-foreground">{item.timeAgo}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<h3 className="font-medium text-foreground mb-3 text-sm leading-tight">{item.title}</h3>
|
|
|
|
<p className="text-xs text-muted-foreground leading-relaxed line-clamp-4">{item.summary}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|