check authorization for add to cart button relates #106

CA-G12 · Oct 1, 2022 · f4002d0 · f4002d0
1 parent a5421ed
commit f4002d0
Show file tree

Hide file tree

Showing 3 changed files with 70 additions and 41 deletions.
diff --git a/client/src/components/Pages/ProductDetails/ProductDetails.jsx b/client/src/components/Pages/ProductDetails/ProductDetails.jsx
@@ -9,7 +9,7 @@ function ProductDetails() {
   const { id } = useParams();
   const [productDetails, setProductDetails] = useState([]);
   const [quantity, setQuantity] = useState(1);
-  const [titlee, setPageName] = useOutletContext();
+  const [titlee, setPageName, user, setUser] = useOutletContext();
 
   useEffect(() => {
     fetch(`/product/${id}`, {
@@ -24,27 +24,40 @@ function ProductDetails() {
   const navigate = useNavigate();
 
   const addToCart = (e) => {
-    fetchUrl('POST', '/cart', {
-      productId: id,
-      userId: 1,
-      count: quantity,
-    })
-      .then((data) => {
-        if (data) {
-          console.log(data);
-          toast.success('Product added successfully!', {
-            position: 'top-left',
-            autoClose: 2000,
-            hideProgressBar: false,
-            closeOnClick: true,
-            pauseOnHover: true,
-            draggable: true,
-            progress: undefined,
-          });
-          // navigate(`/cart`);
-        }
+    if (user.token) {
+      fetchUrl('POST', '/cart', {
+        productId: id,
+        userId: user.id,
+        count: quantity,
       })
-      .catch(console.log);
+        .then((data) => {
+          if (data) {
+            console.log(data);
+            toast.success('Product added successfully!', {
+              position: 'top-left',
+              autoClose: 2000,
+              hideProgressBar: false,
+              closeOnClick: true,
+              pauseOnHover: true,
+              draggable: true,
+              progress: undefined,
+            });
+            // navigate(`/cart`);
+          }
+        })
+        .catch(console.log);
+    } else {
+      // navigate('/users/signup');
+      toast.error('You Have To Sign Up!', {
+        position: 'top-left',
+        autoClose: 2000,
+        hideProgressBar: false,
+        closeOnClick: true,
+        pauseOnHover: true,
+        draggable: true,
+        progress: undefined,
+      });
+    }
   };
 
   console.log(quantity);

diff --git a/client/src/components/Pages/ProductsContainer/Products/ProductCard.jsx b/client/src/components/Pages/ProductsContainer/Products/ProductCard.jsx
@@ -11,27 +11,40 @@ function ProductCard(props) {
   const addToCart = (e) => {
     const id = e.target.id;
     console.log(e.target.id);
-
-    fetchUrl('POST', '/cart', {
-      productId: id,
-      userId: user.id,
-      count: 1,
-    })
-      .then((data) => {
-        if (data) {
-          toast.success('Product added successfully!', {
-            position: 'top-left',
-            autoClose: 2000,
-            hideProgressBar: false,
-            closeOnClick: true,
-            pauseOnHover: true,
-            draggable: true,
-            progress: undefined,
-          });
-          // navigate(`/cart`);
-        }
+    // if (user.token === false) navigate('/users/signup');
+    if (user.token) {
+      fetchUrl('POST', '/cart', {
+        productId: id,
+        userId: user.id,
+        count: 1,
       })
-      .catch(console.log);
+        .then((data) => {
+          if (data) {
+            toast.success('Product added successfully!', {
+              position: 'top-left',
+              autoClose: 2000,
+              hideProgressBar: false,
+              closeOnClick: true,
+              pauseOnHover: true,
+              draggable: true,
+              progress: undefined,
+            });
+            // navigate(`/cart`);
+          }
+        })
+        .catch(console.log);
+    } else {
+      // navigate('/users/signup');
+      toast.error('You Have To Sign Up!', {
+        position: 'top-left',
+        autoClose: 2000,
+        hideProgressBar: false,
+        closeOnClick: true,
+        pauseOnHover: true,
+        draggable: true,
+        progress: undefined,
+      });
+    }
   };
 
   return (

diff --git a/client/src/components/Pages/signup/signup.jsx b/client/src/components/Pages/signup/signup.jsx
@@ -5,6 +5,7 @@ import { useNavigate } from 'react-router-dom';
 import signSchema from '../../../utils/fetch';
 import { toast } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
+import { useOutletContext } from 'react-router-dom';
 
 import './signup.css';
 const signSh = yup.object().shape({
@@ -32,6 +33,8 @@ function Signup() {
   const [password, setPassword] = useState('');
   const [confirmPassword, setConfPassword] = useState('');
   const [avatar, setAvatar] = useState('');
+  const [title, setPageName, user, setUser] = useOutletContext();
+  setPageName('Sign Up');
   const register = async (e) => {
     try {
       e.preventDefault();