Merge branch 'develop' into feature/us16-user-notifications

.env

@@ -1,4 +1,4 @@
-REACT_APP_API_URL = 'http://127.0.0.1:8000'
+REACT_APP_API_URL = 'https://kasula-develop-5q5vehm3ja-ew.a.run.app'
 
 # LA VARIABLE ESTÀ PENSADA PERQUÈ NO PORTI BARRA AL FINAL
 

README.md

@@ -35,3 +35,4 @@ npm install -g serve
 npm run build
 serve -s build
 ```
+

package.json

@@ -4,6 +4,7 @@
   "private": true,
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.5.1",
+    "@fortawesome/free-regular-svg-icons": "^6.5.1",
     "@fortawesome/free-solid-svg-icons": "^6.4.2",
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@testing-library/jest-dom": "^5.17.0",
@@ -18,6 +19,7 @@
     "react-bootstrap": "^2.9.1",
     "react-bootstrap-icons": "^1.10.3",
     "react-dom": "^18.2.0",
+    "react-icons": "^4.12.0",
     "react-router-dom": "^6.17.0",
     "react-scripts": "5.0.1",
     "react-toastify": "^9.1.3",

src/assets/jsonData/sort_options.json

@@ -0,0 +1,28 @@
+{"fields": [{
+    "name": "none",
+    "displayName": "---"
+}, {
+    "name": "name",
+    "displayName": "Title"
+}, {
+    "name": "average_rating",
+    "displayName": "Rating"
+}, {
+    "name": "cooking_time",
+    "displayName": "Cooking Time"
+}, {
+    "name": "difficulty",
+    "displayName": "Difficulty"
+}, {
+    "name": "energy",
+    "displayName": "Energy"
+}, {
+    "name": "username",
+    "displayName": "Recipe Author"
+}, {
+    "name": "creation_date",
+    "displayName": "Creation Date"
+}, {
+    "name": "updated_at",
+    "displayName": "Last Modified"
+}]}

src/components/AuthContext.jsx

@@ -8,6 +8,7 @@ export const AuthProvider = ({ children }) => {
     const logout = () => {
         setToken(null);
         localStorage.removeItem("token");
+        localStorage.removeItem("currentUser");
     };
 
     const isLogged = () => {

src/components/KasulaNavbar.jsx

@@ -1,6 +1,6 @@
 //React
 import React, { useState, useEffect } from "react";
-import { Link } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import { useAuth } from "./AuthContext";
 import "../css/common.css";
 
@@ -28,6 +28,7 @@ import chef from "../assets/chef.png";
 
 function KasulaNavbar() {
   const { token, logout, isLogged } = useAuth();
+  const navigate = useNavigate();
   const [user, setUser] = useState({});
   const [showModal, setShowModal] = useState(false);
   const [showPostRecipe, setShowPostRecipe] = useState(false);
@@ -69,13 +70,13 @@ function KasulaNavbar() {
 
   const handleClosePostRecipeSuccessfulModal = () => {
     setShowPostRecipe(false);
-    //window.location.reload();
   };
 
   const handleLogout = () => {
     localStorage.setItem("logged", "false"); // This will update the localStorage
     handleCloseModal(); // This will close the modal
     logout(); // This will remove the token from the localStorage
+    window.location.reload(); 
   };
 
   const CustomToggle = React.forwardRef(({ onClick }, ref) => (
@@ -138,6 +139,13 @@ function KasulaNavbar() {
                     <Dropdown.Menu className="dropdown-menu-end">
                       <Dropdown.Item
                         eventKey={1}
+                        href={`/UserProfile/${user._id}`}
+                      >
+                        Profile
+                      </Dropdown.Item>
+                      <Dropdown.Divider />
+                      <Dropdown.Item
+                        eventKey={2}
                         onClick={() => {
                           handleOpenModal();
                         }}

src/components/LikesReview.jsx

@@ -2,10 +2,10 @@
 import React, { useState } from "react";
 import {Row, Col } from "react-bootstrap";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faThumbsUp, faHeart } from "@fortawesome/free-solid-svg-icons";
+import { faHeart as heartSolid } from '@fortawesome/free-solid-svg-icons'; // Icono sólido
+import { faHeart as heartRegular } from '@fortawesome/free-regular-svg-icons'; // Icono regular
 import { useAuth } from "./AuthContext";
 
-
 function LikesReview({ reviewUsername, recipeId, reviewId, initialLikes, likedBy, reloadReviews }) {
   const [likes, setLikes] = useState(initialLikes);
   const [hasLiked, setHasLiked] = useState(false);
@@ -43,7 +43,6 @@ function LikesReview({ reviewUsername, recipeId, reviewId, initialLikes, likedBy
           setLikes(likes + 1);
           setHasLiked(true);
           setHasLikedByUser(true);    
-        // Realiza la lógica para enviar el like a la base de datos
         try {
           const response = await fetch(
             `${process.env.REACT_APP_API_URL}/review/like/${recipeId}/${reviewId}`,
@@ -68,21 +67,23 @@ function LikesReview({ reviewUsername, recipeId, reviewId, initialLikes, likedBy
 
   const cursorStyle = isLogged === 'true' && !isOwnerReview ? { cursor: "pointer" } : { cursor: "not-allowed" };
 
+  const iconoLike = hasLikedByUser ? heartSolid : heartRegular;
+
   return (
     <Row>
       <Col sm={3}>
         <FontAwesomeIcon
-          icon={faHeart}
+          icon={iconoLike}
           onClick={handleLikeClick}
-          style={cursorStyle}
+          style={{ color: 'red', ...cursorStyle }}
         />
       </Col>
       <Col sm={8}>
         <span className="">{likes} likes</span>
       </Col>
       <Col sm={1}></Col>
     </Row>  
-       );
+  );
 }
 
 export default LikesReview;