feat: @nft-team/core 유틸함수 라이브러리 적용 (#169)

components/common/StarRating/index.tsx

@@ -1,11 +1,11 @@
 import { useMemo } from 'react';
 
+import { checkNumber, generateArrayOfNumber } from '@nft-team/core';
 import clsx from 'clsx';
 
 import {
   EmptyStarIcon, FillStarIcon, HalfStarIcon, PixelEmptyStar, PixelFillStar, PixelHalfStar,
 } from 'lib/assets/icons';
-import { checkNumberValue, generateArrayOfNumber } from 'utils';
 
 import styles from './index.module.scss';
 
@@ -19,7 +19,7 @@ type Props = {
 function StarRating({
   rating, maxRating = 5, type, className,
 }: Props) {
-  const numberRating = checkNumberValue(rating);
+  const numberRating = checkNumber(rating);
   const fillStarCount = Math.floor(numberRating);
 
   const detailClassName = clsx({

components/detail/PlaceDetailWindow/index.tsx

@@ -2,6 +2,7 @@
 
 import Image from 'next/image';
 
+import { checkEmpty, checkNumber } from '@nft-team/core';
 import { DelayRenderComponent, GlobalPortal } from '@nft-team/react';
 import clsx from 'clsx';
 import { motion, useIsomorphicLayoutEffect, Variants } from 'framer-motion';
@@ -13,7 +14,6 @@ import Spinner from 'components/common/Spinner';
 import StarRating from 'components/common/StarRating';
 import { CloseIcon } from 'lib/assets/icons';
 import { PlacesWithSearchResult } from 'lib/types/google.maps';
-import { checkEmpty, checkNumberValue } from 'utils';
 
 import styles from './index.module.scss';
 
@@ -127,7 +127,7 @@ function PlaceDetailWindow({
                   {placeDetail?.searchBlogPost.status === 'fulfilled' && (
                     <Accordion
                       title="네이버 검색결과"
-                      counterColor={checkNumberValue(placeDetail?.searchBlogPost.value.total_count) > NAVER_MAX_REVIEW_COUNT ? 'danger' : 'positive'}
+                      counterColor={checkNumber(placeDetail?.searchBlogPost.value.total_count) > NAVER_MAX_REVIEW_COUNT ? 'danger' : 'positive'}
                       counter={placeDetail?.searchBlogPost.value.total_count}
                       wrapperClassName={styles.reviewAccordionWrapper}
                     >

components/map/PlaceBottomSheet/index.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import { BottomSheet } from 'react-spring-bottom-sheet';
 
+import { checkEmpty } from '@nft-team/core';
 import { useQuery } from '@tanstack/react-query';
 import { shallow } from 'zustand/shallow';
 
@@ -10,7 +11,6 @@ import { fetchAllSettledSearchBlogs } from 'lib/apis/search';
 import { PlaceResult } from 'lib/types/google.maps';
 import { SelectedPlace } from 'lib/types/search';
 import usePlaceDetailWindowStore from 'stores/placeDetailWindow';
-import { checkEmpty } from 'utils';
 
 import PlaceBottomSheetItem from '../PlaceBottomSheetItem';
 

components/map/PlaceBottomSheetItem/index.tsx

@@ -1,8 +1,9 @@
+import { checkNumber } from '@nft-team/core';
 import { useActionKeyEvent } from '@nft-team/react';
 
 import StarRating from 'components/common/StarRating';
 import { PlacesWithSearchResult } from 'lib/types/google.maps';
-import { checkNumberValue, numberWithComma } from 'utils';
+import { numberWithComma } from 'utils';
 
 import styles from './index.module.scss';
 
@@ -13,7 +14,7 @@ type Props = {
 
 function PlaceBottomSheetItem({ place, onClick }: Props) {
   const { name, user_ratings_total } = place;
-  const rating = checkNumberValue(place.rating);
+  const rating = checkNumber(place.rating);
 
   const onKeyDown = useActionKeyEvent<HTMLLIElement>(['Enter', 'NumpadEnter'], () => onClick);
 

package.json

@@ -31,6 +31,7 @@
   },
   "homepage": "https://github.com/mbti-nf-team/unnamed-k-place-frontend#readme",
   "dependencies": {
+    "@nft-team/core": "^1.1.0",
     "@nft-team/react": "^1.2.0",
     "@react-google-maps/api": "^2.18.1",
     "@tanstack/react-query": "^4.29.5",

utils/index.test.ts

@@ -1,6 +1,4 @@
-import {
-  checkEmpty, checkNumberValue, codeToFlag, generateArrayOfNumber, numberWithComma,
-} from 'utils';
+import { codeToFlag, numberWithComma } from 'utils';
 
 describe('codeToFlag', () => {
   it('flag 이모지 유니코드로 변경되어야만 한다.', () => {
@@ -10,52 +8,6 @@ describe('codeToFlag', () => {
   });
 });
 
-describe('generateArrayOfNumber', () => {
-  it('넘겨준 값에 따른 길이의 배열을 반환해야만한다', () => {
-    const result = generateArrayOfNumber(5);
-
-    expect(result.length).toBe(5);
-  });
-});
-
-describe('checkNumberValue', () => {
-  context('number type이 아닌 경우', () => {
-    it('0을 반환해야 한다', () => {
-      const result = checkNumberValue(null);
-
-      expect(result).toBe(0);
-    });
-  });
-
-  context('number type인 경우', () => {
-    it('그대로 입력된 값을 반환해야만 한다.', () => {
-      const result = checkNumberValue(100);
-
-      expect(result).toBe(100);
-    });
-  });
-});
-
-describe('checkEmpty', () => {
-  context('value가 undefined이거나 빈 배열인 경우', () => {
-    it('빈 배열을 반환해야만 한다', () => {
-      const result = checkEmpty();
-
-      expect(result).toEqual([]);
-    });
-  });
-
-  context('value가 undefined이거나 빈 배열이 아닌 경우', () => {
-    const mockArray = ['test', 'test2'];
-
-    it('입력된 값이 반환되어야 한다', () => {
-      const result = checkEmpty(mockArray);
-
-      expect(result).toEqual(mockArray);
-    });
-  });
-});
-
 describe('numberWithComma', () => {
   context('숫자인 경우', () => {
     it('콤마가 붙은 숫자 string형이 반환되어야만 한다', () => {

utils/index.ts

@@ -6,30 +6,12 @@ export const codeToFlag = (code: string): string => String.fromCodePoint(
     .map((c) => 127397 + c.charCodeAt(0)),
 );
 
-export const generateArrayOfNumber = (length: number) => Array.from({ length }, (_, i) => i);
-
-export const checkNumberValue = (value?: number | null): number => {
-  if (typeof value === 'number') {
-    return value;
-  }
-
-  return 0;
-};
-
 export const filteredPlaces = (
   places: google.maps.places.PlaceResult[],
 ) => places.filter((place): place is PlaceResult => [
   place.geometry?.location, place.place_id, place.name,
 ].some((value) => Boolean(value)));
 
-export const checkEmpty = <T>(value?: T[]): T[] => {
-  if (!value || !value.length) {
-    return [];
-  }
-
-  return value;
-};
-
 export function numberWithComma(
   value?: number | null,
   returnZero = true,

yarn.lock

@@ -2934,6 +2934,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@nft-team/core@npm:^1.1.0":
+  version: 1.1.0
+  resolution: "@nft-team/core@npm:1.1.0"
+  checksum: cea9ed8c805d8fcaa23f7b69cf28d3f22f74dd9075d4730441b98af14c9efe9f03ecb539ad7894fb3b993543dc66dd82439e743a387e88bb0e52032b73811f47
+  languageName: node
+  linkType: hard
+
 "@nft-team/eslint-config@npm:^1.1.1":
   version: 1.1.1
   resolution: "@nft-team/eslint-config@npm:1.1.1"
@@ -12972,6 +12979,7 @@ __metadata:
     "@commitlint/cli": ^17.4.3
     "@commitlint/config-conventional": ^17.4.3
     "@next/eslint-plugin-next": ^13.4.6
+    "@nft-team/core": ^1.1.0
     "@nft-team/eslint-config": ^1.1.1
     "@nft-team/react": ^1.2.0
     "@react-google-maps/api": ^2.18.1