fix: add avatar fallback in testimonial and developer testimonial com…

[Abh002-S]

---

name: Pull Request
about: Submit changes to the project for review and inclusion

Description

Added avatar fallback support in Testimonials and DeveloperTestimonials.
Now, if an image fails to load (404 or broken URL), the component gracefully shows the first letter of the user’s name inside a styled circle instead of a broken image icon.

Related Issue

Fixes #422

Changes Made

• Updated Testimonials.tsx to handle broken/missing avatar images.
• Updated DeveloperTestimonials.tsx with the same fallback logic.
• Improved accessibility by ensuring fallback avatars include proper alt text.

Testing Performed

• Tested with working image URLs → shows correct avatar.
• Tested with broken image URLs → shows user’s first letter in a circle.
• Verified on Chrome, Firefox, and Edge.
• Works in both light and dark mode.

Checklist

• I have tested these changes locally and they work as expected.
• I have followed the project's coding style guidelines.
• I have updated the documentation if necessary.
• I have added/updated tests (not applicable here).
• I have addressed review feedback (if any).

Additional Notes for Reviewers

This update improves UX by preventing broken images from appearing in testimonials.
Fallback ensures the UI remains clean, even when external image URLs fail.

Here’s a screenshot showing the fallback avatar in action:

[github-actions]

❌ Checks Failed

Status: 🚫 Not ready to merge

Please fix the following issues before merging:

📝 Code Linting Failed

Issue: Code formatting or style violations detected.

Specific problems:

• Code formatting issues detected

How to fix:

Platform	Command	Description
🐧 Unix/macOS/Linux	npm run format	Auto-fix all formatting issues
🪟 Windows	npm run format:file <filename>	Fix specific files
🔍 Check Only	npm run format:check	Check formatting without fixing

Need help with linting? Check out the Linting Guide for Windows Users for detailed instructions.

---

🛠️ Next Steps

1. Fix the issues mentioned above
2. Test locally to ensure everything works
3. Push your fixes to this branch
4. Wait for re-check - This bot will automatically run again

🤖 This comment will be updated automatically when you push new commits

[github-actions]

🎉 All Checks Passed!

Status: ✅ Ready to merge

✅ Completed Workflows

Workflow	Status	Details
🔨 Continuous Integration	✅ Passed	Build completed successfully
📝 Code Linting	✅ Passed	All formatting and style checks passed

---

🚀 This PR is ready for review and can be safely merged to main branch!

Great work! Your code meets all quality standards. 👏

[sa-fw-an]

Great work @Abh002-S :)

[Abh002-S]

Thankyou so much @sa-fw-an !