import React from 'react';
import blogImg1 from '../assets/images/blog/1.jpg';
import UseCaseData from '../Services/UseCaseData';
import Image from 'next/image';
import Link from 'next/link';


function UseCase() {

    var UseCaseDataResult = UseCaseData();

    return (
        <>
            <div className="row">
                {
                    UseCaseDataResult.map((i, index )=> {
                        var blgImg = i.meta_value != null ? "/images/" + i.meta_value : blogImg1;

                        return (
                            <div key={index} className="col-12 col-md-6 col-lg-4">
                                <div className="post-item-1">

                                    {<Image width='auto' height='auto' src={blgImg} alt={i.title} />}
                                    <div className="b-post-details">
                                        <h3>
                                            <Link href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
                                                {i.title}
                                            </Link>
                                        </h3>
                                        <Link className="read-more" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
                                            Learn more<i className="fal fa-arrow-right"></i>
                                        </Link>
                                    </div>

                                </div>
                            </div>

                        )

                    })
                }
            </div>
        </>
    );
}

export default UseCase;