diff --git a/static/src/js/__tests__/App.test.jsx b/static/src/js/__tests__/App.test.jsx index 51d615721d..1ff71081d6 100644 --- a/static/src/js/__tests__/App.test.jsx +++ b/static/src/js/__tests__/App.test.jsx @@ -2,11 +2,7 @@ import React from 'react' import nock from 'nock' import { Helmet } from 'react-helmet' -import { - render, - waitFor, - screen -} from '@testing-library/react' +import { render, waitFor } from '@testing-library/react' import * as AppConfig from '../../../../sharedUtils/config' import App from '../App' diff --git a/static/src/js/containers/MapContainer/MapEvents.jsx b/static/src/js/containers/MapContainer/MapEvents.jsx index a13bb11939..bcc6de9356 100644 --- a/static/src/js/containers/MapContainer/MapEvents.jsx +++ b/static/src/js/containers/MapContainer/MapEvents.jsx @@ -26,7 +26,6 @@ const MapEvents = (props) => { }) useEffect(() => { - // Handle map offset changes const handleMapOffsetChange = () => { map.invalidateSize() } diff --git a/static/src/js/containers/MapLayoutContainer/MapLayoutContainer.jsx b/static/src/js/containers/MapLayoutContainer/MapLayoutContainer.jsx index 2240b748f0..b3f8e5c808 100644 --- a/static/src/js/containers/MapLayoutContainer/MapLayoutContainer.jsx +++ b/static/src/js/containers/MapLayoutContainer/MapLayoutContainer.jsx @@ -1,4 +1,3 @@ -// MapLayoutContainer.jsx import React, { useEffect, useRef } from 'react' import PropTypes from 'prop-types' @@ -14,22 +13,18 @@ const MapLayoutContainer = ({ children, panelsRef }) => { let totalOffset = 0 - // Add sidebar width if available if (sidebarEl) totalOffset += sidebarEl.getBoundingClientRect().width + // Add panels width if panels are open if (panelEl && panelsSection?.classList.contains('panels--is-open')) { totalOffset += panelEl.getBoundingClientRect().width } - // Update the CSS variable on the container containerRef.current.style.setProperty('--map-offset', `${totalOffset}px`) - - // Dispatch the event window.dispatchEvent(new CustomEvent('mapOffsetChanged')) } } - // Initial calculation updateMapOffset() // Observe DOM mutations and resize events @@ -69,19 +64,14 @@ const MapLayoutContainer = ({ children, panelsRef }) => { } }, []) - // Convert children to an array for processing const childrenArray = React.Children.toArray(children) - // Process children to clone the SidebarContainer with the panelsRef. const processedChildren = childrenArray.map((child) => { - // Ensure the child is a valid React element if (React.isValidElement(child)) { - // If this element itself is the SidebarContainer, clone it with the ref if (child.type.displayName === 'SidebarContainer') { return React.cloneElement(child, { ref: panelsRef }) } - // Otherwise, if the element has children, process them recursively if (child.props && child.props.children) { const updatedChild = React.cloneElement(child, { children: React.Children.map(child.props.children, (subChild) => { @@ -112,11 +102,9 @@ const MapLayoutContainer = ({ children, panelsRef }) => { MapLayoutContainer.propTypes = { children: PropTypes.node.isRequired, - // PanelsRef is a ref that will be attached to the sidebar component panelsRef: PropTypes.oneOfType([ PropTypes.func, - // eslint-disable-next-line react/forbid-prop-types - PropTypes.shape({ current: PropTypes.any }) + PropTypes.shape({ current: PropTypes.instanceOf(HTMLDivElement) }) ]).isRequired }