Drop Target: Fix ResizeObserver error (#6201)

This commit is contained in:
zubiden 2025-09-09 20:26:21 +02:00 committed by Alexander Zinchuk
parent 36fc2acd48
commit c55334b642
2 changed files with 3 additions and 20 deletions

View File

@ -97,6 +97,7 @@
.title {
font-size: 1.3125rem;
font-weight: var(--font-weight-medium);
text-align: center;
letter-spacing: -0.18px;
@media (max-height: 450px) {
@ -106,6 +107,7 @@
.description {
font-size: 1rem;
text-align: center;
letter-spacing: 0.3px;
@media (max-height: 450px) {

View File

@ -4,11 +4,9 @@ import { memo, useRef } from '../../../lib/teact/teact';
import buildClassName from '../../../util/buildClassName';
import useEffectOnce from '../../../hooks/useEffectOnce';
import useFlag from '../../../hooks/useFlag';
import useLang from '../../../hooks/useLang';
import useLastCallback from '../../../hooks/useLastCallback';
import useResizeObserver from '../../../hooks/useResizeObserver';
import Icon from '../../common/icons/Icon';
@ -22,7 +20,6 @@ export type OwnProps = {
const DropTarget: FC<OwnProps> = ({ isQuick, isGeneric, onFileSelect }) => {
const ref = useRef<HTMLDivElement>();
const svgRef = useRef<SVGSVGElement>();
const lang = useLang();
@ -38,22 +35,6 @@ const DropTarget: FC<OwnProps> = ({ isQuick, isGeneric, onFileSelect }) => {
unmarkHovered();
});
const handleResize = useLastCallback(() => {
const svg = svgRef.current;
if (!svg) {
return;
}
const { width, height } = svg.getBoundingClientRect();
svg.viewBox.baseVal.width = width;
svg.viewBox.baseVal.height = height;
});
// Can't listen for SVG resize
useResizeObserver(ref, handleResize);
useEffectOnce(handleResize);
const className = buildClassName(
'DropTarget',
isHovered && 'hovered',
@ -68,7 +49,7 @@ const DropTarget: FC<OwnProps> = ({ isQuick, isGeneric, onFileSelect }) => {
onDragLeave={handleDragLeave}
data-dropzone
>
<svg className="target-outline-container" ref={svgRef}>
<svg className="target-outline-container">
<rect className="target-outline" x="0" y="0" width="100%" height="100%" rx="8" />
</svg>
<div className="target-content">