import type { Article } from '@/types/nostr'
import type { ArticleDraft } from '@/lib/articlePublisherTypes'
import { EditPanel } from '../UserArticlesEditPanel'
import { UserArticlesView } from '../UserArticlesList'
import type { UserArticlesController } from './types'

type UserArticlesLayoutProps = {
  controller: UserArticlesController
  loading: boolean
  error: string | null
  showEmptyMessage: boolean
  currentPubkey: string | null
  onSelectSeries?: ((seriesId: string | undefined) => void) | undefined
}

export function UserArticlesLayout(props: UserArticlesLayoutProps): React.ReactElement {
  const { editPanelProps, listProps } = createLayoutProps(props.controller, props)
  return (
    <div className="space-y-4">
      <EditPanel {...editPanelProps} />
      <UserArticlesView {...listProps} />
    </div>
  )
}

function createLayoutProps(controller: UserArticlesController, view: UserArticlesLayoutProps): { editPanelProps: EditPanelProps; listProps: UserArticlesListProps } {
  return { editPanelProps: buildEditPanelProps(controller), listProps: buildListProps(controller, view) }
}

type EditPanelProps = {
  draft: ArticleDraft | null
  editingArticleId: string | null
  loading: boolean
  error: string | null
  onCancel: () => void
  onDraftChange: (draft: ArticleDraft) => void
  onSubmit: () => Promise<void>
}

function buildEditPanelProps(controller: UserArticlesController): EditPanelProps {
  return {
    draft: controller.editingDraft,
    editingArticleId: controller.editingArticleId,
    loading: controller.loading,
    error: controller.error,
    onCancel: controller.cancelEditing,
    onDraftChange: controller.updateDraft,
    onSubmit: controller.handleEditSubmit,
  }
}

type UserArticlesListProps = {
  articles: Article[]
  loading: boolean
  error: string | null
  showEmptyMessage: boolean
  unlockedArticles: Set<string>
  onUnlock: (article: Article) => void
  onEdit: (article: Article) => void
  onDelete: (article: Article) => void
  editingArticleId: string | null
  currentPubkey: string | null
  pendingDeleteId: string | null
  requestDelete: (articleId: string) => void
  onSelectSeries?: ((seriesId: string | undefined) => void) | undefined
}

function buildListProps(controller: UserArticlesController, view: UserArticlesLayoutProps): UserArticlesListProps {
  const handlers = buildUserArticlesHandlers(controller)
  return {
    articles: controller.localArticles,
    loading: view.loading,
    error: view.error,
    showEmptyMessage: view.showEmptyMessage,
    unlockedArticles: controller.unlockedArticles,
    onUnlock: handlers.onUnlock,
    onEdit: handlers.onEdit,
    onDelete: handlers.onDelete,
    editingArticleId: controller.editingArticleId,
    currentPubkey: view.currentPubkey,
    pendingDeleteId: controller.pendingDeleteId,
    requestDelete: controller.requestDelete,
    ...(view.onSelectSeries ? { onSelectSeries: view.onSelectSeries } : {}),
  }
}

function buildUserArticlesHandlers(controller: UserArticlesController): { onUnlock: (article: Article) => void; onEdit: (article: Article) => void; onDelete: (article: Article) => void } {
  return {
    onUnlock: (a: Article): void => void controller.handleUnlock(a),
    onEdit: (a: Article): void => void controller.startEditing(a),
    onDelete: (a: Article): void => void controller.handleDelete(a),
  }
}