From 40eb7abd01ef4b8eb95c5b60e0dd01cf7af9a56f Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Mon, 28 Oct 2024 12:17:38 +0300 Subject: [PATCH 01/18] Fix navigation --- .../src/components/ExplorePage/index.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/apps/climatemappedafrica/src/components/ExplorePage/index.js b/apps/climatemappedafrica/src/components/ExplorePage/index.js index 4296a53b3..047b20921 100644 --- a/apps/climatemappedafrica/src/components/ExplorePage/index.js +++ b/apps/climatemappedafrica/src/components/ExplorePage/index.js @@ -80,7 +80,10 @@ function ExplorePage({ ]); useEffect(() => { if (geoCode) { - dispatch({ type: "fetch", payload: { code: geoCode } }); + dispatch({ + type: "fetch", + payload: { code: geoCode, onClick: handleClickTag }, + }); } }, [dispatch, geoCode]); @@ -94,7 +97,7 @@ function ExplorePage({ if (data) { dispatch({ type: "show", - payload: { profile: data, options: { onClick: handleClickTag } }, + payload: { profile: data, onClick: handleClickTag }, }); } }, [dispatch, data]); From 4413068d5938a367c1391447cbffcd6b7bc1b14a Mon Sep 17 00:00:00 2001 From: Kevin Koech Date: Mon, 28 Oct 2024 16:19:03 +0300 Subject: [PATCH 02/18] Added PanelItems options to Payloadcms --- .../src/lib/data/blockify/explore-page.js | 59 +++------ .../src/lib/data/common/index.js | 2 +- .../payload/globals/HURUMap/PanelOptions.js | 121 ++++++++++++++++++ .../src/payload/globals/HURUMap/index.js | 3 +- 4 files changed, 143 insertions(+), 42 deletions(-) create mode 100644 apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js diff --git a/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js b/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js index a08295a60..a78c8682e 100644 --- a/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js +++ b/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js @@ -6,6 +6,15 @@ import { async function explorePage({ block: { slugs }, hurumap }) { const { rootGeography, + align, + anchor, + lazyblock, + blockUniqueClass, + ghostkitSpacings, + ghostkitSR, + scrollToTopLabel, + dataNotAvailable, + items: panelItems, page: { value }, } = hurumap; const { code: name, rootGeographyHasData: pinRootGeography } = rootGeography; @@ -35,46 +44,16 @@ async function explorePage({ block: { slugs }, hurumap }) { // TODO: Move this to a PayloadCMS const panel = { - panelItems: [ - { - value: "rich-data", - icon: "https://cms.dev.codeforafrica.org/pesayetu/wp-content/uploads/sites/2/2021/11/Group-4505.svg", - iconProps: { - src: "https://cms.dev.codeforafrica.org/pesayetu/wp-content/uploads/sites/2/2021/11/Group-4505.svg", - width: 44, - height: 44, - type: "svg", - blurDataURL: - "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGElEQVR4nGNgQAP/T///f/o/jHMWiQMHACIVCyeABSwfAAAAAElFTkSuQmCC", - placeholder: "blur", - }, - }, - { - value: "pin", - icon: "https://cms.dev.codeforafrica.org/pesayetu/wp-content/uploads/sites/2/2022/01/Path-210-1-1.svg", - pin: true, - iconProps: { - src: "https://cms.dev.codeforafrica.org/pesayetu/wp-content/uploads/sites/2/2022/01/Path-210-1-1.svg", - width: 44, - height: 44, - type: "svg", - blurDataURL: - "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAH0lEQVR4nGNgQAP/L/z/f/r//4P/wZzT//+fBbOQAQBvnQ3r6iVM4QAAAABJRU5ErkJggg==", - placeholder: "blur", - }, - }, - ], - scrollToTopLabel: "Back To Top", - dataNotAvailable: "— DATA NOT AVAILABLE", - lazyblock: { - slug: "lazyblock/panel", - }, - align: "", - anchor: "", - blockId: "20amuc", - blockUniqueClass: "lazyblock-panel-20amuc", - ghostkitSpacings: "", - ghostkitSR: "", + panelItems, + scrollToTopLabel, + dataNotAvailable, + lazyblock, + align, + anchor, + blockId: "explore-page", + blockUniqueClass, + ghostkitSpacings, + ghostkitSR, }; const res = { id: "explore-page", diff --git a/apps/climatemappedafrica/src/lib/data/common/index.js b/apps/climatemappedafrica/src/lib/data/common/index.js index fb7918025..c1e0b3f8c 100644 --- a/apps/climatemappedafrica/src/lib/data/common/index.js +++ b/apps/climatemappedafrica/src/lib/data/common/index.js @@ -57,7 +57,7 @@ function getNavBar(siteSettings, variant, { slug }) { export async function getPageProps(api, context) { // For now, ClimatemappedAfrica only supports single paths i.e. /, /about, etc., // so params.slug[0] is good enough - const slugs = context.params?.slugs || undefined; + const slugs = context.params?.slugs || ["index"]; const [slug] = slugs || ["index"]; const { draftMode = false } = context; const options = { draft: draftMode }; diff --git a/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js b/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js new file mode 100644 index 000000000..c3135fe24 --- /dev/null +++ b/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js @@ -0,0 +1,121 @@ +import image from "../../fields/image"; + +const PanelOptions = { + label: "Panel Options", + fields: [ + { + name: "items", + type: "array", + label: "Panel Items", + fields: [ + { + type: "select", + name: "value", + label: "Value", + options: [ + { value: "rich-data", label: "Rich Data" }, + { value: "pin", label: "Pin" }, + ], + localized: true, + }, + image({ + overrides: { + name: "icon", + required: true, + }, + }), + ], + }, + { + type: "row", + fields: [ + { + name: "scrollToTopLabel", + type: "text", + label: "Scroll To Top Label", + defaultValue: "Scroll To Top", + admin: { + width: "50%", + }, + localized: true, + }, + { + name: "dataNotAvailable", + type: "text", + label: "Data Not Available", + defaultValue: "DATA NOT AVAILABLE", + admin: { + width: "50%", + }, + localized: true, + }, + { + name: "align", + type: "text", + label: "Align", + localized: true, + defaultValue: "", + admin: { + width: "50%", + }, + }, + { + name: "anchor", + type: "text", + label: "Anchor", + localized: true, + defaultValue: "", + admin: { + width: "50%", + }, + }, + { + name: "blockUniqueClass", + type: "text", + label: "Block Unique Class", + defaultValue: "lazyblock-panel-20amuc", + localized: true, + admin: { + width: "50%", + }, + }, + { + name: "ghostkitSpacings", + type: "text", + label: "Ghostkit Spacings", + defaultValue: "", + localized: true, + admin: { + width: "50%", + }, + }, + { + name: "ghostkitSR", + type: "text", + label: "Ghostkit SR", + localized: true, + defaultValue: "", + admin: { + width: "50%", + }, + }, + ], + }, + { + name: "lazyblock", + type: "group", + label: "Lazy Block", + fields: [ + { + name: "slug", + type: "text", + label: "Slug", + defaultValue: "lazyblock/panel", + localized: true, + }, + ], + }, + ], +}; + +export default PanelOptions; diff --git a/apps/climatemappedafrica/src/payload/globals/HURUMap/index.js b/apps/climatemappedafrica/src/payload/globals/HURUMap/index.js index 245ab94d8..d4f24a51e 100644 --- a/apps/climatemappedafrica/src/payload/globals/HURUMap/index.js +++ b/apps/climatemappedafrica/src/payload/globals/HURUMap/index.js @@ -1,4 +1,5 @@ import Geography from "./Geography"; +import PanelOptions from "./PanelOptions"; import Profile from "./Profile"; import Tutorial from "./Tutorial"; @@ -22,7 +23,7 @@ const HURUMap = { }, { type: "tabs", - tabs: [Profile, Geography, Tutorial], + tabs: [Profile, Geography, Tutorial, PanelOptions], admin: { condition: (_, siblingData) => !!siblingData?.enableHURUMap, }, From e6b3e452e9a83336bd6ec1762137f0f7d9d4eb86 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Tue, 29 Oct 2024 14:02:50 +0300 Subject: [PATCH 03/18] Fix location search --- .../DropdownSearch/DownloadSearch.js | 26 ++++++++++--------- .../Navigation/ExploreNavigation/index.js | 5 ++-- .../src/lib/data/common/index.js | 7 +++-- 3 files changed, 22 insertions(+), 16 deletions(-) diff --git a/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js b/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js index dc9f31362..a0ed0598f 100644 --- a/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js +++ b/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js @@ -16,7 +16,7 @@ import Link from "@/climatemappedafrica/components/Link"; function DropdownSearch({ href: hrefProp = "/explore", - label = "Search for a location", + label, locations, onClick, icon: IconProp = SearchIcon, @@ -97,15 +97,17 @@ function DropdownSearch({ return ( - ({ - color: palette.text.primary, - marginBottom: typography.pxToRem(10), - })} - > - {label} - + {label && ( + ({ + color: palette.text.primary, + marginBottom: typography.pxToRem(10), + })} + > + {label} + + )} ({ }, })); -function ExploreNavigation({ explorePagePath, logo, variant }) { +function ExploreNavigation({ explorePagePath, locations, logo, variant }) { const classes = useStyles(); const { setIsOpen } = useTour(); @@ -72,8 +72,9 @@ function ExploreNavigation({ explorePagePath, logo, variant }) { Date: Tue, 29 Oct 2024 14:07:17 +0300 Subject: [PATCH 04/18] Fix btn size Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> --- .../src/components/DropdownSearch/DownloadSearch.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js b/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js index a0ed0598f..7947622e2 100644 --- a/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js +++ b/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js @@ -87,8 +87,8 @@ function DropdownSearch({ component={iconComponent} viewBox="0 0 48 48" sx={{ - width: 48, - height: 48, + width: 40, + height: 40, ...iconBorder, }} /> From ae55079f2373c155b395012c39ff290b20717d2e Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Tue, 29 Oct 2024 17:16:35 +0300 Subject: [PATCH 05/18] Regenerate snapshot Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> --- .../src/components/DropdownSearch/DropdownSearch.snap.js | 4 ++-- apps/climatemappedafrica/src/components/Hero/Hero.snap.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/climatemappedafrica/src/components/DropdownSearch/DropdownSearch.snap.js b/apps/climatemappedafrica/src/components/DropdownSearch/DropdownSearch.snap.js index d8dd3412a..06576c3fb 100644 --- a/apps/climatemappedafrica/src/components/DropdownSearch/DropdownSearch.snap.js +++ b/apps/climatemappedafrica/src/components/DropdownSearch/DropdownSearch.snap.js @@ -12,7 +12,7 @@ exports[` renders unchanged 1`] = ` Search for a location

renders unchanged 1`] = ` > diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js index e94a3de38..3f70167fe 100644 --- a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js +++ b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js @@ -60,7 +60,7 @@ exports[` renders unchanged 1`] = `
@@ -80,7 +80,7 @@ exports[` renders unchanged 1`] = ` > From d607fdda01c0094773fc8b8c64a3938ca7cd5a96 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Wed, 30 Oct 2024 09:15:43 +0300 Subject: [PATCH 06/18] Deploy --- .github/workflows/climatemappedafrica-deploy-dev.yml | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/.github/workflows/climatemappedafrica-deploy-dev.yml b/.github/workflows/climatemappedafrica-deploy-dev.yml index 285b91405..456a1dfaa 100644 --- a/.github/workflows/climatemappedafrica-deploy-dev.yml +++ b/.github/workflows/climatemappedafrica-deploy-dev.yml @@ -2,7 +2,7 @@ name: Climate Mapped Africa | Deploy | DEV on: push: - branches: [main] + branches: [ft/climatemapped-hurumap-fixes] paths: - "apps/climatemappedafrica/**" - "Dockerfile" @@ -33,6 +33,10 @@ jobs: with: fetch-depth: 0 + # Add support for more platforms with QEMU (optional) + - name: Set up QEMU + uses: docker/setup-qemu-action@v3 + - name: Set up Docker Buildx uses: docker/setup-buildx-action@v2 @@ -61,6 +65,7 @@ jobs: cache-from: type=local,src=/tmp/.buildx-cache cache-to: type=local,dest=/tmp/.buildx-cache-new context: . + platforms: linux/arm64 target: climatemappedafrica-runner push: true tags: "${{ env.IMAGE_NAME }}:${{ github.sha }}" From 46daf83952e406703780a36fc21c52b8ebb03ea9 Mon Sep 17 00:00:00 2001 From: Kevin Koech Date: Wed, 30 Oct 2024 14:34:10 +0300 Subject: [PATCH 07/18] Update Hero component to match designs --- apps/climatemappedafrica/src/components/Hero/Hero.js | 12 ++++++------ apps/climatemappedafrica/src/components/Hero/Map.js | 8 ++++---- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.js b/apps/climatemappedafrica/src/components/Hero/Hero.js index 8b761f8dc..989c485e2 100644 --- a/apps/climatemappedafrica/src/components/Hero/Hero.js +++ b/apps/climatemappedafrica/src/components/Hero/Hero.js @@ -26,14 +26,14 @@ function Hero({ }) { const isUpLg = useMediaQuery((theme) => theme.breakpoints.up("lg")); const [hoverGeo, setHoverGeo] = useState(null); - const continentLevelZoom = isUpLg ? 2.4 : 2.1; + const continentLevelZoom = isUpLg ? 3 : 2.1; // We have to reduce the zoom level for continent so that all countries(Including islands) are visible within the designs const countryLevelZoom = isUpLg ? 6 : 5.25; const zoom = level === "continent" ? continentLevelZoom : countryLevelZoom; - return ( - + {center ? ( ({ + sx={{ position: "relative", - height: { sm: "299px", lg: "471px" }, - width: { sm: "236px", lg: "371px" }, + height: { sm: "350px", lg: "471px" }, + width: { sm: "300px", lg: "500px" }, marginTop: { sm: "55px", lg: "42px" }, "& .leaflet-container": { background: "transparent", }, - })} + }} > Date: Wed, 30 Oct 2024 14:41:45 +0300 Subject: [PATCH 08/18] Update Hero component snapshots --- apps/climatemappedafrica/src/components/Hero/Hero.snap.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js index e94a3de38..38d7598e4 100644 --- a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js +++ b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js @@ -3,7 +3,7 @@ exports[` renders unchanged 1`] = `
renders unchanged 1`] = ` class="MuiGrid-root MuiGrid-container css-11lq3yg-MuiGrid-root" >
Date: Wed, 30 Oct 2024 15:23:34 +0300 Subject: [PATCH 09/18] Fixed Map Styles --- apps/climatemappedafrica/src/components/Hero/Map.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/apps/climatemappedafrica/src/components/Hero/Map.js b/apps/climatemappedafrica/src/components/Hero/Map.js index c67558d7f..12c5e5468 100644 --- a/apps/climatemappedafrica/src/components/Hero/Map.js +++ b/apps/climatemappedafrica/src/components/Hero/Map.js @@ -1,11 +1,10 @@ -import { Box } from "@mui/material"; +import { Box, useTheme } from "@mui/material"; import { useRouter } from "next/router"; import PropTypes from "prop-types"; import React from "react"; import { MapContainer, GeoJSON } from "react-leaflet"; import "leaflet/dist/leaflet.css"; -import theme from "@/climatemappedafrica/theme"; function Map({ center, @@ -19,7 +18,6 @@ function Map({ color: "#2A2A2C", weight: 1, opacity: 1, - fillColor: "#fff", dashArray: "2", }, onLayerMouseOver, @@ -29,6 +27,7 @@ function Map({ const countyCodes = featuredLocations?.map(({ code }) => code); + const theme = useTheme(); const onEachFeature = (feature, layer) => { layer.setStyle({ fillColor: theme.palette.background.default, From 08077cdc773fad01fb4a8d66164a79dfbd7b0f06 Mon Sep 17 00:00:00 2001 From: Kevin Koech Date: Wed, 30 Oct 2024 15:37:02 +0300 Subject: [PATCH 10/18] Updated explore page slug on hero --- apps/climatemappedafrica/src/components/Hero/Hero.js | 2 ++ apps/climatemappedafrica/src/components/Hero/Map.js | 6 +++++- apps/climatemappedafrica/src/lib/data/blockify/hero.js | 4 ++++ 3 files changed, 11 insertions(+), 1 deletion(-) diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.js b/apps/climatemappedafrica/src/components/Hero/Hero.js index 989c485e2..6085bc944 100644 --- a/apps/climatemappedafrica/src/components/Hero/Hero.js +++ b/apps/climatemappedafrica/src/components/Hero/Hero.js @@ -22,6 +22,7 @@ function Hero({ searchPlaceholder, properties, level, + explorePageSlug, ...props }) { const isUpLg = useMediaQuery((theme) => theme.breakpoints.up("lg")); @@ -116,6 +117,7 @@ function Hero({ }} onLayerMouseOver={setHoverGeo} featuredLocations={featuredLocations} + explorePageSlug={explorePageSlug} {...props} /> ) : null} diff --git a/apps/climatemappedafrica/src/components/Hero/Map.js b/apps/climatemappedafrica/src/components/Hero/Map.js index 12c5e5468..bd8f60512 100644 --- a/apps/climatemappedafrica/src/components/Hero/Map.js +++ b/apps/climatemappedafrica/src/components/Hero/Map.js @@ -22,6 +22,7 @@ function Map({ }, onLayerMouseOver, featuredLocations, + explorePageSlug, }) { const router = useRouter(); @@ -54,7 +55,9 @@ function Map({ }); }); layer.on("click", () => { - router.push(`/explore/${feature.properties.code.toLowerCase()}`); + router.push( + `/${explorePageSlug}/${feature.properties.code.toLowerCase()}`, + ); }); } }; @@ -113,6 +116,7 @@ Map.propTypes = { featuredLocations: PropTypes.arrayOf( PropTypes.shape({ code: PropTypes.string }), ), + explorePageSlug: PropTypes.string, }; export default Map; diff --git a/apps/climatemappedafrica/src/lib/data/blockify/hero.js b/apps/climatemappedafrica/src/lib/data/blockify/hero.js index 328c91dd5..66b91a3e0 100644 --- a/apps/climatemappedafrica/src/lib/data/blockify/hero.js +++ b/apps/climatemappedafrica/src/lib/data/blockify/hero.js @@ -6,6 +6,9 @@ import { export default async function hero({ block, hurumap }) { const { rootGeography: { center, code, rootGeographyHasData: pinRootGeography }, + page: { + value: { slug: explorePageSlug }, + }, } = hurumap; const { geometries } = await fetchProfileGeography(code.toLowerCase()); const { level } = geometries.boundary?.properties ?? {}; @@ -32,5 +35,6 @@ export default async function hero({ block, hurumap }) { level, properties: geometries.boundary?.properties, pinRootGeography, + explorePageSlug, }; } From b2a7d031585b0558063d8648fad816e7ae224ef8 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Wed, 30 Oct 2024 15:37:08 +0300 Subject: [PATCH 11/18] Revert Workflow file Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> --- .github/workflows/climatemappedafrica-deploy-dev.yml | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/.github/workflows/climatemappedafrica-deploy-dev.yml b/.github/workflows/climatemappedafrica-deploy-dev.yml index 456a1dfaa..285b91405 100644 --- a/.github/workflows/climatemappedafrica-deploy-dev.yml +++ b/.github/workflows/climatemappedafrica-deploy-dev.yml @@ -2,7 +2,7 @@ name: Climate Mapped Africa | Deploy | DEV on: push: - branches: [ft/climatemapped-hurumap-fixes] + branches: [main] paths: - "apps/climatemappedafrica/**" - "Dockerfile" @@ -33,10 +33,6 @@ jobs: with: fetch-depth: 0 - # Add support for more platforms with QEMU (optional) - - name: Set up QEMU - uses: docker/setup-qemu-action@v3 - - name: Set up Docker Buildx uses: docker/setup-buildx-action@v2 @@ -65,7 +61,6 @@ jobs: cache-from: type=local,src=/tmp/.buildx-cache cache-to: type=local,dest=/tmp/.buildx-cache-new context: . - platforms: linux/arm64 target: climatemappedafrica-runner push: true tags: "${{ env.IMAGE_NAME }}:${{ github.sha }}" From 4de4b754433f3888e5333ff646853298f6a4b9bd Mon Sep 17 00:00:00 2001 From: Kevin Koech Date: Wed, 30 Oct 2024 16:06:03 +0300 Subject: [PATCH 12/18] FIxed Explore page Panel Items --- .../src/lib/data/blockify/explore-page.js | 12 ---- .../payload/globals/HURUMap/PanelOptions.js | 64 ------------------- 2 files changed, 76 deletions(-) diff --git a/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js b/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js index f962f7f30..d82ab8b2c 100644 --- a/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js +++ b/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js @@ -6,12 +6,6 @@ import { async function explorePage({ block: { slugs }, hurumap }) { const { rootGeography, - align, - anchor, - lazyblock, - blockUniqueClass, - ghostkitSpacings, - ghostkitSR, scrollToTopLabel, dataNotAvailable, items: panelItems, @@ -47,13 +41,7 @@ async function explorePage({ block: { slugs }, hurumap }) { panelItems, scrollToTopLabel, dataNotAvailable, - lazyblock, - align, - anchor, blockId: "explore-page", - blockUniqueClass, - ghostkitSpacings, - ghostkitSR, }; const res = { id: "explore-page", diff --git a/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js b/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js index c3135fe24..fcd40c676 100644 --- a/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js +++ b/apps/climatemappedafrica/src/payload/globals/HURUMap/PanelOptions.js @@ -49,70 +49,6 @@ const PanelOptions = { }, localized: true, }, - { - name: "align", - type: "text", - label: "Align", - localized: true, - defaultValue: "", - admin: { - width: "50%", - }, - }, - { - name: "anchor", - type: "text", - label: "Anchor", - localized: true, - defaultValue: "", - admin: { - width: "50%", - }, - }, - { - name: "blockUniqueClass", - type: "text", - label: "Block Unique Class", - defaultValue: "lazyblock-panel-20amuc", - localized: true, - admin: { - width: "50%", - }, - }, - { - name: "ghostkitSpacings", - type: "text", - label: "Ghostkit Spacings", - defaultValue: "", - localized: true, - admin: { - width: "50%", - }, - }, - { - name: "ghostkitSR", - type: "text", - label: "Ghostkit SR", - localized: true, - defaultValue: "", - admin: { - width: "50%", - }, - }, - ], - }, - { - name: "lazyblock", - type: "group", - label: "Lazy Block", - fields: [ - { - name: "slug", - type: "text", - label: "Slug", - defaultValue: "lazyblock/panel", - localized: true, - }, ], }, ], From e90e3a4c6a9cb619f79820b8e3274766d7754e42 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Wed, 30 Oct 2024 16:23:33 +0300 Subject: [PATCH 13/18] Fetch profile once --- .../src/lib/data/blockify/explore-page.js | 8 ++--- .../src/lib/data/blockify/index.js | 10 +++++-- .../src/lib/data/common/index.js | 29 +++++++++++++++---- 3 files changed, 34 insertions(+), 13 deletions(-) diff --git a/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js b/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js index 53e8e8fc2..a586e6cb8 100644 --- a/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js +++ b/apps/climatemappedafrica/src/lib/data/blockify/explore-page.js @@ -1,16 +1,12 @@ -import { - fetchProfile, - fetchProfileGeography, -} from "@/climatemappedafrica/lib/hurumap"; +import { fetchProfileGeography } from "@/climatemappedafrica/lib/hurumap"; -async function explorePage({ block: { slugs }, hurumap }) { +async function explorePage({ block: { slugs }, hurumap, hurumapProfile }) { const { rootGeography, page: { value }, } = hurumap; const { code: name } = rootGeography; const code = slugs.length ? slugs[0] : name; - const hurumapProfile = await fetchProfile(); const { locations, preferredChildren, mapType, choropleth } = hurumapProfile; diff --git a/apps/climatemappedafrica/src/lib/data/blockify/index.js b/apps/climatemappedafrica/src/lib/data/blockify/index.js index d8a83f9fe..5337adfb3 100644 --- a/apps/climatemappedafrica/src/lib/data/blockify/index.js +++ b/apps/climatemappedafrica/src/lib/data/blockify/index.js @@ -12,13 +12,19 @@ const propsifyBlockBySlug = { tutorial, }; -export const blockify = async (blocks, api, context, hurumap) => { +export const blockify = async ( + blocks, + api, + context, + hurumap, + hurumapProfile, +) => { const promises = blocks?.map(async (block) => { const slug = block.blockType; const propsifyBlock = propsifyBlockBySlug[slug]; if (propsifyBlock) { - return propsifyBlock({ block, api, context, hurumap }); + return propsifyBlock({ block, api, context, hurumap, hurumapProfile }); } return { ...block, diff --git a/apps/climatemappedafrica/src/lib/data/common/index.js b/apps/climatemappedafrica/src/lib/data/common/index.js index 81f110f14..a502b32dc 100644 --- a/apps/climatemappedafrica/src/lib/data/common/index.js +++ b/apps/climatemappedafrica/src/lib/data/common/index.js @@ -35,8 +35,8 @@ function getFooter(siteSettings, variant) { }; } -async function getNavBar(siteSettings, variant, { slug }) { - const { locations } = await fetchProfile(); +async function getNavBar(siteSettings, variant, { slug }, hurumapProfile) { + const { locations } = hurumapProfile; const { connect: { links = [] }, primaryNavigation: { menus = [], connect = [] }, @@ -65,6 +65,8 @@ export async function getPageProps(api, context) { const { draftMode = false } = context; const options = { draft: draftMode }; + const hurumapProfile = await fetchProfile(); + const { docs: [page], } = await api.findPage(slug, options); @@ -78,12 +80,23 @@ export async function getPageProps(api, context) { page: { value: explorePage }, } = hurumap; - let blocks = await blockify(page.blocks, api, context, hurumap); + let blocks = await blockify( + page.blocks, + api, + context, + hurumap, + hurumapProfile, + ); const variant = page.slug === explorePage.slug ? "explore" : "default"; const siteSettings = await api.findGlobal("settings-site"); const footer = getFooter(siteSettings, variant); - const menus = await getNavBar(siteSettings, variant, explorePage); + const menus = await getNavBar( + siteSettings, + variant, + explorePage, + hurumapProfile, + ); if (slug === explorePage.slug) { // The explore page is a special case. The only block we need to render is map and tutorial. @@ -96,7 +109,13 @@ export async function getPageProps(api, context) { blockType: "tutorial", }, ]; - blocks = await blockify(explorePageBlocks, api, context, hurumap); + blocks = await blockify( + explorePageBlocks, + api, + context, + hurumap, + hurumapProfile, + ); } return { From 2b64a8ce8f06befca6af17acaa07a356d9600f58 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Thu, 31 Oct 2024 10:48:31 +0300 Subject: [PATCH 14/18] Fix How it works mobile view --- .../src/components/HowItWorks/index.js | 27 ++++++++++++++----- 1 file changed, 20 insertions(+), 7 deletions(-) diff --git a/apps/climatemappedafrica/src/components/HowItWorks/index.js b/apps/climatemappedafrica/src/components/HowItWorks/index.js index 155c23933..21835efea 100644 --- a/apps/climatemappedafrica/src/components/HowItWorks/index.js +++ b/apps/climatemappedafrica/src/components/HowItWorks/index.js @@ -56,7 +56,15 @@ function HowItWorks({ })} />
- + ({ + marginBottom: { + xs: theme.typography.pxToRem(23), + md: 0, + }, + })} > ({ From 1cf7e6a375c855c618a80eb4828f29922cb16e2f Mon Sep 17 00:00:00 2001 From: Kevin Koech Date: Thu, 31 Oct 2024 13:47:29 +0300 Subject: [PATCH 15/18] Updated Panel Options --- .../DropdownSearch/DownloadSearch.js | 1 - .../src/components/Hero/Hero.snap.js | 5 --- .../src/lib/data/blockify/explore-page.js | 5 +-- .../src/lib/data/common/index.js | 2 +- .../payload/globals/HURUMap/PanelOptions.js | 45 +++++++++++-------- 5 files changed, 28 insertions(+), 30 deletions(-) diff --git a/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js b/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js index dc9f31362..fb3cfc7b2 100644 --- a/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js +++ b/apps/climatemappedafrica/src/components/DropdownSearch/DownloadSearch.js @@ -111,7 +111,6 @@ function DropdownSearch({ onChange={handleChange} placeholder={placeholder} value={query} - {...props} sx={({ typography, palette }) => ({ borderRadius: typography.pxToRem(10), color: palette.primary.main, diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js index 38d7598e4..1af23dffd 100644 --- a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js +++ b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js @@ -58,16 +58,11 @@ exports[` renders unchanged 1`] = ` Search for a location

Date: Thu, 31 Oct 2024 17:25:25 +0300 Subject: [PATCH 16/18] FIx Grid --- apps/climatemappedafrica/src/components/HowItWorks/index.js | 6 ------ 1 file changed, 6 deletions(-) diff --git a/apps/climatemappedafrica/src/components/HowItWorks/index.js b/apps/climatemappedafrica/src/components/HowItWorks/index.js index 21835efea..9b3dd3d90 100644 --- a/apps/climatemappedafrica/src/components/HowItWorks/index.js +++ b/apps/climatemappedafrica/src/components/HowItWorks/index.js @@ -165,12 +165,6 @@ function HowItWorks({ xs: "center", md: "flex-end", }} - sx={(theme) => ({ - marginBottom: { - xs: theme.typography.pxToRem(23), - md: 0, - }, - })} > ({ From 4e9016e2076f1e105f185e4991bdf3ff924abde3 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Fri, 1 Nov 2024 01:16:26 +0300 Subject: [PATCH 17/18] Common settings Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> --- .../src/lib/data/blockify/index.js | 9 ++------- .../src/lib/data/common/index.js | 20 +++++++------------ 2 files changed, 9 insertions(+), 20 deletions(-) diff --git a/apps/climatemappedafrica/src/lib/data/blockify/index.js b/apps/climatemappedafrica/src/lib/data/blockify/index.js index 5337adfb3..b89ee1313 100644 --- a/apps/climatemappedafrica/src/lib/data/blockify/index.js +++ b/apps/climatemappedafrica/src/lib/data/blockify/index.js @@ -12,13 +12,8 @@ const propsifyBlockBySlug = { tutorial, }; -export const blockify = async ( - blocks, - api, - context, - hurumap, - hurumapProfile, -) => { +export const blockify = async (blocks, api, context, settings) => { + const { hurumap, hurumapProfile } = settings; const promises = blocks?.map(async (block) => { const slug = block.blockType; const propsifyBlock = propsifyBlockBySlug[slug]; diff --git a/apps/climatemappedafrica/src/lib/data/common/index.js b/apps/climatemappedafrica/src/lib/data/common/index.js index a502b32dc..7fb75928c 100644 --- a/apps/climatemappedafrica/src/lib/data/common/index.js +++ b/apps/climatemappedafrica/src/lib/data/common/index.js @@ -79,17 +79,17 @@ export async function getPageProps(api, context) { const { page: { value: explorePage }, } = hurumap; + const siteSettings = await api.findGlobal("settings-site"); - let blocks = await blockify( - page.blocks, - api, - context, + const settings = { hurumap, hurumapProfile, - ); + siteSettings, + }; + + let blocks = await blockify(page.blocks, api, context, settings); const variant = page.slug === explorePage.slug ? "explore" : "default"; - const siteSettings = await api.findGlobal("settings-site"); const footer = getFooter(siteSettings, variant); const menus = await getNavBar( siteSettings, @@ -109,13 +109,7 @@ export async function getPageProps(api, context) { blockType: "tutorial", }, ]; - blocks = await blockify( - explorePageBlocks, - api, - context, - hurumap, - hurumapProfile, - ); + blocks = await blockify(explorePageBlocks, api, context, settings); } return { From f7f0dd5dfc41756f20548c037437ff45cdc54a9d Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Fri, 1 Nov 2024 01:21:38 +0300 Subject: [PATCH 18/18] Update failing tests --- apps/climatemappedafrica/src/components/Hero/Hero.snap.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js index 47322e6c2..6b4302a5f 100644 --- a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js +++ b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js @@ -58,11 +58,7 @@ exports[` renders unchanged 1`] = ` Search for a location