review

2026-07-17 10:18:55 +03:30
parent 7913c43bc0
commit 3e17cf9e12
13 changed files with 882 additions and 309 deletions
@@ -0,0 +1,76 @@
+import { type FC } from 'react'
+import { Star1, DocumentText, Like1, Dislike } from 'iconsax-react'
+import { useTranslation } from 'react-i18next'
+import type { ReviewDetail } from '../types/Types'
+
+interface ReviewContentSectionProps {
+    review: ReviewDetail
+}
+
+const ReviewContentSection: FC<ReviewContentSectionProps> = ({ review }) => {
+    const { t } = useTranslation('global')
+
+    return (
+        <div className='space-y-6'>
+            <div className='flex items-center gap-3 pb-6 border-b border-border'>
+                <div className='flex items-center gap-2'>
+                    <Star1 size={24} color="#FFB800" variant="Bold" />
+                    <span className='text-2xl font-semibold'>{review.rating}</span>
+                </div>
+                <span className='text-sm text-gray-500'>از ۵</span>
+            </div>
+
+            <div>
+                <div className='flex items-center gap-2 mb-4'>
+                    <DocumentText size={20} color="#8C90A3" />
+                    <span className='text-sm font-medium'>نظر</span>
+                </div>
+                <div className='bg-gray-50 rounded-xl p-4 border border-border'>
+                    <p className='text-sm leading-6 text-gray-700 whitespace-pre-wrap'>
+                        {review.comment || 'نظری ثبت نشده است'}
+                    </p>
+                </div>
+            </div>
+
+            {review.positivePoints && review.positivePoints.length > 0 && (
+                <div>
+                    <div className='flex items-center gap-2 mb-4'>
+                        <Like1 size={20} color="#22C55E" />
+                        <span className='text-sm font-medium'>نقاط مثبت</span>
+                    </div>
+                    <div className='flex flex-wrap gap-3'>
+                        {review.positivePoints.map((point, index) => (
+                            <span
+                                key={index}
+                                className='px-4 py-2 border border-green-500 text-green-600 rounded-xl text-sm bg-white'
+                            >
+                                {t(`reviews.${point}`)}
+                            </span>
+                        ))}
+                    </div>
+                </div>
+            )}
+
+            {review.negativePoints && review.negativePoints.length > 0 && (
+                <div>
+                    <div className='flex items-center gap-2 mb-4'>
+                        <Dislike size={20} color="#EF4444" />
+                        <span className='text-sm font-medium'>نقاط منفی</span>
+                    </div>
+                    <div className='flex flex-wrap gap-3'>
+                        {review.negativePoints.map((point, index) => (
+                            <span
+                                key={index}
+                                className='px-4 py-2 border border-red-500 text-red-600 rounded-xl text-sm bg-white'
+                            >
+                                {t(`reviews.${point}`)}
+                            </span>
+                        ))}
+                    </div>
+                </div>
+            )}
+        </div>
+    )
+}
+
+export default ReviewContentSection