session-desktop/ts/components/session/SessionRadioGroup.tsx

import React from 'react';

import { SessionRadio } from './SessionRadio';

interface Props {
  initalItem: string;
  items: Array<any>;
  group: string;
  onClick?: any;
}

interface State {
  activeItem: string;
}

export class SessionRadioGroup extends React.PureComponent<Props, State> {
  public static defaultProps = {
    onClick: () => null,
  };

  constructor(props: any) {
    super(props);
    this.clickHandler = this.clickHandler.bind(this);

    this.state = {
      activeItem: this.props.initalItem,
    }
  }

  public render() {
    const { items, group } = this.props;
    
    return (
      <div
        className='session-radio-group'
      >
        <fieldset id={group}>
          { items.map(item => {
              return (
                <SessionRadio
                  key={item.value}
                  label={item.label}
                  active={item.value === this.state.activeItem}
                  value={item.value}
                  group={group}
                  onClick={this.clickHandler}
                />
              );
            })
          }
        </fieldset>
      </div>
    );
  }

  private clickHandler() {
    if (this.props.onClick) {
      this.props.onClick();      
    }
  }
}