Best JavaScript code snippet using best
reducer.js
Source: reducer.js
1const ADD_NEW_ITEM = 'ADD_NEW_ITEM',2 REMOVE_ITEM = 'REMOVE_ITEM',3 ITEM_IN_PROGRESS = 'ITEM_IN_PROGRESS',4 ITEM_COMPLETED = 'ITEM_COMPLETED',5 SELECT_ITEM = 'SELECT_ITEM',6 CLEAR_ITEM_SELECTED = 'CLEAR_ITEM_SELECTED',7 SAVE_CHANGES = 'SAVE_CHANGES';8let initialState = {9 newList: [],10 inProgressList: [],11 completedList: [],12 itemSelected:{13 title:null,14 description:null,15 completed:null,16 }17}18export default function reducer(state = initialState, action){19 console.log(action.type);20 switch(action.type){21 case SAVE_CHANGES:22 return Object.assign({}, state, action.comp==='new'? {newList: state.newList.map((e)=>{23 return Object.assign({}, e, {24 title:action.title && action.oldTitle === e.title? action.title : e.title, 25 description:action.description && action.oldDescription === e.description? action.description:e.description,26 });27 }), itemSelected:{28 title: action.title? action.title : state.itemSelected.title,29 description: action.description? action.description : state.itemSelected.description,30 completed: state.itemSelected.completed, 31 }} : action.comp==='progress'? {inProgressList: state.inProgressList.map((e)=>{32 return Object.assign({}, e, {33 title:action.title && action.oldTitle === e.title? action.title:e.title, 34 description:action.description && action.oldDescription === e.description? action.description:e.description,35 });36 }), itemSelected:{37 title: action.title? action.title : state.itemSelected.title,38 description: action.description? action.description : state.itemSelected.description,39 completed: state.itemSelected.completed, 40 }}: {completedList: state.completedList.map((e)=>{41 return Object.assign({}, e, {42 title:action.title && action.oldTitle === e.title? action.title:e.title, 43 description:action.description && action.oldDescription === e.description? action.description:e.description,44 });45 }), itemSelected:{46 title: action.title? action.title : state.itemSelected.title,47 description: action.description? action.description : state.itemSelected.description,48 completed: state.itemSelected.completed, 49 }})50 case CLEAR_ITEM_SELECTED:51 return Object.assign({}, state, {52 itemSelected: {53 title: null,54 description: null,55 completed: null,56 }57 })58 case ADD_NEW_ITEM:59 return Object.assign({}, state, {60 newList: [...state.newList,{61 title:action.title, description:action.description62 }]63 });64 case REMOVE_ITEM:65 return action.list==='new'?66 Object.assign({}, state, {newList: state.newList.filter((e)=>{67 return e.title!==action.title && e.description!==action.description68 }), itemSelected:{69 title: action.title===state.itemSelected.title? null : state.itemSelected.title,70 description: action.description===state.itemSelected.description? null : state.itemSelected.description,71 completed: action.description===state.itemSelected.description? null : state.itemSelected.completed,72 }}) : action.list==='progress'?73 Object.assign({}, state, {inProgressList: state.inProgressList.filter((e)=>{74 return e.title!==action.title && e.description!==action.description75 }), itemSelected:{76 title: action.title===state.itemSelected.title? null : state.itemSelected.title,77 description: action.description===state.itemSelected.description? null : state.itemSelected.description,78 completed: action.description===state.itemSelected.description? null : state.itemSelected.completed,79 }}) :80 Object.assign({}, state, {completedList: state.completedList.filter((e)=>{81 return e.title!==action.title && e.description!==action.description82 }), itemSelected:{83 title: action.title===state.itemSelected.title? null : state.itemSelected.title,84 description: action.description===state.itemSelected.description? null : state.itemSelected.description,85 completed: action.description===state.itemSelected.description? null : state.itemSelected.completed,86 }}) 87 case ITEM_IN_PROGRESS:88 return Object.assign({}, state, {89 newList: state.newList.filter((e)=>{90 return (e.title!==action.title && e.description!==action.description)91 }), 92 inProgressList:[...state.inProgressList, {93 title:action.title, description:action.description94 }],95 itemSelected: action.title === state.itemSelected.title && action.description === state.itemSelected.description?96 {97 title:action.title,98 description: action.description,99 completed: 'progress'100 } :101 {102 title:state.itemSelected.title,103 description: state.itemSelected.description,104 completed:state.itemSelected.completed105 }106 })107 case ITEM_COMPLETED:108 return Object.assign({}, state, {109 inProgressList: state.inProgressList.filter((e)=>{110 return e.title!==action.title && e.description!==action.description111 }),112 completedList: [...state.completedList, {113 title:action.title, description:action.description114 }],115 itemSelected: action.title === state.itemSelected.title && action.description === state.itemSelected.description?116 {117 title:action.title,118 description: action.description,119 completed: 'complete'120 } :121 {122 title:state.itemSelected.title,123 description: state.itemSelected.description,124 completed:state.itemSelected.completed125 }126 })127 case SELECT_ITEM:128 return Object.assign({}, state, {itemSelected: {129 title: action.title,130 description: action.description,131 completed: action.status132 }})133 default:134 return Object.assign({}, state)135 }...
basketReducer.js
Source: basketReducer.js
1import {2 ADD_PRODUCT_BASKET,3 GET_NUMBERS_BASKET,4 INCREASE_QUANTITY,5 DECREASE_QUANTITY,6 CLEAR_PRODUCT,7} from "../actions/types";8const initialState = {9 basketNumbers: 0,10 cartCost: 0,11 products: {12 nyc: {13 name: "New York Shirt",14 tagName: "nyc",15 price: 12.0,16 numbers: 0,17 inCart: false,18 },19 logo: {20 name: "White Logo Shirt",21 tagName: "logo",22 price: 15.0,23 numbers: 0,24 inCart: false,25 },26 design: {27 name: "Design Logo Shirt",28 tagName: "design",29 price: 18.0,30 numbers: 0,31 inCart: false,32 },33 stripe: {34 name: "Solid Stripe Shirt",35 tagName: "stripe",36 price: 20.0,37 numbers: 0,38 inCart: false,39 },40 white: {41 name: "Plain White Shirt",42 tagName: "white",43 price: 25.0,44 numbers: 0,45 inCart: false,46 },47 pink: {48 name: "Pink Polo Shirt",49 tagName: "pink",50 price: 30.0,51 numbers: 0,52 inCart: false,53 },54 },55};56export default (state = initialState, action) => {57 let itemSelected = {};58 switch (action.type) {59 case ADD_PRODUCT_BASKET:60 itemSelected = { ...state.products[action.payload] };61 itemSelected.numbers += 1;62 itemSelected.inCart = true;63 console.log(itemSelected);64 return {65 ...state,66 basketNumbers: state.basketNumbers + 1,67 cartCost: state.cartCost + state.products[action.payload].price,68 products: {69 ...state.products,70 [action.payload]: itemSelected,71 },72 };73 case GET_NUMBERS_BASKET:74 return {75 ...state,76 };77 case INCREASE_QUANTITY:78 itemSelected = { ...state.products[action.payload] };79 itemSelected.numbers += 1;80 return {81 ...state,82 basketNumbers: state.basketNumbers + 1,83 cartCost: state.cartCost + state.products[action.payload].price,84 products: {85 ...state.products,86 [action.payload]: itemSelected,87 },88 };89 case DECREASE_QUANTITY:90 itemSelected = { ...state.products[action.payload] };91 let newCartCost = 0;92 let newBasketNumbers = 0;93 if (itemSelected.numbers === 0) {94 itemSelected.numbers = 0;95 newCartCost = state.cartCost;96 newBasketNumbers = state.basketNumbers;97 } else {98 itemSelected.numbers -= 1;99 newCartCost = state.cartCost - state.products[action.payload].price;100 newBasketNumbers = state.basketNumbers - 1;101 }102 return {103 ...state,104 basketNumbers: newBasketNumbers,105 cartCost: newCartCost,106 products: {107 ...state.products,108 [action.payload]: itemSelected,109 },110 };111 case CLEAR_PRODUCT:112 itemSelected = { ...state.products[action.payload] };113 let numbersBack = itemSelected.numbers;114 itemSelected.numbers = 0;115 itemSelected.inCart = false;116 return {117 ...state,118 basketNumbers: state.basketNumbers - numbersBack,119 cartCost: state.cartCost - numbersBack * itemSelected.price,120 products: {121 ...state.products,122 [action.payload]: itemSelected,123 },124 };125 default:126 return state;127 }...
ProductDetail.js
Source: ProductDetail.js
1import React from "react"2import { pushToCart } from "../redux/actions"3import { useDispatch } from "react-redux"4import { useHistory } from "react-router-dom"5import { formatMoney, priceByDiscount, priceByQuantity } from "./functions"6import "../assets/scss/ProductDetail.scss"7const ProductDetail = (props) => {8 const { itemSelected, increaseQuantity, decreaseQuantity } = props9 const history = useHistory()10 const dispatch = useDispatch()11 const pushItem = () => {12 const item = Object.assign({}, itemSelected)13 dispatch(pushToCart(item))14 }15 const redirectToCart = () => {16 pushItem()17 history.push("/shoppingcart")18 }19 return (20 <div className="detailProduct">21 <div className="image">22 <img src={itemSelected.src} alt="" />23 </div>24 <div className="info">25 <h2>{itemSelected.name}</h2>26 <div className="info--flex">27 {itemSelected.discount !== 0 && (28 <div className="info__discount">-{itemSelected.discount}%</div>29 )}30 <div className="info__price">31 <div className="info__price__properties">32 {itemSelected.discount ? (33 <>34 <div>Giá niêm yết</div>35 <div>Giá khuyến mãi</div>36 </>37 ) : (38 <div>Giá bán lẻ</div>39 )}40 </div>41 <div className="info__price__value">42 {itemSelected.discount ? (43 <>44 <div className="info__price__value--lineThrough">45 {formatMoney(itemSelected.price)}46 </div>47 <div>48 {formatMoney(49 priceByDiscount(itemSelected.price, itemSelected.discount)50 )}51 </div>52 </>53 ) : (54 <div>{formatMoney(itemSelected.price)}</div>55 )}56 </div>57 </div>58 <div className="info__counter">59 <span>Chá»n sá» lượng</span>60 <button61 disabled={itemSelected.quantity === 1}62 onClick={() => decreaseQuantity(itemSelected)}63 >64 -65 </button>66 <input type="text" value={itemSelected.quantity} disabled={true} />67 <button onClick={() => increaseQuantity(itemSelected)}>+</button>68 <span>69 {formatMoney(70 priceByQuantity(71 priceByDiscount(itemSelected),72 itemSelected.quantity73 )74 )}75 </span>76 </div>77 </div>78 <div className="button">79 <button onClick={redirectToCart}>MUA NGAY</button>80 <button onClick={pushItem}>THÃM VÃO GIá» HÃNG</button>81 </div>82 </div>83 </div>84 )85}...
Using AI Code Generation
1var BestBuyApi = require('./BestBuyApi');2var bestBuyApi = new BestBuyApi();3bestBuyApi.itemSelected('1', function(err, data) {4 if (err) {5 console.log('Error: ' + err);6 } else {7 console.log('Data: ' + data);8 }9});
Using AI Code Generation
1var BestBuyService = require('./bestbuy-service.js');2var bestBuyService = new BestBuyService();3bestBuyService.itemSelected('12345', function (err, data) {4 if (err) {5 console.log(err);6 } else {7 console.log(data);8 }9});10* **Nathan Miller** - [nmiller22](
Check out the latest blogs from LambdaTest on this topic:
LambdaTest has recently received two notable awards from the leading business software directory FinancesOnline after their experts were impressed with our test platform’s capabilities in accelerating one’s development process.
The layout of a web page is one of the most important features of a web page. It can affect the traffic inflow by a significant margin. At times, a designer may come up with numerous layout ideas and sometimes he/she may struggle the entire day to come up with one. Moreover, design becomes even more important when it comes to ensuring cross browser compatibility.
Chrome is hands down the most used browsers by developers and users alike. It is the primary reason why there is such a solid chrome community and why there is a huge list of Chrome Extensions targeted at developers.
In a startup, the major strength of the people is that they are multitaskers. Be it anything, the founders and the core team wears multiple hats and takes complete responsibilities to get the ball rolling. From designing to deploying, from development to testing, everything takes place under the hawk eyes of founders and the core members.
We are in the era of the ‘Heads down’ generation. Ever wondered how much time you spend on your smartphone? Well, let us give you an estimate. With over 2.5 billion smartphone users, an average human spends approximately 2 Hours 51 minutes on their phone every day as per ComScore’s 2017 report. The number increases by an hour if we include the tab users as well!
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Get 100 minutes of automation test minutes FREE!!