Simple Budget Categories App

مرحبا اريد مشروع React لإدارة الميزانية وتقسيمها لفئات (أكل – مواصلات – تسلية). 🔹 Task 1 — إنشاء الفئات (Categories Setup) المطلوب: صفحة فيها 3 أو 4 فئات ثابتة: Food Transport Entertainment Other كل فئة لها Budget Limit يكتبه المستخدم. حفظ كل فئة في state بالشكل التالي: { name: "Food", limit: 1500, spent: 0 } 🔹 Task 2 — إضافة مصروف (Add Expense Page) المطلوب: صفحة فيها: اختيار فئة من Dropdown إدخال قيمة المصروف زر “Add Expense” عند الإضافة: يتم تحديث spent للفئة المختارة. مثال: Food.spent = Food.spent 120 🔹 Task 3 — صفحة متابعة الميزانية (Budget Overview) المطلوب: صفحة تعرض: Limit لكل فئة مقدار المصروف الحالي المتبقي إضافة Progress Bar بسيطة لكل فئة: كلما spent يزيد → الشريط يزيد لو spent أكبر من limit → يظهر تنبيه باللون الأحمر: "Budget exceeded!"