Add skeleton loading UI for better perceived performance

Replace "로딩 중..." text with animated skeleton placeholders in
RestaurantList, RestaurantDetail, and ReviewSection components.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
joungmin
2026-03-09 11:08:03 +09:00
parent 6c47d3c57d
commit 4d09be2419
5 changed files with 121 additions and 4 deletions

View File

@@ -2,18 +2,25 @@
import type { Restaurant } from "@/lib/api";
import { getCuisineIcon } from "@/lib/cuisine-icons";
import { RestaurantListSkeleton } from "@/components/Skeleton";
interface RestaurantListProps {
restaurants: Restaurant[];
selectedId?: string;
onSelect: (r: Restaurant) => void;
loading?: boolean;
}
export default function RestaurantList({
restaurants,
selectedId,
onSelect,
loading,
}: RestaurantListProps) {
if (loading) {
return <RestaurantListSkeleton />;
}
if (!restaurants.length) {
return (
<div className="p-4 text-center text-gray-500 text-sm">