From 8965eb6dad8f9dc03e5f847f14d81795cc578f2c Mon Sep 17 00:00:00 2001
From: Kirill <mpak8501@yandex.ru>
Date: Fri, 15 May 2026 13:29:50 +0500
Subject: [PATCH] perf: use OptimizedImage in ReviewsBlock

---
 .../widgets/reviews-block/ui/ReviewsBlock.tsx | 20 ++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/client/src/widgets/reviews-block/ui/ReviewsBlock.tsx b/client/src/widgets/reviews-block/ui/ReviewsBlock.tsx
index 53d7bcd..c9a3ac0 100644
--- a/client/src/widgets/reviews-block/ui/ReviewsBlock.tsx
+++ b/client/src/widgets/reviews-block/ui/ReviewsBlock.tsx
@@ -11,6 +11,7 @@ import { useQuery } from '@tanstack/react-query'
 import { Link as RouterLink } from 'react-router-dom'
 import { fetchLatestApprovedReviews } from '@/entities/product/api/reviews-api'
 import { RichTextMessageContent } from '@/shared/ui/RichTextMessageContent'
+import { OptimizedImage } from '@/shared/ui/OptimizedImage'
 
 function initials(display: string) {
   const s = display.trim()
@@ -112,19 +113,28 @@ export function ReviewsBlock() {
                 </Stack>
                 {r.imageUrl && (
                   <Box
-                    component="img"
-                    src={r.imageUrl}
-                    alt="Фото к отзыву"
                     sx={{
                       mt: 1.5,
                       width: 120,
                       height: 120,
-                      objectFit: 'cover',
                       borderRadius: 1.5,
                       border: 1,
                       borderColor: 'divider',
+                      overflow: 'hidden',
                     }}
-                  />
+                  >
+                    <OptimizedImage
+                      src={r.imageUrl}
+                      alt="Фото к отзыву"
+                      widths={[120, 320]}
+                      sizes="120px"
+                      sx={{
+                        width: '100%',
+                        height: '100%',
+                        objectFit: 'cover',
+                      }}
+                    />
+                  </Box>
                 )}
               </Paper>
             )