refactor: 상수명 명확하게 변경 및 비슷한 상수 객체로 묶음

woowacourse · May 12, 2023 · 9bb45d1 · 9bb45d1
1 parent 206e1b6
commit 9bb45d1
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 13 deletions.
diff --git a/src/components/ProductItem.tsx b/src/components/ProductItem.tsx
@@ -2,14 +2,14 @@ import { useState, ChangeEventHandler, useEffect } from 'react';
 import { css, styled } from 'styled-components';
 import QuantityInput from './QuantityInput';
 import Icon from './common/Icon';
-import { CART_PATH } from '../constants/svgPath';
-import { INITIAL_QUANTITY, NONE_QUANTITY, NOT_NUMBER } from '../constants';
 import { changeInvalidValueToBlank } from '../utils/changeInvalidValueToBlank';
 import { atom, useRecoilValue, useRecoilState } from 'recoil';
 import { Product, CartItem } from '../types';
 import { productListState } from './ProductList';
 import { useSetCart } from '../hooks/useSetCart';
 import { setDataInLocalStorage } from '../utils/setDataInLocalStorage';
+import { CART_PATH } from '../constants/svgPath';
+import { QUANTITY, NOT_NUMBER } from '../constants';
 
 interface Props {
   id: number;
@@ -32,7 +32,7 @@ const ProductItem = ({ id, imgUrl, name, price }: Props) => {
   const [quantity, setQuantity] = useState(
     cart.filter((item: CartItem) => item.id === id).length
       ? cart.filter((item: CartItem) => item.id === id)[0].quantity
-      : INITIAL_QUANTITY
+      : QUANTITY.INITIAL
   );
 
   useEffect(() => {
@@ -51,7 +51,7 @@ const ProductItem = ({ id, imgUrl, name, price }: Props) => {
   const handleNumberInputChange: ChangeEventHandler<HTMLInputElement> = ({ target }) => {
     const { value } = target;
 
-    if (value === NONE_QUANTITY) {
+    if (value === QUANTITY.NONE) {
       setIsSelected(false);
 
       removeProductItemFromCart();
@@ -61,7 +61,7 @@ const ProductItem = ({ id, imgUrl, name, price }: Props) => {
       };
       setCart((prev: Product[]) => removeProductFromCart(prev));
 
-      return setQuantity(INITIAL_QUANTITY);
+      return setQuantity(QUANTITY.INITIAL);
     }
 
     setQuantity(changeInvalidValueToBlank(value, NOT_NUMBER));

diff --git a/src/constants/index.ts b/src/constants/index.ts
@@ -1,6 +1,9 @@
-export const INITIAL_QUANTITY: Readonly<string> = '1';
-export const NONE_QUANTITY: Readonly<string> = '0';
+export const QUANTITY: Readonly<Record<string, string>> = {
+  INITIAL: '1',
+  NONE: '0',
+};
 
-export const NOT_NUMBER: Readonly<RegExp> = /[^0-9]/g;
-export const CART_ITEM_EXISTS: Readonly<number> = 0;
-export const ONE_ITEM_IN_CART: Readonly<number> = 1;
+export const NOT_NUMBER = /[^0-9]/g;
+
+export const FIRST_INDEX = 0;
+export const ONE_ITEM_IN_CART = 1;
diff --git a/src/hooks/useSetCart.ts b/src/hooks/useSetCart.ts
@@ -2,7 +2,7 @@ import { useRecoilValue, useSetRecoilState } from 'recoil';
 import { cartState } from '../components/ProductItem';
 import { productListState } from '../components/ProductList';
 import { CartItem, Product } from '../types';
-import { CART_ITEM_EXISTS, ONE_ITEM_IN_CART } from '../constants';
+import { FIRST_INDEX, ONE_ITEM_IN_CART } from '../constants';
 
 export const useSetCart = (id: number) => {
   const productList = useRecoilValue<Product[]>(productListState);
@@ -19,7 +19,7 @@ export const useSetCart = (id: number) => {
     setCart((prev: CartItem[]) => {
       const { cartItemIndex, updatedCart } = findCartItemIndexAndUpdatedCart(prev);
 
-      if (cartItemIndex >= CART_ITEM_EXISTS) {
+      if (cartItemIndex >= FIRST_INDEX) {
         const updatedItem = { ...prev[cartItemIndex], quantity: Number(value) };
         updatedCart[cartItemIndex] = updatedItem;
 
@@ -40,7 +40,7 @@ export const useSetCart = (id: number) => {
     setCart((prev: CartItem[]) => {
       const { cartItemIndex, updatedCart } = findCartItemIndexAndUpdatedCart(prev);
 
-      if (cartItemIndex >= CART_ITEM_EXISTS) {
+      if (cartItemIndex >= FIRST_INDEX) {
         updatedCart.splice(cartItemIndex, ONE_ITEM_IN_CART);
 
         return updatedCart;