story-research-zapwall/components/ArticlePreview.tsx
2026-01-14 00:34:36 +01:00

41 lines
1.3 KiB
TypeScript

import type { Article } from '@/types/nostr'
import { Button } from './ui'
import { ArticlePages } from './ArticlePages'
interface ArticlePreviewProps {
article: Article
loading: boolean
onUnlock: () => void
}
export function ArticlePreview({ article, loading, onUnlock }: ArticlePreviewProps): React.ReactElement {
if (article.paid) {
return (
<div>
<p className="mb-2 text-cyber-accent">{article.preview}</p>
<p className="text-sm text-cyber-accent/80 mt-4 whitespace-pre-wrap">{article.content}</p>
{article.pages && article.pages.length > 0 && <ArticlePages pages={article.pages} articleId={article.id} />}
</div>
)
}
return (
<div>
<p className="mb-4 text-cyber-accent">{article.preview}</p>
<div className="border-t border-neon-cyan/30 pt-4">
<p className="text-sm text-cyber-accent/70 mb-4">
Contenu complet disponible après un zap de {article.zapAmount} sats
</p>
<Button
variant="success"
onClick={onUnlock}
disabled={loading}
loading={loading}
>
{loading ? 'Traitement...' : `Débloquer avec ${article.zapAmount} sats zap`}
</Button>
</div>
</div>
)
}