From 3390e450c35058414ede0d2292a48fde628a43b2 Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Sun, 19 Mar 2023 11:52:19 -0300
Subject: [PATCH 1/9] fix: set app element

---
 src/App.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/App.tsx b/src/App.tsx
index bbc9b44..80c8352 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,8 +1,11 @@
 import React from 'react';
+import Modal from 'react-modal';
 import { RouterProvider } from 'react-router-dom';
 
 import router from './routes/route_app';
 
+Modal.setAppElement('#root');
+
 const App = () => {
   return <RouterProvider router={router} />;
 };

From 5c0b41b345f87f42a7687fa938f13aa4b5197b8d Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Sun, 19 Mar 2023 12:38:09 -0300
Subject: [PATCH 2/9] fix: update a feature

---
 src/components/CardDetails/CardDetails.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/CardDetails/CardDetails.tsx b/src/components/CardDetails/CardDetails.tsx
index 7a520c5..183eb95 100644
--- a/src/components/CardDetails/CardDetails.tsx
+++ b/src/components/CardDetails/CardDetails.tsx
@@ -20,7 +20,7 @@ export const CardDetails = ({ id, name, img, types, weight, height, abilities, s
     <div className="bg-white w-[400px] mx-auto rounded-2xl border border-zinc-300 overflow-hidden">
       <div
         style={{
-          backgroundColor: types![0].type.name
+          backgroundColor: id!
             ? getTypesToBackgroundColor(types![0].type.name.toUpperCase())
             : '#9d9b9b',
         }}

From 4f960df3f07a5b67327177e7f27652b64227180d Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Mon, 10 Apr 2023 22:13:01 -0300
Subject: [PATCH 3/9] fix: update button in modal

---
 src/components/Modal/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx
index af6f963..8b2c085 100644
--- a/src/components/Modal/index.tsx
+++ b/src/components/Modal/index.tsx
@@ -15,7 +15,7 @@ export const ContentModal = ({ active, children, onCloseModal }: IModal) => {
     >
       <button
         type="button"
-        className="absolute right-2 top-2 text-white hover:brightness-75"
+        className="absolute right-2 top-2 text-white hover:brightness-90"
         onClick={onCloseModal}
       >
         <X size={25} weight="bold" />

From 85bc8274543ccc22c94c3ef0ec32ce723103cebf Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Mon, 10 Apr 2023 22:13:44 -0300
Subject: [PATCH 4/9] fix: formatting

---
 src/components/PokemonCard/index.tsx | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/PokemonCard/index.tsx b/src/components/PokemonCard/index.tsx
index 1aece36..0148ab0 100644
--- a/src/components/PokemonCard/index.tsx
+++ b/src/components/PokemonCard/index.tsx
@@ -11,7 +11,13 @@ import {
 } from '../../utils/getTheme';
 import { TypeCard } from '../TypeCard';
 
-export const PokemonCard = ({ name, id, types, url_img, getSelectedPokemon }: IPokemonCard) => {
+export const PokemonCard = ({
+  name,
+  id,
+  types,
+  url_img,
+  getSelectedPokemon,
+}: IPokemonCard) => {
   return (
     <>
       <li
@@ -25,7 +31,9 @@ export const PokemonCard = ({ name, id, types, url_img, getSelectedPokemon }: IP
       >
         <div className="py-4 px-1">
           <div className="flex flex-col">
-            <h3 className="font-black line-clamp-1 text-sm capitalize">{name}</h3>
+            <h3 className="font-black line-clamp-1 text-sm capitalize">
+              {name}
+            </h3>
             <span className="font-semibold text-xs">
               {getNumberOrderFormat(id)}
             </span>
@@ -35,10 +43,13 @@ export const PokemonCard = ({ name, id, types, url_img, getSelectedPokemon }: IP
               return (
                 <TypeCard
                   key={type.type.name}
-                  icon={`${type.type.name && getTypesToIconsTypes(type.type.name.toUpperCase())}`}
+                  icon={`${
+                    type.type.name &&
+                    getTypesToIconsTypes(type.type.name.toUpperCase())
+                  }`}
                   type={type.type.name}
                 />
-              )
+              );
             })}
           </div>
         </div>

From a2b6630a0c63d9d89b826ab35e2f710cc6071ce1 Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Fri, 14 Apr 2023 10:25:12 -0300
Subject: [PATCH 5/9] fix: adjusted lint

---
 .eslintrc                                  |  1 +
 src/components/CardDetails/CardDetails.tsx | 50 ++++++++++++++--------
 2 files changed, 34 insertions(+), 17 deletions(-)

diff --git a/.eslintrc b/.eslintrc
index 2b28351..2b3775f 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -30,6 +30,7 @@
     "no-underscore-dangle": "off",
     "no-bitwise": "off",
     "prettier/prettier": "error",
+    "react/jsx-one-expression-per-line": "off",
     "react/no-unknown-property": [2, { "ignore": ["class", "for"] }],
     "react/jsx-filename-extension": [1, { "extensions": [".tsx"] }],
     "no-use-before-define": "off",
diff --git a/src/components/CardDetails/CardDetails.tsx b/src/components/CardDetails/CardDetails.tsx
index 183eb95..e906053 100644
--- a/src/components/CardDetails/CardDetails.tsx
+++ b/src/components/CardDetails/CardDetails.tsx
@@ -7,15 +7,27 @@ import { ImStatsBars } from 'react-icons/im';
 
 import { ICardDatails } from '../../interfaces/cardDatails';
 import { getNumberOrderFormat } from '../../utils/getNumberOrderFormat';
-import { getTypesToBackgroundColor, getTypesToIconsTypes } from '../../utils/getTheme';
+import {
+  getTypesToBackgroundColor,
+  getTypesToIconsTypes,
+} from '../../utils/getTheme';
 import { TypeCard } from '../TypeCard';
 
 const formatHeightWeight = (value: number) => {
   const format = value / 10;
   return format;
-}
+};
 
-export const CardDetails = ({ id, name, img, types, weight, height, abilities, stats }: ICardDatails) => {
+export const CardDetails = ({
+  id,
+  name,
+  img,
+  types,
+  weight,
+  height,
+  abilities,
+  stats,
+}: ICardDatails) => {
   return (
     <div className="bg-white w-[400px] mx-auto rounded-2xl border border-zinc-300 overflow-hidden">
       <div
@@ -35,18 +47,24 @@ export const CardDetails = ({ id, name, img, types, weight, height, abilities, s
         <strong className="text-2xl font-medium leading-tight capitalize">
           {name}
         </strong>
-        <span className="text-lg font-semibold text-zinc-500">{getNumberOrderFormat(id!)}</span>
+        <span className="text-lg font-semibold text-zinc-500">
+          {getNumberOrderFormat(id!)}
+        </span>
       </div>
 
       <div className="flex items-center gap-2 py-4 px-4">
         {types?.map((type, index) => {
           return (
-            <div key={`${type.type.name}-${index}`} className="font-semibold text-white text-[14px]">
+            <div
+              key={`${type.type.name}-${index}`}
+              className="font-semibold text-white text-[14px]"
+            >
               <TypeCard
                 type={type.type.name}
-                icon={`${type.type.name &&
+                icon={`${
+                  type.type.name &&
                   getTypesToIconsTypes(type.type.name.toUpperCase())
-                  }`}
+                }`}
               />
             </div>
           );
@@ -55,7 +73,7 @@ export const CardDetails = ({ id, name, img, types, weight, height, abilities, s
 
       <div className="flex items-center justify-between px-4 my-2">
         <div className="w-full px-2">
-          <h3 className='flex items-center text-sm font-semibold text-zinc-500 gap-2 mb-1 uppercase'>
+          <h3 className="flex items-center text-sm font-semibold text-zinc-500 gap-2 mb-1 uppercase">
             <FaWeightHanging size={15} className="text-zinc-500" />
             Peso:
           </h3>
@@ -68,22 +86,18 @@ export const CardDetails = ({ id, name, img, types, weight, height, abilities, s
         </div>
 
         <div className="w-full px-2">
-          <h3 className='flex items-center text-sm font-semibold text-zinc-500 gap-2 mb-1 uppercase'>
+          <h3 className="flex items-center text-sm font-semibold text-zinc-500 gap-2 mb-1 uppercase">
             <AiOutlineColumnHeight size={15} className="text-zinc-500" />
             Altura:
           </h3>
           <div className="text-center font-medium border border-zinc-300 rounded-lg py-2 px-3">
-            <span className="text-base">
-              {formatHeightWeight(height)}
-              m
-            </span>
+            <span className="text-base">{formatHeightWeight(height)}m</span>
           </div>
         </div>
       </div>
 
-
       <div className="flex flex-col justify-center items-center pt-2 px-4">
-        <h3 className='flex items-center text-sm font-semibold text-zinc-500 gap-2 mb-1 uppercase'>
+        <h3 className="flex items-center text-sm font-semibold text-zinc-500 gap-2 mb-1 uppercase">
           <CgPokemon size={20} className="text-zinc-500" />
           Abilities
         </h3>
@@ -93,7 +107,9 @@ export const CardDetails = ({ id, name, img, types, weight, height, abilities, s
             return (
               <div key={`${ability.ability.name}-${index}`}>
                 <div className="text-center border border-zinc-300 rounded-lg py-2 px-3">
-                  <span className="text-base capitalize">{ability.ability.name}</span>
+                  <span className="text-base capitalize">
+                    {ability.ability.name}
+                  </span>
                 </div>
               </div>
             );
@@ -114,7 +130,7 @@ export const CardDetails = ({ id, name, img, types, weight, height, abilities, s
               {/* <ProgressBar /> */}
               <span>{stats.base_stat}</span>
             </div>
-          )
+          );
         })}
       </div>
     </div>

From 0bd342c6036f2a39107a121c571fdb16beecf452 Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Fri, 14 Apr 2023 10:49:18 -0300
Subject: [PATCH 6/9] feat: adding new rules

---
 .eslintrc | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.eslintrc b/.eslintrc
index 2b3775f..e833453 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -30,6 +30,8 @@
     "no-underscore-dangle": "off",
     "no-bitwise": "off",
     "prettier/prettier": "error",
+    "no-restricted-syntax": "off",
+    "consistent-return": "off",
     "react/jsx-one-expression-per-line": "off",
     "react/no-unknown-property": [2, { "ignore": ["class", "for"] }],
     "react/jsx-filename-extension": [1, { "extensions": [".tsx"] }],

From ebd1f0c6d40bcb96cd1147da8a93df4afbccf1da Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Fri, 14 Apr 2023 10:50:56 -0300
Subject: [PATCH 7/9] feat: configure absolute imports

---
 package-lock.json | 72 ++++++++++++++++++++++++++++++++++++++++++++++-
 package.json      |  3 +-
 tsconfig.json     | 37 ++++++++++++++++++------
 vite.config.ts    |  4 +--
 yarn.lock         | 23 +++++++++++++--
 5 files changed, 125 insertions(+), 14 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6701cbc..0933b17 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -53,7 +53,8 @@
         "tailwindcss": "^3.2.4",
         "ts-jest": "^26.5.4",
         "typescript": "^4.9.3",
-        "vite": "^4.0.0"
+        "vite": "^4.0.0",
+        "vite-tsconfig-paths": "^4.2.0"
       }
     },
     "node_modules/@ampproject/remapping": {
@@ -7125,6 +7126,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/globrex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz",
+      "integrity": "sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==",
+      "dev": true
+    },
     "node_modules/gopd": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
@@ -16726,6 +16733,26 @@
         "node": ">=10"
       }
     },
+    "node_modules/tsconfck": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/tsconfck/-/tsconfck-2.1.1.tgz",
+      "integrity": "sha512-ZPCkJBKASZBmBUNqGHmRhdhM8pJYDdOXp4nRgj/O0JwUwsMq50lCDRQP/M5GBNAA0elPrq4gAeu4dkaVCuKWww==",
+      "dev": true,
+      "bin": {
+        "tsconfck": "bin/tsconfck.js"
+      },
+      "engines": {
+        "node": "^14.13.1 || ^16 || >=18"
+      },
+      "peerDependencies": {
+        "typescript": "^4.3.5 || ^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/tsconfig-paths": {
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz",
@@ -17185,6 +17212,25 @@
         }
       }
     },
+    "node_modules/vite-tsconfig-paths": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/vite-tsconfig-paths/-/vite-tsconfig-paths-4.2.0.tgz",
+      "integrity": "sha512-jGpus0eUy5qbbMVGiTxCL1iB9ZGN6Bd37VGLJU39kTDD6ZfULTTb1bcc5IeTWqWJKiWV5YihCaibeASPiGi8kw==",
+      "dev": true,
+      "dependencies": {
+        "debug": "^4.1.1",
+        "globrex": "^0.1.2",
+        "tsconfck": "^2.1.0"
+      },
+      "peerDependencies": {
+        "vite": "*"
+      },
+      "peerDependenciesMeta": {
+        "vite": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/w3c-hr-time": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
@@ -22573,6 +22619,12 @@
         }
       }
     },
+    "globrex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz",
+      "integrity": "sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==",
+      "dev": true
+    },
     "gopd": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
@@ -29534,6 +29586,13 @@
         }
       }
     },
+    "tsconfck": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/tsconfck/-/tsconfck-2.1.1.tgz",
+      "integrity": "sha512-ZPCkJBKASZBmBUNqGHmRhdhM8pJYDdOXp4nRgj/O0JwUwsMq50lCDRQP/M5GBNAA0elPrq4gAeu4dkaVCuKWww==",
+      "dev": true,
+      "requires": {}
+    },
     "tsconfig-paths": {
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz",
@@ -29843,6 +29902,17 @@
         "rollup": "^3.7.0"
       }
     },
+    "vite-tsconfig-paths": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/vite-tsconfig-paths/-/vite-tsconfig-paths-4.2.0.tgz",
+      "integrity": "sha512-jGpus0eUy5qbbMVGiTxCL1iB9ZGN6Bd37VGLJU39kTDD6ZfULTTb1bcc5IeTWqWJKiWV5YihCaibeASPiGi8kw==",
+      "dev": true,
+      "requires": {
+        "debug": "^4.1.1",
+        "globrex": "^0.1.2",
+        "tsconfck": "^2.1.0"
+      }
+    },
     "w3c-hr-time": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
diff --git a/package.json b/package.json
index 91ed7f6..ed1d62b 100644
--- a/package.json
+++ b/package.json
@@ -93,7 +93,8 @@
     "tailwindcss": "^3.2.4",
     "ts-jest": "^26.5.4",
     "typescript": "^4.9.3",
-    "vite": "^4.0.0"
+    "vite": "^4.0.0",
+    "vite-tsconfig-paths": "^4.2.0"
   },
   "baseUrl": "./node_modules/@types",
   "typeRoots": [
diff --git a/tsconfig.json b/tsconfig.json
index 3d0a51a..e16d6e4 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,21 +1,42 @@
 {
   "compilerOptions": {
-    "target": "ESNext",
+    "target": "esnext",
     "useDefineForClassFields": true,
-    "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "allowJs": false,
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
     "skipLibCheck": true,
-    "esModuleInterop": false,
+    "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
     "strict": true,
     "forceConsistentCasingInFileNames": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
+    "module": "esnext",
+    "moduleResolution": "node",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
+    "baseUrl": "./src",
+    "paths": {
+      "@assets/*": ["./assets/*"],
+      "@components/*": ["./components/*"],
+      "@hooks/*": ["./hooks/*"],
+      "@interfaces/*": ["./interfaces/*"],
+      "@routes/*": ["./routes/*"],
+      "@pages/*": ["./pages/*"],
+      "@utils/*": ["./utils/*"],
+      "@lib/*": ["./lib/*"],
+      "@theme/*": ["./theme/*"]
+    },
+    "typeRoots": ["node_modules/@types", "./types"]
   },
-  "include": ["src"],
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "src/**/*.js",
+    "src/**/*.jsx",
+    "tests/**/*.ts",
+    "tests/**/*.tsx"
+  ],
+  "exclude": ["node_modules", "dist"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }
diff --git a/vite.config.ts b/vite.config.ts
index 4e7004e..a02a332 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,7 +1,7 @@
 import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vite';
+import tsconfigPaths from 'vite-tsconfig-paths';
 
-// https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), tsconfigPaths()],
 });
diff --git a/yarn.lock b/yarn.lock
index 0a81bb2..c254c1b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3232,6 +3232,11 @@
     "merge2" "^1.4.1"
     "slash" "^3.0.0"
 
+"globrex@^0.1.2":
+  "integrity" "sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg=="
+  "resolved" "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz"
+  "version" "0.1.2"
+
 "gopd@^1.0.1":
   "integrity" "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA=="
   "resolved" "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz"
@@ -6736,6 +6741,11 @@
     "semver" "7.x"
     "yargs-parser" "20.x"
 
+"tsconfck@^2.1.0":
+  "integrity" "sha512-ZPCkJBKASZBmBUNqGHmRhdhM8pJYDdOXp4nRgj/O0JwUwsMq50lCDRQP/M5GBNAA0elPrq4gAeu4dkaVCuKWww=="
+  "resolved" "https://registry.npmjs.org/tsconfck/-/tsconfck-2.1.1.tgz"
+  "version" "2.1.1"
+
 "tsconfig-paths@^3.14.1":
   "integrity" "sha512-fxDhWnFSLt3VuTwtvJt5fpwxBHg5AdKWMsgcPOOIilyjymcYVZoCQF8fvFRezCNfblEXmi+PcM1eYHeOAgXCOQ=="
   "resolved" "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz"
@@ -6837,7 +6847,7 @@
   dependencies:
     "is-typedarray" "^1.0.0"
 
-"typescript@^4.9.3", "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta", "typescript@>=3.8 <5.0":
+"typescript@^4.3.5 || ^5.0.0", "typescript@^4.9.3", "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta", "typescript@>=3.8 <5.0":
   "integrity" "sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg=="
   "resolved" "https://registry.npmjs.org/typescript/-/typescript-4.9.4.tgz"
   "version" "4.9.4"
@@ -6970,7 +6980,16 @@
     "core-util-is" "1.0.2"
     "extsprintf" "^1.2.0"
 
-"vite@^4.0.0":
+"vite-tsconfig-paths@^4.2.0":
+  "integrity" "sha512-jGpus0eUy5qbbMVGiTxCL1iB9ZGN6Bd37VGLJU39kTDD6ZfULTTb1bcc5IeTWqWJKiWV5YihCaibeASPiGi8kw=="
+  "resolved" "https://registry.npmjs.org/vite-tsconfig-paths/-/vite-tsconfig-paths-4.2.0.tgz"
+  "version" "4.2.0"
+  dependencies:
+    "debug" "^4.1.1"
+    "globrex" "^0.1.2"
+    "tsconfck" "^2.1.0"
+
+"vite@*", "vite@^4.0.0":
   "integrity" "sha512-xevPU7M8FU0i/80DMR+YhgrzR5KS2ORy1B4xcX/cXLsvnUWvfHuqMmVU6N0YiJ4JWGRJJsLCgjEzKjG9/GKoSw=="
   "resolved" "https://registry.npmjs.org/vite/-/vite-4.0.4.tgz"
   "version" "4.0.4"

From ee376356545a73fe604f07fa67c9e530b67b2521 Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Fri, 14 Apr 2023 12:09:44 -0300
Subject: [PATCH 8/9] refactor: add absolute imports

---
 src/App.tsx                                      |  2 +-
 src/components/Anchor/Anchor.tsx                 |  2 +-
 src/components/CardDetails/CardDetails.tsx       | 15 +++++----------
 src/components/Footer/Footer.tsx                 |  4 ++--
 src/components/Header/index.tsx                  |  6 ++----
 src/components/InputSearch/InputSearch.tsx       |  3 +--
 src/components/ListPokemon/index.tsx             | 14 +++++++-------
 src/components/Modal/index.tsx                   |  3 +--
 src/components/PokemonCard/index.tsx             |  6 +++---
 src/components/ShowMoreButton/ShowMoreButton.tsx |  2 +-
 src/components/SocialMedia/SocialMedia.tsx       |  3 +--
 src/components/TypeCard/index.tsx                |  4 ++--
 src/hooks/usePagination.ts                       |  2 +-
 src/hooks/usePokemons.ts                         |  3 +--
 src/hooks/useSelectPokemon.ts                    |  4 ++--
 src/interfaces/detailsPokemon.ts                 |  2 +-
 src/interfaces/list.ts                           |  2 +-
 src/pages/Home.tsx                               |  4 ++--
 src/pages/Pokedex.tsx                            | 16 ++++++++--------
 src/routes/route_app.tsx                         |  4 ++--
 src/utils/getTheme.ts                            |  4 +---
 21 files changed, 46 insertions(+), 59 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 80c8352..3931486 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import Modal from 'react-modal';
 import { RouterProvider } from 'react-router-dom';
 
-import router from './routes/route_app';
+import router from '@routes/route_app';
 
 Modal.setAppElement('#root');
 
diff --git a/src/components/Anchor/Anchor.tsx b/src/components/Anchor/Anchor.tsx
index 19f7dc8..f9b6b6a 100644
--- a/src/components/Anchor/Anchor.tsx
+++ b/src/components/Anchor/Anchor.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { IAnchor } from '../../interfaces/anchor';
+import { IAnchor } from '@interfaces/anchor';
 
 export const Anchor = ({ children, url }: IAnchor) => {
   return (
diff --git a/src/components/CardDetails/CardDetails.tsx b/src/components/CardDetails/CardDetails.tsx
index e906053..8066a12 100644
--- a/src/components/CardDetails/CardDetails.tsx
+++ b/src/components/CardDetails/CardDetails.tsx
@@ -1,22 +1,17 @@
-/* eslint-disable prettier/prettier */
 import React from 'react';
 import { AiOutlineColumnHeight } from 'react-icons/ai';
 import { CgPokemon } from 'react-icons/cg';
 import { FaWeightHanging } from 'react-icons/fa';
 import { ImStatsBars } from 'react-icons/im';
 
-import { ICardDatails } from '../../interfaces/cardDatails';
-import { getNumberOrderFormat } from '../../utils/getNumberOrderFormat';
+import { TypeCard } from '@components/TypeCard';
+import { ICardDatails } from '@interfaces/cardDatails';
+import { formatHeightWeight } from '@utils/formatHeightWeight';
+import { getNumberOrderFormat } from '@utils/getNumberOrderFormat';
 import {
   getTypesToBackgroundColor,
   getTypesToIconsTypes,
-} from '../../utils/getTheme';
-import { TypeCard } from '../TypeCard';
-
-const formatHeightWeight = (value: number) => {
-  const format = value / 10;
-  return format;
-};
+} from '@utils/getTheme';
 
 export const CardDetails = ({
   id,
diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
index 48ff240..d3f7c7d 100644
--- a/src/components/Footer/Footer.tsx
+++ b/src/components/Footer/Footer.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
-import Logo from '../../assets/logo/pokemon-logo.svg';
-import { SocialMedia } from '../SocialMedia/SocialMedia';
+import Logo from '@assets/logo/pokemon-logo.svg';
+import { SocialMedia } from '@components/SocialMedia/SocialMedia';
 
 export const Footer: React.FC = () => {
   return (
diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
index 093cf33..44e7243 100644
--- a/src/components/Header/index.tsx
+++ b/src/components/Header/index.tsx
@@ -1,12 +1,10 @@
-/* eslint-disable no-restricted-syntax */
 import React from 'react';
 import { Link } from 'react-router-dom';
 
+import Pikachu from '@assets/img/pikachu-2.png';
+import Logo from '@assets/logo/logo.png';
 import { ArrowLeft } from 'phosphor-react';
 
-import Pikachu from '../../assets/img/pikachu-2.png';
-import Logo from '../../assets/logo/logo.png';
-
 export const Header = () => {
   return (
     <header className="bg-[#fe6613] pt-4 px-4 h-[310px]">
diff --git a/src/components/InputSearch/InputSearch.tsx b/src/components/InputSearch/InputSearch.tsx
index 143d43c..6009cbd 100644
--- a/src/components/InputSearch/InputSearch.tsx
+++ b/src/components/InputSearch/InputSearch.tsx
@@ -1,9 +1,8 @@
 import React from 'react';
 
+import { ISearch } from '@interfaces/search';
 import { MagnifyingGlass } from 'phosphor-react';
 
-import { ISearch } from '../../interfaces/search';
-
 export const InputSearch = ({ getFilterPokemon }: ISearch) => {
   return (
     <div className="flex items-center flex-col gap-2 py-6 px-1 mx-4 mb-2">
diff --git a/src/components/ListPokemon/index.tsx b/src/components/ListPokemon/index.tsx
index 629f53c..989d116 100644
--- a/src/components/ListPokemon/index.tsx
+++ b/src/components/ListPokemon/index.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 
-import { usePagination } from '../../hooks/usePagination';
-import { useGetPokemonsData } from '../../hooks/usePokemons';
-import { ListProps } from '../../interfaces/list';
-import { IPokemons } from '../../interfaces/pokemons';
-import { Loading } from '../Loading/Loading';
-import { PokemonCard } from '../PokemonCard';
-import { ShowMoreButton } from '../ShowMoreButton/ShowMoreButton';
+import { Loading } from '@components/Loading/Loading';
+import { PokemonCard } from '@components/PokemonCard';
+import { ShowMoreButton } from '@components/ShowMoreButton/ShowMoreButton';
+import { usePagination } from '@hooks/usePagination';
+import { useGetPokemonsData } from '@hooks/usePokemons';
+import { ListProps } from '@interfaces/list';
+import { IPokemons } from '@interfaces/pokemons';
 
 export const ListPokemon = ({ data, handleSelectedId }: ListProps) => {
   const itemsPerPage = 20;
diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx
index 8b2c085..3106315 100644
--- a/src/components/Modal/index.tsx
+++ b/src/components/Modal/index.tsx
@@ -1,10 +1,9 @@
 import React from 'react';
 import Modal from 'react-modal';
 
+import { IModal } from '@interfaces/modal';
 import { X } from 'phosphor-react';
 
-import { IModal } from '../../interfaces/modal';
-
 export const ContentModal = ({ active, children, onCloseModal }: IModal) => {
   return (
     <Modal
diff --git a/src/components/PokemonCard/index.tsx b/src/components/PokemonCard/index.tsx
index 0148ab0..e1ffdb7 100644
--- a/src/components/PokemonCard/index.tsx
+++ b/src/components/PokemonCard/index.tsx
@@ -1,10 +1,10 @@
 /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
 /* eslint-disable jsx-a11y/click-events-have-key-events */
-/* eslint-disable prettier/prettier */
 import React from 'react';
 
-import { IPokemonCard } from '../../interfaces/pokemonCard';
-import { getNumberOrderFormat } from '../../utils/getNumberOrderFormat';
+import { IPokemonCard } from '@interfaces/pokemonCard';
+import { getNumberOrderFormat } from '@utils/getNumberOrderFormat';
+
 import {
   getTypesToBackgroundColor,
   getTypesToIconsTypes,
diff --git a/src/components/ShowMoreButton/ShowMoreButton.tsx b/src/components/ShowMoreButton/ShowMoreButton.tsx
index 729811e..b1ea1ca 100644
--- a/src/components/ShowMoreButton/ShowMoreButton.tsx
+++ b/src/components/ShowMoreButton/ShowMoreButton.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { MdOutlineCatchingPokemon } from 'react-icons/md';
 
-import { IButtonProps } from '../../interfaces/button';
+import { IButtonProps } from '@interfaces/button';
 
 export const ShowMoreButton = ({ loadItems, showMoreItems }: IButtonProps) => {
   return (
diff --git a/src/components/SocialMedia/SocialMedia.tsx b/src/components/SocialMedia/SocialMedia.tsx
index 3078b63..fa96c60 100644
--- a/src/components/SocialMedia/SocialMedia.tsx
+++ b/src/components/SocialMedia/SocialMedia.tsx
@@ -1,9 +1,8 @@
 import React from 'react';
 
+import { Anchor } from '@components/Anchor/Anchor';
 import { GithubLogo, LinkedinLogo, TwitterLogo } from 'phosphor-react';
 
-import { Anchor } from '../Anchor/Anchor';
-
 export const SocialMedia: React.FC = () => {
   return (
     <div className="flex gap-1 items-center">
diff --git a/src/components/TypeCard/index.tsx b/src/components/TypeCard/index.tsx
index 45838e1..cb6771d 100644
--- a/src/components/TypeCard/index.tsx
+++ b/src/components/TypeCard/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
-import { ITypeCard } from '../../interfaces/typeCard';
-import { getTypesToColor } from '../../utils/getTheme';
+import { ITypeCard } from '@interfaces/typeCard';
+import { getTypesToColor } from '@utils/getTheme';
 
 export const TypeCard = ({ type, icon }: ITypeCard) => {
   return (
diff --git a/src/hooks/usePagination.ts b/src/hooks/usePagination.ts
index 3c1c051..b2b9a93 100644
--- a/src/hooks/usePagination.ts
+++ b/src/hooks/usePagination.ts
@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 
-import { IPagination, IPaginationReturn } from '../interfaces/pagination';
+import { IPagination, IPaginationReturn } from '@interfaces/pagination';
 
 export const usePagination = <T>({
   data,
diff --git a/src/hooks/usePokemons.ts b/src/hooks/usePokemons.ts
index 8e4459b..6c60191 100644
--- a/src/hooks/usePokemons.ts
+++ b/src/hooks/usePokemons.ts
@@ -1,10 +1,9 @@
 /* eslint-disable no-restricted-syntax */
 import { useEffect, useState } from 'react';
 
+import { IPokemons } from '@interfaces/pokemons';
 import axios from 'axios';
 
-import { IPokemons } from '../interfaces/pokemons';
-
 export const useGetPokemonsData = () => {
   const [loading, setLoading] = useState(false);
   const [pokemons, setPokemons] = useState<IPokemons[]>([]);
diff --git a/src/hooks/useSelectPokemon.ts b/src/hooks/useSelectPokemon.ts
index cedae2d..af91fbd 100644
--- a/src/hooks/useSelectPokemon.ts
+++ b/src/hooks/useSelectPokemon.ts
@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { detailsPokemon } from '../interfaces/detailsPokemon';
-import { api } from '../lib/axios';
+import { detailsPokemon } from '@interfaces/detailsPokemon';
+import { api } from '@lib/axios';
 
 export const useSelectPokemon = () => {
   const [active, setActive] = useState(false);
diff --git a/src/interfaces/detailsPokemon.ts b/src/interfaces/detailsPokemon.ts
index 44b498f..0aaead5 100644
--- a/src/interfaces/detailsPokemon.ts
+++ b/src/interfaces/detailsPokemon.ts
@@ -1,4 +1,4 @@
-import { ISprites } from './pokemons';
+import { ISprites } from '@interfaces/pokemons';
 
 export interface detailsPokemon {
   id: number;
diff --git a/src/interfaces/list.ts b/src/interfaces/list.ts
index b0deebf..204910f 100644
--- a/src/interfaces/list.ts
+++ b/src/interfaces/list.ts
@@ -1,4 +1,4 @@
-import { IPokemons } from './pokemons';
+import { IPokemons } from '@interfaces/pokemons';
 
 export type ListProps = {
   data: IPokemons[];
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index 4c0a99d..b884840 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -3,8 +3,8 @@ import { CgPokemon } from 'react-icons/cg';
 import { MdCatchingPokemon } from 'react-icons/md';
 import { Link } from 'react-router-dom';
 
-import img from '../assets/img/Charizard-Pokemon.png';
-import { SocialMedia } from '../components/SocialMedia/SocialMedia';
+import img from '@assets/img/Charizard-Pokemon.png';
+import { SocialMedia } from '@components/SocialMedia/SocialMedia';
 
 const Home: React.FC = () => {
   return (
diff --git a/src/pages/Pokedex.tsx b/src/pages/Pokedex.tsx
index 0cfd49a..0fd5bb4 100644
--- a/src/pages/Pokedex.tsx
+++ b/src/pages/Pokedex.tsx
@@ -1,14 +1,14 @@
 import React from 'react';
 import { Helmet } from 'react-helmet';
 
-import { CardDetails } from '../components/CardDetails/CardDetails';
-import { Footer } from '../components/Footer/Footer';
-import { Header } from '../components/Header';
-import { InputSearch } from '../components/InputSearch/InputSearch';
-import { ListPokemon } from '../components/ListPokemon';
-import { ContentModal } from '../components/Modal';
-import { useGetPokemonsData } from '../hooks/usePokemons';
-import { useSelectPokemon } from '../hooks/useSelectPokemon';
+import { CardDetails } from '@components/CardDetails/CardDetails';
+import { Footer } from '@components/Footer/Footer';
+import { Header } from '@components/Header';
+import { InputSearch } from '@components/InputSearch/InputSearch';
+import { ListPokemon } from '@components/ListPokemon';
+import { ContentModal } from '@components/Modal';
+import { useGetPokemonsData } from '@hooks/usePokemons';
+import { useSelectPokemon } from '@hooks/useSelectPokemon';
 
 const Pokedex: React.FC = () => {
   const { pokemons, FilterPokemon } = useGetPokemonsData();
diff --git a/src/routes/route_app.tsx b/src/routes/route_app.tsx
index 193fbb3..4c24775 100644
--- a/src/routes/route_app.tsx
+++ b/src/routes/route_app.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import { createBrowserRouter } from 'react-router-dom';
 
-import Home from '../pages/Home';
-import Pokedex from '../pages/Pokedex';
+import Home from '@pages/Home';
+import Pokedex from '@pages/Pokedex';
 
 const router = createBrowserRouter([
   {
diff --git a/src/utils/getTheme.ts b/src/utils/getTheme.ts
index e121406..116dc14 100644
--- a/src/utils/getTheme.ts
+++ b/src/utils/getTheme.ts
@@ -1,6 +1,4 @@
-/* eslint-disable no-restricted-syntax */
-/* eslint-disable consistent-return */
-import { THEME } from '../theme/theme';
+import { THEME } from '@theme/theme';
 
 export const getTypesToColor = (type: string) => {
   for (const [key, color] of Object.entries(THEME.COLORS)) {

From 91e816aca68929234ffe77ff25fe561ac82c8bf0 Mon Sep 17 00:00:00 2001
From: TiagoM13 <thyagomotha2000@gmail.com>
Date: Fri, 14 Apr 2023 12:10:43 -0300
Subject: [PATCH 9/9] feat: add new utility

---
 src/utils/formatHeightWeight.ts | 4 ++++
 1 file changed, 4 insertions(+)
 create mode 100644 src/utils/formatHeightWeight.ts

diff --git a/src/utils/formatHeightWeight.ts b/src/utils/formatHeightWeight.ts
new file mode 100644
index 0000000..7597f61
--- /dev/null
+++ b/src/utils/formatHeightWeight.ts
@@ -0,0 +1,4 @@
+export const formatHeightWeight = (value: number) => {
+  const format = value / 10;
+  return format;
+};