1  "use client";
 2  
 3  import {
 4    MagicTweet,
 5    TweetNotFound,
 6    TweetSkeleton,
 7  } from "./TweetCard";
 8  import { TweetProps, useTweet } from "react-tweet";
 9  
10  const ClientTweetCard = ({
11    id,
12    apiUrl,
13    fallback = <TweetSkeleton />,
14    components,
15    fetchOptions,
16    onError,
17    ...props
18  }: TweetProps & { className?: string }) => {
19    const { data, error, isLoading } = useTweet(id, apiUrl, fetchOptions);
20  
21    if (isLoading) return fallback;
22    if (error || !data) {
23      const NotFound = components?.TweetNotFound || TweetNotFound;
24      return <NotFound error={onError ? onError(error) : error} />;
25    }
26  
27    return <MagicTweet tweet={data} components={components} {...props} />;
28  };
29  
30  export default ClientTweetCard;