diff --git a/package-lock.json b/package-lock.json
index b89d6503..4f5feed9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1952,13 +1952,6 @@
"requires": {
"follow-redirects": "1.5.10",
"is-buffer": "^2.0.2"
- },
- "dependencies": {
- "is-buffer": {
- "version": "2.0.3",
- "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.3.tgz",
- "integrity": "sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw=="
- }
}
},
"axobject-query": {
diff --git a/src/App.js b/src/App.js
index c4854e15..d9ca6872 100644
--- a/src/App.js
+++ b/src/App.js
@@ -10,8 +10,8 @@ class App extends Component {
- Board
+
+ {this.makeCollection()}
+
)
}
-
}
Board.propTypes = {
-
+ url: PropTypes.string.isRequired,
+ boardName: PropTypes.string.isRequired
};
export default Board;
diff --git a/src/components/Card.js b/src/components/Card.js
index 6788cc03..603f5a6f 100644
--- a/src/components/Card.js
+++ b/src/components/Card.js
@@ -1,21 +1,41 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import emoji from 'emoji-dictionary';
-
import './Card.css';
class Card extends Component {
+ // deleteButton = () => {
+ // return
+ // }
+
render() {
return (
- Card
+
+
+
+ {this.props.text}
+
+
+ {this.props.emoji}
+
+
)
}
}
Card.propTypes = {
-
+ text: PropTypes.string,
+ emoji: PropTypes.string,
+ id: PropTypes.number.isRequired,
+ deleteCard: PropTypes.func.isRequired,
};
export default Card;
diff --git a/src/components/NewCardForm.js b/src/components/NewCardForm.js
index 47331423..5f7d6f81 100644
--- a/src/components/NewCardForm.js
+++ b/src/components/NewCardForm.js
@@ -3,4 +3,92 @@ import PropTypes from 'prop-types';
import emoji from 'emoji-dictionary';
import './NewCardForm.css';
+const emojis = require("emoji-dictionary");
const EMOJI_LIST = ["", "heart_eyes", "beer", "clap", "sparkling_heart", "heart_eyes_cat", "dog"]
+
+class NewCardForm extends Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ text: "",
+ emoji: ""
+ };
+ }
+
+ onChange = (event) => {
+ const { name, value } = event.target;
+
+ const updatedState = {};
+ updatedState[name] = value;
+
+ this.setState(updatedState);
+ };
+
+ onSelect = event => {
+ this.setState({
+ emoji: event.target.value
+ });
+ };
+
+ onSubmit = (e) => {
+ e.preventDefault();
+
+ let newSubmission = {}
+ Object.keys(this.state).forEach((key) => {
+ if ( key === 'Emoji' || key === "emoji" ) {
+ const value = this.state[key]
+ newSubmission[key] = emoji.getName(value)
+ } else {
+ newSubmission[key] = this.state[key]
+ }
+ });
+
+ this.props.addCard(newSubmission);
+
+ this.setState({
+ text: "",
+ emoji: ""
+ });
+ }
+
+ render() {
+ const emojiList = EMOJI_LIST.map((emoji, i) => {
+ return
+ });
+
+ return (
+
+ )
+ }
+}
+
+NewCardForm.propTypes = {
+ addCard: PropTypes.func.isRequired
+};
+
+export default NewCardForm;