My developer journal: Sprint III — Feature complete
Building a web chat app
Another entry to my Developer Journal for Lambda Labs project, where we build a service chat app for hotels and its guests.
Refactoring API endpoints
The sprint started with refactoring an endpoint I build earlier together with my team mate Diana. We needed an endpoint, which would return all hotel staff based on hotel_id. My first idea was to use our GET /api/users/:id endpoint and check whether the id is a hotel_id or a user_id and return data based on that. But Diana came up with a lot cleaner solution with using the query string in our GET all users endpoint, where we check whether the query string exists, and if yes, return all hotel staff. If the query string doesn’t exist, return all users. After that I refactored our Jest tests to reflect the changes we did.
Afterwards I worked on a feature, where when a new Super Admin is created, which is the highest account level you can have, a new Hotel resource is also created bound to his account. The endpoint will first check whether the account being created is unique, then it normalizes the data, creates new Hotel , hashes password and saves new user with user_type: Super_Admin . After successful creation of new user, a JWT is created and sent back to the client for future authentication.
Next I worked on other endpoints, so they would display data relevant only for a specific Hotel. I also updated DELETE requests to not actually delete the resource from our database, but rather just change property on this resource, so it will not be fetched anymore on standard client GET requests.
As I refactored these endpoints, I had to update tests for them, as some of them started to fail. I managed to fix some of these tests, but tests, where I utilized multiple MongoDB models were giving me errors with 500 status codes. I’ve researched this issue for quite some time, but was not able to fix them properly. From what I read, the issue might be Jest running tests concurrently, which is causing problems to my database connection.
But since the functionality was working, when tested manually with Postman, we’ve made a team decision to postpone work on these tests until we have a functioning MVP.
Moving to front end
With updated endpoints, it was time for me to move to Front End. Working again with React, and especially Redux was a bit difficult at start as I have not touched Redux for couple of weeks, and I could definitely feel it! However couple of hours in, I was already getting back on it.
The first ticket I worked on front end was pair programming the chat functionality for Hotel employees. We connected our Socket on front end with back end and saved the messages in Redux store. As we worked on it, we realized we will need more endpoints for closed chats, so after we were finished with this main feature, I jumped back on our back end repo to build them out. When building these, I learned you can build a MongoDB query, that will filter the results based on properties in different database schemas.
Employee dashboard
After we have the Socket connection working and endpoints ready, I started to work on Employee Dashboard, where they should be able to see lists of tickets (guest requests) based on their status (queued/active/closed). I build out a reusable component, which I feed filtered data based on ticket status. This component then renders tickets with basic information like Guest name, Room number and last message sent in that specific ticket. This component will be used to render all three lists of tickets.
Then I worked on the functionality for the employee to search through tickets displayed on screen. For this I used match-sorter library, which uses a simple algorithm that makes it easy for users to filter and sort a list of items based on given input.
Pull Request reviews and Bug fixes
Last, but not least, I reviewed Pull Requests from my team mates and communicated with them any change requests.
While working, we started getting errors from Create React App about conflicting dependency versions. The dependency causing problems was babel-jest where we had two different versions installed in our node_modules. After some googling, I found out we can specify the exact version we want for a dependency to have inside our package.json file with yarn resolutions.
This week we’re closing in on being feature complete. The main functionalities of the app are working and we just need to work on some details and bug fixes. Next up is responsiveness of the app, styling the UI and providing for a nice UX.
