import React from 'react';
import { useNavigate } from 'react-router-dom';
import './ApartmentRentals.css';

function ApartmentRentals() {
    const navigate = useNavigate();

    const handleBookNowClick = () => {
        navigate('/apartment-list'); // Переход на страницу ApartmentList
    };

    return (
        <header className='apartment'>
            <img
                className='backround__section'
                src={process.env.PUBLIC_URL + '/images/Section.png'}
                alt='изображение'
            />
            <div className='Apartament__content'>
                <h1 className='heading'>Short-term and Long-term Apartment Rentals</h1>
                <p className='info'>Discover the perfect apartment for your needs, whether it's a quick stay or a long-term investment</p>
                <button
                    className='content__button'
                    onClick={handleBookNowClick}
                >
                    Book Now
                </button>
            </div>
        </header>
    );
}

export default ApartmentRentals;