import React from 'react';
import { useNavigate } from 'react-router-dom';
import { RegisterForm } from '../../components/domain/auth';
import { PublicLayout } from '../../components/layout';

const RegisterPage: React.FC = () => {
  const navigate = useNavigate();

  const handleRegistrationSuccess = () => {
    navigate('/app/onboarding');
  };

  const handleLoginClick = () => {
    navigate('/login');
  };

  return (
    <PublicLayout 
      variant="centered"
      maxWidth="xl"
      headerProps={{
        showThemeToggle: true,
        showAuthButtons: false,
        variant: "minimal"
      }}
    >
      <RegisterForm
        onSuccess={handleRegistrationSuccess}
        onLoginClick={handleLoginClick}
        className="mx-auto"
      />
    </PublicLayout>
  );
};

export default RegisterPage;