2026-01-14 13:47:03 +01:00

89 lines
2.5 KiB
TypeScript

import { useState } from 'react'
import { Card } from './ui'
import { useNostrAuth } from '@/hooks/useNostrAuth'
import { useArticlePublishing } from '@/hooks/useArticlePublishing'
import type { ArticleDraft } from '@/lib/articlePublisher'
import { ArticleEditorForm } from './ArticleEditorForm'
interface ArticleEditorProps {
onPublishSuccess?: (articleId: string) => void
onCancel?: () => void
seriesOptions?: { id: string; title: string }[]
onSelectSeries?: ((seriesId: string | undefined) => void) | undefined
defaultSeriesId?: string
}
function SuccessMessage(): React.ReactElement {
return (
<Card variant="default" className="bg-green-50 border-green-200">
<h3 className="text-lg font-semibold text-green-800 mb-2">Article Published!</h3>
<p className="text-green-700">Your article has been successfully published.</p>
</Card>
)
}
export function ArticleEditor({ onPublishSuccess, onCancel, seriesOptions, onSelectSeries, defaultSeriesId }: ArticleEditorProps): React.ReactElement {
const { connected, pubkey, connect } = useNostrAuth()
const { loading, error, success, relayStatuses, publishArticle } = useArticlePublishing(pubkey ?? null)
const [draft, setDraft] = useState<ArticleDraft>({
title: '',
preview: '',
content: '',
zapAmount: 800,
media: [],
...(defaultSeriesId ? { seriesId: defaultSeriesId } : {}),
})
const submit = buildSubmitHandler({
publishArticle,
draft,
...(onPublishSuccess ? { onPublishSuccess } : {}),
connect,
connected,
})
if (success) {
return <SuccessMessage />
}
return (
<ArticleEditorForm
draft={draft}
onDraftChange={setDraft}
onSubmit={(e) => {
e.preventDefault()
void submit()
}}
loading={loading}
error={error}
relayStatuses={relayStatuses}
{...(onCancel ? { onCancel } : {})}
{...(seriesOptions ? { seriesOptions } : {})}
{...(onSelectSeries ? { onSelectSeries } : {})}
/>
)
}
interface SubmitHandlerParams {
publishArticle: (draft: ArticleDraft) => Promise<string | null>
draft: ArticleDraft
onPublishSuccess?: (articleId: string) => void
connect?: () => Promise<void>
connected?: boolean
}
function buildSubmitHandler(
params: SubmitHandlerParams
): () => Promise<void> {
return async (): Promise<void> => {
if (!params.connected && params.connect) {
await params.connect()
return
}
const articleId = await params.publishArticle(params.draft)
if (articleId) {
params.onPublishSuccess?.(articleId)
}
}
}