92 lines
2.7 KiB
TypeScript
92 lines
2.7 KiB
TypeScript
import { Card, CardContent } from "@/components/ui/card";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Link } from "react-router-dom";
|
|
|
|
export interface FeaturedUpdate {
|
|
title: string;
|
|
description: string;
|
|
date: string;
|
|
type: string;
|
|
isNew?: boolean;
|
|
}
|
|
|
|
const defaultUpdates: FeaturedUpdate[] = [
|
|
{
|
|
title: "New AI Integration Tutorials",
|
|
description: "Learn how to integrate cutting-edge AI features",
|
|
date: "2 days ago",
|
|
type: "Tutorial",
|
|
isNew: true,
|
|
},
|
|
{
|
|
title: "API v2.1 Documentation",
|
|
description: "Updated API docs with new endpoints and features",
|
|
date: "1 week ago",
|
|
type: "API",
|
|
},
|
|
{
|
|
title: "Performance Best Practices",
|
|
description: "New guide on optimizing application performance",
|
|
date: "2 weeks ago",
|
|
type: "Guide",
|
|
},
|
|
];
|
|
|
|
interface RecentUpdatesSectionProps {
|
|
updates?: FeaturedUpdate[];
|
|
showViewAll?: boolean;
|
|
}
|
|
|
|
export default function RecentUpdatesSection({
|
|
updates = defaultUpdates,
|
|
showViewAll = true,
|
|
}: RecentUpdatesSectionProps) {
|
|
return (
|
|
<div className="mb-12">
|
|
<div className="flex items-center justify-between mb-6">
|
|
<h3 className="text-2xl font-bold text-white">Recent Updates</h3>
|
|
{showViewAll && (
|
|
<Button
|
|
asChild
|
|
variant="outline"
|
|
size="sm"
|
|
className="border-slate-600 text-white hover:bg-slate-800"
|
|
>
|
|
<Link to="/changelog">View All Updates</Link>
|
|
</Button>
|
|
)}
|
|
</div>
|
|
<div className="space-y-4">
|
|
{updates.map((update, index) => (
|
|
<Card
|
|
key={index}
|
|
className="bg-slate-800/50 border-slate-700 hover:border-purple-500/50 transition-all duration-300 cursor-pointer"
|
|
>
|
|
<CardContent className="p-4">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<div className="flex items-center space-x-3 mb-2">
|
|
<h4 className="text-white font-medium">{update.title}</h4>
|
|
{update.isNew && (
|
|
<Badge className="bg-green-600 text-white text-xs">
|
|
New
|
|
</Badge>
|
|
)}
|
|
<Badge variant="outline" className="text-xs">
|
|
{update.type}
|
|
</Badge>
|
|
</div>
|
|
<p className="text-gray-400 text-sm">{update.description}</p>
|
|
</div>
|
|
<div className="text-right">
|
|
<p className="text-xs text-gray-500">{update.date}</p>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|