sunmengyue / 508124 Goto Github PK

We would like for users to be able to send images. We would like you to implement the front end of this feature. The backend functionality is already implemented. This feature is described in depth on this page.

Note: In your PR description, please explain your thought process around UX for attaching an image.

We’ve received new specs from our designer. Please implement the design for the login and signup pages, and make it mobile responsive. The design spec and needed assets are available in this zip folder, as well as in this Figma file. The spec may need a bit of adapting to fit our use case, so please use your best judgement. Also note that the resources provided include more than just the login and signup pages, but only these two pages should be implemented for this ticket.

Please include a couple of screenshots in the description when making this PR to showcase the styling you've done.

Note: In your PR description, please share any decisions you made when implementing this, and the thought process behind those decisions.

We would like for users to be able to see when someone is typing. We would like you to implement the feature of "someone is typing".

When someone in the conversation (that is not yourself) is typing, it will display the "typing bubble".

There are some bugs in our starting code that we would like you to investigate and resolve. First, when you send a new message, it does not immediately appear on the screen. We would like new messages to be immediately added to the chat UI for both existing conversations and new conversations. (Note: This may require more than one change)

Additionally, messages are not displayed in the correct order on page load. Messages should be displayed in order with the oldest messages at the top and newest messages at the bottom.

The starting code has some Cypress tests for this ticket (bug-fix-ticket.spec.js). Please ensure that your code passes these tests before requesting review on your PR for this feature (the README has details on how to run the tests).

Note: All fixes for these bugs can be done on the front end. In your PR description, please share the steps you followed to debug this issue.