radiobutton-dynamic-naming

[eatyourpeas]

Overview

A bug first identified by @dmc-cambric that when two `<RCPCHChart key={'1'} {...props}/> components are rendered side by side, the radiobuttons toggling between chronological/corrected/both ages were clashing - selecting the buttons would update the state and refresh the plot, but would deselect the radio button in the other component.

This was because the name attribute in the radiobutton group was clashing in the DOM with the other instance.

Alongside the fix for this, opportunistically a few small changes were also made.

Code changes

• AgeRadioButtonGroup.tsx introduces a randomly generated string appended to the id and the name of each radiobutton input for the life of the component.
• StyledResetZoomButton - passes the margin prop through to the component from makeAllStyles. sets the border-radius to 0 as button showing as rounded in storybook
• rename the callback from the radiobutton group from handleClick (which is used elsewhere) to more meaningful name
• bug fix for tanner2 them which had been duplicated with tanner1 in error. Returns the theme to the orginal tanner2 styles
• package.json bumps the version as a patch

Related Issues

closes #85

Mentions

Many thanks to @dmc-cambric for picking this up and ongoing support for the project.