Routes and User-Home

src/api/routes.py

@@ -47,7 +47,7 @@ def login():
 
     if user and bcrypt.check_password_hash(user.password, password):
         access_token = create_access_token(identity=email)
-        return jsonify(access_token=access_token)
+        return jsonify(access_token=access_token, user=user.serialize())
     else:
         return jsonify({"msg": "Bad email or password"}), 401
 
@@ -184,11 +184,12 @@ def search():
         return jsonify({"error": "Error fetching data from API."}), 500
 
 # Create category for user
-@api.route('/users/<int:user_id>/categories', methods=['POST'])
+@api.route('/users/<int:user_id>/category', methods=['POST'])
 def create_category(user_id):
     category_name = request.json.get("category_name", None)
-    # user_id = request.json.get("user_id", None)
-
+    # current_user_id = get_jwt_identity()
+    # if current_user_id != user_id:
+    #     return jsonify({"error": "You are not authorized to perform this action"}), 403
     if category_name is None:
         return jsonify({"msg": "Please fill out the required fields"}), 400
 
@@ -200,13 +201,13 @@ def create_category(user_id):
 
 #Get all of user's categories
 @api.route('/users/<int:user_id>/categories', methods=['GET'])
-@jwt_required()  # Requires a valid JWT token
+# @jwt_required()  # Requires a valid JWT token
 def get_all_categories(user_id):
 
     try:
-        current_user_id = get_jwt_identity()
-        if current_user_id != user_id:
-            return jsonify({"error": "You are not authorized to perform this action"}), 403
+        # current_user_id = get_jwt_identity()
+        # if current_user_id != user_id:
+        #     return jsonify({"error": "You are not authorized to perform this action"}), 403
 
         categories = User_Category.query.filter_by(user_id=user_id).all()
         serialized_categories = [category.serialize() for category in categories] 

src/front/js/pages/home.js

@@ -12,7 +12,7 @@ export const Home = () => {
 
     // Sends the user to their page if logged in
     useEffect(() => {
-        if (store.token && store.token != "" && store.token != undefined) {
+        if (store.token && store.token != "" && store.token && store.user != undefined) {
             forward("/user-home");
         }
     }, [store.token, forward]);

src/front/js/pages/user-home.js

@@ -15,23 +15,35 @@ export const UserHome = () => {
     const forward = useNavigate();
     const [isModalOpen, setIsModalOpen] = useState(false);
     const [categoryName, setCategoryName] = useState("");
-
+    const [ categories, setCategories ] = useState(null)
+
     // Sends the user to the main home page if not logged in
     useEffect(() => {
-        // if (store.token == null) {
-        //     forward("/");
-        // }
-    }, [store.token, forward]);
+        if (!store.token || store.user == null) {
+            forward("/");
+        }
+        const getUserCategories = async() => {
+            const userCategories = await actions.getUserCategories()
+            if(userCategories) {
+                console.log("Got the categories!", userCategories)
+                setCategories(userCategories)
+            }
+        }
+        getUserCategories()
+        console.log("User category state", categories)
+    }, [store.token]);
+
 
     const toggleModal = () => {
         setIsModalOpen(!isModalOpen);
     };
     const handleCategoryNameChange = (e) => {
         setCategoryName(e.target.value); // Update category name when input changes
     };
-    const handleCreateCategory = () => {
+    const handleCreateCategory = async() => {
         // Handle saving the category name (e.g., send it to an API or store it in state)
         console.log("Category name:", categoryName);
+        await actions.createCategory(categoryName)
         // You can add your logic here to save the category name
         // For now, I'm just logging it to the console
     };

src/front/js/store/flux.js

@@ -1,9 +1,10 @@
-const base = "https://orange-broccoli-j4rpj6prpr2qpvq-3001.app.github.dev/api/";
+const base = process.env.BACKEND_URL + "/api/";
 
 const getState = ({ getStore, getActions, setStore }) => {
 	return {
 		store: {
 			token: null,
+			user: null,
 			items: []
 		},
 		actions: {
@@ -45,7 +46,7 @@ const getState = ({ getStore, getActions, setStore }) => {
 					const result = await response.json();
 					console.log("This came from the back-end", result);
 					sessionStorage.setItem("token", result.access_token);
-					setStore({ token: result.access_token });
+					setStore({ token: result.access_token, user: result.user });
 					return true;
 				} catch (error) {
 					console.error('Error fetching data:', error);
@@ -129,7 +130,42 @@ const getState = ({ getStore, getActions, setStore }) => {
                     setStore({ items: storedItems });
                 };
 				console.log(getStore().items)
-			}
+			},
+			createCategory: async (category)=>{
+				const store = getStore();
+				console.log("STORE", store)
+				try {
+					const resp = await fetch(base + `users/${store.user.id}/category`, {
+						method: 'POST',
+						headers: {
+							'Content-Type': 'application/json',
+						},
+						body: JSON.stringify({category_name: category})
+					})
+					const data = await resp.json()
+					console.log("Data after creating category", data)
+				} catch(error) {
+					console.log("Error creating category", error)
+					throw new Error
+				}
+			},
+			getUserCategories: async () => {
+				const store = getStore();
+				try {
+					const resp = await fetch(base + `users/${store.user.id}/categories`, {
+						method: 'GET',
+						headers: {
+							'Content-Type': 'application/json',
+						}
+					})
+					const data = await resp.json()
+					console.log("Data after getting categories", data)
+					return data
+				} catch(error) {
+					console.log("Error getting categories", error)
+					throw new Error
+				}
+			},
 		}
 	};
 };