diff --git a/public/app/features/explore-map/components/ExploreMapPanelContainer.tsx b/public/app/features/explore-map/components/ExploreMapPanelContainer.tsx index 796e6da8fc8..9eb316de364 100644 --- a/public/app/features/explore-map/components/ExploreMapPanelContainer.tsx +++ b/public/app/features/explore-map/components/ExploreMapPanelContainer.tsx @@ -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 >
-
Explore Panel {panel.id.slice(0, 8)}
+
+ {t('explore-map.panel.title', 'Explore Panel {{id}}', { id: panel.id.slice(0, 8) })} +
diff --git a/public/app/features/explore-map/components/ExploreMapPanelContent.tsx b/public/app/features/explore-map/components/ExploreMapPanelContent.tsx index 6d2ec5a3aa9..a41d3df1c49 100644 --- a/public/app/features/explore-map/components/ExploreMapPanelContent.tsx +++ b/public/app/features/explore-map/components/ExploreMapPanelContent.tsx @@ -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) { diff --git a/public/app/features/explore-map/components/ExploreMapToolbar.tsx b/public/app/features/explore-map/components/ExploreMapToolbar.tsx index 0756ab2cd4b..d89e9e98790 100644 --- a/public/app/features/explore-map/components/ExploreMapToolbar.tsx +++ b/public/app/features/explore-map/components/ExploreMapToolbar.tsx @@ -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]);