Skip to content

Commit

Permalink
Merge pull request #4864 from wri/feat/tree-cover-by-type-FLAG-1098
Browse files Browse the repository at this point in the history
[FLAG-1098] Priority 2: Rename the “tree cover by type” widget and add “Plantations” intersection
  • Loading branch information
willian-viana authored Oct 11, 2024
2 parents ad28145 + 655e7d2 commit 700c328
Show file tree
Hide file tree
Showing 4 changed files with 37 additions and 47 deletions.
21 changes: 17 additions & 4 deletions components/widgets/land-cover/tree-cover/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,8 @@ import getWidgetProps from './selectors';
export default {
widget: 'treeCover',
title: {
default: 'Tree Cover by type in {location}',
global: 'Global tree cover by type',
withPlantations: 'Forest cover by type in {location}',
default: 'Tree Cover in {location}',
global: 'Global tree cover',
},
alerts: [
{
Expand Down Expand Up @@ -109,7 +108,13 @@ export default {
summary: 4,
landCover: 1,
},
refetchKeys: ['threshold', 'decile', 'extentYear', 'landCategory'],
refetchKeys: [
'threshold',
'decile',
'extentYear',
'landCategory',
'forestType',
],
pendingKeys: ['threshold', 'decile', 'extentYear'],
settings: {
threshold: 30,
Expand Down Expand Up @@ -140,6 +145,14 @@ export default {
clearable: true,
border: true,
},
{
key: 'forestType',
whitelist: ['plantations'],
label: 'Forest Type',
type: 'select',
placeholder: 'All tree cover',
clearable: true,
},
{
key: isTropicalTreeCover ? 'decile' : 'threshold',
label: 'Tree cover',
Expand Down
60 changes: 18 additions & 42 deletions components/widgets/land-cover/tree-cover/selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,43 +6,31 @@ import { formatNumber } from 'utils/format';
const getData = (state) => state.data;
const getSettings = (state) => state.settings;
const getIndicator = (state) => state.indicator;
const getWhitelist = (state) => state.polynamesWhitelist;
const getColors = (state) => state.colors;
const getSentence = (state) => state.sentence;
const getTitle = (state) => state.title;
const getLocationName = (state) => state.locationLabel;
const getMetaKey = (state) => state.metaKey;
const getAdminLevel = (state) => state.adminLevel;

export const isoHasPlantations = createSelector(
[getWhitelist, getLocationName],
(whitelist, name) => {
const hasPlantations =
name === 'global'
? true
: whitelist &&
whitelist.annual &&
whitelist.annual.includes('plantations');
return hasPlantations;
}
);

export const parseData = createSelector(
[getData, getColors, getIndicator, isoHasPlantations],
(data, colors, indicator, hasPlantations) => {
[getData, getColors, getIndicator],
(data, colors, indicator) => {
if (isEmpty(data)) return null;
const { totalArea, totalCover, cover, plantations } = data;
const otherCover = indicator ? totalCover - cover : 0;
const plantationsCover = hasPlantations ? plantations : 0;
const plantationsCover = plantations || 0;
const label = indicator ? ` in ${indicator.label}` : '';
const indicators = indicator?.value?.split('__') || [];
const hasPlantations = indicators.includes('plantations');

const parsedData = [
{
label: hasPlantations
? 'Natural Forest'.concat(label)
: 'Tree Cover'.concat(label),
value: cover - plantationsCover,
label: 'Tree Cover'.concat(label),
value: hasPlantations ? plantationsCover : cover - plantationsCover,
color: colors.naturalForest,
percentage: ((cover - plantationsCover) / totalArea) * 100,
percentage:
((hasPlantations ? plantationsCover : cover) / totalArea) * 100,
},
{
label: 'Other Land Cover',
Expand All @@ -51,21 +39,16 @@ export const parseData = createSelector(
percentage: ((totalArea - cover - otherCover) / totalArea) * 100,
},
];
if (indicator) {

if (hasPlantations) {
parsedData.splice(1, 0, {
label: hasPlantations ? 'Other forest cover' : 'Other tree cover',
label: 'Other tree cover',
value: otherCover,
color: colors.otherCover,
percentage: (otherCover / totalArea) * 100,
});
} else if (!indicator && hasPlantations) {
parsedData.splice(1, 0, {
label: 'Plantations',
value: plantations,
color: colors.plantedForest,
percentage: (plantations / totalArea) * 100,
});
}

return parsedData;
}
);
Expand All @@ -85,17 +68,8 @@ export const parseSentence = createSelector(
getIndicator,
getSentence,
getAdminLevel,
isoHasPlantations,
],
(
data,
settings,
locationName,
indicator,
sentences,
admLevel,
isoPlantations
) => {
(data, settings, locationName, indicator, sentences, admLevel) => {
if (!data || !sentences) return null;

const { extentYear, threshold, decile } = settings;
Expand All @@ -111,9 +85,11 @@ export const parseSentence = createSelector(
: 'treeCover';
const sentence =
sentences[sentenceKey][sentenceSubkey][sentenceTreeCoverType];
const indicators = indicator?.value?.split('__') || [];
const hasPlantations = indicators.includes('plantations');

const { cover, plantations, totalCover, totalArea } = data;
const top = isoPlantations ? cover - plantations : cover;
const top = !hasPlantations ? cover - plantations : plantations;
const bottom = indicator ? totalCover : totalArea;
const percentCover = (100 * top) / bottom;

Expand Down
2 changes: 1 addition & 1 deletion data/colors.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
"intactForest": "#6b8729",
"primaryForest": "#84a637",
"plantedForest": "#a0c746",
"otherCover": "#c7e67c",
"otherCover": "#a0c746",
"nonForest": "#e7e5a4"
},
"loss": {
Expand Down
1 change: 1 addition & 0 deletions data/land-categories.js
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ export default [
},
{
label: 'Indigenous and Community Lands',
preserveString: true,
value: 'landmark',
dataType: 'keyword',
metaKey: 'landmark_icls_2020',
Expand Down

0 comments on commit 700c328

Please sign in to comment.