Add icon support for tools and improve analytics chart display
Update API, database schema, and frontend components to allow optional icons for tools, and adjust analytics chart rendering for better visibility. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 776963d0-f75d-42e2-a57b-cc36bdff8495 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 0ad0b686-eebd-46d2-8314-67e9e874e224 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/0683fb79-a27c-485c-9333-5f4b288c4567/776963d0-f75d-42e2-a57b-cc36bdff8495/1p7jhzu Replit-Helium-Checkpoint-Created: true
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import { ToolWithStats } from "@workspace/api-client-react";
|
||||
import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from "@/components/ui/card";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Star, MessageSquare } from "lucide-react";
|
||||
import { Star, MessageSquare, Wrench } from "lucide-react";
|
||||
import { Link } from "wouter";
|
||||
|
||||
export function ToolCard({ tool }: { tool: ToolWithStats }) {
|
||||
@@ -9,9 +9,25 @@ export function ToolCard({ tool }: { tool: ToolWithStats }) {
|
||||
<Card className="hover-elevate transition-all flex flex-col h-full cursor-pointer hover:border-primary/50">
|
||||
<Link href={`/tools/${tool.id}`} className="flex flex-col h-full p-0 m-0">
|
||||
<CardHeader className="pb-3">
|
||||
<div className="flex justify-between items-start mb-2">
|
||||
<CardTitle className="text-lg line-clamp-1">{tool.name}</CardTitle>
|
||||
<Badge variant="outline" className="shrink-0">{tool.category}</Badge>
|
||||
<div className="flex items-start gap-3 mb-2">
|
||||
<div className="shrink-0 w-9 h-9 rounded-md border bg-muted flex items-center justify-center overflow-hidden">
|
||||
{tool.iconUrl ? (
|
||||
<img
|
||||
src={tool.iconUrl}
|
||||
alt={tool.name}
|
||||
className="w-full h-full object-contain p-0.5"
|
||||
onError={(e) => { (e.target as HTMLImageElement).style.display = "none"; }}
|
||||
/>
|
||||
) : (
|
||||
<Wrench className="w-4 h-4 text-muted-foreground" />
|
||||
)}
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex justify-between items-start gap-2">
|
||||
<CardTitle className="text-base line-clamp-1">{tool.name}</CardTitle>
|
||||
<Badge variant="outline" className="shrink-0 text-xs">{tool.category}</Badge>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<CardDescription className="line-clamp-2 min-h-[2.5rem]">
|
||||
{tool.description}
|
||||
|
||||
Reference in New Issue
Block a user