"use client";
import { sliderProps } from "@/utility/sliderProps";
import { useEffect, useState } from "react";
import Slider from "react-slick";

function TestimonialAbout() {
  const [nav1, setNav1] = useState(null);
  const [nav2, setNav2] = useState(null);
  const [slider1, setSlider1] = useState(null);
  const [slider2, setSlider2] = useState(null);
  useEffect(() => {
    setNav1(slider1);
    setNav2(slider2);
  });

  const thumbs = {
    dots: false,
    arrows: false,
    speed: 800,
    autoplay: true,
    focusOnSelect: true,
    slidesToShow: 3,
    slidesToScroll: 1,
  };
  const slider = {
    arrows: false,
    dots: false,
    infinite: false,
    autoplay: true,
    speed: 500,
    fade: true,
    slidesToShow: 1,
    slidesToScroll: 1,
  };

  return (
    <section className="testimonials-five rel z-1 py-130 rpy-100">
      <div className="container rel">
        <div className="row text-center justify-content-center">
          <div className="col-xl-6 col-lg-7 col-md-8">
            <div
              className="section-title mb-50"
              data-aos="fade-up"
              data-aos-duration={1500}
              data-aos-offset={50}
            >
              <span className="sub-title mb-5">Customer Feedback</span>
              <h2>what our customer’s say us</h2>
            </div>
            {/* <Slider
              asNavFor={nav1}
              ref={(slider) => setSlider2(slider)}
              {...sliderProps.testimonialsFiveAuthors}
              className="testimonials-five-authors mb-20"
              data-aos="fade-up"
              data-aos-delay={50}
              data-aos-duration={1500}
              data-aos-offset={50}
            >
              <div className="testimonial-five-author-item">
                <img
                  src="assets/images/testimonials/testi-author-five1.jpg"
                  alt="Author"
                />
              </div>
              <div className="testimonial-five-author-item">
                <img
                  src="assets/images/testimonials/testi-author-five2.jpg"
                  alt="Author"
                />
              </div>
              <div className="testimonial-five-author-item">
                <img
                  src="assets/images/testimonials/testi-author-five3.jpg"
                  alt="Author"
                />
              </div>
              <div className="testimonial-five-author-item">
                <img
                  src="assets/images/testimonials/testi-author-five2.jpg"
                  alt="Author"
                />
              </div>
            </Slider> */}
            <Slider
              className="testimonials-five-content"
              asNavFor={nav2}
              ref={(slider) => setSlider1(slider)}
              {...sliderProps.testimonialsFiveContent}
              data-aos="fade-up"
              data-aos-delay={100}
              data-aos-duration={1500}
              data-aos-offset={50}
            >
              <div className="testimonial-five-item">
                <div className="text">
                  The food was exceptional, with the dosas being a particular highlight and deserving of strong recommendation. Their taste was remarkable, representing the best dosas in the entire KWC region. The staff provided polite and attentive service. While the quantity of chutneys and sauces could be improved, the overall dining experience was highly satisfactory.
                </div>
                <span className="author">Mohit</span>
                {/* <span className="designation">Manager</span> */}
              </div>
              <div className="testimonial-five-item">
                <div className="text">
                  We had a delightful experience at Shivas Dosa. The service was exceptional, and the food was amazing.The Mysore Bonda and Chicken 65 reminded me of Bangalore, and the Mutton Chukka and Biryani were top-notch.A special mention for Rajatha's humble and attentive service. I truly appreciate their wonderful service and incredible food. Highly recommended!
                </div>
                <span className="author">Anoop V</span>
                {/* <span className="designation">Manager</span> */}
              </div>
              <div className="testimonial-five-item">
                <div className="text">
                  I ordered two party trays of Ambur chicken biryani and one tray of chicken 65. The price was very reasonable compared to other restaurants in Kitchener and Cambridge. The taste was absolutely delicious, and the Ambur-style biryani was flavorful and authentic. The chicken 65 was crispy and well-seasoned. The service provided by Pungulali was excellent. Highly recommend this place for great food at a great price!
                </div>
                <span className="author">Ramesh Babu Gnana Kandan</span>
                {/* <span className="designation">Manager</span> */}
              </div>
              <div className="testimonial-five-item">
                <div className="text">
                  I had a great experience at Shiva Dosa Point today! I ordered Sambhar Idli, Chicken Kothu Parotta, and Coffee, and everything was delicious. The flavors were authentic, and the food was served fresh and hot. A special mention to Poonguzhali and Swetha for their excellent service—they were friendly, attentive, and made the dining experience even better. Definitely recommend this place for anyone craving good South Indian food!
                </div>
                <span className="author">Murali Krishna</span>
                {/* <span className="designation">Manager</span> */}
              </div>
              <div className="testimonial-five-item">
                <div className="text">
                    I had a wonderful experience at Shiva Dosa Restaurant! The food was absolutely delicious — authentic South Indian flavors served hot and fresh. We truly didn’t feel far from India. But what truly made our visit special was the outstanding service. A big thank you to Poonguzhali and Smriti, who were both incredibly attentive, kind, and professional throughout our meal. Their warm hospitality made us feel right at home. Highly recommend this place and their food.
                </div>
                <span className="author">Serah Benjamin</span>
                {/* <span className="designation">Manager</span> */}
              </div>

            </Slider>
          </div>
        </div>
        <div className="testimonials-five-shapes">
          <div
            className="shape left"
            data-aos="fade-left"
            data-aos-delay={150}
            data-aos-duration={1500}
            data-aos-offset={50}
          >
            <img
              src="/assets/images/about/fourth-section/left.webp"
              alt="Left" loading="lazy"
            />
          </div>
          <div
            className="shape right"
            data-aos="fade-right"
            data-aos-delay={150}
            data-aos-duration={1500}
            data-aos-offset={50}
          >
            <img
              src="/assets/images/about/fourth-section/right.webp"
              alt="right" loading="lazy"
            />
          </div>
        </div>
      </div>
      <div className="testimonials-shapes">
        <div className="shape one-1">
          <img
            src="/assets/images/about/fourth-section/bottom.webp"
            alt="Shape" loading="lazy"
          />
        </div>
        {/* <div className="shape three">
          <img
            src="/assets/images/about/fourth-section/testi-1.webp"
            alt="Shape"
          />
        </div> */}
        <div className="shape four">
          <img
            src="/assets/images/about/fourth-section/chicken-right.webp"
            alt="Shape" loading="lazy"
          />
        </div>
      </div>
    </section>
  );
}

export default TestimonialAbout;