محمود سعداوي2

السلام عليكم. أنا بصدد العمل على مشروع MERN وأستعمل redux toolkit لإدارة حالة التطبيق. في المثال التالي: عند الضغط على زر الحذف، لايتم التفعيل إلا بعد تحديث الصفحة. الكود: slice removeEducation(state, action) { state.profile.education = state.profile.education.filter( (el) => el._id !== action.payload ); }, api call export function deleteEducation(educId) { return async (dispatch, getState) => { try { const { data } = await axios.delete( `${PROFILE_URL}/education/${educId}`, { headers: { "x-auth-token": getState().auth.user.token, }, } ); dispatch(profileActions.removeEducation(data)); // dispatch(profileActions.setProfile()) } catch (error) { const errors = error.response.data.errors; errors?.forEach((err) => { dispatch(alertActions.createAlert(err.msg)); dispatch(alertActions.clearAlert(err.id)); }); dispatch(profileActions.clearLoading()); console.log(error); } }; } المكون Education const handleRemoveEducation = (id) => { dispatch(deleteEducation(id)); }; ********************** {profile?.education.map((educ, index) => ( <tr key={index} className="bg-gray-100 border-b"> <td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900"> {index + 1} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> {educ.school} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> {educ.degree} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> {educ.current ? `${moment(educ.from).format( "DD MMM YYYY" )} - present` : `${moment(educ.from).format( "DD MMM YYYY" )} - ${moment(educ.to).format("DD MMM YYYY")}`} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> <Button dangerBtn type={"button"} onClick={() => handleRemoveEducation(educ._id)} > Delete </Button> </td> </tr> ))} شكرا على المساعدة.

السلام عليكم. بعد تسجيل الدخول، يتوجه المستخدم ملفه الشخصي للقيام بإضافة ما يتوجب من معطيات. في هذه الحالة تكون المصفوفة profile فارغة لأنه لاتوجد بداخلها بيانات تتعلق بالملف الشخصي للمستخدم. يقوم المستخدم إذن بإنشاء ملفه الشخصي بواسطة الكود التالي: const profileSlice = createSlice({ name: "profile", initialState: { profile: [], loading: false, isProfileCreated: false, }, reducers: { setProfile(state, action) { state.profile = action.payload }, setLoading(state) { state.loading = true }, clearLoading(state) { state.loading = false }, setIsProfileCreated(state) { state.isProfileCreated = true; state.loading = false }, clearIsProfileCreated(state) { state.isProfileCreated = false; }, }, }); *** export function createProfile(newProfile) { return async(dispatch, getState) => { try { dispatch(profileActions.setLoading()) const { data } = await axios.post(PROFILE_URL, newProfile, { headers: { 'x-auth-token': getState().auth.user.token } }) dispatch(profileActions.setProfile(data)) dispatch(profileActions.setIsProfileCreated()) setTimeout( () => dispatch(profileActions.clearIsProfileCreated()), 2000 ); } catch (error) { const err = error.response?.data.msg if (err) { dispatch(alertActions.createAlert(err)); dispatch(alertActions.clearAlert(err)); } const errors = error.response.data.errors errors?.forEach((err) => { dispatch(alertActions.createAlert(err.msg)); dispatch(alertActions.clearAlert(err.id)); }); dispatch(profileActions.clearLoading()) } } } **** const navigate = useNavigate(); const dispatch = useDispatch(); const { loading, isProfileCreated } = useSelector((state) => state.profile); const { alerts } = useSelector((state) => state.alert); const addNewProfile = (e) => { e.preventDefault(); dispatch( createProfile({ status, company, website, location, skills, githubusername, bio, twitter, facebook, instagram, linkedin, youtube, }) ); alerts.map((alert) => dispatch(alertActions.clearAlert(alert.id))); }; useEffect(() => { if (alerts.length > 0) { setShow(true); setTimeout(() => { setShow(false); }, 3000); } }, [alerts]); useEffect(() => { if (isProfileCreated) { navigate("/dashboard"); } }, [navigate, isProfileCreated]); هنا يتم إنشاء الملف الشخصي، ويتم تسجيل كافة المعطيات بقاعدة البيانات. المشكل الذي أواجهه. في الكود التالي const { profile } = useSelector((state) => state.profile); console.log(profile) عندما أقوم بتحديث الصفحة تصبح profile مصفوفة فارغة. أرجو المساعدة.

هذه هي profileSlice const profileSlice = createSlice({ name: "profile", initialState: { profile: [], loading: false, isProfileCreated: false, }, reducers: { setProfile(state, action) { state.profile = action.payload }, setLoading(state) { state.loading = true }, clearLoading(state) { state.loading = false }, setIsProfileCreated(state) { state.isProfileCreated = true; state.loading = false }, clearIsProfileCreated(state) { state.isProfileCreated = false; }, addExperience(state, action) { state.profile.experience = action.payload } }, }); profileApiCall export function createProfile(newProfile) { return async(dispatch, getState) => { try { dispatch(profileActions.setLoading()) const { data } = await axios.post(PROFILE_URL, newProfile, { headers: { 'x-auth-token': getState().auth.user.token } }) dispatch(profileActions.setProfile(data)) dispatch(profileActions.setIsProfileCreated()) setTimeout( () => dispatch(profileActions.clearIsProfileCreated()), 2000 ); } catch (error) { const err = error.response?.data.msg if (err) { dispatch(alertActions.createAlert(err)); dispatch(alertActions.clearAlert(err)); } const errors = error.response.data.errors errors?.forEach((err) => { dispatch(alertActions.createAlert(err.msg)); dispatch(alertActions.clearAlert(err.id)); }); dispatch(profileActions.clearLoading()) } } }

السلام عليكم. في الكود التالي: function DashboardScreen() { const { profile } = useSelector((state) => state.profile); return ( <div className="mt-16"> {profile.length === 0 ? ( <> <Title>Dashboard</Title> <div className="mx-4 mb-4 lg:mx-8"> <p className="text-lg text-zinc-800 my-4"> You have not yet setup a profile, please add some info. </p> <Button> <Link to="/dashboard/create-profile">Create Profile</Link> </Button> </div> </> ) : ( <> <MyComponent/> </> )} </div> ); } export default DashboardScreen; في البداية كل شيء تمام. لكن عندما أقوم بتحديث الصفحة يكون طول المصفوفة صفر. الرجاء المساعدة.

السلام عليكم وعيد مبارك. هل يوجد امتداد أو برنامج يمكنني بأخذ صورة لصفحة الويب بالطريقة التالية: شكرا.

المشكل أن الكود يعمل دون تحريك. يعني لم يتم تفعيل animation

السلام عليكم. في الكود التالي لم أعرف لماذا يقع تفعيل التحريك (animation) الكود الأول <div className={`w-20 bg-slate-50 flex flex-col absolute top-14 transition-all duration-500 ease-in-out`} style={{ right: dropdown ? "2px" : "-100%", }} > الكود الثاني <div className={`w-20 bg-slate-50 flex flex-col absolute top-14 transition-all duration-500 ease-in-out ${dropdown ? "right-2" : "right-[-100%]"}`} // style={{ // right: dropdown ? "2px" : "-100%", // }} > شكرا.

لكن الكود الأول لم يعمل علما وأني لم أقم بتغيير الشيفرة غير التي أرفقتها تفضل هذا الكود الخاص بتسجيل الدخول وتعديل المستخدم /** * desc Register user * route POST /api/users * access Public */ const registerUser = asyncHandler(async (req, res) => { const { name, email, password } = req.body; const userExist = await User.findOne({ email }); if (userExist) { res.status(400).json({ message: "User Already Exist" }); } const user = await User.create({ name, email, password, }); if (user) { generateToken(res, user._id); res.status(201).json({ _id: user._id, name: user.name, email: user.email, isAdmin: user.isAdmin, }); } else { res.status(400).json({ message: "Invalid User Data" }); } }); /** * desc Update User profile * route PUT /api/users/profile * access Private */ const updateUserProfile = asyncHandler(async (req, res) => { const user = await User.findById(req.user._id); if (user) { user.name = req.body.name || user.name; user.email = req.body.email || user.email; if (req.body.password) { user.password = req.body.password; } const updatedUser = await user.save(); res.json({ _id: updatedUser._id, name: updatedUser.name, email: updatedUser.email, isAdmin: updatedUser.isAdmin, }); } else { res.status(404); throw new Error('User not found'); } });

السلام عليكم. لو تسمحوا أود معرفة الإختلاف بين الكودين التاليين. الكود الأول: userSchema.methods.matchPassword = async function (enteredPassword) { return await bcrypt.compare(enteredPassword, this.password); }; // Encrypt password using bcrypt userSchema.pre('save', async function (next) { if (!this.isModified('password')) { next(); } const salt = await bcrypt.genSalt(10); this.password = await bcrypt.hash(this.password, salt); }); الكود الثاني: userSchema.methods.matchPassword = async function (enteredPassword) { return await bcrypt.compare(enteredPassword, this.password) } // Encrypt password using bcrypt userSchema.pre('save', async function (next) { if (!this.isModified('password')) { next(); } const salt = await bcrypt.genSalt(10); const hashedPassword = await bcrypt.hash(this.password, salt); this.password = hashedPassword; }); مع العلم أن الكود الأول لم يقم بتشفير كلمة بينما الكود الثاني قام بتشفير كلمة المرور. شكرا على المساعدة.

تفضل

لا توجد لدي إضافات remix لم أجد إضافات remix

كيف أعرف ذلك

نتيجة البحث بدت فارغة. ليس لدي إضافات إذن

السلام عليكم ورمضان مبارك عليكم. يبدو أنني قمت بإضافة إمتداد في vs code مثلما توضح الصورة التالية أرجو المساعدة في معرفة هذا الإمتداد قصد حذفه. أعتذر على الجودة الضعيفة للصورة. شكرا.

السلام عليكم. أريد إضافة أزرار PayPal كمايلي: قمت بالكود التالي: index.js <PayPalScriptProvider deferLoading={true}> <App /> </PayPalScriptProvider> <> <button className="p-2 bg-slate-700 text-slate-100 rounded" onClick={onApproveTest}>Test Pay Order</button> <div className="bg-slate-100"> <PayPalButtons createOrder={createOrder} onApprove={onApprove} onError={onError} ></PayPalButtons> </div> </> المشكل أنه لم يتم التعرف على العنصر PayPalButtons وبالتالي لم تظهر الأزرار شكرا للمساعدة