Run prettier formatting on commit for frontend code

[jacobshandling]

Summary by CodeRabbit

• Configured pre-commit hooks to automatically format code before commits are made.
• Integrated code formatting tooling into the development workflow for JavaScript, TypeScript, and JSX files in the frontend.

• Manual testing
• Confirmed decent speed on a MBP M5 48g RAM https://www.loom.com/share/0c803cbcca7f46579f44be9ec06e787e

[coderabbitai]

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[jacobshandling]

@coderabbitai review

[coderabbitai]

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 40bccd7a-22f8-4dc6-a915-843e8d128bdd

📥 Commits

Reviewing files that changed from the base of the PR and between e9fe5eb and 501e2ce.

⛔ Files ignored due to path filters (1)

• yarn.lock is excluded by !**/yarn.lock, !**/*.lock

📒 Files selected for processing (2)

• .husky/pre-commit
• package.json

---

Walkthrough

A new .husky/pre-commit hook script was added that executes npx lint-staged. The package.json file was updated to include a prepare npm script configured to run husky, and two new dev dependencies (husky and lint-staged) were introduced. Additionally, a lint-staged configuration was added to target frontend/**/*.{js,jsx,ts,tsx} files and run prettier --write on them during the pre-commit phase.

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Description check	⚠️ Warning	The pull request description is empty, failing to provide any context, rationale, or checklist items required by the repository template.	Add a comprehensive description including related issue number, relevant checklist items (such as testing and any applicable sections), and an explanation of the changes and their purpose.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely summarizes the main change: introducing Prettier formatting to run automatically on commits for frontend code.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch frontend-format-on-commit

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 66.65%. Comparing base (e9fe5eb) to head (a586f85).
⚠️ Report is 9 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main   #42470      +/-   ##
==========================================
- Coverage   66.65%   66.65%   -0.01%     
==========================================
  Files        2530     2530              
  Lines      202378   202378              
  Branches     9149     9149              
==========================================
- Hits       134895   134894       -1     
- Misses      55290    55291       +1     
  Partials    12193    12193              

Flag	Coverage Δ
frontend	54.38% <ø> (-0.01%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[claude]

Claude Code Review

This repository is configured for manual code reviews. Comment @claude review to trigger a review.

_{Tip: disable this comment in your organization's Code Review settings.}

[Copilot]

Pull request overview

Adds automated Prettier formatting on commit for the frontend by introducing Husky + lint-staged configuration at the repo root, integrating formatting into the existing JS toolchain.

Changes:

• Add Husky install via prepare script and include Husky as a devDependency.
• Add lint-staged as a devDependency and configure it to run prettier --write on staged frontend JS/TS files.
• Add a pre-commit hook that runs lint-staged.

Reviewed changes

Copilot reviewed 2 out of 3 changed files in this pull request and generated 4 comments.

File	Description
package.json	Adds Husky/lint-staged tooling plus a lint-staged rule to format staged frontend JS/TS via Prettier.
.husky/pre-commit	Introduces a pre-commit hook to run lint-staged.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.