Please fix those errors.

Please fix those errors.

import React from 'react';
class ContactForm extends React.Component {
 constructor(props) {
  super(props);
  this.state = {
   name: '',
   storageType: '',
   maxItem: '',
   resourceName: '',
   maxResource: '',
   resourceType: '',
   currentResource: '',
   display: false
  };
  this.handleNameChange = this.handleNameChange.bind(this);
  this.handleStorageTypeChange = this.handleStorageTypeChange.bind(this);
  this.handleMaxItemChange = this.handleMaxItemChange.bind(this);
  this.handleResourceNameChange = this.handleResourceNameChange.bind(this);
  this.handleResourceTypeChange = this.handleResourceTypeChange.bind(this);
  this.handleMaxResourceChange = this.handleMaxResourceChange.bind(this);
  this.handleCurrentResourceChange = this.handleCurrentResourceChange.bind(this);
  this.handleSubmit = this.handleSubmit.bind(this);
 }
 handleNameChange(event) {
  const target = event.target;
  const value = target.type === 'checkbox' ? target.checked : target.value;
  const name = target.name;

  this.setState({
   name: value
  })
  console.log('Change detected. State updated' + name + ' = ' + value);

 }
 handleStorageTypeChange(event) {
  const target = event.target;
  const value = target.type === 'checkbox' ? target.checked : target.value;

  this.setState({
   storageType: value
  })
 }
 handleMaxItemChange(event) {
  const target = event.target;
  const value = target.type === 'checkbox' ? target.checked : target.value;

  this.setState({
   maxItem: value
  })
 }
 handleResourceNameChange(event) {
  this.setState({
   resourceName: event.target.value
  })
 }
 handleResourceTypeChange(event) {
  this.setState({
   resourceType: event.target.value
  })
 }
 handleMaxResourceChange(event) {
  this.setState({
   maxResource: event.target.value
  })
 }
 handleCurrentResourceChange(event) {
  this.setState({
   currentResource: event.target.value
  })
 }
 handleSubmit() {
  this.setState({
   display: true
  })
 }
 displayButtons() {
  const back = <div>
   <input type="button" onClick={this.handleSubmit} value="Back" />
  <input type="button" onClick={this.handleSubmit} value="Edit" />
  <input type="button" onClick={this.handleSubmit} value="Delete" /></div>
  return back;
 }
 render() {
  return (
   <div>
    <form>
     <div className="form-group">
      <h1> Inventory </h1>
      <label for="nameInput">Name</label>
      <input type="text" name="name" value={this.state.name} onChange={this.handleNameChange}
       className="form-control" id="nameInput" placeholder="Name" />
     </div>
     <div className="form-group">
      <label for="storageType">Storage Type</label>
      <input name="storage" type="text" value={this.state.storageType} onChange={this.handleStorageTypeChange}
       className="form-control" id="storageType" placeholder="Storage Type" />
     </div>
     <div className="form-group">
      <label for="nameInput">Max Item Capacity</label>
      <input type="text" name="maxItem" value={this.state.maxItem} onChange={this.handleMaxItemChange}
       className="form-control" id="nameInput" placeholder="Max Item Capacity" />
     </div>
     <div className="form-group">
      <h1> Resources </h1>
      <label for="nameInput">Resource Name</label>
      <input type="text" name="resourceName" value={this.state.resourceName} onChange={this.handleResourceNameChange}
       className="form-control" id="nameInput" placeholder="Resource Name" />
     </div>
     <div className="form-group">
      <label for="nameInput">Resource Type</label>
      <input name="resourceType" value={this.state.resourceType} onChange={this.handleResourceTypeChange}
       className="form-control" id="nameInput" placeholder="Resource Type" />
     </div>
     <div className="form-group">
      <label for="nameInput">Max Number of Resources</label>
      <input name="maxResource" value={this.state.maxResource} onChange={this.handleMaxResourceChange}
       className="form-control" id="nameInput" placeholder="Max Number of Resources" />
     </div>
     <div className="form-group">
      <label for="nameInput">Current Number of Resources</label>
      <input type="text" name="currentResource" value={this.state.currentResource} onChange={this.handleCurrentResourceChange}
       className="form-control" id="nameInput" placeholder="Current number of Resources" />
     </div>
     <input type="button" onClick={this.handleSubmit} value="Submit form" />
     {this.state.display ? this.displayButtons() : ''}
    </form>
   </div>
  )
 }

}
class MainTitle extends React.Component {
 render() {
  return (
   <h1> Add Inventory </h1>
  )
 }
}
export default class App extends React.Component {
 render() {
  return (
   <div>
    <MainTitle />
    <ContactForm />
   </div>
  )
 }

}