Permalink
Browse files

Add new `Add Category` component

  • Loading branch information...
dusty-phillips committed Aug 27, 2018
1 parent e5657a6 commit eb28990494934a93ed389186597b8317029b124d
Showing with 60 additions and 1 deletion.
  1. +5 −1 src/App.js
  2. +55 −0 src/components/AddCategory.js
@@ -3,13 +3,17 @@ import { Provider } from "react-redux"
import store from "./redux/store"
import AuthButton from "./components/AuthButton"
import AddCategory from "./components/AddCategory"
class App extends Component {
render() {
return (
<Provider store={store}>
<AuthButton />
<div>
<AuthButton />
<AddCategory />
</div>
</Provider>
)
}
@@ -0,0 +1,55 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { compose } from 'redux'
import { firestoreConnect } from 'react-redux-firebase'
class AddCategory extends Component {
static propTypes = {
uid: PropTypes.string,
firestore: PropTypes.shape({
add: PropTypes.func.isRequired
}).isRequired
}
state = { category: '' }
addCategory() {
this.props.firestore.add(
{ collection: 'categories' },
{
uid: this.props.uid,
name: this.state.category
}
)
this.setState({ category: '' })
}
render() {
if (!this.props.uid) return null
return (
<div>
<input
type="text"
value={this.state.category}
onChange={(evt) => this.setState({ category: evt.target.value })}
/>
<button onClick={(evt) => this.addCategory()}>Add Category</button>
</div >
)
}
}
const mapStateToProps = state => {
return {
uid: state.firebase.auth.uid,
}
}
const mapDispatchToProps = {}
export default compose(
connect(mapStateToProps, mapDispatchToProps),
firestoreConnect(),
)(AddCategory)

0 comments on commit eb28990

Please sign in to comment.