From 034010a1771236e266a4675fc669f68524fc8e03 Mon Sep 17 00:00:00 2001
From: morteza-mortezai <mrtz.mrtzi.1989@gmail.com>
Date: Fri, 26 Jun 2026 11:19:00 +0330
Subject: [PATCH] up

---
 src/assets/images/placeholder-product.svg |  6 ++++++
 src/pages/request/RequestDetail.tsx       | 14 ++++++++++++--
 2 files changed, 18 insertions(+), 2 deletions(-)
 create mode 100644 src/assets/images/placeholder-product.svg

diff --git a/src/assets/images/placeholder-product.svg b/src/assets/images/placeholder-product.svg
new file mode 100644
index 0000000..2c0018a
--- /dev/null
+++ b/src/assets/images/placeholder-product.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="86" height="86" viewBox="0 0 86 86" fill="none">
+  <rect width="86" height="86" fill="#F3F4F6"/>
+  <path d="M28 54L38 42L48 52L58 38L66 54H28Z" fill="#D1D5DB"/>
+  <circle cx="34" cy="32" r="5" fill="#D1D5DB"/>
+  <rect x="22" y="22" width="42" height="42" rx="4" stroke="#D1D5DB" stroke-width="2"/>
+</svg>
diff --git a/src/pages/request/RequestDetail.tsx b/src/pages/request/RequestDetail.tsx
index 9d1e3e7..04755b0 100644
--- a/src/pages/request/RequestDetail.tsx
+++ b/src/pages/request/RequestDetail.tsx
@@ -2,6 +2,7 @@ import { type FC } from 'react'
 import { useParams } from 'react-router-dom'
 import { useGetRequestDetails } from './hooks/useRequestData'
 import TicketSection from './components/TicketSection'
+import placeholderProductImage from '@/assets/images/placeholder-product.svg'
 
 const RequestDetail: FC = () => {
 
@@ -25,12 +26,21 @@ const RequestDetail: FC = () => {
                 <div className='flex flex-col gap-10'>
                     {
                         data?.data?.items?.map((item) => {
+                            const productImage = item.product?.images?.[0]
+
                             return (
                                 <div key={item.product.id}>
                                     <div className="flex items-center gap-6">
                                         {/* Product Image */}
-                                        <div className='size-[86px] rounded-lg overflow-hidden'>
-                                            <img src={item.product?.images?.[0]} className='size-full' />
+                                        <div className='size-[86px] rounded-lg overflow-hidden bg-gray-100'>
+                                            <img
+                                                src={productImage || placeholderProductImage}
+                                                alt={item.product?.title ?? 'محصول'}
+                                                className='size-full object-cover'
+                                                onError={(e) => {
+                                                    e.currentTarget.src = placeholderProductImage
+                                                }}
+                                            />
                                         </div>
 
                                         {/* Order Details */}