Refactor radio group buttons

src/Components/RadioGroupButtons/RadioGroupButtons.tsx

@@ -0,0 +1,53 @@
+import * as React from 'react';
+import { IInputGroup } from '../../Interfaces/IInputGroup';
+
+interface IRadioGroupButtonsProps {
+  name: string
+  value?: string
+  defaultValue?: string
+  labelText: string
+  inputGroups: IInputGroup[]
+  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void
+}
+
+export const RadioGroupButtons: React.FunctionComponent<IRadioGroupButtonsProps> = (props) => {
+  let inputGroups;
+  if (props.value !== undefined) {
+    inputGroups = props.inputGroups.map((inputGroup) => (
+      <label key={inputGroup.value}>
+        <input
+          type='radio'
+          name={props.name}
+          value={inputGroup.value}
+          checked={props.value === inputGroup.value}
+          onChange={props.onChange}
+        />
+        {inputGroup.text}
+      </label>
+    ));
+  } else {
+    inputGroups = props.inputGroups.map((inputGroup) => (
+      <label key={inputGroup.value}>
+        <input
+          type='radio'
+          name={props.name}
+          value={inputGroup.value}
+          defaultChecked={props.defaultValue === inputGroup.value}
+          onChange={props.onChange}
+        />
+        {inputGroup.text}
+      </label>
+    ));
+  }
+
+  return (
+    <>
+      <label>
+        {props.labelText}
+      </label>
+      <div id='XPositionReference'>
+        { inputGroups }
+      </div>
+    </>
+  );
+};