From 579cfe220887437847bb0014d9e5440c62e1c00c Mon Sep 17 00:00:00 2001
From: Aaron Briggs <abriggs@contractor.usgs.gov>
Date: Wed, 24 Feb 2021 20:24:30 -0600
Subject: [PATCH] refactor and fix tests
---
.../components/hydrograph/discrete-data.js | 44 ++++---------------
.../hydrograph/discrete-data.test.js | 35 +++++++++------
.../components/hydrograph/graph-brush.js | 2 +-
.../hydrograph/selectors/cursor.test.js | 19 +++++---
.../hydrograph/selectors/discrete-data.js | 36 ++++++++-------
.../selectors/discrete-data.test.js | 16 +++++--
.../hydrograph/time-series-graph.js | 2 +-
.../components/hydrograph/tooltip.js | 5 +--
8 files changed, 78 insertions(+), 81 deletions(-)
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.js b/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.js
index 418e46902..32823638d 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.js
@@ -3,38 +3,16 @@ import {defineCircleMarker, defineTextOnlyMarker} from 'd3render/markers';
const GW_LEVEL_RADIUS = 7;
const GW_LEVEL_CLASS = 'gw-level-point';
-const GROUNDWATER_LINE_CLASSES = {
- 'APPROVED': {label: 'Approved', class: 'approved'},
- 'PROVISIONAL': {label: 'Provisional', class: 'provisional'},
- 'REVISED': {label: 'Revised', class: 'revised'},
- 'UNKNOWN_CODE': {label: '', class: 'unknown-code'}
-};
-
-/*
-* Helper function that takes a raw approval code and matches it to a more detail object
-* @param {Object} groundwaterDataPoints - details about a single groundwater data point
-* @return {Object} Details that expand on the meaning of the approval code.
-*/
-export const getDetailsForApprovalCode = function(groundwaterPointData) {
- const groundwaterLineClass = {
- 'A': GROUNDWATER_LINE_CLASSES.APPROVED,
- 'R': GROUNDWATER_LINE_CLASSES.REVISED,
- 'P': GROUNDWATER_LINE_CLASSES.PROVISIONAL,
- 'default': GROUNDWATER_LINE_CLASSES.UNKNOWN_CODE
- };
-
- return groundwaterLineClass[groundwaterPointData['qualifiers'][0] ] || groundwaterLineClass['default'];
-};
/*
* Render the ground water level symbols on the svg in their own group. If the group exists, remove
* it before rendering again.
* @param {D3 elem} svg (could also be a group)
- * @param {Array of Object} levels - each object, should have dateTime and value properties
+ * @param {Array of Object} points - each object, should have dateTime and value properties
* @param {D3 scale} xScale
* @param {D3 scale } yScale
*/
-export const drawGroundwaterLevels = function(svg, {levels, xScale, yScale, enableClip}) {
+export const drawGroundwaterLevels = function(svg, {points, xScale, yScale, enableClip}) {
svg.selectAll('#iv-graph-gw-levels-group').remove();
const group = svg.append('g')
.attr('id', 'iv-graph-gw-levels-group');
@@ -42,12 +20,12 @@ export const drawGroundwaterLevels = function(svg, {levels, xScale, yScale, enab
group.attr('clip-path', 'url(#graph-clip)');
}
- levels.forEach((level) => {
+ points.forEach((point) => {
group.append('circle')
- .attr('class', `${GW_LEVEL_CLASS} ${getDetailsForApprovalCode(level).class}`)
+ .attr('class', `${GW_LEVEL_CLASS} ${point.approvals.class}`)
.attr('r', GW_LEVEL_RADIUS)
- .attr('cx', xScale(level.dateTime))
- .attr('cy', yScale(level.value));
+ .attr('cx', xScale(point.dateTime))
+ .attr('cy', yScale(point.value));
});
};
@@ -55,22 +33,18 @@ export const drawGroundwaterLevels = function(svg, {levels, xScale, yScale, enab
* Returns a circle marker that can be used to represent the groundwater level symbol in legends
* @return {Object} - see d3-rendering/markers module.
*/
-export const getGroundwaterLevelsMarker = function() {
- return defineCircleMarker(null, GW_LEVEL_CLASS, GW_LEVEL_RADIUS, 'Field visit');
-};
-
export const getGroundwaterLevelsMarkers = function(groundwaterApprovals) {
let groundwaterMarkers = [];
groundwaterMarkers.push(defineTextOnlyMarker('Field Visit: '));
if (groundwaterApprovals.provisional) {
- groundwaterMarkers.push(defineCircleMarker(null, `${GW_LEVEL_CLASS} ${GROUNDWATER_LINE_CLASSES.PROVISIONAL.class}`, GW_LEVEL_RADIUS, GROUNDWATER_LINE_CLASSES.PROVISIONAL.label));
+ groundwaterMarkers.push(defineCircleMarker(null, `${GW_LEVEL_CLASS} provisional`, GW_LEVEL_RADIUS, 'Provisional'));
}
if (groundwaterApprovals.approved) {
- groundwaterMarkers.push(defineCircleMarker(null, `${GW_LEVEL_CLASS} ${GROUNDWATER_LINE_CLASSES.APPROVED.class}`, GW_LEVEL_RADIUS, GROUNDWATER_LINE_CLASSES.APPROVED.label));
+ groundwaterMarkers.push(defineCircleMarker(null, `${GW_LEVEL_CLASS} approved`, GW_LEVEL_RADIUS, 'Approved'));
}
if (groundwaterApprovals.revised) {
- groundwaterMarkers.push(defineCircleMarker(null, `${GW_LEVEL_CLASS} ${GROUNDWATER_LINE_CLASSES.REVISED.class}`, GW_LEVEL_RADIUS, GROUNDWATER_LINE_CLASSES.REVISED.label));
+ groundwaterMarkers.push(defineCircleMarker(null, `${GW_LEVEL_CLASS} revised`, GW_LEVEL_RADIUS, 'Revised'));
}
return groundwaterMarkers;
};
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.test.js b/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.test.js
index 73d225dfd..68676c695 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.test.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/discrete-data.test.js
@@ -1,8 +1,9 @@
import {select} from 'd3-selection';
import {scaleLinear} from 'd3-scale';
-import {circleMarker} from 'd3render/markers';
-import {drawGroundwaterLevels, getGroundwaterLevelsMarker} from './discrete-data';
+import {circleMarker, textOnlyMarker} from 'd3render/markers';
+import {drawGroundwaterLevels, getGroundwaterLevelsMarkers} from './discrete-data';
+
describe('monitoring-location/components/hydrograph/discrete-data', () => {
describe('drawGroundwaterLevels', () => {
@@ -12,12 +13,12 @@ describe('monitoring-location/components/hydrograph/discrete-data', () => {
beforeEach(() => {
svg = select('body').append('svg');
gwLevels = [
- {value: '14.0', dateTime: 1491055200000, qualifiers: ['A', '1']},
- {value: '14.5', dateTime: 1490882400000, qualifiers: ['P', '1']},
- {value: '13.0', dateTime: 1490536800000, qualifiers: ['R', '1']},
- {value: '12.0', dateTime: 1489672800000, qualifiers: ['P', '1']},
- {value: '11.0', dateTime: 1489672300000, qualifiers: ['bad approval code', '1']},
- {value: '13.0', dateTime: 1489672100000, qualifiers: ['1']}
+ {value: '14.0', dateTime: 1491055200000, qualifiers: ['A', '1'], approvals: {label: 'Approved', class: 'approved'}},
+ {value: '14.5', dateTime: 1490882400000, qualifiers: ['P', '1'], approvals: {label: 'Provisional', class: 'provisional'}},
+ {value: '13.0', dateTime: 1490536800000, qualifiers: ['R', '1'], approvals: {label: 'Revised', class: 'revised'}},
+ {value: '12.0', dateTime: 1489672800000, qualifiers: ['P', '1'], approvals: {label: 'Provisional', class: 'provisional'}},
+ {value: '11.0', dateTime: 1489672300000, qualifiers: ['bad approval code', '1'], approvals: {label: 'code bad approval code', class: 'unknown-code-bad approval code'}},
+ {value: '13.0', dateTime: 1489672100000, qualifiers: ['1'], approvals: {label: 'code 1', class: 'unknown-code-1'}}
];
xScale = scaleLinear()
.domain([0, 100])
@@ -33,7 +34,7 @@ describe('monitoring-location/components/hydrograph/discrete-data', () => {
it('Renders correct number of circles with correct class for each gw level', () => {
drawGroundwaterLevels(svg, {
- levels: gwLevels,
+ points: gwLevels,
xScale: xScale,
yScale: yScale
});
@@ -41,17 +42,16 @@ describe('monitoring-location/components/hydrograph/discrete-data', () => {
expect(svg.selectAll('.approved').size()).toBe(1);
expect(svg.selectAll('.provisional').size()).toBe(2);
expect(svg.selectAll('.revised').size()).toBe(1);
- expect(svg.selectAll('.unknown-code').size()).toBe(2);
});
- it('A second call to render with no gw levels renders no circles', () => {
+ it('A second call to render with no gw points renders no circles', () => {
drawGroundwaterLevels(svg, {
- levels: gwLevels,
+ points: gwLevels,
xScale: xScale,
yScale: yScale
});
drawGroundwaterLevels(svg, {
- levels: [],
+ points: [],
xScale: xScale,
yScale: yScale
});
@@ -59,8 +59,15 @@ describe('monitoring-location/components/hydrograph/discrete-data', () => {
});
describe('getGroundwaterLevelsMarker', () => {
+ const groundwaterApprovals = {
+ provisional: true,
+ approved: false,
+ revised: false
+ };
+
it('Expects to return a circle marker', () => {
- expect(getGroundwaterLevelsMarker().type).toBe(circleMarker);
+ expect(getGroundwaterLevelsMarkers(groundwaterApprovals)[0].type).toBe(textOnlyMarker);
+ expect(getGroundwaterLevelsMarkers(groundwaterApprovals)[1].type).toBe(circleMarker);
});
});
});
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/graph-brush.js b/assets/src/scripts/monitoring-location/components/hydrograph/graph-brush.js
index a316f01bc..0ecc1f748 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/graph-brush.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/graph-brush.js
@@ -96,7 +96,7 @@ export const drawGraphBrush = function(container, store) {
enableClip: () => false
})))
.call(link(store, drawGroundwaterLevels, createStructuredSelector({
- levels: getVisibleGroundwaterLevelPoints,
+ points: getVisibleGroundwaterLevelPoints,
xScale: getBrushXScale('current'),
yScale: getBrushYScale,
enableClip: () => false
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/selectors/cursor.test.js b/assets/src/scripts/monitoring-location/components/hydrograph/selectors/cursor.test.js
index 35ac99278..444674aee 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/selectors/cursor.test.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/selectors/cursor.test.js
@@ -216,15 +216,15 @@ const TEST_STATE_THREE_VARS = {
},
values: [{
value: '10',
- qualifiers: [],
+ qualifiers: ['A', '1'],
dateTime: 1522346400000
}, {
value: '20',
- qualifiers: [],
+ qualifiers: ['P', '1'],
dateTime: 1522347300000
}, {
value: '30',
- qualifiers: [],
+ qualifiers: ['P', '1'],
dateTime: 1522348200000
}]
}
@@ -517,9 +517,16 @@ describe('monitoring-location/components/hydrograph/cursor module', () => {
};
expect(getGroundwaterLevelCursorPoint(testState)).toEqual({
- value: 20,
- qualifiers: [],
- dateTime: 1522347300000
+ 'approvals': {
+ 'class': 'provisional',
+ 'label': 'Provisional'
+ },
+ 'dateTime': 1522347300000,
+ 'qualifiers': [
+ 'P',
+ '1'
+ ],
+ 'value': 20
});
});
});
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.js b/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.js
index 77e239cf9..fd71a7b40 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.js
@@ -5,6 +5,23 @@ import {getIVCurrentVariableGroundwaterLevels} from 'ml/selectors/discrete-data-
import {getRequestTimeRange, getCurrentVariable} from 'ml/selectors/time-series-selector';
import {getIanaTimeZone} from 'ml/selectors/time-zone-selector';
+
+/*
+* Helper function that takes a raw approval code and matches it to a more detail object
+* @param {Object} approvalCode - details about a single groundwater data point
+* @return {Object} Details that expand on the meaning of the approval code.
+*/
+export const getDetailsForApprovalCode = function(approvalCode) {
+ const groundwaterLineClass = {
+ 'A': {label: 'Approved', class: 'approved'},
+ 'P': {label: 'Provisional', class: 'provisional'},
+ 'R': {label: 'Revised', class: 'revised'},
+ 'default': {label: `code ${approvalCode}`, class: `unknown-code-${approvalCode}`}
+ };
+
+ return groundwaterLineClass[approvalCode] || groundwaterLineClass['default'];
+};
+
/*
* Returns a selector function that returns the groundwater levels that will be visible
* on the hydrograpnh
@@ -27,27 +44,14 @@ export const getVisibleGroundwaterLevelPoints = createSelector(
.map((data) => {
return {
...data,
- value: parseFloat(data.value)
+ value: parseFloat(data.value),
+ approvals: getDetailsForApprovalCode(data.qualifiers[0])
};
});
}
);
-/*
-* When given an approval code, will return the text equivalent
-* @param {String} approvalCode - Usually a letter such as 'A'
-* @return {String} - an easy to understand text version of an approval code
-*/
-const approvalCodeText = function(approvalCode) {
- const approvalText = {
- P: 'Provisional',
- A: 'Approved',
- R: 'Revised',
- default: `unknown code: ${approvalCode}`
- };
- return approvalText[approvalCode] || approvalText.default;
-};
/*
* Selector function which returns a function that returns an array of gw data appropriate
@@ -71,7 +75,7 @@ export const getVisibleGroundwaterLevelsTableData = createSelector(
suppressMilliseconds: true,
suppressSeconds: true
}),
- approvals: approvalCodeText(point.qualifiers[0])
+ approvals: getDetailsForApprovalCode(point.qualifiers[0]).label
};
});
}
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.test.js b/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.test.js
index 599a804aa..bf109e8bb 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.test.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/selectors/discrete-data.test.js
@@ -85,14 +85,22 @@ describe('monitoring-location/components/hydrograph/selectors/discrete-data', ()
expect(result).toHaveLength(2);
expect(result[0]).toEqual({
+ 'approvals': {
+ 'class': 'provisional',
+ 'label': 'Provisional'
+ },
+ 'dateTime': 1490536800000,
'qualifiers': 'P',
- value: 13.0,
- dateTime: 1490536800000
+ 'value': 13
});
expect(result[1]).toEqual({
+ 'approvals': {
+ 'class': 'approved',
+ 'label': 'Approved'
+ },
+ 'dateTime': 1490882400000,
'qualifiers': 'A',
- value: 14.5,
- dateTime: 1490882400000
+ 'value': 14.5
});
});
});
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/time-series-graph.js b/assets/src/scripts/monitoring-location/components/hydrograph/time-series-graph.js
index 8caaa7f71..065d42492 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/time-series-graph.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/time-series-graph.js
@@ -272,7 +272,7 @@ export const drawTimeSeriesGraph = function(elem, store, siteNo, showMLName, sho
enableClip: () => true
})))
.call(link(store, drawGroundwaterLevels, createStructuredSelector({
- levels: getVisibleGroundwaterLevelPoints,
+ points: getVisibleGroundwaterLevelPoints,
xScale: getMainXScale('current'),
yScale: getMainYScale,
enableClip: () => true
diff --git a/assets/src/scripts/monitoring-location/components/hydrograph/tooltip.js b/assets/src/scripts/monitoring-location/components/hydrograph/tooltip.js
index d57d171ef..d368dc774 100644
--- a/assets/src/scripts/monitoring-location/components/hydrograph/tooltip.js
+++ b/assets/src/scripts/monitoring-location/components/hydrograph/tooltip.js
@@ -15,9 +15,6 @@ import {getMainLayout} from './selectors/layout';
import {getMainXScale, getMainYScale} from './selectors/scales';
import {getTsTimeZone, getCurrentVariableUnitCode} from './selectors/time-series-data';
-import {getDetailsForApprovalCode} from './discrete-data';
-
-
const getTsTooltipTextInfo = function(tsPoint, tsKey, unitCode, ianaTimeZone) {
let label = '';
if (tsPoint) {
@@ -59,7 +56,7 @@ const getGWLevelTextInfo = function(point, unitCode, ianaTimeZone) {
const timeLabel = DateTime.fromMillis(point.dateTime, {zone: ianaTimeZone}).toFormat('MMM dd, yyyy hh:mm:ss a ZZZZ');
return {
label: `${valueLabel} - ${timeLabel}`,
- classes: ['gwlevel-tooltip-text', `${getDetailsForApprovalCode(point).class}`]
+ classes: ['gwlevel-tooltip-text', `${point.approvals.class}`]
};
};
--
GitLab