[copy airbnb] 13、收藏夹屏幕（使用服务器组件加载收藏夹）Favorites screen (Loading favorites with server component)

import getCurrentUser from "../actions/getCurrentUser";
import getFavoriteLisings from "../actions/getFavoriteListings";
import ClientOnly from "../components/ClientOnly";
import EmptyState from "../components/EmptyState";
import FavoritesClient from "./FavoritesClient";

const ListingPage = async() => {
    const listings = await getFavoriteLisings();
    const currentUser = await getCurrentUser();

    if(listings.length === 0){
        return (
            <ClientOnly>
              <EmptyState
                title="No favorites found"
                subtitle="Looks like you have no favorite listings."
              ></EmptyState>
            </ClientOnly>
          );
    }

    return (
        <ClientOnly>
            <FavoritesClient
                listings={listings}
                currentUser={currentUser}
            >
            </FavoritesClient>

        </ClientOnly>
    );

};
export default ListingPage;

"use client";
import Container from "../components/Container";
import Heading from "../components/Heading";
import ListingCard from "../components/listings/ListingCard";
import { SafeListing, SafeUser } from "../types";

interface FavoritesClientProps {
  listings: SafeListing[];
  currentUser?: SafeUser | null;
}

const FavoritesClient: React.FC<FavoritesClientProps> = ({
  listings,
  currentUser,
}) => {
  return (
    <Container>
      <Heading
        title="Favorites"
        subtitle="List of places you have favorited!"
      ></Heading>
      <div className=" mt-10 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-8">
        {listings.map((listing) => (
          <ListingCard
            currentUser={currentUser}
            key={listing.id}
            data={listing}
          ></ListingCard>
        ))}
      </div>
    </Container>
  );
};
export default FavoritesClient;

import prisma from '@/app/libs/prismadb';
import getCurrentUser from "./getCurrentUser";

export default async function getFavoriteLisings(){
    try {
        const currentUser = await getCurrentUser();

        if(!currentUser){
            return [];
        }

        const favorites = await prisma.listing.findMany({
            where:{
                id:{
                    in:[...(currentUser.favoriteIds||[])]
                }
            }
        })

        const safeFavorites = favorites.map((favorite)=>({
            ...favorite,
            createdAt:favorite.createdAt.toISOString()
        }));

        return safeFavorites;
    } catch (error:any) {
        throw new Error(error);
    }
}