From cdefc2166bc9263645ffc24e149a87fca5bbe3b4 Mon Sep 17 00:00:00 2001 From: JORGE Date: Thu, 13 Jun 2024 16:06:40 -0400 Subject: [PATCH 1/3] [TM-872] zoom to country of project and site if 0 polygons --- .../[uuid]/components/OverviewMapArea.tsx | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/src/pages/project/[uuid]/components/OverviewMapArea.tsx b/src/pages/project/[uuid]/components/OverviewMapArea.tsx index 6b93b3f21..5f94226af 100644 --- a/src/pages/project/[uuid]/components/OverviewMapArea.tsx +++ b/src/pages/project/[uuid]/components/OverviewMapArea.tsx @@ -7,6 +7,7 @@ import { MapContainer } from "@/components/elements/Map-mapbox/Map"; import { getPolygonsData } from "@/components/elements/Map-mapbox/utils"; import MapSidePanel from "@/components/elements/MapSidePanel/MapSidePanel"; import { APPROVED, DRAFT, NEEDS_MORE_INFORMATION, SUBMITTED } from "@/constants/statuses"; +import { fetchGetV2DashboardCountryCountry } from "@/generated/apiComponents"; import { SitePolygonsDataResponse } from "@/generated/apiSchemas"; import { useDate } from "@/hooks/useDate"; @@ -30,7 +31,19 @@ const OverviewMapArea = ({ entityModel, type }: EntityAreaProps) => { setEntityBbox(result.bbox as BBox); } }; - + const callCountryBBox = async () => { + let currentCountry = entityModel?.country; + if (type === "sites") { + currentCountry = entityModel?.project?.country; + } + const countryBbox = await fetchGetV2DashboardCountryCountry({ + pathParams: { country: currentCountry } + }); + if (Array.isArray(countryBbox.bbox) && countryBbox.bbox.length > 1) { + const bboxFormat = countryBbox.bbox[1] as unknown as BBox; + setEntityBbox(bboxFormat); + } + }; useEffect(() => { if (entityModel?.uuid) { const statusFilter = checkedValues.join(","); @@ -55,6 +68,7 @@ const OverviewMapArea = ({ entityModel, type }: EntityAreaProps) => { [NEEDS_MORE_INFORMATION]: [], [DRAFT]: [] }); + callCountryBBox(); } }, [polygonsData]); From c126251aa063c5cb79165a4085a5ca9eaaa3ffe8 Mon Sep 17 00:00:00 2001 From: JORGE Date: Thu, 13 Jun 2024 16:38:36 -0400 Subject: [PATCH 2/3] [TM-872] Add polygon empty modal --- src/components/elements/Map-mapbox/Map.tsx | 6 ++++++ .../Map-mapbox/MapControls/EmptyStateDisplay.tsx | 16 ++++++++++++++++ .../[uuid]/components/OverviewMapArea.tsx | 1 + 3 files changed, 23 insertions(+) create mode 100644 src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx diff --git a/src/components/elements/Map-mapbox/Map.tsx b/src/components/elements/Map-mapbox/Map.tsx index e2c411533..253897d82 100644 --- a/src/components/elements/Map-mapbox/Map.tsx +++ b/src/components/elements/Map-mapbox/Map.tsx @@ -21,6 +21,7 @@ import { BBox } from "./GeoJSON"; import type { TooltipType } from "./Map.d"; import CheckPolygonControl from "./MapControls/CheckPolygonControl"; import EditControl from "./MapControls/EditControl"; +import EmptyStateDisplay from "./MapControls/EmptyStateDisplay"; import { FilterControl } from "./MapControls/FilterControl"; import ImageControl from "./MapControls/ImageControl"; import PolygonCheck from "./MapControls/PolygonCheck"; @@ -78,6 +79,7 @@ interface MapProps extends Omit mapFunctions?: any; tooltipType?: TooltipType; sitePolygonData?: SitePolygonsDataResponse; + polygonsExists?: boolean; } export const MapContainer = ({ @@ -102,6 +104,7 @@ export const MapContainer = ({ showLegend = false, mapFunctions, tooltipType = "view", + polygonsExists = true, ...props }: MapProps) => { const [viewImages, setViewImages] = useState(false); @@ -291,6 +294,9 @@ export const MapContainer = ({ + + + ); }; diff --git a/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx b/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx new file mode 100644 index 000000000..bcf483b5f --- /dev/null +++ b/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx @@ -0,0 +1,16 @@ +import { useT } from "@transifex/react"; + +import Text from "../../Text/Text"; + +const EmptyStateDisplay = () => { + const t = useT(); + return ( +
+
+ {t("Polygons have not been created for this site")} +
+
+ ); +}; + +export default EmptyStateDisplay; diff --git a/src/pages/project/[uuid]/components/OverviewMapArea.tsx b/src/pages/project/[uuid]/components/OverviewMapArea.tsx index 5f94226af..dcfea510c 100644 --- a/src/pages/project/[uuid]/components/OverviewMapArea.tsx +++ b/src/pages/project/[uuid]/components/OverviewMapArea.tsx @@ -108,6 +108,7 @@ const OverviewMapArea = ({ entityModel, type }: EntityAreaProps) => { showLegend siteData={true} className="flex-1 rounded-r-lg" + polygonsExists={polygonsData.length > 0} /> ); From f6b523eb10e0da31c0fc913ac20ac6dc80dc1a2a Mon Sep 17 00:00:00 2001 From: Dotty Date: Thu, 13 Jun 2024 17:39:09 -0400 Subject: [PATCH 3/3] [TM-872] add style in EmptyStateDisplay --- .../Map-mapbox/MapControls/EmptyStateDisplay.tsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx b/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx index bcf483b5f..a60f68a88 100644 --- a/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx +++ b/src/components/elements/Map-mapbox/MapControls/EmptyStateDisplay.tsx @@ -5,9 +5,13 @@ import Text from "../../Text/Text"; const EmptyStateDisplay = () => { const t = useT(); return ( -
-
- {t("Polygons have not been created for this site")} +
+
+ + {t("Polygons have not been")} +
+ {t("created for this site")} +
);