import {Redirect, useRouter} from 'expo-router'

import {CrumbForm} from '@/components/composer'
import {useEditableDraft} from '@/hooks/use-editable-draft'

export default function ComposeScreen() {
  const router = useRouter()
  const {draft, submit, inferring} = useEditableDraft(null)
  if (!draft) return <Redirect href="/" />

  return (
    <CrumbForm
      draft={draft}
      title="New crumb"
      submitLabel="Drop crumb"
      inferring={inferring}
      onCancel={() => router.dismissAll()}
      onSubmit={async (fields) => {
        const created = await submit(fields)
        if (created) router.replace(`/crumb/${created.id}`)
        else router.dismissAll()
      }}
    />
  )
}
