import { RegisterAccountForm, useRegisterAccount } from '@/features/register-account'
import { routes } from '@/shared/config'
import { t } from '@/shared/i18n'
import { FormNavigation, Heading } from '@/shared/ui'
import { AuthPanel } from '@/widgets/auth-panel'

export function RegisterPage({ onSent }: { onSent: () => void }) {
  const model = useRegisterAccount(onSent)
  return (
    <AuthPanel
      heading={
        <Heading title={t('register.title')} step={t('register.step')} description={t('register.description')} />
      }
      notice={model.task.notice}
      footer={<FormNavigation prompt={t('register.prompt')} action={t('register.action')} to={routes.login} />}
    >
      <RegisterAccountForm model={model} />
    </AuthPanel>
  )
}