runfoo-org/elmeg-demo
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

M2: Enhanced empty states with icons, no emojis

Browse source
This commit is contained in:
fullsizemalt 2025-12-25 22:47:39 -08:00
parent 42926cd675
commit 0bfe25268c
2 changed files with 19 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontend/components/profile/user-attendance-list.tsx
View file

@ -1,7 +1,7 @@
"use client" "use client"
import { useEffect, useState } from "react" 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 { Calendar, MapPin } from "lucide-react"
import Link from "next/link" import Link from "next/link"
import { getApiUrl } from "@/lib/api-config" import { getApiUrl } from "@/lib/api-config"
@ -26,7 +26,14 @@ export function UserAttendanceList({ userId }: { userId: number }) {
if (loading) return <div>Loading attendance...</div> if (loading) return <div>Loading attendance...</div>
if (shows.length === 0) { 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 ( return (

11
frontend/components/profile/user-reviews-list.tsx
View file

@ -3,6 +3,7 @@
import { useEffect, useState } from "react" import { useEffect, useState } from "react"
import { ReviewCard } from "@/components/reviews/review-card" import { ReviewCard } from "@/components/reviews/review-card"
import { getApiUrl } from "@/lib/api-config" import { getApiUrl } from "@/lib/api-config"
import { PenLine } from "lucide-react"
export function UserReviewsList({ userId }: { userId: number }) { export function UserReviewsList({ userId }: { userId: number }) {
const [reviews, setReviews] = useState<any[]>([]) const [reviews, setReviews] = useState<any[]>([])
@ -24,7 +25,15 @@ export function UserReviewsList({ userId }: { userId: number }) {
if (loading) return <div>Loading reviews...</div> if (loading) return <div>Loading reviews...</div>
if (reviews.length === 0) { 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&apos;ve attended</p>
</div>
)
} }
return ( return (