Fix lint errors

This commit is contained in:
Aleksandar Petrov
2025-11-28 17:37:09 -04:00
parent ff28bcb0b2
commit 09d0deb180
3 changed files with 23 additions and 18 deletions
@@ -1,8 +1,9 @@
import { css, cx } from '@emotion/css';
import { useCallback, useRef } from 'react';
import { Rnd } from 'react-rnd';
import { DraggableData, Rnd, RndResizeCallback } from 'react-rnd';
import { GrafanaTheme2 } from '@grafana/data';
import { t } from '@grafana/i18n';
import { Button, useStyles2 } from '@grafana/ui';
import { useDispatch, useSelector } from 'app/types/store';
@@ -32,7 +33,7 @@ export function ExploreMapPanelContainer({ panel }: ExploreMapPanelContainerProp
const isSelected = selectedPanelId === panel.id;
const handleDragStop = useCallback(
(e: any, data: any) => {
(_e: MouseEvent | TouchEvent, data: DraggableData) => {
dispatch(
updatePanelPosition({
panelId: panel.id,
@@ -43,8 +44,8 @@ export function ExploreMapPanelContainer({ panel }: ExploreMapPanelContainerProp
[dispatch, panel.id]
);
const handleResizeStop = useCallback(
(e: any, direction: any, ref: any, delta: any, position: any) => {
const handleResizeStop: RndResizeCallback = useCallback(
(_e, _direction, ref, _delta, position) => {
const newWidth = ref.offsetWidth;
const newHeight = ref.offsetHeight;
@@ -108,7 +109,9 @@ export function ExploreMapPanelContainer({ panel }: ExploreMapPanelContainerProp
>
<div className={styles.panel}>
<div className={cx(styles.panelHeader, 'panel-drag-handle')}>
<div className={styles.panelTitle}>Explore Panel {panel.id.slice(0, 8)}</div>
<div className={styles.panelTitle}>
{t('explore-map.panel.title', 'Explore Panel {{id}}', { id: panel.id.slice(0, 8) })}
</div>
<div className={styles.panelActions}>
<Button
icon="copy"
@@ -116,9 +119,16 @@ export function ExploreMapPanelContainer({ panel }: ExploreMapPanelContainerProp
size="sm"
fill="text"
onClick={handleDuplicate}
tooltip="Duplicate panel"
tooltip={t('explore-map.panel.duplicate', 'Duplicate panel')}
/>
<Button
icon="times"
variant="secondary"
size="sm"
fill="text"
onClick={handleRemove}
tooltip={t('explore-map.panel.remove', 'Remove')}
/>
<Button icon="times" variant="secondary" size="sm" fill="text" onClick={handleRemove} tooltip="Remove" />
</div>
</div>
<div className={styles.panelContent}>
@@ -53,13 +53,12 @@ function patchGetBoundingClientRect() {
const style = window.getComputedStyle(element);
if (style.transform && style.transform !== 'none') {
// Use offsetWidth which is not affected by transforms
return {
...result,
width: this.offsetWidth,
height: this.offsetHeight,
right: result.left + this.offsetWidth,
bottom: result.top + this.offsetHeight,
} as DOMRect;
return new DOMRect(
result.left,
result.top,
this.offsetWidth,
this.offsetHeight
);
}
element = element.parentElement;
}
@@ -72,7 +71,6 @@ function patchGetBoundingClientRect() {
};
isPatched = true;
console.log('[ExploreMapPanelContent] Patched getBoundingClientRect for AutoSizer');
}
export function ExploreMapPanelContent({ exploreId, width, height }: ExploreMapPanelContentProps) {
@@ -47,11 +47,8 @@ export function ExploreMapToolbar() {
const handleResetZoom = useCallback(() => {
if (transformRef?.current) {
console.log('[ExploreMapToolbar] Resetting zoom, transformRef:', transformRef.current);
// Reset both scale and position to initial values
transformRef.current.setTransform(0, 0, 1, 200);
} else {
console.log('[ExploreMapToolbar] transformRef is null or current is not set');
}
}, [transformRef]);