GSOC 2019: Add Edit Previews to Non‐Release Entities in MusicBrainz

I am Anirudh Jain (Cyna on IRC), an undergraduate student at Bharati Vidyapeeth’s College of Engineering, New Delhi, India. I’ve been working on the MusicBrainz project of the MetaBrainz Foundation as a participant in Google Summer of Code 2019. This year marks the beginning of me as an Open Source developer. My work during the GSoC 2019 period can be found in my “temp” branch in my musicbrainz-server clone. The changes there will slowly get merged into the “cyna-gsoc” branch in the main musicbrainz-server repository on GitHub as they’re reviewed.

About the Project

MusicBrainz has just began converting all its components to React from Perl. The codebase is quite large so the process was being done in smaller steps. One of those steps was converting the templates and forms to React from Template toolkit pages. An additional feature to that was the release entity edit previews which was exclusive to it.

When an editor edits or adds entities in MusicBrainz a preview of the changes in realtime weren’t shown to the editor. The feature existed only for the Release entity, which was written in KnockoutJs. As the shifting from Perl templates to React templates are going on in MetaBrainz, my project was to add an option to preview the changes made to all non‐release entities at real time in React. I had to first convert all the forms and templates from Perl to React so I could use React code with it and then add the logic in React to enable real time preview of changes for MB entities.

How I came to know about MetaBrainz?

This year I was applying for GSoC 2019, the second time after being rejected in the first attempt during GSoC 2018. I spent the month of December 2018 looking at the organisations that have been a part of GSoC for the previous years. I found MetaBrainz interesting, there were so many projects I could work on. Among all of them, two piqued my interest the most; they were MusicBrainz and BookBrainz.

Before GSoC 2019 began

I worked on minor fixes on the MusicBrainz project. I converted few templates to React to get the hang of it. I then worked on the MBS-11086 ticket from the MetaBrainz Jira. I learned a lot from Nicolás Tamargo (reosarevok), Yvan Rivierre (yvanzo) and Michael Wiencek (bitmap) before GSoC began. I started discussion about various projects of MetaBrainz and the timeline of projects.

During Community Bonding Period

During this period I spent time working on minor edits and changes, getting familiarised with the codebase and getting to know my mentor Michael Wiencek (bitmap). He helped me formulate a plan on how to go about the previews with entity aliases. I had follow 4 steps:

• Step 1: Convert edit details of the entity to React
• Step 2: Convert and hydrate EditForm of the entity to React
• Step 3: Link the Perl backend to render the converted EditForm instead of Perl template.
• Step 4: Add previews component using edit details to the EditForm and test them.

Thanks to bitmap, my work sure got easier as I understood the reason for every line I had to modify to achieve my target.

First Month – June 2019

My first month went slow as I only could complete the entity alias previews. I faced many issues during this month. While I spent time converting the templates to React I hit many areas where I couldn’t do anything without help, I also faced issues with ReactDOM rendering as this was the first time I ever had to work on backend React. With help from my mentor, bitmap, I learnt the difference between React at backend and frontend. I was able to add previews to entity aliases by the end of the month. By the end of this month I had more than 20 commits which were squashed into 2 commits to represent the task they performed.

Second Month – July 2019

This month I concentrated on easing up my work by converting all the edit details to React so all the manual work would be done. I also spend time creating utility components that I would require for converting the edit forms of entities. After all the manual work was done, the conversion of the Place entity and adding previews to it was completed. There were times when I got stuck on issues that would stop me from completing the target by the GSoC period. Getting things reviewed and collaborating with the mentor to face difficult and confusing tasks were some of my best moments. Though not meeting the targets and having about a month’s work on my head, I still had confidence to complete the project on time.

Final Month – August 2019

Most of my work was done in August, I converted 7 entity types and added previews to them during this month. I spent a lot of time testing the feature and fixing bugs in my code. Writing code until the end of the program and even during the evaluation period enabled me to complete the tasks at hand. Finally I could complete my GSoC project by the end of the month.

Whats Next?

I plan on working on the MusicBrainz project after the GSoC period and become a frequent contributor to the MetaBrainz Foundation. This GSoC was the greatest stepping stone for me, my life as a developer has begun and I’ll be improving every day. One of my greatest achievements was writing a few thousand lines of code in a short span of time. This also has been the only time I stuck with a single project and worked on it for more than a month. It’s been an honour working with MetaBrainz. Thanks :).

Special Mentions

• Michael Wiencek (bitmap): Enabled me to find solutions on my own instead of depending of others for it.
• Nicolás Tamargo (reosarevok): Helped me get started with MusicBrainz Setup and have also been a great help when I had doubts.
• Yvan Rivierre (yvanzo): Helped me with answers when I got stuck with unknown syntax.
• GSoC: Giving me a chance to work with the MetaBrainz Foundation.