For Release 3.0 we needed to create two pull requests, one to an external repository and one internal to Seneca College, this blog is about my pull request to an internal repository.
During my work on the external pull request requirement of this Release, user c3ho on our Slack team posted an issue involving UI changes. I thought this was going to be easy enough and decided that I would like to give it a shot as my first pull request to the Telescope program. The issue can be found here and you can find the pull request that I made here
Basically, I was tasked with creating a UI that would explain to the user how to use the new Search Query functionality created in pull request #1275
Starting up my development enviorment was very easy considering that I had to set everything up in a previous lab, so it was as simple as running the command
npm run develop
Which I found in the Telescope deployment docs
After this I got straight to work and started researching on the best way to develop this feature, I decided that it would be best to keep true to the design that the previous developers created and I didn't want to do anything out of the ordinary that would draw away from the attention of the page. My fix was a hoverable info icon that has a popout that would explain all the new key symbols that users can use when searching.
It looks nice and clean and doesn't create to much of a difference in UI design from the previous developers that worked on this page.
I had to do a lot of research about material UI & react which I never used before, primarly I had to choose between all of these different tooltips but I settled on the HtmlToolTip because this would give me the most freedom to choose how I would like the design to be once the user hovered over the info button.
The biggest take away was the use of Material UI which seemed to be incredibly useful as my first 30minutes was trying to just use basic HTML inside the component. There is an abundance of tools that will be at your disposal when working with Open Source projects and you can't be scared to learn new skills if you want to create good pull requests.
Top comments (0)