Profile Card

1import { ProfileCoverPhoto } from './profile-cover-photo';
2import { ProfileDescription } from './profile-description';
3import { UserInfo } from './user-info';
4import { FollowButton } from './follow-button';
5import { MessageButton } from './message-button';
6import { ProfileStat } from './profile-stat';
7import { ProfileActions } from './profile-actions';
8import { cn } from '@/lib/utils/deso';
9import { ProfileTag } from './profile-tag';
10import { Calendar, LinkIcon, MapPin } from 'lucide-react';
11 
12export interface ProfileCardProps {
13  publicKey: string;
14  variant?: 'default' | 'compact';
15  showFeaturedImage?: boolean;
16  showFollowButton?: boolean;
17  showMessageButton?: boolean;  
18  showActionMenu?: boolean;
19  followButtonVariant?: 'default' | 'icon-only';
20  messageButtonVariant?: 'default' | 'icon-only';
21  className?: string;
22  showDescription?: boolean;
23  showTags?: boolean;
24  showStats?: boolean;
25}
26 
27export function ProfileCard({
28  publicKey,
29  variant = 'default',
30  showFeaturedImage = true,
31  showFollowButton = true,
32  showMessageButton = true,
33  showActionMenu = true,
34  followButtonVariant = 'default',
35  messageButtonVariant = 'default',
36  showDescription = true,
37  showTags = true,
38  showStats = true,
39  className,
40}: ProfileCardProps) {
41 
42  const profileTagList: Record<string, { icon: React.ReactNode, text: string, link?: string }> = {
43    location: {
44      icon: <MapPin className="size-3" />,
45      text: 'New York, NY',
46    },
47    website: {
48      icon: <LinkIcon className="size-3" />,
49      text: 'deso.com',
50      link: 'https://deso.com',
51    },
52    joined: {
53      icon: <Calendar className="size-3" />,
54      text: 'Joined June 2024',
55    },
56  }
57 
58  if (variant === 'compact') {
59    return (
60      <div
61        className={cn(
62          'w-full mx-auto bg-background rounded-lg overflow-hidden border border-border',
63          className
64        )}
65      >
66        <div className={cn('p-4 flex flex-col gap-4', className)}>
67          <div className="flex items-center justify-between gap-2">
68            <UserInfo
69              publicKey={publicKey}
70              pictureSize="sm"
71              isVerified={true}
72              showVerification
73              showPublicKey
74              className="z-10"
75            />
76            <div className="flex items-center gap-2">
77              {showActionMenu && <ProfileActions />}
78              {showMessageButton && <MessageButton variant={messageButtonVariant} showTooltip />}
79// … truncated