From 9a9244d8d5e654ecc9f592f6f03b5b0aa9c1b668 Mon Sep 17 00:00:00 2001 From: "Adam J. Pain" Date: Mon, 7 May 2018 17:43:30 +0200 Subject: [PATCH 1/2] Updates tree-cover and ifl-cover widgets --- .../widget-header/widget-header-component.js | 2 +- .../land-cover/fao-cover/initial-state.js | 2 +- .../intact-tree-cover/initial-state.js | 12 ++++---- .../land-cover/intact-tree-cover/selectors.js | 28 +++++++++++-------- .../tree-cover-located/initial-state.js | 3 +- .../land-cover/tree-cover/initial-state.js | 4 +++ .../land-cover/tree-cover/selectors.js | 28 +++++++++++-------- 7 files changed, 47 insertions(+), 32 deletions(-) diff --git a/app/javascript/components/widgets/components/widget-header/widget-header-component.js b/app/javascript/components/widgets/components/widget-header/widget-header-component.js index 54da34af4e..592bb41db5 100644 --- a/app/javascript/components/widgets/components/widget-header/widget-header-component.js +++ b/app/javascript/components/widgets/components/widget-header/widget-header-component.js @@ -50,7 +50,7 @@ class WidgetHeader extends PureComponent { return (
{`${title} in ${ - currentLocation ? currentLocation.label : '' + currentLocation.label ? currentLocation.label : 'Global' }`}
{!embed && diff --git a/app/javascript/components/widgets/widgets/land-cover/fao-cover/initial-state.js b/app/javascript/components/widgets/widgets/land-cover/fao-cover/initial-state.js index 9e023f0e27..22b7ce8f46 100644 --- a/app/javascript/components/widgets/widgets/land-cover/fao-cover/initial-state.js +++ b/app/javascript/components/widgets/widgets/land-cover/fao-cover/initial-state.js @@ -3,7 +3,7 @@ export const initialState = { config: { size: 'small', categories: ['land-cover'], - admins: ['country'], + admins: ['global', 'country'], type: 'fao', metaKey: 'widget_forest_cover_fao', sortOrder: { diff --git a/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js b/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js index 2e04664ca1..87c311b6c9 100644 --- a/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js +++ b/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js @@ -9,7 +9,7 @@ export default { 'ifl_2013__landmark' ], categories: ['land-cover'], - admins: ['country', 'region', 'subRegion'], + admins: ['global', 'country', 'region', 'subRegion'], selectors: ['indicators', 'thresholds', 'extentYears'], type: 'extent', metaKey: 'widget_ifl', @@ -18,13 +18,13 @@ export default { landCover: 3 }, sentences: { + globalInitial: + 'As of 2013, {percentage} of {location} tree cover is {intact}.', + globalWithIndicator: + 'As of 2013, {percentage} of {location} tree cover within {indicator} is {intact}.', initial: 'In {location}, {percentage} of tree cover is {intact}.', - lessThan: - 'In {location}, less than {percentage} of tree cover is {intact}.', withIndicator: - 'Within {indicator} in {location}, {percentage} of tree cover is {intact}.', - lessThanWithIndicator: - 'Within {indicator} in {location}, less than {percentage} of tree cover is {intact}.' + 'Within {indicator} in {location}, {percentage} of tree cover is {intact}.' } }, settings: { diff --git a/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/selectors.js b/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/selectors.js index e9d82fe241..49157f24fe 100644 --- a/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/selectors.js +++ b/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/selectors.js @@ -14,11 +14,12 @@ const getSentences = state => state.config && state.config.sentences; // get lists selected export const parseData = createSelector( - [getData, getSettings, getIndicatorWhitelist, getColors], - (data, settings, whitelist, colors) => { - if (isEmpty(data) || isEmpty(whitelist)) return null; + [getData, getSettings, getIndicatorWhitelist, getColors, getCurrentLocation], + (data, settings, whitelist, colors, currentLabel) => { + if (isEmpty(data)) return null; const { totalArea, totalExtent, extent, plantations } = data; - const hasPlantations = Object.keys(whitelist).indexOf('plantations') > -1; + const hasPlantations = + !currentLabel || Object.keys(whitelist).indexOf('plantations') > -1; const colorRange = getColorPalette(colors.ramp, hasPlantations ? 3 : 2); const parsedData = [ { @@ -40,7 +41,7 @@ export const parseData = createSelector( percentage: (totalArea - totalExtent) / totalArea * 100 } ]; - if (hasPlantations) { + if (currentLabel && hasPlantations) { parsedData.splice(2, 0, { label: 'Plantations', value: plantations, @@ -55,12 +56,12 @@ export const parseData = createSelector( export const getSentence = createSelector( [parseData, getSettings, getCurrentLocation, getIndicator, getSentences], (parsedData, settings, currentLabel, indicator, sentences) => { - if (!parsedData || !currentLabel || !indicator) return null; + if (!parsedData || !indicator) return null; const { initial, - lessThan, withIndicator, - lessThanWithIndicator + globalInitial, + globalWithIndicator } = sentences; const totalExtent = parsedData .filter(d => d.label !== 'Non-Forest') @@ -83,17 +84,20 @@ export const getSentence = createSelector( } const params = { - location: currentLabel, + location: currentLabel || 'global', indicator: indicatorLabel, percentage: - intactPercentage < 0.1 ? '0.1%' : `${format('.0f')(intactPercentage)}%`, + intactPercentage < 0.1 + ? '<0.1%' + : `${format('.0f')(intactPercentage)}%`, intact: 'intact forest' }; let sentence = indicator.value === 'ifl_2013' ? initial : withIndicator; - if (intactPercentage < 0.01) { + + if (!currentLabel) { sentence = - indicator.value === 'ifl_2013' ? lessThan : lessThanWithIndicator; + indicator.value === 'ifl_2013' ? globalInitial : globalWithIndicator; } return { sentence, diff --git a/app/javascript/components/widgets/widgets/land-cover/tree-cover-located/initial-state.js b/app/javascript/components/widgets/widgets/land-cover/tree-cover-located/initial-state.js index 8c030aaf21..938bf66454 100644 --- a/app/javascript/components/widgets/widgets/land-cover/tree-cover-located/initial-state.js +++ b/app/javascript/components/widgets/widgets/land-cover/tree-cover-located/initial-state.js @@ -24,7 +24,7 @@ export default { ], units: ['ha', '%'], categories: ['summary', 'land-cover'], - admins: ['country', 'region'], + admins: ['global', 'country', 'region'], selectors: ['indicators', 'thresholds', 'units', 'extentYears'], locationCheck: true, type: 'extent', @@ -35,6 +35,7 @@ export default { landCover: 2 }, sentences: { + global: '', initial: 'In {location}, {count} regions represent {percentage} of all tree cover. This region has the largest tree cover at {extent} compared to an average of {averageExtent}.', hasIndicator: diff --git a/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js b/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js index 3d05237fc3..f24f8139a7 100644 --- a/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js +++ b/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js @@ -14,6 +14,10 @@ export default { landCover: 1 }, sentences: { + globalInitial: + 'As of {year}, there was {value} of {location} tree cover.', + globalWithIndicator: + 'As of {year}, there was {value} of {location} tree cover within {indicator}.', initial: 'As of {year}, {location} had {value} of tree cover.', withIndicator: 'As of {year}, {indicator} in {location} had {value} of tree cover.' diff --git a/app/javascript/components/widgets/widgets/land-cover/tree-cover/selectors.js b/app/javascript/components/widgets/widgets/land-cover/tree-cover/selectors.js index e377f80281..634730376b 100644 --- a/app/javascript/components/widgets/widgets/land-cover/tree-cover/selectors.js +++ b/app/javascript/components/widgets/widgets/land-cover/tree-cover/selectors.js @@ -14,12 +14,13 @@ const getSentences = state => state.config && state.config.sentences; // get lists selected export const parseData = createSelector( - [getData, getSettings, getWhitelists, getColors], - (data, settings, whitelist, colors) => { - if (isEmpty(data) || isEmpty(whitelist)) return null; + [getData, getSettings, getWhitelists, getColors, getCurrentLocation], + (data, settings, whitelist, colors, currentLabel) => { + if (isEmpty(data)) return null; const { totalArea, cover, plantations } = data; const { indicator } = settings; - const hasPlantations = Object.keys(whitelist).indexOf('plantations') > -1; + const hasPlantations = + !currentLabel || Object.keys(whitelist).indexOf('plantations') > -1; const colorRange = getColorPalette(colors.ramp, hasPlantations ? 2 : 1); const parsedData = [ { @@ -54,17 +55,22 @@ export const getSentence = createSelector( [getData, getSettings, getCurrentLocation, getIndicator, getSentences], (data, settings, currentLabel, indicator, sentences) => { if (!data || !sentences) return null; - const { initial, withIndicator } = sentences; + const { + initial, + withIndicator, + globalInitial, + globalWithIndicator + } = sentences; const params = { year: settings.extentYear, - location: currentLabel, + location: currentLabel || 'global', indicator: indicator && indicator.label, value: `${format('.3s')(data.cover)}ha` }; - - return { - sentence: indicator ? withIndicator : initial, - params - }; + let sentence = indicator ? withIndicator : initial; + if (!currentLabel) { + sentence = indicator ? globalWithIndicator : globalInitial; + } + return { sentence, params }; } ); From 531be23f3ec8544707ac16d10952f861e0e90365 Mon Sep 17 00:00:00 2001 From: Ed Brett Date: Tue, 8 May 2018 13:31:16 +0200 Subject: [PATCH 2/2] manage tabs changes correctly --- .../widgets/land-cover/intact-tree-cover/initial-state.js | 2 +- .../widgets/land-cover/tree-cover/initial-state.js | 2 +- app/javascript/pages/dashboards/page/page-selectors.js | 8 +++----- 3 files changed, 5 insertions(+), 7 deletions(-) diff --git a/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js b/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js index b04fac6c8b..c2505c798e 100644 --- a/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js +++ b/app/javascript/components/widgets/widgets/land-cover/intact-tree-cover/initial-state.js @@ -9,7 +9,7 @@ export default { 'ifl_2013__landmark' ], categories: ['land-cover'], - admins: ['country', 'region', 'subRegion'], + admins: ['global', 'country', 'region', 'subRegion'], selectors: ['indicators', 'thresholds'], type: 'extent', metaKey: 'widget_ifl', diff --git a/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js b/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js index a9af9a75f0..134fac285a 100644 --- a/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js +++ b/app/javascript/components/widgets/widgets/land-cover/tree-cover/initial-state.js @@ -4,7 +4,7 @@ export default { size: 'small', indicators: ['gadm28', 'mining', 'landmark', 'wdpa'], categories: ['summary', 'land-cover'], - admins: ['country', 'region', 'subRegion'], + admins: ['global', 'country', 'region', 'subRegion'], selectors: ['indicators', 'thresholds'], type: 'extent', metaKey: 'widget_tree_cover', diff --git a/app/javascript/pages/dashboards/page/page-selectors.js b/app/javascript/pages/dashboards/page/page-selectors.js index 5c1e58d012..699a4b2ae9 100644 --- a/app/javascript/pages/dashboards/page/page-selectors.js +++ b/app/javascript/pages/dashboards/page/page-selectors.js @@ -1,5 +1,4 @@ import { createSelector } from 'reselect'; -import compact from 'lodash/compact'; import qs from 'query-string'; // get list data @@ -15,9 +14,6 @@ export const getLinks = createSelector( [getCategories, getCategory, getLocation, getQuery], (categories, activeCategory, location, query) => categories.map(category => { - const locationUrl = compact( - Object.keys(location).map(key => location[key]) - ).join('/'); const newQuery = { ...query, category: category.value, @@ -25,7 +21,9 @@ export const getLinks = createSelector( }; return { label: category.label, - path: `/dashboards/${locationUrl}?${qs.stringify(newQuery)}`, + path: `${window.location.pathname}${newQuery ? '?' : ''}${qs.stringify( + newQuery + )}`, active: activeCategory === category.value }; })