base commit

client/src/pages/me/ui/sections/OrderDetailPage.tsx

@@ -24,6 +24,7 @@ import { postProductReview, uploadReviewImage } from '@/entities/product/api/rev
 import { markOrderMessagesRead } from '@/entities/user/api/messages-api'
 import { formatPriceRub } from '@/shared/lib/format-price'
 import { orderStatusLabelRu } from '@/shared/lib/order-status-labels'
+import { RichTextMessageContent } from '@/shared/ui/RichTextMessageContent'
 import { RichTextMessageEditor } from '@/shared/ui/RichTextMessageEditor'
 
 function reviewSubmitErrorMessage(err: unknown): string {
@@ -95,6 +96,7 @@ export function OrderDetailPage() {
   })
 
   const order = orderQuery.data?.item
+  const canSendMessage = text.replace(/<[^>]*>/g, ' ').trim().length > 0
 
   const eligibilityQuery = useQuery({
     queryKey: ['me', 'orders', id, 'review-eligibility'],
@@ -322,12 +324,15 @@ export function OrderDetailPage() {
                   bgcolor: m.authorType === 'admin' ? 'grey.100' : 'primary.50',
                   border: 1,
                   borderColor: 'divider',
+                  alignSelf: m.authorType === 'admin' ? 'flex-start' : 'flex-end',
+                  width: 'fit-content',
+                  maxWidth: '85%',
                 }}
               >
                 <Typography variant="caption" color="text.secondary">
                   {m.authorType === 'admin' ? 'Админ' : 'Вы'} · {new Date(m.createdAt).toLocaleString()}
                 </Typography>
-                <Typography sx={{ whiteSpace: 'pre-wrap' }}>{m.text}</Typography>
+                <RichTextMessageContent value={m.text} />
               </Box>
             ))}
             {order.messages.length === 0 && <Typography color="text.secondary">Пока сообщений нет.</Typography>}
@@ -340,7 +345,7 @@ export function OrderDetailPage() {
             <Button
               variant="contained"
               onClick={() => msgMut.mutate()}
-              disabled={msgMut.isPending || !text.trim()}
+              disabled={msgMut.isPending || !canSendMessage}
               sx={{ minWidth: 160 }}
             >
               Отправить