message: enhancement: adding options
diff: -import React, { useEffect } from "react";
  +import React, { useEffect, useState } from "react";
  import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
  import Chip from "@material-ui/core/Chip";
  import { TextField, Grid, Divider } from "@material-ui/core";
  import _includes from "lodash/includes";
  import _camelCase from "lodash/camelCase";
  +import AddIcon from "@material-ui/icons/AddCircle";
  +import IconButton from "@material-ui/core/IconButton";
  +import InputAdornment from "@material-ui/core/InputAdornment";
  const useStyles = makeStyles(Theme =>
  createStyles({
  - root: {
  + root: {},
  + field: {
  + width: "100%",
  + },
  + chipsContainer: {
  display: "flex",
  justifyContent: "center",
  flexWrap: "wrap",
  @@ -23,10 +30,13 @@ const useStyles = makeStyles(Theme =>
  export default function SelectOptionsInput(props: any) {
  const { options, setValue } = props;
  const classes = useStyles();
  -
  - const handleAdd = (newOption: string) => {
  + const [newOption, setNewOption] = useState("");
  + const handleAdd = () => {
  // setOptions([...options, newOption]);
  + if (newOption !== "") {
  setValue("options", [...options, newOption]);
  + setNewOption("");
  + }
  };
  const handleDelete = (optionToDelete: string) => () => {
  const newOptions = options.filter(
  @@ -43,17 +53,35 @@ export default function SelectOptionsInput(props: any) {
  <Grid container direction="column" className={classes.root}>
  <Grid item>
  <TextField
  + value={newOption}
  + className={classes.field}
  label="New Option"
  + onChange={e => {
  + setNewOption(e.target.value);
  + }}
  onKeyPress={(e: any) => {
  - const value = e.target.value;
  if (e.key === "Enter") {
  - handleAdd(value);
  - e.target.value = "";
  + handleAdd();
  }
  }}
  + InputProps={{
  + endAdornment: (
  + <InputAdornment position="end">
  + <IconButton
  + edge="end"
  + aria-label="toggle password visibility"
  + onClick={(e: any) => {
  + handleAdd();
  + }}
  + >
  + {<AddIcon />}
  + </IconButton>
  + </InputAdornment>
  + ),
  + }}
  />
  </Grid>
  - <Grid item>
  + <Grid item className={classes.chipsContainer}>
  {options.map((option: string) => {
  return (
  <Chip
  