p632-sp-2017/microservice-catalog-frontend

import React from 'react';
import { Alert, Button , PageHeader , Jumbotron , FormGroup } from 'react-bootstrap';
import FontAwesome from 'react-fontawesome';

import { formFields } from './AddServiceFields';

let EditForm = (props) => {
  const { onSubmitEdit, submitSucceeded, error, handleSubmit, pristine, reset, submitting, initialValues }=props;

  return(
    <div>
      <PageHeader>Edit MicroService</PageHeader>
      { submitSucceeded &&
        <Alert bsStyle="success">
          <strong>Microservice Successfully Edited!</strong>
        </Alert>
      }
      {
        error &&
        <Alert bsStyle="danger">
          <strong>Sorry! Some error has occurred...</strong>
        </Alert>
      }
      <Jumbotron>
          {
            initialValues === undefined &&
            <FontAwesome name="pulse fa-spinner" className="fa-4x" />
          }
          {
            initialValues !== undefined &&
            <form onSubmit={handleSubmit(onSubmitEdit)}>
              <FormGroup  bsSize="large">
                <div className="FieldContainer">
                  {formFields}
                </div>
                <div className="buttonContainer">
                  <Button className="col-md-1 text-center" type="submit" bsStyle="primary" disabled={submitting}>Submit</Button>
                  <Button className="col-md-1 text-center" type="button" bsStyle="danger">Cancel</Button>
                  <Button className="col-md-1 text-center" type="reset" disabled={pristine || submitting} onClick={reset}>Clear Values</Button>
                </div>
              </FormGroup>
            </form>
          }
     </Jumbotron>
    </div>
  );
}

EditForm.displayName = 'EditForm';

export default EditForm;