/* eslint-disable @typescript-eslint/no-explicit-any */
import styles from "./suggestion.module.scss"
import { Link } from "@inertiajs/react"
import { BsArrowRight } from "react-icons/bs"

interface SuggestionProps {
  title: any;
  label: any;
  icon: any;
  path: any;
  type: any;
}

const Suggestion = ({ title, label, icon, path, type }: SuggestionProps) => {
  return (
    <Link href={`/${path}`} className={ type === "estate" ? styles["estate"] : type === "education" ? styles["education"] : styles["suggestion"] }>
        <div className={ styles["suggestion--left"] }>
            <h1>{ title }</h1>
            <div className={ styles["suggestion--left--btn"] }>{ label } <BsArrowRight /></div>
        </div>
        <img src={ icon } alt="thumbnail" />
    </Link>


    // <div className={ type === "estate" ? styles["estate"] : type === "education" ? styles["education"] : styles["suggestion"] }>
    //     <div className={ styles["suggestion--left"] }>
    //         <h1>{ title }</h1>
    //         <div className={ styles["suggestion--left--btn"] }>{ label } <BsArrowRight /></div>
    //     </div>
    //     <img src={ icon } alt="thumbnail" />
    // </div>
  )
}

export default Suggestion