#1136

Committed 23 Jul 2024 01:45PM UTC coverage: 92.72% (-0.004%) from 92.724%

Build # #1136

Build Type

Committed by

Commit Message

feat:(stripe payment): implementation of stripe payment 187419028

Pull Request Pull Request #44: #187419028 implementation of stripe payment API

Run Details

753 of 926 branches covered (81.32%)

Branch coverage included in aggregate %.

342 of 357 new or added lines in 8 files covered. (95.8%)

3 existing lines in 2 files now uncovered.

8634 of 9198 relevant lines covered (93.87%)

15.92 hits per line

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

95.92

/src/components/carts/CartPage.tsx

import { DynamicData } from '../../@types/DynamicData';
import CartQuantity from '../../components/buttons/CartQuantity';
import RemoveCartButton from '../../components/buttons/RemoveCart';
import { payModel } from '../../redux/features/toggleSlice';
import { useAppSelector, useAppDispatch } from '../../redux/hooks/hooks';
import PaymentToggleModel from '../payment/PaymentToggleModel';

const CartPage = () => {
        const { carts, numberOfItem } = useAppSelector((state) => state.cart);
        const dispatch = useAppDispatch();
        const { openTaggle } = useAppSelector((state) => state.toggle);
        const paymentToggleModel = (): boolean => {
                dispatch(payModel());
                return true;
        };

        return (
                <>
                        {openTaggle && <PaymentToggleModel />}
                        <div className="grid grid-cols-1 ipad:grid-cols-2 gap-4 ipad:gap-8 mt-16 tablet:mt-24 ipad:mt-36 h-full bg-neutral-white px-5 py-10">
                                <div className="bg-neutral-greyLight rounded-xl p-6 flex flex-col justify-center ipad:order-1">
                                        <div className="bg-inputBg rounded-xl p-5 text-sm mb-3">
                                                <div className="mb-7 py-2">
                                                        <div className="flex justify-between gap-1 mb-3">
                                                                <p>Number of Items:</p>
                                                                <p>{numberOfItem} items</p>
                                                        </div>
                                                        <div className="flex justify-between">
                                                                <p>Total price:</p>
                                                                <p>
                                                                        <span>{carts?.total}</span> Rwf
                                                                </p>
                                                        </div>
                                                </div>
                                                <button
                                                        onClick={paymentToggleModel}
                                                        className="bg-action-success py-2 px-3 mobile:py-3 rounded-3xl text-neutral-white w-full text-sm hover:bg-action-success/90"
                                                >
                                                        Checkout ( <span>{carts?.total}</span> Rwf )
                                                </button>
                                        </div>
                                </div>
                                <div className="bg-neutral-greyLight p-5 rounded-3xl">
                                        <div className="mt-4">
                                                <h1 className="font-semibold text-base text-center text-primary-lightblue ipad:text-2xl ipad:text-left">
                                                        The Checkout Hub: Your Cart
                                                </h1>
                                                <hr className="text-primary-lightblue/45 my-3" />
                                        </div>

                                        <div className="overflow-y-scroll h-[34rem] space-y-10 ">
                                                {Array.isArray(carts?.products) &&
                                                        carts?.products?.map((item: DynamicData, idx: number) => (
                                                                <div
                                                                        key={idx}
                                                                        className="bg-inputBg grid grid-cols-1 mr-4 py-5 px-[0.6rem] gap-4 ipad:gap-0 ipad:px-0 ipad:py-1.5 ipad:flex items-center justify-between rounded-2xl "
                                                                >
                                                                        <div className="flex justify-between p-3 gap-5 ipad:gap-3 items-center">
                                                                                <div className="rounded-md  h-[112px] w-[112px]  ipad:w-[130px] ipad:h-[120px] laptop:w-[170px] laptop:h-[150px] overflow-hidden">
                                                                                        <img
                                                                                                className="mobile:w-full w-full h-full object-cover"
                                                                                                src={item.image}
                                                                                                alt={item.name}
                                                                                        />
                                                                                </div>
                                                                                <div className="text-xs flex-1">
                                                                                        <h2 className="font-semibold mb-2 mobile:text-lg ipad:text-sm">
                                                                                                {item.name}
                                                                                        </h2>
                                                                                        <div className="flex gap-1 mb-2 mobile:my-5 ipad:my-4">
                                                                                                <p className="text-xs mobile:text-sm ipad:text-xs">
                                                                                                        price:
                                                                                                </p>
                                                                                                <p className="text-xs mobile:text-sm ipad:text-xs">
                                                                                                        {item.price} Rwf
                                                                                                </p>
                                                                                        </div>
                                                                                        <div className="flex items-center gap-4">
                                                                                                <CartQuantity productId={item.id} />
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                        <div className="ipad:w-[20%] px-1 ipad:pr-3">
                                                                                <RemoveCartButton productId={item.id} />
                                                                        </div>
                                                                </div>
                                                        ))}
                                        </div>
                                </div>
                        </div>
                </>
        );
};

export default CartPage;

1	import { DynamicData } from '../../@types/DynamicData';	1✔
2	import CartQuantity from '../../components/buttons/CartQuantity';	1✔
3	import RemoveCartButton from '../../components/buttons/RemoveCart';	1✔
4	import { payModel } from '../../redux/features/toggleSlice';	1✔
5	import { useAppSelector, useAppDispatch } from '../../redux/hooks/hooks';	1✔
6	import PaymentToggleModel from '../payment/PaymentToggleModel';	1✔
7		1✔
8	const CartPage = () => {	1✔
9	const { carts, numberOfItem } = useAppSelector((state) => state.cart);	1✔
10	const dispatch = useAppDispatch();	1✔
11	const { openTaggle } = useAppSelector((state) => state.toggle);	1✔
12	const paymentToggleModel = (): boolean => {	1✔
NEW 13	dispatch(payModel());	×
NEW 14	return true;	×
NEW 15	};	×
16		1✔
17	return (	1✔
18	<>	1✔
19	{openTaggle && <PaymentToggleModel />}	1!
20	<div className="grid grid-cols-1 ipad:grid-cols-2 gap-4 ipad:gap-8 mt-16 tablet:mt-24 ipad:mt-36 h-full bg-neutral-white px-5 py-10">	1✔
21	<div className="bg-neutral-greyLight rounded-xl p-6 flex flex-col justify-center ipad:order-1">	1✔
22	<div className="bg-inputBg rounded-xl p-5 text-sm mb-3">	1✔
23	<div className="mb-7 py-2">	1✔
24	<div className="flex justify-between gap-1 mb-3">	1✔
25	<p>Number of Items:</p>	1✔
26	<p>{numberOfItem} items</p>	1✔
27	</div>	1✔
28	<div className="flex justify-between">	1✔
29	<p>Total price:</p>	1✔
30	<p>	1✔
31	<span>{carts?.total}</span> Rwf	1✔
32	</p>	1✔
33	</div>	1✔
34	</div>	1✔
35	<button	1✔
36	onClick={paymentToggleModel}	1✔
37	className="bg-action-success py-2 px-3 mobile:py-3 rounded-3xl text-neutral-white w-full text-sm hover:bg-action-success/90"	1✔
38	>	1✔
39	Checkout ( <span>{carts?.total}</span> Rwf )	1✔
40	</button>	1✔
41	</div>	1✔
42	</div>	1✔
43	<div className="bg-neutral-greyLight p-5 rounded-3xl">	1✔
44	<div className="mt-4">	1✔
45	<h1 className="font-semibold text-base text-center text-primary-lightblue ipad:text-2xl ipad:text-left">	1✔
46	The Checkout Hub: Your Cart	1✔
47	</h1>	1✔
48	<hr className="text-primary-lightblue/45 my-3" />	1✔
49	</div>	1✔
50		1✔
51	<div className="overflow-y-scroll h-[34rem] space-y-10 ">	1✔
52	{Array.isArray(carts?.products) &&	1✔
53	carts?.products?.map((item: DynamicData, idx: number) => (	1✔
54	<div	2✔
55	key={idx}	2✔
56	className="bg-inputBg grid grid-cols-1 mr-4 py-5 px-[0.6rem] gap-4 ipad:gap-0 ipad:px-0 ipad:py-1.5 ipad:flex items-center justify-between rounded-2xl "	2✔
57	>	2✔
58	<div className="flex justify-between p-3 gap-5 ipad:gap-3 items-center">	2✔
59	<div className="rounded-md h-[112px] w-[112px] ipad:w-[130px] ipad:h-[120px] laptop:w-[170px] laptop:h-[150px] overflow-hidden">	2✔
60	<img	2✔
61	className="mobile:w-full w-full h-full object-cover"	2✔
62	src={item.image}	2✔
63	alt={item.name}	2✔
64	/>	2✔
65	</div>	2✔
66	<div className="text-xs flex-1">	2✔
67	<h2 className="font-semibold mb-2 mobile:text-lg ipad:text-sm">	2✔
68	{item.name}	2✔
69	</h2>	2✔
70	<div className="flex gap-1 mb-2 mobile:my-5 ipad:my-4">	2✔
71	<p className="text-xs mobile:text-sm ipad:text-xs">	2✔
72	price:	2✔
73	</p>	2✔
74	<p className="text-xs mobile:text-sm ipad:text-xs">	2✔
75	{item.price} Rwf	2✔
76	</p>	2✔
77	</div>	2✔
78	<div className="flex items-center gap-4">	2✔
79	<CartQuantity productId={item.id} />	2✔
80	</div>	2✔
81	</div>	2✔
82	</div>	2✔
83	<div className="ipad:w-[20%] px-1 ipad:pr-3">	2✔
84	<RemoveCartButton productId={item.id} />	2✔
85	</div>	2✔
86	</div>	2✔
87	))}	1✔
88	</div>	1✔
89	</div>	1✔
90	</div>	1✔
91	</>	1✔
92	);	1✔
93	};	1✔
94		1✔
95	export default CartPage;	1✔

atlp-rwanda / hackers-ec-Fe / #1136

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