2026-01-13 15:56:14 +01:00

63 lines
2.2 KiB
TypeScript

import Image from 'next/image'
import { t } from '@/lib/i18n'
import type { AuthorPresentationArticle } from '@/types/nostr'
export function AuthorPageHeader(params: { presentation: AuthorPresentationArticle | null }): React.ReactElement | null {
if (!params.presentation) {
return null
}
const authorName = getAuthorNameFromPresentationTitle(params.presentation.title)
return (
<div className="space-y-4 mb-8">
<div className="flex items-start gap-6">
<AuthorProfileImage bannerUrl={params.presentation.bannerUrl} />
<div className="flex-1 space-y-4">
<AuthorHeaderTitle authorName={authorName} />
<AuthorPresentationSection title={t('presentation.field.presentation')} text={params.presentation.description} />
<AuthorPresentationSection title={t('presentation.field.contentDescription')} text={params.presentation.contentDescription} />
</div>
</div>
</div>
)
}
function getAuthorNameFromPresentationTitle(title: string): string {
const trimmed = title.replace(/^Présentation de /, '').trim()
return trimmed.length > 0 ? trimmed : title
}
function AuthorProfileImage(params: { bannerUrl: string | undefined }): React.ReactElement | null {
if (!params.bannerUrl) {
return null
}
return (
<div className="relative w-32 h-32 rounded-lg overflow-hidden border border-neon-cyan/20 flex-shrink-0">
<Image src={params.bannerUrl} alt={t('author.profilePicture')} fill className="object-cover" />
</div>
)
}
function AuthorHeaderTitle(params: { authorName: string }): React.ReactElement {
return (
<div>
<h1 className="text-3xl font-bold text-neon-cyan mb-2">{params.authorName}</h1>
<p className="text-xs text-cyber-accent/60 italic mb-4">{t('author.profileNote')}</p>
</div>
)
}
function AuthorPresentationSection(params: { title: string; text: string | undefined }): React.ReactElement | null {
if (!params.text) {
return null
}
return (
<div className="space-y-2">
<h2 className="text-lg font-semibold text-neon-cyan">{params.title}</h2>
<div className="prose prose-invert max-w-none">
<p className="text-cyber-accent whitespace-pre-wrap">{params.text}</p>
</div>
</div>
)
}