feat: save settings to the backend (#395)

Co-authored-by: Dunsin <78784850+Dun-sin@users.noreply.github.com>

client/src/App.jsx

@@ -4,6 +4,7 @@ import { KindeProvider } from "@kinde-oss/kinde-auth-react"
 
 // Store
 import { useAuth } from 'context/AuthContext';
+import { useApp } from 'src/context/AppContext';
 
 // Components
 import NavBar from 'components/NavBar';
@@ -23,7 +24,7 @@ import Profile from './pages/Profile';
 
 function App() {
     const { isLoggedIn, dispatchAuth } = useAuth();
-
+    const { loadUserSettings } = useApp();
 
     async function loginWithEmail(email) {
         try {
@@ -43,6 +44,12 @@ function App() {
                         email
                     },
                 })
+                try {
+                    const userData = await api.get(`/profile/${email}`);
+                    loadUserSettings(userData.data?.settings);
+                } catch (error) {
+                    console.error('Error loading user data:', error);
+                }
             } else {
                 throw new Error('Login failed');
             }

client/src/context/AppContext.jsx

@@ -66,6 +66,16 @@ export const AppProvider = ({ children }) => {
         });
     }
 
+    function loadUserSettings(settings) {
+        if (!settings) {
+            return;
+        }
+        dispatch({
+            type: 'UPDATE_SETTINGS',
+            payload: settings,
+        });
+    }
+
     function updateTmpSettings(newSettings) {
         dispatch({
             type: 'UPDATE_TMP_SETTINGS',
@@ -104,6 +114,7 @@ export const AppProvider = ({ children }) => {
                 cancelSettingsUpdate,
                 startSearch,
                 endSearch,
+                loadUserSettings
             }}
         >
             {children}

client/src/pages/Settings.jsx

@@ -11,6 +11,8 @@ import {
 } from 'rsuite';
 
 import { useApp } from 'src/context/AppContext';
+import { useAuth } from 'src/context/AuthContext';
+import { api } from 'src/lib/axios';
 
 const Searching = () => {
     const {
@@ -20,18 +22,34 @@ const Searching = () => {
         updateTmpSettings,
         cancelSettingsUpdate,
     } = useApp();
+    const { authState } = useAuth();
+
     const settings = useMemo(() => {
         return app.tmpSettings
             ? { ...app.settings, ...app.tmpSettings }
             : app.settings;
     });
 
+    const updateUserSettings = async () => {
+        const data = {
+            email: authState?.email,
+            settings
+        };
+        try {
+            const response = await api.post('/profile', data);
+            console.log(response.data.message);
+        } catch (error) {
+            console.error(error);
+        }
+    };
+
     /**
      *
      * @param {Event | SubmitEvent} e
      */
-    const handleSubmit = () => {
+    const handleSubmit = async () => {
         updateSettings();
+        await updateUserSettings();
     };
 
     const handleChange = (newSettings) => {

server/controllers/userController.js

@@ -62,7 +62,7 @@ const getProfile = async (req, res) => {
 };
 
 const updateProfile = async (req, res) => {
-        const { username, aboutMe, gender, age, email } = req.body;
+        const { username, aboutMe, gender, age, email, settings } = req.body;
 
         try {
                 // Find the user by email
@@ -72,11 +72,12 @@ const updateProfile = async (req, res) => {
                         return res.status(404).json({ error: 'User not found' });
                 }
 
-                // Update user's profile with provided fields or defaults
-                user.username = username || 'Anonymous';
-                user.aboutMe = aboutMe || null;
-                user.gender = gender || 'Unknown';
-                user.age = age || null;
+                // Update user's profile with provided fields or the User fields or defaults
+                user.username = username || user.username || 'Anonymous';
+                user.aboutMe = aboutMe || user.aboutMe || null;
+                user.gender = gender || user.gender || 'Unknown';
+                user.age = age || user.age || null;
+                user.settings = settings || user.settings;
 
                 // Save the updated user profile
                 await user.save();

server/models/UserSchema.js

@@ -26,6 +26,10 @@ const UserSchema = new mongoose.Schema({
 		type: String,
 		required: false,
 	},
+	settings: {
+		type: Object,
+		required: false
+	},
 });
 
 UserSchema.index({ email: 1 }, { unique: true });