Hacktoberfest Week 2 PR

I am very excited to have gotten my first Hacktoberfest PR merged! This time I went for a small code fix instead of a documentation fix.

Background on the Project

TanyaAja is an anonymous question bank platform. Once set up, you can get your own web app where others can submit questions to you. Those who post questions are authenticated via Firebase, and their questions are stored in your Notion database. It also uses Next.js and Shadcn UI. The default templates to set up the app is in Indonesian, but users are able to customize these templates to change the wordings.

Set Up

To install or set up the application so that I could test my fix once ready, I had to do many things. In fact, it took me over an hour for set up, and less than ten minutes to do the fix. This is because I had to sign up for multiple services and link them all together to make it work, and the instructions were not very detailed. I had to set up Firebase for the authentication, and Notion to load the site templates as well as the database.

The Issue

Question should more than one word #54

mazipan posted on Oct 12, 2023

Describe the bug Some people just testing the TanyaAja by submitting "one word" question such as "test", "testing", etc. This kind of action should not allowed from the first place.

To Reproduce Steps to reproduce the behavior:

1. Go to public question form submission, e.g: https://www.tanyaaja.in/p/mzp
2. Type one word question
3. Submit question
4. Question submitted

Expected behavior Question should not submitted, and show error message that we are not allowing this kind of action due to it's not seems as a honest question

Additional context Add new validation rule using Valibot to check "one word" question, if possible

View on GitHub

I found the issue in the GitHub advanced search by looking for the following tags: hacktoberfest, good first issue, bug. The project owner would like to add an extra validation to the question submission form to disallow one word questions. I asked to be assigned to this issue, and I asked for more information, such as the error message I should display. The owner not only answered my question, but also told me which method to call to implement the fix!

The Fix

There was already existing validation in place for the question form page using Valibot, so I only needed to change two lines of code. I imported includes in addition to the other Valibot functions, and I also added an a new line of validation using the includes function to ensure the string has at least one space (If it does not the corresponding error message will be displayed). I had never used Valibot before, but it was easy to learn by looking at the web documentation as well as the existing code.

Screenshot of my fix. You can also test it out for yourself here.

The Pull Request

My Draft Pull Request was read by the owner and I was told to run pnpm run format then pnpm run lint --fix to auto format the code. I did as asked and replied back. I submitted the PR, resolved a merge conflict, and a day later, my PR was merged!

Issues I Encountered

• I was unaware that the project owner is using husky to run ESLint and Prettier when I do a commit on the project files, so for a while I was confused as to why the files were automatically formatted - thankfully David let me know about husky when I inquired on Slack
• After I submitted my PR, I got a "This branch has conflicts that must be resolved" message under my PR. It turns out that there were merge conflicts between my branch and the main project, since the main project code has since been updated while I was working (I didn't have the latest code). I clicked the "Resolve conflicts" button and was able to resolve the conflict easily by checking the two lines that conflicted. I erased the line that I wanted removed and kept the one I wanted.

Even though the code fix was short, I did a lot of research and learned a lot about different technologies! I learned how to set up and use services such as Firebase and Notion, and I learned about husky. I learned how to use Valibot to validate data.

All in all, very happy with my first merged pull request and very motivated to continue with hacktoberfest! I am now on the lookout for more complicated bug fixes, please leave a comment if you know of any issues or interesting projects :)