| 39 | }; |
| 40 | |
| 41 | export function UserDropdownContent({ |
| 42 | adminHref, |
| 43 | displayName, |
| 44 | email, |
| 45 | handle, |
| 46 | onManageAccount, |
| 47 | onSignOut, |
| 48 | showAdmin, |
| 49 | unread, |
| 50 | }: UserDropdownContentProps) { |
| 51 | const t = useTranslations("header"); |
| 52 | const locale = useLocale(); |
| 53 | const currentLocale: Locale = hasLocale(locale) ? locale : "en"; |
| 54 | const href = (pathname: string) => withLocale(pathname, currentLocale); |
| 55 | |
| 56 | return ( |
| 57 | <> |
| 58 | {displayName ? ( |
| 59 | <DropdownMenuGroup> |
| 60 | <DropdownMenuLabel className="px-3 py-2"> |
| 61 | <div className="truncate text-sm font-medium text-foreground"> |
| 62 | {displayName} |
| 63 | </div> |
| 64 | {email && email !== displayName ? ( |
| 65 | <div className="truncate text-xs text-muted-3">{email}</div> |
| 66 | ) : null} |
| 67 | </DropdownMenuLabel> |
| 68 | </DropdownMenuGroup> |
| 69 | ) : null} |
| 70 | |
| 71 | <DropdownMenuSeparator /> |
| 72 | |
| 73 | <DropdownMenuGroup> |
| 74 | <DropdownMenuItem |
| 75 | render={<Link href={`/u/${handle}`} prefetch={false} />} |
| 76 | > |
| 77 | <IdentificationCardIcon weight="duotone" className="size-4" /> |
| 78 | {t("myProfile")} |
| 79 | </DropdownMenuItem> |
| 80 | <DropdownMenuItem |
| 81 | render={<Link href="/my-feedback" prefetch={false} />} |
| 82 | > |
| 83 | <ChatCircleDotsIcon weight="duotone" className="size-4" /> |
| 84 | {t("myFeedback")} |
| 85 | {unread > 0 ? ( |
| 86 | <span className="ml-auto rounded-full bg-brand-tint px-1.5 py-0.5 font-mono text-[9px] font-semibold text-brand dark:bg-brand-tint-dark"> |
| 87 | {unread > 9 ? "9+" : unread} |
| 88 | </span> |
| 89 | ) : null} |
| 90 | </DropdownMenuItem> |
| 91 | {showAdmin ? ( |
| 92 | <DropdownMenuItem render={<Link href={adminHref} prefetch={false} />}> |
| 93 | <ShieldCheckIcon weight="duotone" className="size-4" /> |
| 94 | {t("admin")} |
| 95 | </DropdownMenuItem> |
| 96 | ) : null} |
| 97 | </DropdownMenuGroup> |
| 98 | |