Recidiviz / justice-counts-components

A set of React components powering a web app for exploring centralized, standardized metrics on the performance of justice systems across the United States
GNU General Public License v3.0
1 stars 0 forks source link

Add the date range to each metric block. #70

Closed hobuobi closed 3 years ago

hobuobi commented 3 years ago

Previously, the date range for the data presented in the metric blocks (both in the flow diagram and the Key Insights section) was only visible in the introductory text and the header of the flow diagram. This caused some confusion, as testers were sometimes confused about what dates the metrics were associated with.

To fix this, we will now add the range of dates that corresponds with a given metric in the the metric block itself. This involves three main changes:

  1. Date range should appear below the main numbers in the metric block. This should appear as "{most recent month-year} (compared to {month-year used for the % change})" -- for example, "January 2020 (compared to January 2019)".
  2. The orange warning icon should no longer appear in the upper-right hand corner. Instead, it should appear next to the date range.
  3. The text for the warning icon tooltip should now read: "This icon indicates that the dates that correspond with this metric are not aligned with the primary date range ({most recent month-year} --> {month-year used for the % change}."

See mock below (or Figma): Date Range (Final)

nasaownsky commented 3 years ago

Hey, @hobuobi! As @jessex has mentioned in #74 I don't exactly sure what date range must be in tooltip of warning icon. Should it be the primary range or range that used for % change of not aligned metric? If I understood right it must be the second option and must appear only when % change (year range) exists.

jessex commented 3 years ago

Looks like you're good to go here after Humphrey's comment on the PR. Thanks, @nasaownsky!