import React from 'react'

const SwiperButton = (props) => {
    const stringifiedProps = JSON.stringify(props);
    return (
        <>
            <button className={(stringifiedProps === "{}") ? `cust-swiper-button-prev relative border-0` : `${props?.prevEl} relative`} aria-label="Prev">
                <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M30 60C13.4315 60 0 46.5685 0 30C0 13.4315 13.4315 0 30 0C46.5685 0 60 13.4315 60 30C60 46.5685 46.5685 60 30 60Z" fill="#074E96" />
                    <path d="M23.3125 30.7185L28.3125 35.7185C28.5 35.906 28.75 35.9998 29 35.9998C29.2812 35.9998 29.5312 35.906 29.7188 35.7185C30.125 35.3435 30.125 34.6873 29.7188 34.3123L26.4375 30.9998H36C36.5625 30.9998 37 30.5623 37 29.9998C37 29.4685 36.5625 28.9998 36 28.9998H26.4375L29.7188 25.7185C30.125 25.3435 30.125 24.6873 29.7188 24.3123C29.3438 23.906 28.6875 23.906 28.3125 24.3123L23.3125 29.3123C22.9062 29.6873 22.9062 30.3435 23.3125 30.7185Z" fill="white" />
                </svg>


            </button>
            <button className={(stringifiedProps === "{}") ? `cust-swiper-button-next relative` : `${props?.nextEl} relative`} aria-label="Next">
                <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M30 60C46.5685 60 60 46.5685 60 30C60 13.4315 46.5685 0 30 0C13.4315 0 0 13.4315 0 30C0 46.5685 13.4315 60 30 60Z" fill="#074E96" />
                    <path d="M36.6875 30.7185L31.6875 35.7185C31.5 35.906 31.25 35.9998 31 35.9998C30.7188 35.9998 30.4688 35.906 30.2812 35.7185C29.875 35.3435 29.875 34.6873 30.2812 34.3123L33.5625 30.9998H24C23.4375 30.9998 23 30.5623 23 29.9998C23 29.4685 23.4375 28.9998 24 28.9998H33.5625L30.2812 25.7185C29.875 25.3435 29.875 24.6873 30.2812 24.3123C30.6562 23.906 31.3125 23.906 31.6875 24.3123L36.6875 29.3123C37.0938 29.6873 37.0938 30.3435 36.6875 30.7185Z" fill="white" />
                </svg>
            </button>
        </>
    )
}

export default SwiperButton