From 6d65f4afb0c594c70c1873161a7c557369fb400f Mon Sep 17 00:00:00 2001 From: tom1145 Date: Fri, 7 Feb 2025 13:53:59 +0200 Subject: [PATCH] refactor: update MapContext and Map components for revised API response --- src/components/Map/index.tsx | 8 ++++---- src/context/MapContext.tsx | 25 ++++++++++++------------- src/shared/types/locationNodeType.ts | 16 +++++----------- 3 files changed, 21 insertions(+), 28 deletions(-) diff --git a/src/components/Map/index.tsx b/src/components/Map/index.tsx index 2b2d4f1..1e75b8a 100644 --- a/src/components/Map/index.tsx +++ b/src/components/Map/index.tsx @@ -79,14 +79,14 @@ export default function Map() { acc: Record, node: LocationNode ) => { - const { city, lat, lon, country } = node._source + const { city, lat, lon, country, count } = node if (city) { if (!acc[city]) { - acc[city] = { lat, lon, country, count: 0 } + acc[city] = { lat, lon, country, count } + } else { + acc[city].count += count } - - acc[city].count += 1 } return acc diff --git a/src/context/MapContext.tsx b/src/context/MapContext.tsx index c4790fb..dd7b551 100644 --- a/src/context/MapContext.tsx +++ b/src/context/MapContext.tsx @@ -7,18 +7,11 @@ import React, { useMemo } from 'react' import axios from 'axios' -import { LocationNode } from '../shared/types/locationNodeType' import { getApiRoute } from '@/config' - -interface CountryNodesInfo { - country: string - nodeIds: string[] - totalNodes: number -} +import { LocationNode } from '../shared/types/locationNodeType' interface MapContextType { data: LocationNode[] - countryNodesInfo: CountryNodesInfo[] loading: boolean error: any totalCountries: number @@ -32,7 +25,6 @@ export const MapContext = createContext(undefined) export const MapProvider: React.FC = ({ children }) => { const [data, setData] = useState([]) - const [countryNodesInfo, setCountryNodesInfo] = useState([]) const [loading, setLoading] = useState(true) const [error, setError] = useState(null) const [totalCountries, setTotalCountries] = useState(0) @@ -46,13 +38,21 @@ export const MapProvider: React.FC = ({ children }) => { setLoading(true) try { const response = await axios.get(fetchUrl) - const nodes = response.data.locations + const locationsFromAPI = response.data.locations const totalCountries = response.data.totalCountries - setData(nodes) + const transformedNodes = locationsFromAPI.map((location: any) => ({ + city: location.location, + lat: location.coordinates.lat, + lon: location.coordinates.lon, + country: location.country || location.location, + count: location.count + })) + + setData(transformedNodes) setTotalCountries(totalCountries) } catch (err) { - console.log('error', err) + console.error('Error fetching locations:', err) setError(err) } finally { setLoading(false) @@ -66,7 +66,6 @@ export const MapProvider: React.FC = ({ children }) => {