src/app/shop/[id]/page.tsx

@@ -37,9 +37,9 @@ function ProductDetailContent({ id }: { id: string }) {
     <div className="py-12 px-4">
       <div className="max-w-4xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-12">
         <div>
-          {product.images && product.images.length > 0 && (
+          {product.imageSrc && (
             <img
-              src={product.images[0]}
+              src={product.imageSrc}
               alt={product.name}
               className="w-full rounded-lg shadow-lg"
             />

src/app/shop/page.tsx

@@ -19,9 +19,9 @@ function ShopPageContent() {
           <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
             {products.map((product) => (
               <div key={product.id} className="bg-white rounded-lg shadow-md overflow-hidden">
-                {product.images && product.images.length > 0 && (
+                {product.imageSrc && (
                   <img
-                    src={product.images[0]}
+                    src={product.imageSrc}
                     alt={product.name}
                     className="w-full h-48 object-cover"
                   />