refac: ESLint 적용 (#28)

.changeset/bright-peaches-tell.md

@@ -0,0 +1,6 @@
+---
+'@modern-kit/react': patch
+'@modern-kit/utils': patch
+---
+
+refac: ESLint 적용

.eslintrc.cjs

@@ -5,17 +5,17 @@ module.exports = {
     'eslint:recommended',
     'plugin:@typescript-eslint/recommended',
     'plugin:react-hooks/recommended',
-    'prettier',
   ],
   ignorePatterns: ['dist', '.eslintrc.cjs'],
   parser: '@typescript-eslint/parser',
-  plugins: ['react-refresh'],
+  plugins: ['unused-imports', 'react-refresh'],
   rules: {
     '@typescript-eslint/no-var-requires': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-unnecessary-type-constraint': 'off',
     'import/no-anonymous-default-export': 'off',
+    'no-useless-escape': 'off',
   },
 };

.github/workflows/pull-request.yml

@@ -20,6 +20,8 @@ jobs:
         run: yarn install
       - name: build 🔨
         run: lerna run build
+      - name: eslint 🚀
+        run: yarn eslint packages
       - name: typecheck 🚀
         run: yarn typecheck
       - name: testing 🚀

package.json

@@ -29,6 +29,7 @@
     "eslint": "^8.47.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.3",
+    "eslint-plugin-unused-imports": "^3.1.0",
     "lerna": "^8.0.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

packages/react/src/components/LazyImage/index.tsx

@@ -1,4 +1,4 @@
-import React, { CSSProperties, forwardRef, useMemo, useState } from 'react';
+import React, { CSSProperties, forwardRef, useMemo } from 'react';
 import { useIntersectionObserver } from '../../hooks/useIntersectionObserver';
 import { useMergeRefs } from '../../hooks/useMergeRefs';
 

packages/react/src/components/Portal/index.tsx

@@ -1,10 +1,4 @@
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useLayoutEffect,
-  useMemo,
-} from 'react';
+import { createContext, useCallback, useContext, useMemo } from 'react';
 import { createPortal } from 'react-dom';
 import { useIsMounted } from '../../hooks/useIsMounted';
 import { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect';

packages/react/src/hooks/useMergeRefs/index.ts

@@ -13,6 +13,7 @@ export const useMergeRefs = <T = any>(
         }
       });
     },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     [...refs]
   );
 };

packages/utils/src/common/deepCopy/index.ts

@@ -38,7 +38,7 @@ export const deepCopy = <T>(source: T): T => {
   const newObject: Record<string, any> = {};
 
   for (const key in source) {
-    if (source.hasOwnProperty(key)) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
       newObject[key] = deepCopy(source[key]);
     }
   }

packages/utils/src/common/hexToRgba/index.ts

@@ -6,7 +6,7 @@ export const hexToRgba = (hex: string, alpha = 1) => {
     return null;
   }
 
-  let convertedHex = hex.replace('#', '');
+  const convertedHex = hex.replace('#', '');
 
   const r = parseInt(convertedHex.slice(0, 2), HEXADECIMAL);
   const g = parseInt(convertedHex.slice(2, 4), HEXADECIMAL);

packages/utils/src/object/deleteFalsyProperties/index.ts

@@ -4,7 +4,7 @@ export const deleteFalsyProperties = <T extends Record<PropertyKey, any>>(
   const copiedObj: Record<PropertyKey, any> = {};
 
   for (const key in source) {
-    if (source.hasOwnProperty(key)) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
       const value = source[key];
 
       if (value !== null && typeof value === 'object') {

packages/utils/src/object/mergeProperties/index.ts

@@ -15,7 +15,7 @@ export const mergeProperties = <
   for (const key in source) {
     if (exclude && exclude.includes(key)) continue;
 
-    if (source.hasOwnProperty(key)) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
       if (typeof source[key] === 'object') {
         if (Array.isArray(source[key])) {
           merged[key] = [...target[key], ...source[key]] as any;

packages/utils/src/validator/isFunction/index.ts

@@ -1,3 +1,5 @@
-export const isFunction = (arg: unknown): arg is Function => {
+export const isFunction = <T extends (...args: any[]) => any>(
+  arg: unknown
+): arg is T => {
   return arg instanceof Function;
 };

yarn.lock

@@ -9725,6 +9725,28 @@ __metadata:
   languageName: node
   linkType: hard
 
+"eslint-plugin-unused-imports@npm:^3.1.0":
+  version: 3.1.0
+  resolution: "eslint-plugin-unused-imports@npm:3.1.0"
+  dependencies:
+    eslint-rule-composer: "npm:^0.3.0"
+  peerDependencies:
+    "@typescript-eslint/eslint-plugin": 6 - 7
+    eslint: 8
+  peerDependenciesMeta:
+    "@typescript-eslint/eslint-plugin":
+      optional: true
+  checksum: 712268fc10e7a5b169070c5ec2655733f4cdcf079848b2812ebe716b429a16cb87f315d3c0004cf128ba3874f68dd938eec8394a03587484e97e146494b48cda
+  languageName: node
+  linkType: hard
+
+"eslint-rule-composer@npm:^0.3.0":
+  version: 0.3.0
+  resolution: "eslint-rule-composer@npm:0.3.0"
+  checksum: 1f0c40d209e1503a955101a0dbba37e7fc67c8aaa47a5b9ae0b0fcbae7022c86e52b3df2b1b9ffd658e16cd80f31fff92e7222460a44d8251e61d49e0af79a07
+  languageName: node
+  linkType: hard
+
 "eslint-scope@npm:5.1.1":
   version: 5.1.1
   resolution: "eslint-scope@npm:5.1.1"
@@ -14794,6 +14816,7 @@ __metadata:
     eslint: "npm:^8.47.0"
     eslint-plugin-react-hooks: "npm:^4.6.0"
     eslint-plugin-react-refresh: "npm:^0.4.3"
+    eslint-plugin-unused-imports: "npm:^3.1.0"
     lerna: "npm:^8.0.2"
     react: "npm:^18.2.0"
     react-dom: "npm:^18.2.0"