{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "activity-feed-02",
  "dependencies": ["lucide-react"],
  "registryDependencies": [
    "button",
    "card",
    "https://dashboardblocks.com/r/activity-feed.json",
    "https://dashboardblocks.com/r/icon.json"
  ],
  "files": [
    {
      "path": "registry/components/dashboardblocks/activity-feed/activity-feed-02.tsx",
      "content": "import {\n  ActivityFeedContent,\n  ActivityFeedItem,\n  ActivityFeedTimeline,\n} from '@/registry/components/dashboardblocks/activity-feed'\nimport { Icon } from '@/registry/components/dashboardblocks/icon'\nimport {\n  AlertCircle,\n  ArrowRight,\n  CheckCircle2,\n  Clock,\n  LucideIcon,\n  Zap,\n} from 'lucide-react'\n\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'\n\ntype EventStatus = 'success' | 'progress' | 'error' | 'info'\n\ninterface DeploymentEvent {\n  id: number\n  title: string\n  description: string\n  time: string\n  status: EventStatus\n  icon: LucideIcon\n}\n\ninterface ActivityFeed02Props {\n  title: string\n  events: DeploymentEvent[]\n}\n\nconst statusStyles: Record<EventStatus, string> = {\n  success: 'border-green-500 bg-green-100 text-green-500',\n  progress: 'border-blue-500 bg-blue-100 text-blue-500',\n  error: 'border-red-500 bg-red-100 text-red-500',\n  info: 'border-purple-500 bg-purple-100 text-purple-500',\n}\n\nconst exampleProps: ActivityFeed02Props = {\n  title: 'Recent Deployments',\n  events: [\n    {\n      id: 1,\n      title: 'Deployment Successful',\n      description: 'Production v2.4.1 deployed to all regions',\n      time: '10:32 AM',\n      status: 'success',\n      icon: CheckCircle2,\n    },\n    {\n      id: 2,\n      title: 'Build Started',\n      description: 'Building production bundle...',\n      time: '10:30 AM',\n      status: 'progress',\n      icon: Clock,\n    },\n    {\n      id: 3,\n      title: 'Critical Alert',\n      description: 'CPU usage exceeded 90% threshold',\n      time: '9:15 AM',\n      status: 'error',\n      icon: AlertCircle,\n    },\n    {\n      id: 4,\n      title: 'Performance Optimized',\n      description: 'Cache hit rate improved by 23%',\n      time: '8:45 AM',\n      status: 'info',\n      icon: Zap,\n    },\n  ],\n}\n\nconst ActivityFeed02 = (props: ActivityFeed02Props) => {\n  const { title, events } = props\n  return (\n    <Card>\n      <CardHeader>\n        <CardTitle className='flex items-center justify-between'>\n          {title}\n          <Button variant='outline' size='sm'>\n            View all\n            <ArrowRight />\n          </Button>\n        </CardTitle>\n      </CardHeader>\n      <CardContent>\n        <ActivityFeedTimeline lineClassName='shadow-xs'>\n          {events.map((event) => {\n            const EventIcon = event.icon\n            return (\n              <ActivityFeedItem key={event.id}>\n                <Icon icon={EventIcon} size='md' className={statusStyles[event.status]} />\n                <ActivityFeedContent>\n                  <div className='space-y-1'>\n                    <p className='font-medium mb-0.5'>{event.title}</p>\n                    <p className='text-sm text-muted-foreground'>{event.description}</p>\n                  </div>\n                </ActivityFeedContent>\n                <span className='text-xs text-muted-foreground'>{event.time}</span>\n              </ActivityFeedItem>\n            )\n          })}\n        </ActivityFeedTimeline>\n      </CardContent>\n    </Card>\n  )\n}\n\nexport {\n  ActivityFeed02,\n  exampleProps as activityFeed02ExampleProps,\n  type ActivityFeed02Props,\n  type DeploymentEvent,\n  type EventStatus,\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}