import {
    createElement, //keep this createElement even we dont use it directly. bundler need it to bundle at run time
    Fragment, //keep this Fragment even we dont use it directly. bundler need it to bundle at run time
} from "@wordpress/element";
import { __ } from "@wordpress/i18n";
import Cards from "./Cards";
import { DocIcon, GroupIcon, LoveIcon, SupportIcon } from "../common/Icons";
import Banner from "./Banner";

const Welcome = () => {
    return (
        <>
            <Banner/>
            
            <div className="etafe-welcome">
                <div className="etafe-card-grid">
                    <Cards
                        icon={<SupportIcon/>}
                        title="Need Any Help?"
                        desc="If you encounter issues or need assistance, we're here to help or report specific problems on our support page."
                        buttonText="Create a Ticket"
                        link="https://rstheme.com/support"
                    />
                    <Cards
                        icon={<GroupIcon/>}
                        title="Join Our Community?"
                        desc="Join the Facebook community to discuss with fellow developers, connect with others, and stay updated."
                        buttonText="Join with us"
                        link="https://www.facebook.com/rstheme"
                    />
                    <Cards
                        icon={<DocIcon/>}
                        title="View Knowledge Base"
                        desc="Read comprehensive documentation & learn to build a website easily with Elentix Addons."
                        buttonText="Read Documentation"
                        link="https://rstheme.com/docs/elentix-addons"
                    />
                    <Cards
                        icon={<LoveIcon/>}
                        title="Show Your Love"
                        desc="We love having you in our Elentix Addons family every day. Please take 2 minutes to review us and show some love."
                        buttonText="Leave a Review"
                        link="#"
                    />
                </div>
            </div>
        </>
    );
}
export default Welcome;