- Card
+
+
{props.text}
+
{emoji.getUnicode(`${props.emoji}`)}
+
)
}
Card.propTypes = {
-
+ text: PropTypes.string,
+ emoji: PropTypes.string,
+ id: PropTypes.number,
+ onDeleteCallback: PropTypes.func.isRequired
};
export default Card;
diff --git a/src/components/NewCardForm.js b/src/components/NewCardForm.js
index 47331423..63380258 100644
--- a/src/components/NewCardForm.js
+++ b/src/components/NewCardForm.js
@@ -1,6 +1,68 @@
-import React, { Component } from 'react';
+import React, { Component, useState } from 'react';
import PropTypes from 'prop-types';
import emoji from 'emoji-dictionary';
import './NewCardForm.css';
const EMOJI_LIST = ["", "heart_eyes", "beer", "clap", "sparkling_heart", "heart_eyes_cat", "dog"]
+
+const NewCardForm = (props) => {
+
+ const [formFields, setFormFields] = useState({
+ text: '',
+ emoji: '',
+ })
+
+ const onInputChange = (event) => {
+ const newFormFields = {...formFields}
+ newFormFields[event.target.name] = event.target.value;
+ setFormFields(newFormFields);
+ };
+
+ const onFormSubmit = (event) => {
+ event.preventDefault();
+
+ props.addCardCallback(formFields);
+
+ setFormFields({
+ text: '',
+ emoji: '',
+ });
+ };
+
+ return(
+
+ )
+}
+
+NewCardForm.propTypes = {
+ addCardCallback: PropTypes.func.isRequired
+}
+
+export default NewCardForm;
diff --git a/src/components/NewCardForm.test.js b/src/components/NewCardForm.test.js
index e69de29b..c7866dc0 100644
--- a/src/components/NewCardForm.test.js
+++ b/src/components/NewCardForm.test.js
@@ -0,0 +1,18 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react'
+import NewCardForm from './NewCardForm';
+
+describe('NewCardForm', () => {
+ test('that it matches the existing snapshot', () => {
+ // Arrange-Act
+ const { asFragment } = render(
+
{}}
+ />
+ );
+
+ // Assert
+ expect(asFragment()).toMatchSnapshot();
+ cleanup();
+ });
+});
\ No newline at end of file
diff --git a/src/components/__snapshots__/Board.test.js.snap b/src/components/__snapshots__/Board.test.js.snap
new file mode 100644
index 00000000..f8895571
--- /dev/null
+++ b/src/components/__snapshots__/Board.test.js.snap
@@ -0,0 +1,82 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`BoardTest that it matches the existing snapshot 1`] = `
+
+
+
+`;
diff --git a/src/components/__snapshots__/NewCardForm.test.js.snap b/src/components/__snapshots__/NewCardForm.test.js.snap
new file mode 100644
index 00000000..9e2f6739
--- /dev/null
+++ b/src/components/__snapshots__/NewCardForm.test.js.snap
@@ -0,0 +1,80 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`NewCardForm that it matches the existing snapshot 1`] = `
+
+
+
+`;
diff --git a/src/data/card-data.json b/src/data/card-data.json
index 1f9793ec..068e019d 100644
--- a/src/data/card-data.json
+++ b/src/data/card-data.json
@@ -6,7 +6,7 @@
},
{
"text": "",
- "Emoji": "heart_eyes"
+ "emoji": "heart_eyes"
},
{
"text": "REST is part of work"