M2: Enhanced empty states with icons, no emojis
This commit is contained in:
parent
42926cd675
commit
0bfe25268c
2 changed files with 19 additions and 3 deletions
|
|
@ -1,7 +1,7 @@
|
|||
"use client"
|
||||
|
||||
import { useEffect, useState } from "react"
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Card, CardContent } from "@/components/ui/card"
|
||||
import { Calendar, MapPin } from "lucide-react"
|
||||
import Link from "next/link"
|
||||
import { getApiUrl } from "@/lib/api-config"
|
||||
|
|
@ -26,7 +26,14 @@ export function UserAttendanceList({ userId }: { userId: number }) {
|
|||
if (loading) return <div>Loading attendance...</div>
|
||||
|
||||
if (shows.length === 0) {
|
||||
return <div className="text-muted-foreground">No shows attended yet.</div>
|
||||
return (
|
||||
<div className="text-center py-12">
|
||||
<Calendar className="h-12 w-12 text-muted-foreground/30 mx-auto mb-4" />
|
||||
<p className="text-muted-foreground font-medium">No shows attended yet</p>
|
||||
<p className="text-sm text-muted-foreground/70 mt-1">Mark shows as attended to track your concert history</p>
|
||||
<Link href="/shows" className="text-primary hover:underline text-sm mt-4 inline-block">Browse shows</Link>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
import { useEffect, useState } from "react"
|
||||
import { ReviewCard } from "@/components/reviews/review-card"
|
||||
import { getApiUrl } from "@/lib/api-config"
|
||||
import { PenLine } from "lucide-react"
|
||||
|
||||
export function UserReviewsList({ userId }: { userId: number }) {
|
||||
const [reviews, setReviews] = useState<any[]>([])
|
||||
|
|
@ -24,7 +25,15 @@ export function UserReviewsList({ userId }: { userId: number }) {
|
|||
if (loading) return <div>Loading reviews...</div>
|
||||
|
||||
if (reviews.length === 0) {
|
||||
return <div className="text-muted-foreground">No reviews written yet.</div>
|
||||
return (
|
||||
<div className="text-center py-12">
|
||||
<div className="h-12 w-12 rounded-full bg-muted/50 mx-auto mb-4 flex items-center justify-center">
|
||||
<PenLine className="h-6 w-6 text-muted-foreground/50" />
|
||||
</div>
|
||||
<p className="text-muted-foreground font-medium">No reviews written yet</p>
|
||||
<p className="text-sm text-muted-foreground/70 mt-1">Share your thoughts on shows you've attended</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue