You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

42 lines
1.2 KiB

import { getCommunityDefinition } from '@/lib/event'
import { Event } from 'nostr-tools'
import { useMemo } from 'react'
import ClientSelect from '../ClientSelect'
import Image from '../Image'
export default function CommunityDefinition({
event,
className
}: {
event: Event
className?: string
}) {
const metadata = useMemo(() => getCommunityDefinition(event), [event])
const communityNameComponent = (
<div className="text-xl font-semibold line-clamp-1">{metadata.name}</div>
)
const communityDescriptionComponent = metadata.description && (
<div className="text-sm text-muted-foreground line-clamp-2">{metadata.description}</div>
)
return (
<div className={className}>
<div className="flex gap-4">
{metadata.image && (
<Image
image={{ url: metadata.image }}
className="rounded-lg aspect-square object-cover bg-foreground h-20"
hideIfError
/>
)}
<div className="flex-1 w-0 space-y-1">
{communityNameComponent}
{communityDescriptionComponent}
</div>
</div>
<ClientSelect className="w-full mt-2" event={event} />
</div>
)
}