Urigo / WhatsApp-Clone-Tutorial

https://www.tortilla.academy/Urigo/WhatsApp-Clone-Tutorial

Home Page:https://tortilla.academy

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[Client Step 1.11]

lucas-quinn opened this issue · comments

chat.lastMessage.createdAt is a date object, it can't be displayed as a string. chat.lastMessage.createdAt.toDateString() is okay temporarily.

@material/core already includes @type/material-ui after v4. So we don't need to install it in Step 2

step 2 typo: so we ca define our styles => so we can define our styles

step 3 typo start": "node index.js" => "start": "node index.js"

step 4 don't need to install bodyParser and @types/bodyParser. Since express 4.16, bodyParser is already included in express. app.use(bodyParser.json());=> app.use(express.json());

step 4: you changed lastMessage in db.ts file to array number ['1'], but it was not mentioned in the tutorial, I think db.ts shouldn't be changed, we should change the resolver.ts from 'messages.find(m => m.id === chat.lastMessage)' to 'chat.lastMessage'

step 5:
expect(getByTestId('date')).toHaveTextContent('02:00'); this is GMT+2 time, many people needs to change this, is there a better way to fix this?

step 5: didn't mention installing jest-junit, but it appears in the next package.json file.

In step 1, Id in client's db.ts is number, but in step 3 later, Id in db.ts is string. It's confusing. They need to be unified.

step 6 "const MessageItem = styled.div`
float: right;
background-color: #dcf8c6;
display: inline-block;" inline-block is ignored due to the float

step 7, we should use "@apollo/react-hooks" instead of "react-apollo-hooks", I found react-apollo-hooks 0.5 will cauze error, it says, can't read data.chat. But I switch to @apollo/react-hooks, everything is fine, we even don't need to change any code.

step 7 test: we should use "@apollo/react-testing" instead of "apollo-link-mock", thus, we don't need test-helpers.ts, since we could directly "import { MockedProvider } from '@apollo/react-testing';",then change client to mocks.

step 10: type Client = , I have some issues here.It seems like DataProxy and Apollo client can't be together. it warns me something, I don't know how to solve it, so I let type Client = any,client.readFragment,I delete the .

step 12: forget to mention "import { withFilter } from 'apollo-server-express';"

@suhuaixing this is amazing! some much valuable feedback and comments!

I've taken care of:

Comments I had more questions about:

  • about your first comment, this was part of the idea, to fail and then gradually solve it by adding Moment, let me know if that makes sense or you think we should do that differently?
  • Also I wasn't really sure what you meant on this comment, can you point me to the change you think I've made in db.ts?
  • About this comment about the timezone, we want it to be fixed on some timezone just some the CI and tests would pass everywhere.
    If you have a better idea I would love to change it!
  • I haven't mentioned installing jest-junit just because we use it for our reporting on the CI and it has no affect on the code. I've added a comment in the tutorial for that.
  • Good point here. Looking at the end result on master and how the tutorial progress, what change would you recommend?
  • I agree with this comment, can you create a PR and let me know what to change exactly now that we've moved to the new version of apollo-hooks?
  • About this comment, Can you maybe open a repo with the current state and let's figure out how to solve it?

fixed, pushing a new version later today