import { Button } from "@mui/material"
import { useEffect, useState } from "react"
import { Link, useParams } from "react-router-dom"
import { gqlCategoryGoodsAndSubCategoryGoods } from "./actions/actions"

const CategoryOneMenu = ({category}) => {


    let categoryRender = (category) => {
        if (category) {
            return <Link key={category._id} to={`/category/${category._id}/${category.name}`}>{category?.name}</Link>
        }
        else return ""
    }
    
    return(
        <>
        <div className="categoryMenu">
        <ul>
            { category ? category.map(categoryRender) : "" }
        </ul>
        <Button variant="contained">Hello!</Button>
        </div>
        </>
    )
}

export default CategoryOneMenu