import React from 'react';
import cn from 'classnames';
import { Container, Text, Checkbox } from './styled';

type DefaultOptionPropTypes = {
  isDefault: boolean;
  onChange: (state: boolean) => void;
  className: string;
};

const DefaultOption = ({ isDefault, onChange, className }: DefaultOptionPropTypes) => (
  <Container className={cn({
    [`${className}-default-option`]: className,
  })}
  >
    <Checkbox
      label="Make default view"
      checked={isDefault}
      onChange={onChange}
    />
    <Text variant="hintText">
      This will be the view this page will always open on
    </Text>
  </Container>
);

export default DefaultOption;