-
Replace with name of sender
+
+
{sender}
- Replace with body of ChatEntry
- Replace with TimeStamp component
-
+ {body}
+
+
+
+
);
};
ChatEntry.propTypes = {
- // Fill with correct proptypes
+ id: PropTypes.number.isRequired,
+ sender: PropTypes.string.isRequired,
+ body: PropTypes.string.isRequired,
+ timeStamp: PropTypes.string.isRequired,
+ liked: PropTypes.bool.isRequired,
+ onToggleLike: PropTypes.func.isRequired,
+ isLocal: PropTypes.bool
};
export default ChatEntry;
diff --git a/src/components/ChatEntry.test.jsx b/src/components/ChatEntry.test.jsx
index 85eff9256..2402bc350 100644
--- a/src/components/ChatEntry.test.jsx
+++ b/src/components/ChatEntry.test.jsx
@@ -11,7 +11,7 @@ describe('Wave 01: ChatEntry', () => {
body="Get out by 8am. I'll count the silverware"
timeStamp="2018-05-18T22:12:03Z"
liked={false}
- />
+ onToggleLike={vi.fn()}/>
);
});
diff --git a/src/components/ChatLog.jsx b/src/components/ChatLog.jsx
new file mode 100644
index 000000000..f8056f3d4
--- /dev/null
+++ b/src/components/ChatLog.jsx
@@ -0,0 +1,28 @@
+import * as PropTypes from 'prop-types';
+import ChatEntry from './ChatEntry.jsx';
+
+const ChatLog = ({ entries, onToggleLike }) => {
+ return (
+
+ {entries.map((entry) => (
+
+ ))}
+
+ );
+};
+
+ChatLog.propTypes = {
+ entries: PropTypes.array.isRequired,
+ onToggleLike: PropTypes.func.isRequired
+};
+
+export default ChatLog;
diff --git a/src/components/ChatLog.test.jsx b/src/components/ChatLog.test.jsx
index dfcfeda99..88746c9ca 100644
--- a/src/components/ChatLog.test.jsx
+++ b/src/components/ChatLog.test.jsx
@@ -42,7 +42,7 @@ const LOG = [
describe('Wave 02: ChatLog', () => {
beforeEach(() => {
- render(
);
+ render(
);
});
test('renders without crashing and shows all the names', () => {