import Link from "next/link"
import { categories } from "@/data/categories";
import MenuItem from "./MenuItem";

export default function Menu(){
    const { all_category } = categories.product;

    return(
        <div className="global-menu-container text-16 leading-6 w-[135px]">
            <p className="group-title font-500 m-0 bg-[#003ED0] text-white cursor-pointer flex items-center justify-center gap-2 rounded-[30px] py-3">
                <i className="icons icon-menu"></i>  <span> Danh mục </span>
            </p>

            <div className="global-sub-container">
                <ul className="sub-container flex flex-col h-full">
                    <li className="item" data-id="1">
                        <Link href="/pc-workstation" className="cat-1 has-children"><i className="lazy cat-thumb" style={{ backgroundImage: 'url(https://hoanghapccdn.com/media/category/cat_icon_1_1761644653.png)' }}></i><span className="cat-title">PC Chuyên Dụng</span></Link><ul className="submenu sub-menu-logo"><li><Link href="/pc-photo-editing" className="cat-2 font-600">PC Photo Editing</Link><ul className="flex flex-wrap gap-2"><li><Link href="/designer-tool/adobe-photoshop"><img src="https://hoanghapc.vn/media/designer-tool/1.png" width="24" height="24" alt="Photoshop" loading="lazy" /></Link></li><li><Link href="/designer-tool/lightroom-classic"><img src="https://hoanghapc.vn/media/designer-tool/11.png" width="24" height="24" alt="lightroom" loading="lazy" /></Link></li><li><Link href="/designer-tool/stable-diffusion"><img src="https://hoanghapc.vn/media/designer-tool/15.png" width="24" height="24" alt="stable" loading="lazy" /></Link></li><li><Link href="/pc-photo-editing"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa.png" width="24" height="24" alt="PC Photo Editing" loading="lazy" /></Link></li><li><Link href="/pc-photo-editing"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-1.png" width="24" height="24" alt="PC Photo Editing" loading="lazy" /></Link></li></ul></li><li><Link href="/hhpc-3d-render" className="cat-2 font-600">PC Rendering</Link><ul className="flex flex-wrap gap-2"><li><Link href="/designer-tool/octane-render"><img src="https://hoanghapc.vn/media/designer-tool/26.png?1762573640" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/redshift"><img src="https://hoanghapc.vn/media/designer-tool/27.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/v-ray"><img src="https://hoanghapc.vn/media/designer-tool/28.png?1762573640" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/hhpc-3d-render"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/machine-learning-ai-tensorflow" className="cat-2 font-600">PC Machine Learning / AI</Link><ul className="flex flex-wrap gap-2"><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/static/assets/2025/images/AI1.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/static/assets/2025/images/AI2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/static/assets/2025/images/AI3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/media/lib/14-11-2025/pc-ai.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/media/lib/14-11-2025/pc-ai-3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/media/lib/14-11-2025/pc-ai-2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/machine-learning-ai-tensorflow"><img src="https://hoanghapc.vn/media/lib/14-11-2025/pc-ai-4.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/server-may-ao-gia-lap" className="cat-2 font-600">Server, Máy Ảo, Giả Lập</Link><ul className="flex flex-wrap gap-2"><li><Link href="/server-may-ao-gia-lap"><img src="https://hoanghapc.vn/static/assets/2025/images/servermayao1.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/server-may-ao-gia-lap"><img src="https://hoanghapc.vn/static/assets/2025/images/severmayao2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/server-may-ao-gia-lap"><img src="https://hoanghapc.vn/static/assets/2025/images/servermayao3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/server-may-ao-gia-lap"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/server-may-ao-gia-lap"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-1.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/server-may-ao-gia-lap"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/pc-architecture-cad" className="cat-2 font-600">PC Architecture, CAD</Link><ul className="flex flex-wrap gap-2"><li><Link href="/designer-tool/autocad"><img src="https://hoanghapc.vn/static/assets/2025/images/cad.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/inventor"><img src="https://hoanghapc.vn/media/designer-tool/29.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/revit"><img src="https://hoanghapc.vn/media/designer-tool/30.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/solidworks"><img src="https://hoanghapc.vn/media/designer-tool/31.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/pc-architecture-cad"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-1.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/pc-architecture-cad"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/pc-edit-render-video" className="cat-2 font-600">PC Video Editing</Link><ul className="flex flex-wrap gap-2"><li><Link href="/designer-tool/after-effect"><img src="https://hoanghapc.vn/media/designer-tool/3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/premiere-pro"><img src="https://hoanghapc.vn/media/designer-tool/10.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/davinci-resolve"><img src="https://hoanghapc.vn/media/designer-tool/16.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/foundry-nuke"><img src="https://hoanghapc.vn/media/designer-tool/17.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/hhpc-3d" className="cat-2 font-600">PC 3D Design, Animation</Link><ul className="flex flex-wrap gap-2"><li><Link href="/designer-tool/3ds-max"><img src="https://hoanghapc.vn/static/assets/2025/images/3Danimation.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/maya"><img src="https://hoanghapc.vn/static/assets/2025/images/3Danimation2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/blender"><img src="https://hoanghapc.vn/media/designer-tool/18.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/cnema-4d"><img src="https://hoanghapc.vn/media/designer-tool/19.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/hhpc-3d"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/hhpc-3d"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/hhpc-3d"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-1.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/pc-visualization" className="cat-2 font-600">PC Visualization</Link><ul className="flex flex-wrap gap-2"><li><Link href="/pc-visualization"><img src="https://hoanghapc.vn/static/assets/2025/images/Visualization.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/pc-visualization"><img src="https://hoanghapc.vn/static/assets/2025/images/Visualization2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/designer-tool/keyshot"><img src="https://hoanghapc.vn/media/designer-tool/25.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/pc-visualization"><img src="https://hoanghapc.vn/static/assets/2025/images/Visualization3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li><li><Link href="/pc-dep" className="cat-2 font-600">PC Đẹp</Link><ul className="flex flex-wrap gap-2"><li><Link href="/pc-dep"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/pc-dep"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-3.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li><li><Link href="/pc-dep"><img src="https://hoanghapc.vn/media/lib/14-11-2025/icon-pc-do-hoa-2.png" width="24" height="24" alt="logo" loading="lazy" /></Link></li></ul></li></ul>
                    </li>
                    
                    {
                        all_category
                            .filter( item => item.id != 1 )
                            .map( item => (
                                <MenuItem key={item.id} item={item} />
                            ))
                    }
                </ul>
            </div>
        </div> 
    )
}