مشكله اظهار الخطاء في صحفه login

لحل هذه المشكلة تحتاج إلى التأكد من التعامل الصحيح مع حالات الخطأ في جزء الواجهة الأمامية وكذلك في جزء الخلفية حيث يجب عليك التأكد من أن الكود الخاص بـ actAuthLogin يقوم بإرجاع رسالة خطأ مفهومة عند حدوث خطأ في المصادقة:

const actAuthLogin = createAsyncThunk(
  "login/actAuthLogin",
  async (formData: TFormData, thunkApi) => {
    const { rejectWithValue } = thunkApi;
    try {
      const response = await axios.post<TResponse>("/login", formData);
      return response.data;
    } catch (error) {
      // تأكد من إعادة الخطأ
      return rejectWithValue(AxiosError(error));
    }
  }
);

و أيضا تأكد من أن الكود يتعامل بشكل صحيح مع حالات الرفض في extraReducers:

builder.addCase(actAuthLogin.rejected, (state, action) => {
  state.loading = "failed";
  if (isString(action.payload)) {
    state.error = action.payload;
  } else {
    state.error = "An unknown error occurred"; // رسالة خطأ افتراضية
  }
});

و أهم أمر هو التحقق من الاستجابة في الخلفية، يحب أن تتأكد من أن API الخاصة بك تعيد رسالة خطأ مناسبة عند تسجيل الدخول بإيميل غير موجود:

app.post("/login", async (req, res) => {
  const { email, password } = req.body;
  const user = await findUserByEmail(email);

  if (!user || !isValidPassword(user, password)) {
    return res.status(401).json({ error: "Invalid email or password" });
  }

  // بقية منطق تسجيل الدخول هنا
});

المشكلة من جانب الواجهة الخلفية، فمنطق التحقق من عملية تسجيل الدخول وبيانات المستخدم هي في الواجهة الخلفية وليس الأمامية، من المفترض أن يتم البحث عن إيميل المستخدم في قاعدة البيانات وعرض رسالة خطأ في حال لم يكن المستخدم موجود.

تفقد الواجهة الخلفية وهل يظهر خطأ بالخادم، وحاول طباعة رسالة الخطأ في الدالة الخاصة بعملية تسجيل الدخول، وأيضًا قم بطباعة كائن payload في ملف authSlice.

إن استمرت المشكلة أرفق مجلد المشروع بعد ضغطه لتفقده.