9809348327

Committed 05 Jul 2024 01:49PM UTC coverage: 88.332% (+0.4%) from 87.967%

Build # 9809348327

Build Type

Pull #53

github

Committed by

web-flow

Commit Message

Merge 38df394a8 into b6fa2397a

Pull Request Pull Request #53: feat-wishlist-management

Run Details

453 of 627 branches covered (72.25%)

Branch coverage included in aggregate %.

381 of 407 new or added lines in 15 files covered. (93.61%)

9 existing lines in 2 files now uncovered.

5308 of 5895 relevant lines covered (90.04%)

8.23 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

93.62

/src/components/Products/ProductCard/ClientProductCard.tsx

import React, { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { RootState } from '../../../redux/store';
import deleteWishlistProduct from '../../../utils/wishlistFunctions/deleteWishlistProduct';
import { addProductToWishlist } from '../../../utils/wishlistFunctions/addProduct';

interface Props {
  product: ProductProp;
}
export interface Category {
  name: string;
  id: string;
  createdAt: Date;
  updatedAt: Date;
  products: [
    {
      id: string;
    }
  ];
}
export interface User {
  firstName: string;
  lastName: string;
}
export interface ProductProp {
  categories: Category[];
  createdAt: Date;
  description: string;
  expirationDate?: Date;
  feedbacks?: string[];
  id?: string;
  images: string[];
  isAvailable: boolean;
  name: string;
  newPrice: string;
  oldPrice?: string;
  quantity: string;
  updatedAt: Date;
  vendor?: User;
}
const ClientProductCard = (props: Props) => {
  const { userToken } = useSelector((state: RootState) => state.auth);
  const { currentCategory } = useSelector((state: RootState) => state.category);
  const { products, onWihlistPage } = useSelector((state: RootState) => state.wishlist);
  const [inWishlist, setInWishlist] = useState(false);
  const dispatch = useDispatch();
  const [wishlistId, setWishlistId] = useState<number | null>(null);

  useEffect(() => {
    const productInWishlist = products.find((product) => product.productInfo.id === props.product.id);
    if (productInWishlist) {
      setInWishlist(true);
      setWishlistId(productInWishlist.wishListDetails.id);
    } else {
      setInWishlist(false);
      setWishlistId(null);
    }
  }, [products, props.product.id]);

  return (
    <div
      data-testid="productDiv"
      className="group cursor-pointer flex flex-col gap-y-2 w-[15.6rem] text-sm hover:bg-neutral-200 p-2 rounded relative duration-200"
    >
      {userToken && (
        <div className="group-hover:flex sm:flex md:hidden absolute right-4 top-4 bg-baseWhite w-8 h-8 pt-[2px] justify-center xmd:items-center text-center rounded-full">
          {onWihlistPage ? (
            <i
              className="fa-regular fa-trash-can text-lg text-orange"
              onClick={() =>
                deleteWishlistProduct(userToken, dispatch, wishlistId, products, setInWishlist, props.product)
              }
              data-testid="deleteButton"
            ></i>
          ) : inWishlist ? (
            <i
              className="fa-solid fa-heart text-lg text-orange"
              onClick={() =>
                deleteWishlistProduct(userToken, dispatch, wishlistId, products, setInWishlist, props.product)
              }
              data-testid="removeButton"
            ></i>
          ) : (
            <i
              className="fa-regular fa-heart text-lg"
              onClick={() => addProductToWishlist(userToken, dispatch, products, props.product)}
              data-testid="addButton"
            ></i>
          )}
        </div>
      )}
      <div className="bg-neutral-400 h-[19.5rem] p-2">
        <img src={props.product.images[0]} alt="" className=" h-full object-contain" />
      </div>
      <div className="text-neutral-600">
        <p>{props.product.name}</p>
        {!props.product.categories[0] && <p>product</p>}
        {props.product.categories[0] && <p>{currentCategory ? currentCategory : props.product.categories[0].name}</p>}
      </div>
      <p>{props.product.vendor?.lastName + ' ' + props.product.vendor?.firstName}</p>
      <p className="text-error200">RWF {props.product.newPrice}</p>
    </div>
  );
};
export default ClientProductCard;

1	import React, { useEffect, useState } from 'react';	1✔
2	import { useDispatch, useSelector } from 'react-redux';	1✔
3	import { RootState } from '../../../redux/store';	1✔
4	import deleteWishlistProduct from '../../../utils/wishlistFunctions/deleteWishlistProduct';	1✔
5	import { addProductToWishlist } from '../../../utils/wishlistFunctions/addProduct';	1✔
6		1✔
7	interface Props {	1✔
8	product: ProductProp;	1✔
9	}	1✔
10	export interface Category {	1✔
11	name: string;	1✔
12	id: string;	1✔
13	createdAt: Date;	1✔
14	updatedAt: Date;	1✔
15	products: [	1✔
16	{	1✔
17	id: string;	1✔
18	}	1✔
19	];	1✔
20	}	1✔
21	export interface User {	1✔
22	firstName: string;	1✔
23	lastName: string;	1✔
24	}	1✔
25	export interface ProductProp {	1✔
26	categories: Category[];	1✔
27	createdAt: Date;	1✔
28	description: string;	1✔
29	expirationDate?: Date;	1✔
30	feedbacks?: string[];	1✔
31	id?: string;	1✔
32	images: string[];	1✔
33	isAvailable: boolean;	1✔
34	name: string;	1✔
35	newPrice: string;	1✔
36	oldPrice?: string;	1✔
37	quantity: string;	1✔
38	updatedAt: Date;	1✔
39	vendor?: User;	1✔
40	}	1✔
41	const ClientProductCard = (props: Props) => {	1✔
42	const { userToken } = useSelector((state: RootState) => state.auth);	45✔
43	const { currentCategory } = useSelector((state: RootState) => state.category);	45✔
44	const { products, onWihlistPage } = useSelector((state: RootState) => state.wishlist);	45✔
45	const [inWishlist, setInWishlist] = useState(false);	45✔
46	const dispatch = useDispatch();	45✔
47	const [wishlistId, setWishlistId] = useState<number \| null>(null);	45✔
48		45✔
49	useEffect(() => {	45✔
50	const productInWishlist = products.find((product) => product.productInfo.id === props.product.id);	25✔
51	if (productInWishlist) {	25✔
52	setInWishlist(true);	25✔
53	setWishlistId(productInWishlist.wishListDetails.id);	25✔
54	} else {	7✔
55	setInWishlist(false);	7✔
56	setWishlistId(null);	25✔
57	}	18✔
58	}, [products, props.product.id]);	18✔
59		18✔
60	return (	45✔
61	<div	45✔
62	data-testid="productDiv"	45✔
63	className="group cursor-pointer flex flex-col gap-y-2 w-[15.6rem] text-sm hover:bg-neutral-200 p-2 rounded relative duration-200"	45✔
64	>	45✔
65	{userToken && (	45✔
66	<div className="group-hover:flex sm:flex md:hidden absolute right-4 top-4 bg-baseWhite w-8 h-8 pt-[2px] justify-center xmd:items-center text-center rounded-full">	45✔
67	{onWihlistPage ? (	45✔
68	<i	16✔
69	className="fa-regular fa-trash-can text-lg text-orange"	16✔
70	onClick={() =>	13✔
71	deleteWishlistProduct(userToken, dispatch, wishlistId, products, setInWishlist, props.product)	13✔
72	}	13✔
73	data-testid="deleteButton"	1✔
74	></i>	1✔
75	) : inWishlist ? (	1✔
76	<i	1✔
77	className="fa-solid fa-heart text-lg text-orange"	1✔
78	onClick={() =>	1✔
79	deleteWishlistProduct(userToken, dispatch, wishlistId, products, setInWishlist, props.product)	1✔
80	}	1✔
81	data-testid="removeButton"	13✔
82	></i>	13✔
83	) : (	13✔
84	<i	3✔
85	className="fa-regular fa-heart text-lg"	1✔
86	onClick={() => addProductToWishlist(userToken, dispatch, products, props.product)}	1✔
87	data-testid="addButton"	1✔
NEW 88	></i>	×
NEW 89	)}	×
UNCOV 90	</div>	×
UNCOV 91	)}	×
UNCOV 92	<div className="bg-neutral-400 h-[19.5rem] p-2">	×
UNCOV 93	<img src={props.product.images[0]} alt="" className=" h-full object-contain" />	×
UNCOV 94	</div>	×
UNCOV 95	<div className="text-neutral-600">	×
96	<p>{props.product.name}</p>	1✔
97	{!props.product.categories[0] && <p>product</p>}	1✔
98	{props.product.categories[0] && <p>{currentCategory ? currentCategory : props.product.categories[0].name}</p>}	1✔
99	</div>	2✔
100	<p>{props.product.vendor?.lastName + ' ' + props.product.vendor?.firstName}</p>	2✔
101	<p className="text-error200">RWF {props.product.newPrice}</p>	2✔
102	</div>	2✔
103	);	2✔
104	};	2✔
105	export default ClientProductCard;	16✔

atlp-rwanda / knights-ecomm-fe / 9809348327

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous