diff --git a/components/widgets/forest-change/tree-loss-ranked/index.js b/components/widgets/forest-change/tree-loss-ranked/index.js index 67f1d1f3a7..bfacfee358 100644 --- a/components/widgets/forest-change/tree-loss-ranked/index.js +++ b/components/widgets/forest-change/tree-loss-ranked/index.js @@ -95,9 +95,9 @@ export default { globalWithIndicator: 'From {startYear} to {endYear}, {topLocationLabel} within {indicator} had the highest relative tree cover loss in the world, eqivalent to a loss of {topLocationLoss}, which represents {topLocationPerc} of the tree cover in the year {extentYear}.', initial: - 'From {startYear} to {endYear}, {location} lost {loss} of relative tree cover, equivalent to a {localPercent} decrease since {extentYear} and {globalPercent} of the global total.', + 'From {startYear} to {endYear}, {location} lost {loss} of relative tree cover, equivalent to a {localPercent} decrease since {extentYear} and {globalPercent} of all tree cover loss in {parent}.', withIndicator: - 'From {startYear} to {endYear}, {location} lost {loss} of tree relative cover in {indicator}, equivalent to a {localPercent} decrease since {extentYear} and {globalPercent} of the global total.', + 'From {startYear} to {endYear}, {location} lost {loss} of tree relative cover in {indicator}, equivalent to a {localPercent} decrease since {extentYear} and {globalPercent} of all tree cover loss in {parent}.', noLoss: 'There was no relative tree cover loss identified in {location}.', }, settings: { diff --git a/components/widgets/forest-change/tree-loss-ranked/selectors.js b/components/widgets/forest-change/tree-loss-ranked/selectors.js index eb62691594..c8053dcdf4 100644 --- a/components/widgets/forest-change/tree-loss-ranked/selectors.js +++ b/components/widgets/forest-change/tree-loss-ranked/selectors.js @@ -5,7 +5,6 @@ import isEmpty from 'lodash/isEmpty'; import groupBy from 'lodash/groupBy'; import sumBy from 'lodash/sumBy'; import sortBy from 'lodash/sortBy'; -import { format } from 'd3-format'; import { formatNumber } from 'utils/format'; // get list data @@ -21,34 +20,41 @@ const getAdm2 = (state) => state.adm2; const getSentences = (state) => state && state.sentence; const getTitle = (state) => state.title; const getLocationName = (state) => state.locationLabel; +const getParent = (state) => state.parent; export const getSummedByYearsData = createSelector( [getData, getSettings, getAdm1, getAdm2], (data, settings, adm1, adm2) => { if (isEmpty(data)) return null; + const { loss, extent } = data; const filteredByYears = loss.filter( (d) => d.year >= settings.startYear && d.year <= settings.endYear ); + let regionKey = 'iso'; if (adm1) regionKey = 'adm1'; if (adm2) regionKey = 'adm2'; + const groupedByRegion = groupBy(filteredByYears, regionKey); const regions = Object.keys(groupedByRegion); - const mappedData = regions.map((i) => { - const isoLoss = Math.round(sumBy(groupedByRegion[i], 'loss')) || 0; - const regionExtent = extent.find((e) => e[regionKey] === i); - const isoExtent = (regionExtent && regionExtent.extent) || 1; + const mappedData = regions.map((region) => { + const isoLoss = Math.round(sumBy(groupedByRegion[region], 'loss')) || 0; + const regionExtent = extent.find((e) => { + return e[regionKey].toString() === region.toString(); // iso is string while adm1 and 2 are numbers + }); + const isoExtent = (regionExtent && regionExtent.extent) || 0; const percentageLoss = isoExtent && isoLoss ? (100 * isoLoss) / isoExtent : 0; return { - id: adm1 ? parseInt(i, 10) : i, + id: adm1 ? parseInt(region, 10) : region, loss: isoLoss, extent: isoExtent, percentage: percentageLoss > 100 ? 100 : percentageLoss, }; }); + return sortBy( uniqBy(mappedData, 'id'), settings.unit === 'ha' ? 'loss' : 'percentage' @@ -124,8 +130,9 @@ export const parseSentence = createSelector( getLocation, getSentences, getLocationData, + getParent, ], - (data, settings, indicator, location, sentences, meta) => { + (data, settings, indicator, location, sentences, meta, parent) => { if (!data || !data.length || !location) return null; const { startYear, endYear } = settings; const { @@ -136,44 +143,38 @@ export const parseSentence = createSelector( noLoss, } = sentences; const locationData = location && data.find((l) => l.id === location.value); - - const loss = locationData && locationData.loss; + const isGlobal = location.label === 'global'; + const loss = locationData?.loss; + const topRegionData = data[0]; + const topRegion = meta && topRegionData && meta[topRegionData.id]; const globalLoss = sumBy(data, 'loss') || 0; - const globalExtent = sumBy(data, 'extent') || 0; - const lossArea = location.label === 'global' ? globalLoss : loss; - const areaPercent = - location.label === 'global' - ? (100 * globalLoss) / globalExtent - : (locationData && format('.1f')(locationData.percentage)) || 0; - const lossPercent = loss && locationData ? (100 * loss) / globalLoss : 0; + const lossArea = isGlobal ? globalLoss : loss; + const lossPercent = loss ? (100 * loss) / globalLoss : 0; const indicatorName = !indicator ? 'region-wide' : `${indicator.label}`; + let sentence = !indicator ? initial : withIndicator; - if (location.label === 'global') { - sentence = !indicator ? globalInitial : globalWithIndicator; - } - if (loss === 0) sentence = noLoss; - const topRegionData = data[0]; - const topRegion = meta && topRegionData && meta[topRegionData.id]; + if (isGlobal) sentence = !indicator ? globalInitial : globalWithIndicator; + if (loss === 0) sentence = noLoss; const params = { indicator: indicatorName, - topLocationLabel: topRegion && topRegion.label, + topLocationLabel: topRegion?.label, topLocationPerc: topRegionData && formatNumber({ num: topRegionData.percentage, unit: '%' }), topLocationLoss: topRegionData && formatNumber({ num: topRegionData.loss, unit: 'ha', spaceUnit: true }), - location: - location.label === 'global' ? 'globally' : location && location.label, + location: isGlobal ? 'globally' : location?.label, indicator_alt: indicatorName, startYear, endYear, loss: formatNumber({ num: lossArea, unit: 'ha', spaceUnit: true }), - localPercent: formatNumber({ num: areaPercent, unit: '%' }), + localPercent: formatNumber({ num: locationData?.percentage, unit: '%' }), globalPercent: formatNumber({ num: lossPercent, unit: '%' }), extentYear: settings.extentYear, + parent: parent?.label || null, }; return {