import React from 'react'
import Link from 'next/link'
import Cases from '../../api/case';
import Image from 'next/image';
import image1 from '../../public/images/most important clients/1-1.PNG'
import image2 from '../../public/images/most important clients/1-2.PNG'
import image3 from '../../public/images/most important clients/1-3.jpg'
import image4 from '../../public/images/most important clients/1-4.PNG'
import image5 from '../../public/images/most important clients/1-5.PNG'
import image6 from '../../public/images/most important clients/1-6.jpg'
import image8 from '../../public/images/most important clients/1-8.PNG'
import image9 from '../../public/images/most important clients/1-9.PNG'
import image10 from '../../public/images/most important clients/ten.PNG'
import image11 from '../../public/images/most important clients/1-11.PNG'
import image12 from '../../public/images/most important clients/1-12.jpg'
import image13 from '../../public/images/most important clients/1-13.jpg'
import image14 from '../../public/images/most important clients/1-14.jpg'
import image15 from '../../public/images/most important clients/1-15.jpg'
import image16 from '../../public/images/most important clients/1-16.jpg'
import image17 from '../../public/images/most important clients/1-17.jpg'
import image18 from '../../public/images/most important clients/1-18.PNG'
import image19 from '../../public/images/most important clients/1-19.jpg'
import image20 from '../../public/images/most important clients/1-20.jpg'
import image21 from '../../public/images/most important clients/1-21.jpg'
import image22 from '../../public/images/most important clients/1-22.jpg'
import image23 from '../../public/images/most important clients/1-23.jpg'
import image24 from '../../public/images/most important clients/1-24.PNG'
import image25 from '../../public/images/most important clients/1-25.jpg'
import image26 from '../../public/images/most important clients/1-26.PNG'
import image27 from '../../public/images/most important clients/1-27.PNG'
import image28 from '../../public/images/most important clients/1-28.jpg'
import image29 from '../../public/images/most important clients/1-29.PNG'
import image30 from '../../public/images/most important clients/1-30.PNG';
import { useTranslations } from "next-intl";
const CaseStudies2 = (props) => {
    const t = useTranslations("Clinets");
    const imagesArray = [
        image1, image2, image3, image4, image5, image6, image8, image9, image10, image11, image12, image12, image13, image14, image15, image16, image17, image18, image19, image20, image21, image22, image23, image24, image25, image26, image27, image28, image29, image30,
    ]
    const ClickHandler = () => {
        window.scrollTo(10, 0);
    }


    return (
        <section className={`wpo-case-section-s2 ${props.cClass}`}>
            <div className="container">
                <div className="wpo-case-wrap">
                    <div className="sortable-gallery">
                        <div className="wpo-section-title-s2">
                            {/* <span>Here Our Best Work</span> */}
                            <h2>{t("most_important")}</h2>
                        </div>
                        <div className="case-grids gallery-container clearfix">
                            {imagesArray.map((img, i) => (
                                <div className="grid" key={i}>
                                    <div className="img-holder">
                                        <Image src={img} alt="most important customers" />
                                        <div className="hover-content">
                                            {/* <Link className="theme-btn-s2" onClick={ClickHandler} href={'/case/[slug]'} as={`/case/${cases.slug}`}>{cases.cTitle}</Link> */}
                                        </div>
                                    </div>
                                </div>
                            ))}
                        </div>
                    </div>
                </div>
            </div>
        </section>
    );
}

export default CaseStudies2;