import React from 'react';
import styled from 'styled-components';
import RadioButtonGroup from '../../../../../common/radio-group/RadioButtonGroup';
import { StandardOptionsType } from '@bjsdistribution/dms-component-library';

interface IProps {
  refusedDelPointService: any;
  setRefusedDelPointService: React.Dispatch<React.SetStateAction<any>>;
}

const deliveryPoints: StandardOptionsType[] = [
  {
    label: 'Hallway',
    value: 'hallway',
  },
  {
    label: 'ROC',
    value: 'room_of_choice',
  },
];

function DeliveryPoint(props: IProps) {
  const radioGroupHandler = (event: React.ChangeEvent<HTMLInputElement>) => {
    const service = event.target.value;
    props?.setRefusedDelPointService(service);
  };

  return (
    <Container>
      <RadioButtonGroup
        heading="Delivery Point"
        options={deliveryPoints || []}
        onChange={radioGroupHandler}
        direction="horizontal"
        selectedValue={props?.refusedDelPointService}
        required={false}
      />
    </Container>
  );
}

const Container = styled.div`
  display: flex;
  /* height: 30px; */
  padding: 1px;
  align-items: flex-start;
  align-self: stretch;
`;

export default DeliveryPoint;
