feat: first step of adding core charge functionality

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

components/product/product-description.tsx

@@ -1,22 +1,19 @@
 import { AddToCart } from 'components/cart/add-to-cart';
-import Price from 'components/price';
 import Prose from 'components/prose';
 import { Product } from 'lib/shopify/types';
 import { Suspense } from 'react';
+import PriceWithCoreCharge from './price-with-core-charge';
 import { VariantSelector } from './variant-selector';
 
 export function ProductDescription({ product }: { product: Product }) {
   return (
     <>
       <div className="mb-6 flex flex-col border-b pb-6 dark:border-neutral-700">
-        <h1 className="mb-2 text-4xl font-bold">{product.title}</h1>
-        <div className="mr-auto w-auto text-sm">
-          <Price
-            amount={product.priceRange.minVariantPrice.amount}
-            currencyCode={product.priceRange.minVariantPrice.currencyCode}
-            className="text-base font-semibold"
-          />
-        </div>
+        <h1 className="mb-3 text-4xl font-bold">{product.title}</h1>
+        <PriceWithCoreCharge
+          variants={product.variants}
+          defaultPrice={product.priceRange.minVariantPrice}
+        />
       </div>
       <Suspense fallback={null}>
         <VariantSelector options={product.options} variants={product.variants} />