import React, { Fragment, PureComponent } from 'react';

import { withStyles } from '@material-ui/core/styles';
import { Grid } from '@material-ui/core';
import Button from '@material-ui/core/Button';
import ObservationsSection from './ObservationsSection/ObservationsSection';
import DiagnosesSection from './DiagnosesSection/DiagnosesSection';
import PrescriptionsSection from './PrescriptionsSection/PrescriptionsSection';
import TextSectionReview from './TextSectionReview';

import green from '../../../../style/theme/colors/green';

const styles = theme => ({
  title: {
    marginTop: theme.spacing.unit * 6,
    marginBottom: theme.spacing.unit * 6
  },
  submitButton: {
    marginTop: theme.spacing.unit * 8,
    marginBottom: theme.spacing.unit * 8
  },
  medicalConditions: {
    marginLeft: theme.spacing.unit * 10,
    marginRight: theme.spacing.unit * 10
  },
  addButtonText: {
    display: 'inline-block'
  },
  addButton: {
    color: green[200],
    cursor: 'pointer'
  }
});


class ReviewForm extends PureComponent {
  render() {
    const {
      previousPage, handleSubmit, messages, error, classes
    } = this.props;
    return (
      <Fragment>
        <form onSubmit={handleSubmit}>
          <ObservationsSection
            previousPage={previousPage}
            classes={classes}
          />
          <TextSectionReview
            title="Problem"
            label="add label here"
            placeholder="put placeholder"
            previousPage={previousPage}
            fieldname="problem"
            multiline
          />

          <DiagnosesSection
            classes={classes}
            previousPage={previousPage}
          />

          <TextSectionReview
            title="Plan"
            label="add label here"
            placeholder="put placeholder"
            previousPage={previousPage}
            fieldname="plan"
            multiline
          />

          <PrescriptionsSection
            previousPage={previousPage}
            classes={classes}
          />


          <Button
            type="submit"
            color="primary"
            variant="contained"
            className={classes.submitButton}
          >
        Continue
          </Button>
        </form>
      </Fragment>
    );
  }
}

export default withStyles(styles)(ReviewForm);