fix: improve blog publishing workflow

[AgnibhaDebnath]

🔍 Description

This PR fixes several issues in the blog publishing workflow.

Changes

• Fixed the request payload mismatch between the blog editor page and the publish API (dataContent → jsonContent).
• Fixed JSON content encoding before creating the blog file in the repository.
• Updated the publish workflow to create Pull Requests using the contributor fork workflow.
• Improved blog title handling and validation in the editor.
• Translated API comments and PR messages to English for consistency.

Closes #322

---

✅ Checklist

• Verified that the project builds and runs locally (npm run dev)
• Ensured no ESLint or TypeScript warnings/errors remain (see notes below)
• Updated documentation, comments, or in-code explanations where needed
• Verified responsiveness across devices (desktop, tablet, mobile)
• Followed the CONTRIBUTING.md guidelines

---

🎨 Visual Changes (if UI-related)

No significant UI changes.

---

📂 Type of Change

• 🐛 Bug fix (non-breaking change that fixes an issue)
• ✨ New feature (non-breaking change that adds functionality)
• 💥 Breaking change (fix or feature that would cause existing functionality to change)
• 📝 Documentation update
• ♻️ Refactor / code quality improvement
• 🎨 UI/UX enhancement
• 🔒 Security improvement

---

🧩 Additional Notes for Reviewers

Current Limitation

The contributor-fork workflow has been validated locally, but the fork owner is currently hardcoded for testing purposes.

A future authentication mechanism (e.g. GitHub OAuth) will be required to:

• identify the current contributor,
• determine the correct fork owner dynamically,
• remove the hardcoded owner value.

ESLint

I was unable to run the repository lint checks successfully because npm run lint currently fails with:

TypeError: Converting circular structure to JSON

The error appears to originate from the ESLint configuration and is reproducible independently of the changes in this PR.

[vercel]

@AgnibhaDebnath is attempting to deploy a commit to the PhysicsHub's projects Team on Vercel.

A member of the Team first needs to authorize it.

[mattqdev]

Thank you for this! Can you test it to see if works fine?

[mattqdev]

Nice! I saw the test and it's cool, can you add a prettier automation or something like that for the auto formatting before sending the PR?

And please can you add also the header for the metadata on the blog file, like that for example:

`import TAGS from "../tags.js";

export const ballFreeFallBlog = {
id: "bb-004",
slug: "ball-free-fall-comprehensive-guide",
name: "Free Fall & Air Resistance: Interactive Physics Simulation Guide",
desc: "Explore how gravity, air resistance, and wind affect a falling ball. Interactive simulations and clear explanations covering free fall, drag force, and planetary gravity — from beginner to advanced.",
tags: [TAGS.MEDIUM, TAGS.COLLISION, TAGS.PHYSICS, TAGS.GRAVITY],
theory:
`

[AgnibhaDebnath]

Thanks! I'm glad the workflow is working.

Both suggestions make sense. Auto-formatting the generated blog file would prevent contributors from running into formatting issues, and adding the metadata header would make the generated blogs consistent with the existing blog structure.

I'm a bit busy with exams at the moment, but I should be able to work on these improvements in the next 4–5 days.

[mattqdev]

Oh I forgot also, what is the limit of request that can support this github API?

No problem, no need to rush, let me know when it's finished

[AgnibhaDebnath]

Regarding the GitHub API limits, my understanding is that once GitHub OAuth is implemented, the workflow would use each contributor's GitHub access token rather than a single shared token.

In that case, the rate limits would apply per authenticated user, so requests would be distributed across contributors instead of all blog submissions sharing the same API quota.

For authenticated requests, GitHub's REST API generally allows up to 5,000 requests per hour per user/token, and the current publishing workflow only performs a small number of API calls per submission (creating a branch, creating the file, opening the PR, etc.), so I don't expect rate limits to be a significant issue.

[mattqdev]

Oh ok alright, will you implement also the Github Auth system? If not can you please create an issue with the details of how should be created this thing please?

[AgnibhaDebnath]

I'd like to work on it, but I'm currently preparing for exams and probably won't be able to start before mid-July.

The GitHub OAuth implementation would also require some maintainer-side configuration, such as setting up the GitHub OAuth App, configuring the callback URL, and providing the required environment variables.

If you're okay with that timeline, I'd be happy to pick it up after my exams.

[AgnibhaDebnath]

Nice! I saw the test and it's cool, can you add a prettier automation or something like that for the auto formatting before sending the PR?

And please can you add also the header for the metadata on the blog file, like that for example:

`import TAGS from "../tags.js";

export const ballFreeFallBlog = { id: "bb-004", slug: "ball-free-fall-comprehensive-guide", name: "Free Fall & Air Resistance: Interactive Physics Simulation Guide", desc: "Explore how gravity, air resistance, and wind affect a falling ball. Interactive simulations and clear explanations covering free fall, drag force, and planetary gravity — from beginner to advanced.", tags: [TAGS.MEDIUM, TAGS.COLLISION, TAGS.PHYSICS, TAGS.GRAVITY], theory: `

I found the blog metadata structure. For fields such as slug, name, and theory.title, I can generate them automatically from the blog title.

For desc and tags, should contributors provide these through additional fields in the editor, or would you prefer a default/temporary value to be generated automatically?

Also, how would you like the id field to be generated? I noticed the existing blogs use IDs such as bb-004, so I wanted to check whether there's a preferred strategy for assigning new IDs.

[mattqdev]

i'd love to have more input fields for these values, so if you can add them would be awesome. For the id, I' not completely sure of what to do, maybe it's better generate them automatically, but honestly you are free to find the right solution

[AgnibhaDebnath]

I've added the additional metadata fields (description and tags) to the editor along with validation.

I also updated the submission workflow to include the generated slug and id in the blog metadata, and added Prettier formatting for the generated blog file before creating the PR.

The latest changes have been pushed and are ready for review.

Screenshot of the updated editor:

[mattqdev]

Nice! Only one thing, for the tags there is a component called Tag that have all the style and features integrated. And idk if you have already done it but use the list of tags original in tags.js

[mattqdev]

Than i will check that the PR for the blog proposal works and if so i'll merge this pr

[mattqdev]

For the tags list i will put like a scrolling frame or just like in /simulations the filter menu, cause there are too much tags and it risks to be too long

[AgnibhaDebnath]

Thanks! I'm already using the tags from tags.js.

I've updated the tags section to use a horizontal scroll layout, added a selected tags section, and hidden the scrollbar to keep the editor compact even with a large number of tags. The latest changes have been pushed.

Screenshot of the updated editor:

[mattqdev]

Can you use please the Tag component (in (core)/components/Tag.jsx) so the style is uniform?

[AgnibhaDebnath]

Thanks for the feedback! I was already using the tags from tags.js.

I've updated the tag selector to use the shared Tag component, added a selected tags section, and made the tags list horizontally scrollable to keep the editor compact. The latest changes have been pushed.

screenshot:

[mattqdev]

thank you!

[mattqdev]

Can you see please if the Test Blog is working properly please? If so everything it's good!

[AgnibhaDebnath]

I tested the workflow and everything seems to be working correctly. The blog proposal branch was created, the generated JSON includes the metadata and formatting as expected, and the PR was opened successfully.

[mattqdev]

Good! Thank you for this! Can you please create the issue for completing the system with the auth?

[physicshub]

🎉 This PR is included in version 3.29.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀