Default Component - Copy this React, Tailwind Component to your project

<section-class="py-16">-<div-class="container-mx-auto-px-4">-<div-class="flex-justify-between-items-center-mb-12">-<div>-<h2-class="text-3xl-md:text-4xl-font-bold-text-gray-900">Featured-Products</h2>-<p-class="mt-4-text-gray-600">Handpicked-furniture-for-your-home</p>-</div>-<a-href="{{-route('products.index')-}}"-class="hidden-md:inline-flex-items-center-text-primary-600-hover:text-primary-700">-View-All-Products-<svg-class="w-5-h-5-ml-2"-fill="none"-stroke="currentColor"-viewBox="0-0-24-24">-<path-stroke-linecap="round"-stroke-linejoin="round"-stroke-width="2"-d="M17-8l4-4m0-0l-4-4m4-4H3"-/>-</svg>-</a>-</div>-<div-class="grid-grid-cols-1-sm:grid-cols-2-lg:grid-cols-4-gap-6">-@foreach-($featuredProducts-as-$product)-<a-href="{{-route('products.show',-$product->slug)-}}"-class="block-group">-<!---Tambahkan-link-di-sini--->-<div-class="relative-overflow-hidden-rounded-lg-aspect-square">-<img-src="{{-asset('storage/'-.-$product->image)-}}"-alt="{{-$product->name-}}"-class="w-full-h-full-object-cover-group-hover:scale-110-transition-duration-500">-@if-($product->sale_price)-<div-class="absolute-top-4-left-4-bg-red-500-text-white-px-3-py-1-rounded-full-text-sm">-Diskon-</div>-@endif-</div>-<div-class="mt-4">-<h3-class="text-lg-font-semibold-text-gray-900">{{-$product->name-}}</h3>-<p-class="text-sm-text-gray-500">{{-$product->category->name-}}</p>-<div-class="mt-2-flex-items-center-space-x-2">-@if-($product->sale_price)-<span-class="text-lg-font-bold-text-red-500">-Rp-{{-number_format($product->sale_price)-}}-</span>-<span-class="text-sm-text-gray-400-line-through">-Rp-{{-number_format($product->price)-}}-</span>-@else-<span-class="text-lg-font-bold-text-gray-900">-Rp-{{-number_format($product->price)-}}-</span>-@endif-</div>-</div>-</a>-@endforeach-</div>-<div-class="mt-8-text-center-md:hidden">-<a-href="{{-route('products.index')-}}"-class="inline-block-px-6-py-3-bg-primary-600-text-white-rounded-lg-hover:bg-primary-700">-View-All-Products-</a>-</div>-</div>-</section>-update