The Who, The What, and The Why

Village Book Builder is a non-profit organization with a focus on lifting youth out of the poverty cycle through education.
My team and I worked on the search functionality of the Village Book Builders(VBB) internal tool from managing mentor and mentees. The search functionality VBB was looking for was similar to the google mail search functionality. This allows a user to search for multiple types of actions and people from a single unified search field. The search would then present options as you type, in an auto-complete style. Going into the project I was a bit worried about working on a project that wasn't a greenfield project, this was my first such project, the idea of having to work myself into another person's way of doing things was quite daunting.

Who's Line of Code is This Anyway.

My main contribution to this project was componentizing the modal. This is a task that I have discovered I have an uncanny knack for. When a user selects a name of a student or a mentor a modal was expected to pop up. The modal would contain the information about the student/mentor and provide the ability for the administrator to do necessary edits. The project was already using the Ant Design framework which provides a Modal component. I decided to leverage React's custom hooks to make the component easier to use and more flexible in case it needed to be used elsewhere in the future.

The useModal hook combines features that are specific to the modal such as the function to toggle to modal visibility.

As work continued with the project we discover that there was a flaw in the way we implemented the modal that caused it to pop up when you clicked anything in the search bar. It turned out our click handler for the modal was attach to the component that produced all of the items for the search bar instead of just the name of students and mentors. The fix was to simply move the click handler to the item that set up the rendering of the user-type items.

And Now to Pass the Torch

I hate to leave the product at this point there's so much more I would like to do with it but our time has come to an end. At this point, we had added a lot of value to it. We were able to ship the search bar with auto-completion, links to other features, and a modal to display information about students and mentors.

There are many ways this product could move on from here. My team was kind enough to leave notes and comments with suggestions for the next team. We had some ideas for using the modal to edit user data at the time our team had split up to maximize productivity. The code for editing is currently in the search bar main code. We would like to see the editing feature integrated into the useModal custom hook to keep similar functionality together. The biggest technical hurdle I see for the next team is keeping the architecture simple while adding more features. This project was a great change of pace for me I had a great team that showed me the value of having team members to bounce ideas off of. That will be a huge boost to my career goals. Most of the work I've done up until now has been individual work on freelance projects.