Feat: add sound effects system (#21)

[ayoub3bidi]

Description

• Add full-screen mode
• Add sound effect system

Type of Change

• 🐛 Bug fix (non-breaking change which fixes an issue)
• ✨ New feature (non-breaking change which adds functionality)
• 💥 Breaking change (fix or feature that would cause existing functionality to not work as expected)
• 📚 Documentation update
• 🎨 Style/UI improvement
• ⚡ Performance improvement
• 🧪 Test addition or improvement
• 🔧 Chore (maintenance, dependencies, etc.)

Related Issues

#21

Fixes #

Changes Made

• Full-screen mode
• Sound Effect system

Testing

• All existing tests pass (pnpm test:run)
• New tests added for new functionality
• Manual testing completed
• Cross-browser testing (if UI changes)

Test Results

React does not recognize the `defaultLanguage` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `defaultlanguage` instead. If you accidentally passed it from a parent component, remove it from the DOM element.

 ✓ src/components/PythonCodePanel.test.jsx (5 tests) 16ms
 ✓ src/components/SwipeTutorial.test.jsx (3 tests) 13ms
 ✓ src/algorithms/pathfinding/pathfinding.test.js (22 tests) 8ms
 ✓ src/hooks/useSwipe.test.js (11 tests) 8ms
 ✓ src/utils/arrayHelpers.test.js (16 tests) 5ms
 ✓ src/algorithms/sorting/algorithms.test.js (25 tests) 4ms
 ✓ src/utils/soundManager.test.js (12 tests) 3ms
 ✓ src/algorithms/python/index.test.js (19 tests) 1ms
 ✓ src/utils/gridHelpers.test.js (12 tests) 2ms

 Test Files  12 passed (12)
      Tests  165 passed (165)
   Start at  09:38:12
   Duration  1.37s (transform 150ms, setup 120ms, collect 309ms, tests 434ms, environment 273ms, prepare 100ms)

Screenshots/GIFs

Before	After

Code Quality

• Code follows the project's coding standards
• ESLint passes (pnpm lint)
• Prettier formatting applied (pnpm format)
• No console errors or warnings
• Code is properly documented with JSDoc (if applicable)

Performance Impact

• No performance impact
• Performance improved
• Performance impact assessed and acceptable
• Performance benchmarks included

Accessibility

• Keyboard navigation works correctly
• Screen reader compatibility maintained
• Color contrast meets WCAG guidelines
• Focus indicators are visible

Breaking Changes

• None

Checklist

• I have read the CONTRIBUTING.md guidelines
• My code follows the project's style guidelines
• I have performed a self-review of my code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published

Additional Notes

---

Reviewer Guidelines:

• Check that all tests pass
• Verify code follows project standards
• Test the changes locally
• Review for security implications
• Ensure documentation is updated

[netlify]

✅ Deploy Preview for bayanflow ready!

Name	Link
🔨 Latest commit	e48cfa0
🔍 Latest deploy log	https://app.netlify.com/projects/bayanflow/deploys/6915996bd3c55600080b5c62
😎 Deploy Preview	https://deploy-preview-38--bayanflow.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 project configuration.

[netlify]

✅ Deploy Preview for dev-bayanflow ready!

Name	Link
🔨 Latest commit	e48cfa0
🔍 Latest deploy log	https://app.netlify.com/projects/dev-bayanflow/deploys/6915996bd2a51c00086703e9
😎 Deploy Preview	https://deploy-preview-38--dev-bayanflow.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 project configuration.

[github-actions]

🚀 Deployed on https://691599a19606eae3d9174761--bayanflow.netlify.app