From ee90f2413ddbee998b50e44d3ff6211d72bd7ae1 Mon Sep 17 00:00:00 2001 From: Patrick Hanley Date: Thu, 27 Jul 2023 07:23:13 -0700 Subject: [PATCH 1/4] Changed 'you are here' line to points on baseline and reform chart and updated hovercard message --- .../BaselineAndReformChart.jsx | 25 ++++++++++++++----- 1 file changed, 19 insertions(+), 6 deletions(-) diff --git a/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx b/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx index a28896528..0c622d79f 100644 --- a/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx +++ b/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx @@ -145,6 +145,7 @@ function BaselineAndReformTogetherPlot(props) { variableLabel, metadata, variable, + baselineValue } = props; let data = [ ...(variable === "household_net_income" @@ -174,15 +175,27 @@ function BaselineAndReformTogetherPlot(props) { hoverinfo: "none", }, { - x: [currentEarnings, currentEarnings], - y: [0, currentValue], - type: "line", - name: `Your current ${variableLabel}`, + x: [currentEarnings], + y: [currentValue], + type: "scatter", + mode: "markers", + name: `Your reform ${variableLabel}`, line: { - color: style.colors.MEDIUM_DARK_GRAY, + color: style.colors.BLUE, }, hoverinfo: "none", }, + { + x: [currentEarnings], + y: [baselineValue], + type: "scatter", + mode: "markers", + name: `Your baseline ${variableLabel}`, + line: { + color: style.colors.MEDIUM_DARK_GRAY, + }, + hoverinfo: "none", + } ]; const plotObject = ( Date: Fri, 28 Jul 2023 07:40:49 -0700 Subject: [PATCH 2/4] Changed 'you are here' line to points on baseline and reform delta plot --- .../output/EarningsVariation/BaselineAndReformChart.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx b/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx index 0c622d79f..8017ecf0a 100644 --- a/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx +++ b/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx @@ -301,12 +301,12 @@ function BaselineReformDeltaPlot(props) { hoverinfo: "none", }, { - x: [currentEarnings, currentEarnings], - y: [0, currentValue - baselineValue], - type: "line", + x: [currentEarnings], + y: [currentValue - baselineValue], + type: "scatter", name: `Your current change in ${variableLabel}`, line: { - color: style.colors.MEDIUM_DARK_GRAY, + color: style.colors.BLUE, }, hoverinfo: "none", }, From e7e3b656ed0dc3cf886866992ad41d5be60738a3 Mon Sep 17 00:00:00 2001 From: Patrick Hanley Date: Fri, 4 Aug 2023 07:25:10 -0700 Subject: [PATCH 3/4] added test file for BaselineAndReformChart --- src/__tests__/BaselineAndReformChart.test.js | 46 ++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 src/__tests__/BaselineAndReformChart.test.js diff --git a/src/__tests__/BaselineAndReformChart.test.js b/src/__tests__/BaselineAndReformChart.test.js new file mode 100644 index 000000000..1b7196fe8 --- /dev/null +++ b/src/__tests__/BaselineAndReformChart.test.js @@ -0,0 +1,46 @@ +import { fireEvent, render, screen, within } from "@testing-library/react"; +import BaselineAndReformChart from "pages/household/output/EarningsVariation/BaselineAndReformChart"; +import { + formatVariableValue, + getValueFromHousehold, + } from "api/variables.js"; + +jest.mock("react-plotly.js", () => jest.fn()); +jest.mock("../api/variables.js", () => ({ + getValueFromHousehold: jest.fn(), + getPlotlyAxisFormat: jest.fn() +})); + +const metadata = { + variables: { + employment_income: { + unit: "currency-USD" + }, + household_net_income: { + unit: "currency-USD" + }, + "abc": { + unit: "currency-USD" + }, + } +}; + +describe("Test Render Output", () => { + test("Should render toggle", () => { + getValueFromHousehold.mockImplementation(() => { + const testResult = [1,2,3]; + return testResult; + }); + render( + + ) + + fireEvent.click(screen.getByRole('radio', { name: /difference/i })); + + const diffButton = screen.getByRole('radio', { name: /difference/i }); + + expect(diffButton).toHaveProperty("checked", true); + }); + + //TODO: Add tests for actual plot components BaselineAndReformTogetherPlot & BaselineReformDeltaPlot +}); \ No newline at end of file From 426d50033b0eab8f65743d5ed429886be59a8cc9 Mon Sep 17 00:00:00 2001 From: Patrick Hanley Date: Sun, 6 Aug 2023 09:36:39 -0700 Subject: [PATCH 4/4] updated legend for baseline and reform diff plot, and baseline only plot --- .../output/EarningsVariation/BaselineAndReformChart.jsx | 1 + .../output/EarningsVariation/BaselineOnlyChart.jsx | 7 ++++--- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx b/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx index 8017ecf0a..27b6b4ecf 100644 --- a/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx +++ b/src/pages/household/output/EarningsVariation/BaselineAndReformChart.jsx @@ -304,6 +304,7 @@ function BaselineReformDeltaPlot(props) { x: [currentEarnings], y: [currentValue - baselineValue], type: "scatter", + mode: "markers", name: `Your current change in ${variableLabel}`, line: { color: style.colors.BLUE, diff --git a/src/pages/household/output/EarningsVariation/BaselineOnlyChart.jsx b/src/pages/household/output/EarningsVariation/BaselineOnlyChart.jsx index 9d9efa16d..df9f701f2 100644 --- a/src/pages/household/output/EarningsVariation/BaselineOnlyChart.jsx +++ b/src/pages/household/output/EarningsVariation/BaselineOnlyChart.jsx @@ -75,12 +75,13 @@ export default function BaselineOnlyChart(props) { hoverinfo: "none", }, { - x: [currentEarnings, currentEarnings], - y: [0, currentNetIncome], + x: [currentEarnings], + y: [currentNetIncome], type: "line", + mode: "markers", name: `Your current ${variableLabel}`, line: { - color: style.colors.MEDIUM_DARK_GRAY, + color: style.colors.BLUE, }, hoverinfo: "none", },