that time when I had to create a npm package that didn't exist.

#npm #webdev #react #javascript

While working at PhonePe, the first team I was with was the QA team. The backend devs worked from the Pune office and I was from the Bangalore office. They had built a IssueTracker bot on slack, where the QA team would report issues that they found anywhere with the developed features in staging, production and other environments. It was also for user raised issues in the live application.

I had to build the frontend which was to add an entire module called Slack Oncall. The idea was that from the application we could address the resolution to the issue raised and also see stats of how the issues are being raised, how it is being resolved and in which category there would be more issues. There was extensive data visualization in the application which i would address through recharts mostly.

One time they needed a feature for a situation, where one issue is raised for the wrong team and they could pass the issue to a team they seemed fit. With this another problem arose, we needed to keep track of the teams who have looked into this issue. And there were issues which have been passed down to 10+ teams. We needed a way to visualise this and that's how hoplist was conceptualized.

Initially we called it a "hopping list" that would be there with the issue detail, to display which teams had worked on the issue. Hopping as in the issue had hopped from one team to another. I analysed the feature request and figured a horizontal timeline will fit our requirement.

I looked up for horizontal timelines on the npm library, but there was none that fit my requirement, there were mostly vertical timelines with a lot more customization and a lot heavier than necessary. And for the UI I was working with a horizontal timeline would be the best.
I tried a few other npm libraries but everything would break in the UI and there was far more parameters than i needed.

Then I thought to myself, how hard could it be if I made a horizontal timeline component. I gave it a shot, sat down for 4 hours and made one ith minimal customization, it looked rustic, but it did fit my requirement.

And then I decided to publish it as a npm package, well that didn't happen right away, I slacked off for a few months but I published it and within the first week of publishing it, it had 300+ downloads. That metric really made me happy.