6f390c78-9d32-4d1c-81b7-dcd85b5bfb2f

Committed 30 Jun 2024 03:40PM UTC coverage: 92.874% (-3.9%) from 96.809%

Build # 6f390c78-9d32-4d1c-81b7-dcd85b5bfb2f

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 182 branches covered (86.81%)

Branch coverage included in aggregate %.

202 of 232 new or added lines in 11 files covered. (87.07%)

1 existing line in 1 file now uncovered.

611 of 646 relevant lines covered (94.58%)

6.47 hits per line

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

95.0

/src/redux/slices/addProductSlice.ts

import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; 
import { RootState } from "../store";
import { axiosRequest } from "../../utils/baseUrl";
import { toast } from "react-toastify";

export interface Product {
  name: string;
  price: number;
  category: string;
  bonus: number;
  sku: string;
  quantity: number;
  expiryDate?: string;
  images?: File[];
}
const initialState = {
  product: null,
  status: 'idle', //'idle' | 'loading', | 'succeeded' | 'failed'
  error: null
}

export const addNewProduct = createAsyncThunk('products/addProducts', async (product:Product) => {
  try{
    const formData = new FormData();
    Object.keys(product).forEach(key => {
      if (key === 'images' && product.images) {
        product.images.forEach(image => formData.append('images', image));
      } else {
        formData.append(key, product[key as keyof Product] as string);
      }
    });
    for (const pair of formData.entries()) {
      console.log(pair[0], pair[1]);
    }
    const collectionId = localStorage.getItem("collectionId")
    if(!collectionId){
      return "no collection chosen"
    }
    const response = await axiosRequest('POST', `/collections/${collectionId}/product`, product, true);
    
    console.log(response.data)
    if (response.status === 200) {
      toast.success("Product added successfully");
    } else {
      toast.error("Error adding Product Choose Collection and Try again");
    }

    return response.data
  } catch(err){
    toast.error("Error adding Product Try again");
    return err
  }
})

const productsSlice = createSlice({
  name: 'products',
  initialState,
  reducers: {},
  extraReducers(builder){
    builder
      .addCase(addNewProduct.pending, state => {
        state.status = 'loading';
        state.error = null;
      })
      .addCase(addNewProduct.fulfilled, (state, action) => {
        state.status = 'succeeded';
        state.product = action.payload
        console.log(action.payload)
      })
  }
})

export const selectAllProducts = (state: RootState) => state.products
//export const { productAdded } = productsSlice.actions
export default productsSlice.reducer

1	import { createSlice, createAsyncThunk } from "@reduxjs/toolkit";	6✔
2	import { RootState } from "../store";
3	import { axiosRequest } from "../../utils/baseUrl";	6✔
4	import { toast } from "react-toastify";	6✔
5
6	export interface Product {
7	name: string;
8	price: number;
9	category: string;
10	bonus: number;
11	sku: string;
12	quantity: number;
13	expiryDate?: string;
14	images?: File[];
15	}
16	const initialState = {	6✔
17	product: null,
18	status: 'idle', //'idle' \| 'loading', \| 'succeeded' \| 'failed'
19	error: null
20	}
21
22	export const addNewProduct = createAsyncThunk('products/addProducts', async (product:Product) => {	6✔
23	try{	4✔
24	const formData = new FormData();	4✔
25	Object.keys(product).forEach(key => {	4✔
26	if (key === 'images' && product.images) {	25✔
27	product.images.forEach(image => formData.append('images', image));	2✔
28	} else {
29	formData.append(key, product[key as keyof Product] as string);	24✔
30	}
31	});
32	for (const pair of formData.entries()) {	4✔
33	console.log(pair[0], pair[1]);	26✔
34	}
35	const collectionId = localStorage.getItem("collectionId")	4✔
36	if(!collectionId){	4✔
37	return "no collection chosen"	2✔
38	}
39	const response = await axiosRequest('POST', `/collections/${collectionId}/product`, product, true);	2✔
40
41	console.log(response.data)	1✔
42	if (response.status === 200) {	1!
43	toast.success("Product added successfully");	1✔
44	} else {
NEW 45	toast.error("Error adding Product Choose Collection and Try again");	×
46	}
47
48	return response.data	1✔
49	} catch(err){
50	toast.error("Error adding Product Try again");	1✔
51	return err	1✔
52	}
53	})
54
55	const productsSlice = createSlice({	6✔
56	name: 'products',
57	initialState,
58	reducers: {},
59	extraReducers(builder){
60	builder	6✔
61	.addCase(addNewProduct.pending, state => {
62	state.status = 'loading';	3✔
63	state.error = null;	3✔
64	})
65	.addCase(addNewProduct.fulfilled, (state, action) => {
66	state.status = 'succeeded';	3✔
67	state.product = action.payload	3✔
68	console.log(action.payload)	3✔
69	})
70	}
71	})
72
73	export const selectAllProducts = (state: RootState) => state.products	6✔
74	//export const { productAdded } = productsSlice.actions
75	export default productsSlice.reducer	6✔

atlp-rwanda / e-commerce-bitcrafters-fn / 6f390c78-9d32-4d1c-81b7-dcd85b5bfb2f

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