224a33ee-6312-4e35-a3c1-737e538cde32

Committed 30 Jun 2024 05:10PM UTC coverage: 92.601% (-4.2%) from 96.809%

Build # 224a33ee-6312-4e35-a3c1-737e538cde32

Build Type

Pull #16

circleci

Committed by

Yvan-David

Commit Message

feat(Add Product): implement frontend for adding product

 - seller should be able to add a product in a collection
 - only authenticated seller can access the collection and the page
 - a seller can create a collection

[Delivers #187364686]

Pull Request Pull Request #16: [#187364686] A seller should be able to create/add items

Run Details

158 of 183 branches covered (86.34%)

Branch coverage included in aggregate %.

210 of 242 new or added lines in 12 files covered. (86.78%)

1 existing line in 1 file now uncovered.

618 of 655 relevant lines covered (94.35%)

6.41 hits per line

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

93.75

/src/views/dashboard/seller/CreateColletion.tsx

import { useState } from 'react';
import { addNewCollection } from '../../../redux/slices/collectionSlice';
import { useDispatch } from 'react-redux';
import { AppDispatch } from '../../../redux/store';
import {  ToastContainer, toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";

interface ModalProps {
  isOpen: boolean;
  onClose: () => void;
  onSave: (optionName: string) => void;
}

const CreateCollection: React.FC<ModalProps> = ({ isOpen, onClose, onSave }) => {
  const dispatch = useDispatch<AppDispatch>();
  const [optionName, setOptionName] = useState('');
  const [optionDescription, setOptionDescription] = useState('');

  if (!isOpen) return null;
  const handleReload = () => {
    window.location.reload();
    toast.success(" Collection created");
  };
  const handleSave = () => {
    if (optionName.trim()) {
      onSave(optionName);
      onSave(optionDescription);
      setOptionName('');
      setOptionDescription('');
      try {
        dispatch(addNewCollection({
          name: optionName,
          description: optionDescription
        }));
      } catch (error) {
        toast.error("Error adding Collection Try again");
        console.error('Error adding new collection:', error);
      }
    }
  };
  const handleClick = () => {
    handleSave();
    handleReload();
  };

  return (
    <div className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50">
      <div className="bg-white rounded-lg shadow-lg p-6 w-[50%]">
        <h2 className="text-xl mb-4">Add New Collection</h2>
        <label className="text-xl mb-4 block">Name</label>
        <input
          type="text"
          className="border border-gray-300 rounded-md px-2 py-1 w-full mb-4"
          value={optionName}
          onChange={(e) => setOptionName(e.target.value)}
          placeholder="Collection name"
        />
        <label className="text-xl mb-4 block">Description</label>
        <textarea
          className="border border-gray-300 rounded-md px-2 py-1 w-full mb-4"
          value={optionDescription}
          onChange={(e) => setOptionDescription(e.target.value)}
          placeholder="Describe your collection"
        />
        <div className="flex justify-end">
          <button
            className="px-4 py-2 bg-gray-300 text-gray-700 rounded-md mr-2"
            onClick={onClose}
          >
            <span className='w-50rem'>Cancel</span>
          </button>
          <button
            className="px-4 py-2 bg-black text-white rounded-md"
            onClick={handleClick}
          >
            Save
          </button>
        </div>
      </div>
      <ToastContainer />
    </div>
  );
};

export default CreateCollection;

1	import { useState } from 'react';	3✔
2	import { addNewCollection } from '../../../redux/slices/collectionSlice';	3✔
3	import { useDispatch } from 'react-redux';	3✔
4	import { AppDispatch } from '../../../redux/store';
5	import { ToastContainer, toast } from "react-toastify";	3✔
6	import "react-toastify/dist/ReactToastify.css";	3✔
7
8	interface ModalProps {
9	isOpen: boolean;
10	onClose: () => void;
11	onSave: (optionName: string) => void;
12	}
13
14	const CreateCollection: React.FC<ModalProps> = ({ isOpen, onClose, onSave }) => {	3✔
15	const dispatch = useDispatch<AppDispatch>();	24✔
16	const [optionName, setOptionName] = useState('');	24✔
17	const [optionDescription, setOptionDescription] = useState('');	24✔
18
19	if (!isOpen) return null;	24✔
20	const handleReload = () => {	7✔
21	window.location.reload();	1✔
22	toast.success(" Collection created");	1✔
23	};
24	const handleSave = () => {	7✔
25	if (optionName.trim()) {	1✔
26	onSave(optionName);	1✔
27	onSave(optionDescription);	1✔
28	setOptionName('');	1✔
29	setOptionDescription('');	1✔
30	try {	1✔
31	dispatch(addNewCollection({	1✔
32	name: optionName,
33	description: optionDescription
34	}));
35	} catch (error) {
NEW 36	toast.error("Error adding Collection Try again");	×
NEW 37	console.error('Error adding new collection:', error);	×
38	}
39	}
40	};
41	const handleClick = () => {	7✔
42	handleSave();	1✔
43	handleReload();	1✔
44	};
45
46	return (	7✔
47	<div className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50">
48	<div className="bg-white rounded-lg shadow-lg p-6 w-[50%]">
49	<h2 className="text-xl mb-4">Add New Collection</h2>
50	<label className="text-xl mb-4 block">Name</label>
51	<input
52	type="text"
53	className="border border-gray-300 rounded-md px-2 py-1 w-full mb-4"
54	value={optionName}
55	onChange={(e) => setOptionName(e.target.value)}	1✔
56	placeholder="Collection name"
57	/>
58	<label className="text-xl mb-4 block">Description</label>
59	<textarea
60	className="border border-gray-300 rounded-md px-2 py-1 w-full mb-4"
61	value={optionDescription}
62	onChange={(e) => setOptionDescription(e.target.value)}	1✔
63	placeholder="Describe your collection"
64	/>
65	<div className="flex justify-end">
66	<button
67	className="px-4 py-2 bg-gray-300 text-gray-700 rounded-md mr-2"
68	onClick={onClose}
69	>
70	<span className='w-50rem'>Cancel</span>
71	</button>
72	<button
73	className="px-4 py-2 bg-black text-white rounded-md"
74	onClick={handleClick}
75	>
76	Save
77	</button>
78	</div>
79	</div>
80	<ToastContainer />
81	</div>
82	);
83	};
84
85	export default CreateCollection;	3✔

atlp-rwanda / e-commerce-bitcrafters-fn / 224a33ee-6312-4e35-a3c1-737e538cde32

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