@@ -1,13 +1,12 @@
-import React, { useState } from 'react'
-import { ClickAwayListener, Tooltip, useMediaQuery } from '@mui/material'
+import React from 'react'
+import { Tooltip } from '@mui/material'
 
 interface Props {
 	title?: string
 	children: React.ReactNode
 	className?: string
 	maxWidth?: string
-	/** By default tooltip stops click propagation (useful inside buttons/menus). Set false when parent needs the click. */
-	stopClickPropagation?: boolean
+	wrapperWidth?: string
 	placement?:
 		| 'bottom-end'
 		| 'bottom-start'
@@ -21,49 +20,15 @@ interface Props {
 		| 'top-end'
 		| 'top-start'
 		| 'top'
-	/** Растянуть триггер на 100% ширины родителя (flex/grid + disabled-кнопка). */
-	fullWidthTrigger?: boolean
-	/** На устройствах без hover (тач) открывать/закрывать по нажатию, снаружи — закрытие. */
-	tapToOpenOnMobile?: boolean
 }
-/** Выше оверлеев модалок (см. template.module.scss — 9999) */
-const TOOLTIP_POPPER_Z_INDEX = 10050
-
-export const TooltipCustom: React.FC<Props> = ({
-	children,
-	title,
-	placement,
-	className,
-	maxWidth,
-	stopClickPropagation = true,
-	fullWidthTrigger = false,
-	tapToOpenOnMobile = false,
-}) => {
-	const isTouchPrimary = useMediaQuery('(hover: none)', { noSsr: true })
-	const tapMode = Boolean(tapToOpenOnMobile && isTouchPrimary)
-	const [tapOpen, setTapOpen] = useState(false)
-
-	const triggerSpanStyle: React.CSSProperties | undefined = fullWidthTrigger
-		? { display: 'flex', width: '100%', minWidth: 0 }
-		: undefined
-
-	const tooltip = (
+export const TooltipCustom: React.FC<Props> = ({ children, title, placement, className, maxWidth, wrapperWidth }) => {
+	return (
 		<Tooltip
-			open={tapMode ? tapOpen : undefined}
-			onClose={tapMode ? () => setTapOpen(false) : undefined}
-			disableHoverListener={tapMode}
-			disableFocusListener={tapMode}
-			disableTouchListener={tapMode}
-			onClick={stopClickPropagation ? (e: React.MouseEvent) => e.stopPropagation() : undefined}
+			onClick={(e) => e.stopPropagation()}
 			PopperProps={{
-				sx: { zIndex: TOOLTIP_POPPER_Z_INDEX },
-				...(stopClickPropagation
-					? {
-							onClick(e: React.MouseEvent) {
-								e.stopPropagation()
-							},
-						}
-					: {}),
+				onClick(e) {
+					e.stopPropagation()
+				},
 			}}
 			componentsProps={{
 				tooltip: {
@@ -86,21 +51,9 @@ export const TooltipCustom: React.FC<Props> = ({
 			arrow
 			placement={placement}
 		>
-			<span
-				style={triggerSpanStyle}
-				onClick={
-					tapMode
-						? (e) => {
-								if (stopClickPropagation) e.stopPropagation()
-								setTapOpen((v) => !v)
-						  }
-						: undefined
-				}
-			>
+			<div style={{ width: wrapperWidth, display: 'block' }}>
 				{children}
-			</span>
+			</div>
 		</Tooltip>
 	)
-
-	return tapMode ? <ClickAwayListener onClickAway={() => setTapOpen(false)}>{tooltip}</ClickAwayListener> : tooltip
 }
@@ -228,15 +228,19 @@ export const ImageMessagesList: React.FC<MessagesList> = memo(({ device, images,
 
 											<TooltipCustom
 												placement='right'
-												title={message.content.length > (device === 'mobile' ? 35 : 30) ? message.content : ''}
+												wrapperWidth={device === 'desktop' ? '250px' : '291px'}
+												title={message.content}
 											>
 												<Typography
 													onClick={() => message.content.length > 0 && onPromptClick?.(message.content)}
 													sx={{
 														fontSize: '15px',
-														maxWidth: device === 'desktop' ? '250px' : '100%',
+														width: '100%',
 														marginTop: '12px',
 														color: '#A4AAB5',
+														whiteSpace: 'nowrap',
+														overflow: 'hidden',
+														textOverflow: 'ellipsis',
 														cursor: onPromptClick && message.content.length > 0 ? 'pointer' : 'default',
 													}}
 												>
@@ -138,24 +138,27 @@ export const VideoMessagesList: React.FC<MessagesList> = memo(({ device, videos,
 											<TooltipCustom
 												key={message.uid}
 												placement='right'
-												title={message.content.length > 30 ? message.content : ''}
+												wrapperWidth={device === 'desktop' ? '250px' : '291px'}
+												title={message.content}
 											>
 												<Typography
 													onClick={() => message.content.length > 0 && onPromptClick?.(message.content)}
 													sx={{
 														fontSize: '15px',
-														maxWidth: device === 'desktop' ? '250px' : '100%',
+														width: '100%',
 														marginTop: '12px',
 														color: '#A4AAB5',
+														whiteSpace: 'nowrap',
+														overflow: 'hidden',
+														textOverflow: 'ellipsis',
 														cursor: onPromptClick && message.content.length > 0 ? 'pointer' : 'default',
 													}}
 												>
 													{!loadedVideos.has(message.uid)
 														? ''
 														: message.content.length > 0
-														? message?.content.replaceAll('"', '').slice(0, 27)
+														? message?.content.replaceAll('"', '')
 														: 'описание отсутствует'}
-													{message?.content.length > 27 && loadedVideos.has(message.uid) && '...'}
 												</Typography>
 											</TooltipCustom>
 										</Box>