مشكلة في مشروع next.js

لديك خطأ 401 أي عملية غير مُصرح بها، لأن التوكن لم يتم تخزينه بعد تسجيل الدخول، لذا الطلب إلى /api/todos يُرسل بدون Authorization، كذلك يوجد تحذير الـ key وسببه أن دالة createTask تُعيد الجسم الكامل { newTodo, user } بينما الواجهة تتوقع كائن المهمة فقط، فينتج عنصر بدون _id في المصفوفة.

في ملف page.tsx يجب حفظ التوكن بعد تسجيل الدخول:

      if(res?.message){
        setError(res?.message);
        setLoading(false);
      }else{
        alert("تم تسجيل الدخول بنجاح");
        localStorage.setItem("token", res.token); // هنا
        router.push("/home")
      }

كذلك، تعديل createTask   لإعادة data.newTodo وللتحقق من الأخطاء:

export async function createTask(title:string) {
  const token = localStorage.getItem("token");
  const res = await fetch('http://localhost:3000/api/todos', { 
    method: "POST",  
    headers: {
      "Content-Type": "application/json",
      "Authorization": `Bearer ${token ?? ""}`
    },
    body: JSON.stringify({title}),
  });
  if (!res.ok) {
    const err = await res.json().catch(() => ({}));
    throw new Error(err?.message || "Request failed");
  }
  const data = await res.json();
  return data.newTodo;
}

كذلك يجب تحويل الـ _id إلى نص عند توليد التوكن فحاليًا أنت تمرر كائن، في ملف app\api\auth\login\route.ts:

    const token = generateToken(user._id.toString());

ثم شغل الخادم وتوجه إلى الرابط التالي وسجل الدخول:

http://localhost:3000/