Refactor PropertyActionButtons not to have the AddButton subcomp… (#834)

Refactor PropertyActionButtons not to have the AddButton subcomponent

__tests__/components/editor/property/PropertyActionButtons.test.js

@@ -2,40 +2,42 @@
 
 import React from 'react'
 import { shallow } from 'enzyme'
+import PropertyActionButtons from 'components/editor/property/PropertyActionButtons'
 
-import { AddButton, PropertyActionButtons } from 'components/editor/property/PropertyActionButtons'
-
-describe('<AddButton />', () => {
-  const addButtonWrapper = shallow(<AddButton />)
-
-  it('has label "Add"', () => {
-    expect(addButtonWrapper.text()).toEqual('Add')
-  })
-
-  it('is not disabled by default', () => {
-    expect(addButtonWrapper.instance().props.isDisabled).toBeFalsy()
+describe('<PropertyActionButtons />', () => {
+  const mockAddClick = jest.fn()
+  let propertyActionWrapper
+  beforeEach(() => {
+    propertyActionWrapper = shallow(<PropertyActionButtons handleAddClick={mockAddClick}/>)
   })
 
-  it('is disabled if isDisabled prop is true', () => {
-    const disabledAddButtonWrapper = shallow(<AddButton isDisabled={true} />)
+  describe('Add Button', () => {
+    let button
+    beforeEach(() => {
+      button = propertyActionWrapper.find('button')
+    })
 
-    expect(disabledAddButtonWrapper.instance().props.isDisabled).toBeTruthy()
-  })
-})
+    it('has label "Add"', () => {
+      expect(button.text()).toEqual('Add')
+    })
 
-describe('<PropertyActionButtons />', () => {
-  const mockAddClick = jest.fn()
-  const propertyActionWrapper = shallow(<PropertyActionButtons handleAddClick={mockAddClick}/>)
+    it('is not disabled by default', () => {
+      expect(button.prop('disabled')).toBeUndefined()
+    })
 
-  describe('Add Button', () => {
-    const addButton = propertyActionWrapper.find(AddButton)
+    describe('when addButtonDisabled is true', () => {
+      beforeEach(() => {
+        propertyActionWrapper = shallow(<PropertyActionButtons addButtonDisabled={true}/>)
+        button = propertyActionWrapper.find('button')
+      })
 
-    it('contains AddButton', () => {
-      expect(addButton).toBeTruthy()
+      it('is set to disabled', () => {
+        expect(button.prop('disabled')).toBe(true)
+      })
     })
 
     it('Add button responds when clicked', () => {
-      addButton.simulate('click')
+      button.simulate('click')
       expect(mockAddClick).toHaveBeenCalledTimes(1)
     })
   })

__tests__/components/editor/property/PropertyResourceTemplate.test.js

@@ -3,7 +3,7 @@
 import React from 'react'
 import 'jsdom-global/register'
 import { mount, shallow } from 'enzyme'
-import { PropertyActionButtons } from 'components/editor/property/PropertyActionButtons'
+import PropertyActionButtons from 'components/editor/property/PropertyActionButtons'
 import PropertyResourceTemplate from 'components/editor/property/PropertyResourceTemplate'
 import PropertyTemplateOutline from 'components/editor/property/PropertyTemplateOutline'
 import shortid from 'shortid'

src/components/editor/property/PropertyActionButtons.jsx

@@ -1,43 +1,17 @@
 // Copyright 2019 Stanford University see LICENSE for license
 
-import React, { Component } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
 
-export class AddButton extends Component {
-  constructor(props) {
-    super(props)
-  }
-
-  render() {
-    return (
-      <button className="btn btn-default btn-sm"
-              onClick={this.props.onClick}
-              disabled={this.props.isDisabled}>Add</button>
-    )
-  }
-}
-
-export class PropertyActionButtons extends Component {
-  constructor(props) {
-    super(props)
-  }
-
-  render() {
-    return (<div className="btn-group" role="group" aria-label="...">
-      <AddButton onClick={this.props.handleAddClick} isDisabled={this.props.addButtonDisabled}/>
-    </div>)
-  }
-}
+const PropertyActionButtons = props => (<div className="btn-group" role="group" aria-label="...">
+  <button className="btn btn-default btn-sm"
+          onClick={ props.handleAddClick }
+          disabled={ props.addButtonDisabled }>Add</button>
+</div>)
 
 PropertyActionButtons.propTypes = {
   addButtonDisabled: PropTypes.bool,
   handleAddClick: PropTypes.func,
 }
 
-AddButton.propTypes = {
-  isDisabled: PropTypes.bool,
-  onClick: PropTypes.func,
-  reduxPath: PropTypes.array,
-}
-
 export default PropertyActionButtons