101 frontend fixing UI bugs logic bugs code structure

[ceciliatruong]

REMEMBER TO DELETE ANY IRRELEVANT TEMPLATE PROMPT TEXT BEFORE SUBMITTING KEEP IT SHORT AND SWEET

Abstract

Please include a summary of the changes and the related issue. At minimum, describe:

• What problem does this PR solve?
• How does this PR solve the problem?
  • Be specific and avoid vague language like "make it better".
• What kinds of changes did you make to solve the problem?
  • What kinds of new classes did you add?
  • What are their responsibilities?
  • How do they integrate or interoperate? Basically, explain to your teammates reviewing this PR how to navigate the code you're submitting.

Issues

Mention any issues that are being closed by this PR, using the Closes #<issue number> syntax so that they are linked to this PR and automatically closed when the PR is merged.

Closes #(issue)

Type of Change

Please delete options that are not relevant.

• New feature (non-breaking change which adds functionality)
• Bug fix (non-breaking change which fixes an issue)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Other (explain below)

• Testing

Describe the tests that you wrote to verify your changes, or any manual testing you performed to verify your changes. Provide instructions so we can reproduce. Note that only manually testing is not sufficient since it is not repeatable and does not protect against regressions.

Checklist

Perform a self-review using the following checklist. Some items may not apply to your PR if it is for a bug fix. You can check an item by replacing the [ ] with [x].

• [ ] The code is understandable.
  • [ ] The code is follows formatting conventions (spacing, indents, etc).
  • [ ] The code makes use of names that sound like behavior.
  • [ ] The code is commented in hard-to-understand areas.
  • [ ] The code contains changes to documentation if needed.
• [ ] The code is well structured.
  • [ ] The code is organized into logical components.
  • [ ] The components sound like the behavior (requirements) they implement.
  • [ ] The components have clearly defined single responsibilities.
• [ ] The code is correct.
  • [ ] The changes include tests that prove the fix is effective or that the feature fully works.
  • [ ] The changes generate no new failed tests, build errors, or warnings.

Pending Items

Is there anything else that needs to be done before this PR can be merged?

[github-actions[bot]]

Dependency Review

✅ No vulnerabilities or license issues or OpenSSF Scorecard issues found.

OpenSSF Scorecard

Package	Version	Score	Details

Scanned Manifest Files

[netlify[bot]]

✅ Deploy Preview for foodjournal2 ready!

Name	Link
🔨 Latest commit	a921fc4e7e418d4efc38a5f1dc16e672b71c1551
🔍 Latest deploy log	https://app.netlify.com/sites/foodjournal2/deploys/66669a04a0c157000883dd64
😎 Deploy Preview	https://deploy-preview-108--foodjournal2.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.