feat: implement variant selector panel

Signed-off-by: Chloe <pinkcloudvnn@gmail.com>

components/product/warranty.tsx

@@ -2,16 +2,12 @@ import { ShieldCheckIcon } from '@heroicons/react/24/outline';
 import Link from 'next/link';
 import WarrantySelector from './warranty-selector';
 
-type WarrantyProps = {
-  productType: string | null;
-};
-
-const Warranty = ({ productType }: WarrantyProps) => {
+const Warranty = () => {
   return (
     <div className="flex flex-col text-xs lg:text-sm">
       <div className="mb-3 flex flex-row items-center space-x-2 text-base font-medium">
         <ShieldCheckIcon className="h-7 w-7" />
-        <span> Protect your {productType ?? 'product'}</span>
+        <span> Protect your product</span>
       </div>
       <div className="mb-1 flex flex-row items-center space-x-1 divide-x divide-gray-400 leading-none lg:space-x-3">
         <span>Extended Warranty</span>