🔹 Blazor - استخدام Singleton Services لإدارة الحالة عبر التطبيق

في هذا الدرس، سنشرح كيف يمكننا استخدام خدمة Singleton لمشاركة البيانات (الحالة) بين مكونات متعددة في تطبيق Blazor. هذا الأسلوب مهم جدًا عندما تريد أن تتشارك عدة صفحات أو مكونات نفس المعلومات (مثل سلة التسوق أو بيانات المستخدم).

---

🧠 لماذا نستخدم Singleton؟

• للاحتفاظ بالحالة في الذاكرة طوال مدة تشغيل التطبيق.
• لمشاركة نفس الكائن بين كل المكونات.
• لجعل التحديثات تنعكس على جميع الأجزاء المرتبطة تلقائيًا.

---

🛠️ خطوات إنشاء خدمة Singleton لإدارة الحالة

✅ 1. إنشاء كلاس AppState

public class AppState
{
    public string? UserName { get; set; }
    public int CartCount { get; set; }

    public event Action? OnChange;

    public void NotifyStateChanged() => OnChange?.Invoke();
}

✅ 2. تسجيل الخدمة في Program.cs

builder.Services.AddSingleton<AppState>();

✅ 3. استخدام AppState في أكثر من مكون

مكون A: لتحديث البيانات

@inject AppState State

<input @bind="State.UserName" class="form-control" />
<button class="btn btn-primary" @onclick="UpdateCart">أضف إلى السلة</button>

@code {
    void UpdateCart()
    {
        State.CartCount++;
        State.NotifyStateChanged();
    }
}

مكون B: لعرض البيانات بشكل مباشر

@inject AppState State

<p>مرحبًا، @State.UserName</p>
<p>🛒 عدد العناصر في السلة: @State.CartCount</p>

@code {
    protected override void OnInitialized()
    {
        State.OnChange += StateHasChanged;
    }

    public void Dispose()
    {
        State.OnChange -= StateHasChanged;
    }
}

---

💡 ملاحظات هامة

• استخدام NotifyStateChanged مهم جدًا لتنبيه باقي المكونات بالتحديث.
• يجب على المكونات التي تعرض البيانات الاشتراك في الحدث OnChange لتحديث العرض تلقائيًا.
• لا تنس إزالة الاشتراك في Dispose لتفادي تسرب الذاكرة.

---

✅ خلاصة الدرس

خدمات Singleton في Blazor تُعتبر طريقة فعالة لإدارة الحالة ومشاركتها بين المكونات. وهي خطوة مهمة قبل الانتقال إلى طرق أكثر تقدمًا مثل التخزين في المتصفح أو قواعد البيانات.