add close btn to all tooltips

Vizzuality · Jan 15, 2024 · 8cb2ef0 · 8cb2ef0
1 parent 7c10e04
commit 8cb2ef0
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 10 deletions.
diff --git a/src/containers/map/index.tsx b/src/containers/map/index.tsx
@@ -36,6 +36,7 @@ import Legend from 'containers/map/legend';
 import MobileLegend from 'containers/map/mobile/legend';
 import RestorationPopup from 'containers/map/restoration-popup';
 
+import Icon from 'components/icon';
 import Map from 'components/map';
 import Controls from 'components/map/controls';
 import BasemapSettingsControl from 'components/map/controls/basemap-settings';
@@ -51,6 +52,8 @@ import Popup from 'components/popup';
 import { breakpoints } from 'styles/styles.config';
 import type { RestorationPopUp, PopUpKey, LocationPopUp } from 'types/map';
 
+import CLOSE_SVG from 'svgs/ui/close.svg?sprite';
+
 import LayerManager from './layer-manager';
 import LocationPopup from './location-pop-up';
 
@@ -379,10 +382,15 @@ const MapContainer = ({ mapId }: { mapId: string }) => {
                 latitude={locationPopUp?.popup[0]}
                 onClose={() => removePopup('location')}
               >
+                <button
+                  className="absolute -right-9 top-8 -right-[40px] h-11 w-10 cursor-pointer items-center justify-end rounded-r-[20px] bg-white/70 backdrop-blur-sm focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2"
+                  onClick={() => removePopup('location')}
+                >
+                  <Icon icon={CLOSE_SVG} className="ml-1 h-6 w-6" description="Close" />
+                </button>
                 {!isEmpty(locationPopUp?.info) ? (
                   <LocationPopup
                     locationPopUpInfo={locationPopUp}
-                    onClose={() => removePopup('location')}
                     className={cn({
                       '!w-[360px] rounded-3xl pt-6':
                         isEmpty(iucnEcoregionPopUp?.popupInfo) &&

diff --git a/src/containers/map/location-pop-up/index.tsx b/src/containers/map/location-pop-up/index.tsx
@@ -22,15 +22,15 @@ import CLOSE_SVG from 'svgs/ui/close.svg?sprite';
 const LocationPopUP = ({
   locationPopUpInfo,
   nonExpansible,
-  onClose,
+
   className,
 }: {
   locationPopUpInfo: {
     info: LocationPopUp;
     feature: MapboxGeoJSONFeature;
   };
   nonExpansible: boolean;
-  onClose: () => void;
+
   className?: string;
 }) => {
   const [open, setOpen] = useState(nonExpansible);
@@ -67,18 +67,12 @@ const LocationPopUP = ({
   return (
     <div
       className={cn({
-        'relative box-border  flex !w-[500px] cursor-pointer flex-col items-start rounded-t-3xl border-t border-slate-100 bg-white p-6 font-sans':
+        'box-border flex !w-[500px] cursor-pointer flex-col items-start rounded-t-3xl border-t border-slate-100 bg-white p-6 font-sans':
           true,
         'max-h-[86px] w-full overflow-hidden': !open,
         [className]: !!className,
       })}
     >
-      <button
-        className="absolute -right-9 top-8 -right-[40px] h-11 w-10 cursor-pointer items-center justify-end rounded-r-[20px] bg-white/70 backdrop-blur-sm focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2"
-        onClick={onClose}
-      >
-        <Icon icon={CLOSE_SVG} className="ml-1 h-6 w-6" description="Close" />
-      </button>
       <button
         className="flex w-full items-center justify-between"
         disabled={nonExpansible}