Conversation
chimerror
left a comment
There was a problem hiding this comment.
Good work!
I didn't have very many comments, but I hope that given that you've seen how picky I can be that as few comments from me as possible is a good thing. There's a slight difference that causes a test failure, and a missing prop from your PropTypes for ChatLog, and some guidance on the StrictMode code you commented out, but those are all minor issues, and my other comment is positive!
The code is cleanly written and correctly implemented (save that missing space), so that's good enough for a Green!
| // root.render( | ||
| // <React.StrictMode> | ||
| // <App /> | ||
| // </React.StrictMode> | ||
| // ); | ||
| // Not sure if I need this code but it was in the live code, code gets sent into render method and once its rendered its injected | ||
| // directly into html inside the anchor div |
There was a problem hiding this comment.
You don't need this code, and I verified that it works without it, but there is an advantage to keeping it. Namely, it will render the App component in strict mode, which doesn't produce any UI, but will produce warnings that may help you find bugs.
You can read more about it in the React docs on Strict Mode.
| <header> | ||
| <h1>Application title</h1> | ||
| <h1>Chat with Estragon and Vladimir</h1> | ||
| <div> {updateLike()}❤️s</div> |
There was a problem hiding this comment.
As mentioned in my comment on Learn, this causes a test failure because our tests are expecting "3 ❤️s" with a space in between the number and the heart, while your code produces "3❤️s".
But this is a relatively minor issue, obviously.
| className={`chat-entry ${ | ||
| props.sender === 'Estragon' ? 'remote' : 'local' | ||
| } `} |
There was a problem hiding this comment.
This works to distinguish the remote bubbles! Good job!
| body={entry.body} | ||
| timeStamp={entry.timeStamp} | ||
| liked={entry.liked} | ||
| toggleHeartCallback={props.toggleHeartCallback} |
There was a problem hiding this comment.
Since you use this toggleHeartCallback prop, it's likely a good idea to include it in your PropTypes below.
I would even recommend that it be .isRequired because this callback is pretty vital to the function of the code. However, that would cause issues with our tests, that do not supply this callback, so it'd be OK without .isRequired.
No description provided.