'''Do not make any visual modifications. The phrases I write are commands to understand what I want, not to be written down. Understand their content well, then execute what is required.''' Update ONLY the homepage “Shop by category” section. IMPORTANT: Do not use a hardcoded/manual list of categories. CURRENT PROBLEM: The homepage currently shows only a limited selection of categories (for example Beverages, Frozen Food, Cosmetics, Seasonings, etc.). I want this section to become fully DATABASE-DRIVEN. REQUIREMENTS: 1. Fetch ALL active categories dynamically from the existing Supabase categories data. 2. Display EVERY active category in the “Shop by category” section. 3. Do NOT hardcode category names, category IDs, or a fixed list of categories in the frontend. 4. If I create a NEW category later from the admin dashboard, it must automatically appear in this homepage section without requiring any code change or redeployment. 5. If a category is renamed from the admin/database, the homepage must automatically show the updated name. 6. If a category is deactivated/disabled, it should automatically disappear from the homepage section. 7. Keep the existing visual design exactly like the current screenshot: - large image cards - rounded corners - category name at the bottom - product count badge at the top-right - same typography - same spacing - same responsive layout 8. Each category card must link to the existing category/shop filtering page using the existing category routing logic. 9. The product count shown on each card must be calculated dynamically from the products belonging to that category. Do NOT hardcode counts. 10. Category images must also be data-driven. Use the existing category image field/source if one exists. If a category has no image, use the existing fallback image mechanism rather than breaking the card. 11. IMPORTANT: Do not create a new category table. Do not change the existing database schema. Do not modify existing category records. Reuse the current categories and product/category relationships. 12. IMPORTANT: Preserve the current category translation system. When the website is switched between English, French, and German, display the appropriate localized category name using the existing translation structure. 13. Performance: Do not make one separate API request per category. Fetch the required category data efficiently in a single/batched query where possible. Avoid unnecessary repeated product-count queries. 14. The section must work correctly with ANY number of categories: - 10 categories - 30 categories - 100+ categories 15. Do not limit the query to the current 8 categories. There must be NO hardcoded `.slice(0, 8)`, `.slice(0, 10)`, fixed category arrays, or similar frontend limitation. 16. If there are many categories, make the section naturally responsive: - desktop: multiple cards per row - tablet: appropriate number per row - mobile: responsive cards/grid Keep the current design style. 17. If the current section has a “View all” button/link, make sure it still works and leads to the existing full category/shop page. 18. Do not change any other homepage section. AFTER IMPLEMENTATION, VERIFY: - Every active category appears. - A newly created category automatically appears. - A deactivated category disappears. - Category names follow the current language. - Product counts are correct. - Category cards link to the correct filtered shop page. - Existing category images continue working. - Categories without images do not break the UI. - No hardcoded category list remains in the homepage component. - No existing products/categories are modified. Finally, show me the exact frontend component/file that was changed and explain how the categories are now fetched dynamically.