fix(explore): link avatar and name to pet profile page
This commit is contained in:
1 parent
e5264e3ca3
commit
ac19d0fd2c
1 file changed
+12
-9
@@ -1,5 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { FollowButton } from "@/components/social/FollowButton";
|
||||
@@ -27,16 +28,18 @@ export function ExploreCard({ pet, activePetId }: ExploreCardProps) {
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center gap-2 p-3 rounded-xl border bg-card hover:bg-muted/50 transition-colors">
|
||||
<Avatar className="w-14 h-14">
|
||||
{avatarUrl && <AvatarImage src={avatarUrl} alt={pet.name} />}
|
||||
<AvatarFallback className="text-sm bg-muted">
|
||||
{pet.name[0]?.toUpperCase() ?? "?"}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<Link href={`/pets/${pet.id}`} className="flex flex-col items-center gap-2 w-full">
|
||||
<Avatar className="w-14 h-14">
|
||||
{avatarUrl && <AvatarImage src={avatarUrl} alt={pet.name} />}
|
||||
<AvatarFallback className="text-sm bg-muted">
|
||||
{pet.name[0]?.toUpperCase() ?? "?"}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
|
||||
<p className="text-sm font-medium text-center truncate max-w-full">
|
||||
{pet.name}
|
||||
</p>
|
||||
<p className="text-sm font-medium text-center truncate max-w-full">
|
||||
{pet.name}
|
||||
</p>
|
||||
</Link>
|
||||
|
||||
<Badge variant="secondary" className="text-xs">
|
||||
{labelName}
|
||||
|
||||
Reference in new issue
Block a user