import { useState } from 'react'
import { useNostrConnect } from '@/hooks/useNostrConnect'
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
}
function SuccessMessage() {
return (
Article Published!
Your article has been successfully published.
)
}
export function ArticleEditor({ onPublishSuccess, onCancel, seriesOptions, onSelectSeries }: ArticleEditorProps) {
const { connected, pubkey, connect } = useNostrConnect()
const { loading, error, success, publishArticle } = useArticlePublishing(pubkey ?? null)
const [draft, setDraft] = useState({
title: '',
preview: '',
content: '',
zapAmount: 800,
media: [],
})
const submit = buildSubmitHandler(publishArticle, draft, onPublishSuccess, connect, connected)
if (success) {
return
}
return (
{
e.preventDefault()
void submit()
}}
loading={loading}
error={error}
{...(onCancel ? { onCancel } : {})}
{...(seriesOptions ? { seriesOptions } : {})}
{...(onSelectSeries ? { onSelectSeries } : {})}
/>
)
}
function buildSubmitHandler(
publishArticle: (draft: ArticleDraft) => Promise,
draft: ArticleDraft,
onPublishSuccess?: (articleId: string) => void,
connect?: () => Promise,
connected?: boolean
) {
return async () => {
if (!connected && connect) {
await connect()
return
}
const articleId = await publishArticle(draft)
if (articleId) {
onPublishSuccess?.(articleId)
}
}
}