From 563056e8064a131276ed1e09d02c7b69e7a42a5a Mon Sep 17 00:00:00 2001
From: Simao Rodrigues <arodrigues.simao@gmail.com>
Date: Wed, 8 Nov 2023 14:00:00 +0000
Subject: [PATCH 1/6] Attempt to fix initial data-tool layout fixes - details
 -panel

---
 frontend/src/containers/data-tool/content/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/containers/data-tool/content/index.tsx b/frontend/src/containers/data-tool/content/index.tsx
index c05e99ea..ee08a3f0 100644
--- a/frontend/src/containers/data-tool/content/index.tsx
+++ b/frontend/src/containers/data-tool/content/index.tsx
@@ -7,7 +7,7 @@ const DataToolContent: React.FC = () => {
   const [{ showDetails }] = useSyncDataToolContentSettings();
 
   return (
-    <div className="absolute h-full w-full">
+    <div className="relative h-full w-full">
       <Map />
       {showDetails && <Details />}
     </div>

From 4b4424746848757a544bb1e2e7ff575104a91ee4 Mon Sep 17 00:00:00 2001
From: Simao Rodrigues <arodrigues.simao@gmail.com>
Date: Wed, 8 Nov 2023 14:02:43 +0000
Subject: [PATCH 2/6] Fix DataTool details button padding on mobile

---
 .../src/containers/data-tool/sidebar/details-button/index.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/containers/data-tool/sidebar/details-button/index.tsx b/frontend/src/containers/data-tool/sidebar/details-button/index.tsx
index f3cab1ed..60475e59 100644
--- a/frontend/src/containers/data-tool/sidebar/details-button/index.tsx
+++ b/frontend/src/containers/data-tool/sidebar/details-button/index.tsx
@@ -12,7 +12,7 @@ const DetailsButton: React.FC = () => {
 
   return (
     <Button
-      className="flex justify-between"
+      className="flex justify-between px-5 md:px-8"
       variant="sidebar-details"
       size="full"
       onClick={handleButtonClick}

From 91af312b003b632e1f82a7522af01cba9245cbfa Mon Sep 17 00:00:00 2001
From: Simao Rodrigues <arodrigues.simao@gmail.com>
Date: Wed, 8 Nov 2023 14:24:54 +0000
Subject: [PATCH 3/6] Fix DataTool details tables overflow on desktop

---
 frontend/src/containers/data-tool/content/details/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/containers/data-tool/content/details/index.tsx b/frontend/src/containers/data-tool/content/details/index.tsx
index c959c473..cf12898b 100644
--- a/frontend/src/containers/data-tool/content/details/index.tsx
+++ b/frontend/src/containers/data-tool/content/details/index.tsx
@@ -30,7 +30,7 @@ const DataToolDetails: React.FC = () => {
   }, [location]);
 
   return (
-    <div className="overflow-none absolute h-full w-full bg-white px-4 py-4 md:px-6">
+    <div className="overflow-x-hidden overflow-y-scroll absolute h-full w-full bg-white px-4 py-4 md:px-6">
       <div className="mb-8 flex gap-8 md:justify-between">
         <span className="max-w-lg">
           <h2 className="text-4xl font-extrabold">{table.title}</h2>

From 87b2452b03545cd704c6461ce06397c9d34d12fd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez=20Mu=C3=B1oz?=
 <andres.gonzalez@vizzuality.com>
Date: Wed, 8 Nov 2023 16:54:14 +0100
Subject: [PATCH 4/6] fixes linting issue

---
 frontend/src/containers/data-tool/content/details/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/containers/data-tool/content/details/index.tsx b/frontend/src/containers/data-tool/content/details/index.tsx
index cf12898b..98ea3eb7 100644
--- a/frontend/src/containers/data-tool/content/details/index.tsx
+++ b/frontend/src/containers/data-tool/content/details/index.tsx
@@ -30,7 +30,7 @@ const DataToolDetails: React.FC = () => {
   }, [location]);
 
   return (
-    <div className="overflow-x-hidden overflow-y-scroll absolute h-full w-full bg-white px-4 py-4 md:px-6">
+    <div className="absolute h-full w-full overflow-x-hidden overflow-y-scroll bg-white px-4 py-4 md:px-6">
       <div className="mb-8 flex gap-8 md:justify-between">
         <span className="max-w-lg">
           <h2 className="text-4xl font-extrabold">{table.title}</h2>

From c2b56c5a2b975f084b6d43c3b9a02aac2aedf9d7 Mon Sep 17 00:00:00 2001
From: Simao Rodrigues <arodrigues.simao@gmail.com>
Date: Fri, 10 Nov 2023 11:07:12 +0000
Subject: [PATCH 5/6] Remove Sidebar from DataTool's map container - handled in
 the component above it

---
 frontend/src/containers/data-tool/content/map/index.tsx | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/frontend/src/containers/data-tool/content/map/index.tsx b/frontend/src/containers/data-tool/content/map/index.tsx
index cd65235d..4eb649aa 100644
--- a/frontend/src/containers/data-tool/content/map/index.tsx
+++ b/frontend/src/containers/data-tool/content/map/index.tsx
@@ -10,7 +10,6 @@ import { useQueryClient } from '@tanstack/react-query';
 import { useAtomValue, useSetAtom } from 'jotai';
 
 import Map, { ZoomControls, Attributions, DrawControls, Drawing } from '@/components/map';
-import SidebarContent from '@/components/sidebar-content';
 // import Popup from '@/containers/map/popup';
 import LabelsManager from '@/containers/data-tool/content/map/labels-manager';
 import LayersToolbox from '@/containers/data-tool/content/map/layers-toolbox';
@@ -163,9 +162,8 @@ const DataToolMap: React.FC = () => {
   }, [queryClient, locationCode, isSidebarOpen, map]);
 
   return (
-    <div className="absolute left-0 flex h-full w-full flex-col md:flex-row">
+    <div className="absolute left-0 h-full w-full">
       <Map
-        className="absolute left-0 w-full"
         initialViewState={{
           bounds,
           fitBoundsOptions: {
@@ -202,9 +200,6 @@ const DataToolMap: React.FC = () => {
           <Attributions />
         </>
       </Map>
-      <div className="h-1/2 flex-shrink-0 bg-white p-6 pb-3 md:hidden">
-        <SidebarContent />
-      </div>
     </div>
   );
 };

From 6afd60b35650025c66dcc1e6bd7d17029105d1a1 Mon Sep 17 00:00:00 2001
From: Simao Rodrigues <arodrigues.simao@gmail.com>
Date: Fri, 10 Nov 2023 11:16:05 +0000
Subject: [PATCH 6/6] Remove mentions to Sidebar from map; it is in a
 sub-component and doesn't need to worry about it

---
 .../containers/data-tool/content/map/index.tsx | 18 ++----------------
 1 file changed, 2 insertions(+), 16 deletions(-)

diff --git a/frontend/src/containers/data-tool/content/map/index.tsx b/frontend/src/containers/data-tool/content/map/index.tsx
index 4eb649aa..a35b13a5 100644
--- a/frontend/src/containers/data-tool/content/map/index.tsx
+++ b/frontend/src/containers/data-tool/content/map/index.tsx
@@ -15,7 +15,6 @@ import LabelsManager from '@/containers/data-tool/content/map/labels-manager';
 import LayersToolbox from '@/containers/data-tool/content/map/layers-toolbox';
 import { useSyncMapSettings } from '@/containers/data-tool/content/map/sync-settings';
 import { cn } from '@/lib/classnames';
-import { sidebarAtom } from '@/store/data-tool';
 import {
   drawStateAtom,
   layersInteractiveAtom,
@@ -38,7 +37,6 @@ const DataToolMap: React.FC = () => {
   const setPopup = useSetAtom(popupAtom);
   const queryClient = useQueryClient();
   const { locationCode } = useParams();
-  const isSidebarOpen = useAtomValue(sidebarAtom);
   const hoveredPolygonId = useRef<string | number | null>(null);
 
   const locationData = queryClient.getQueryData<LocationResponseDataObject>([
@@ -132,18 +130,6 @@ const DataToolMap: React.FC = () => {
 
   const bounds = customBbox ?? (locationData?.attributes?.bounds as LngLatBoundsLike);
 
-  useEffect(() => {
-    map?.easeTo({
-      padding: {
-        top: 0,
-        bottom: 0,
-        left: isSidebarOpen ? 430 : 0,
-        right: 0,
-      },
-      duration: 500,
-    });
-  }, [isSidebarOpen, map]);
-
   useEffect(() => {
     const { queryKey } = getGetLocationsQueryOptions();
     const d = queryClient.getQueryData<LocationListResponse>(queryKey);
@@ -154,12 +140,12 @@ const DataToolMap: React.FC = () => {
         padding: {
           top: 0,
           bottom: 0,
-          left: isSidebarOpen ? 430 : 0,
+          left: 0,
           right: 0,
         },
       });
     }
-  }, [queryClient, locationCode, isSidebarOpen, map]);
+  }, [queryClient, locationCode, map]);
 
   return (
     <div className="absolute left-0 h-full w-full">