import React from 'react';
import { useNavigate } from 'react-router-dom';
import OnboardingLayout from '../../components/shared/OnboardingLayout';
import { images } from '../../assets';

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

  const handleNext = () => {
    navigate('/onboarding/how-to');
  };

  const handleSkip = () => {
    localStorage.setItem('hasSeenOnboarding', 'true');
    navigate('/');
  };

  return (
    <OnboardingLayout
      title="Добро пожаловать в Sticker Generator"
      image={images.onboard1}
      description="Создавайте уникальные стикеры из ваших фотографий с помощью искусственного интеллекта"
      currentStep={1}
      totalSteps={3}
      primaryButtonText="Далее"
      secondaryButtonText="Пропустить"
      onPrimaryClick={handleNext}
      onSecondaryClick={handleSkip}
    />
  );
};

export default OnboardingWelcome;
