chore: packages의 ui를 shared로 변경, library 버전 통일, router 타입 추가 (#39)

* chore(common): prettier(3.0.3), eslint(8.45.0) 버전으로 최신화

* chore(ui): packages/ui를 packages/shared로 변경

* chore(common): cz-config의 scopes 속성에서 ui를 shared로 변경

* fix(common): router에 Router를 의미하는 type 추가

* style(volunteer): ui에서 shared로 변경에 따른 import 변경

* fix(common): ui에서 shared로 변경에 따른 tsconfig의 paths 변경

* remove(shared): UploadedPhotoItem 삭제

.eslintrc.js

@@ -1,4 +1,4 @@
 module.exports = {
   root: true,
-  extends: ["custom"],
+  extends: ['custom'],
 };

apps/shelter/package.json

@@ -24,7 +24,7 @@
     "react-error-boundary": "^4.0.11",
     "react-hook-form": "^7.47.0",
     "react-router-dom": "^6.17.0",
-    "ui": "workspace:*",
+    "shared": "workspace:*",
     "zod": "^3.22.4",
     "zustand": "^4.4.4"
   },

apps/shelter/src/components/layout/index.tsx

@@ -1,8 +1,8 @@
 import { Container } from '@chakra-ui/react';
 import { Outlet } from 'react-router-dom';
-import BottomNavBar from 'ui/layout/BottomNavBar';
-import Header from 'ui/layout/Header';
-import { HeaderOption } from 'ui/types/header';
+import BottomNavBar from 'shared/layout/BottomNavBar';
+import Header from 'shared/layout/Header';
+import { HeaderOption } from 'shared/types/header';
 
 export default function Layout() {
   const headerOption: HeaderOption = {

apps/shelter/src/routes/index.tsx

@@ -1,4 +1,4 @@
-import { createBrowserRouter } from 'react-router-dom';
+import { createBrowserRouter, RouterProviderProps } from 'react-router-dom';
 
 import Layout from '@/components/layout';
 import PATH from '@/constants/path';
@@ -25,7 +25,7 @@ import VolunteersSearchPage from '@/pages/volunteers/search';
 import VolunteersUpdatePage from '@/pages/volunteers/update';
 import VolunteersWritePage from '@/pages/volunteers/write';
 
-export const router = createBrowserRouter([
+export const router: RouterProviderProps['router'] = createBrowserRouter([
   {
     path: '/',
     element: <Layout />,

apps/volunteer/package.json

@@ -24,7 +24,7 @@
     "react-error-boundary": "^4.0.11",
     "react-hook-form": "^7.47.0",
     "react-router-dom": "^6.17.0",
-    "ui": "workspace:*",
+    "shared": "workspace:*",
     "zod": "^3.22.4",
     "zustand": "^4.4.4"
   },

apps/volunteer/src/components/layout/index.tsx

@@ -1,8 +1,8 @@
 import { Container } from '@chakra-ui/react';
 import { Outlet } from 'react-router-dom';
-import BottomNavBar from 'ui/layout/BottomNavBar';
-import Header from 'ui/layout/Header';
-import { HeaderOption } from 'ui/types/header';
+import BottomNavBar from 'shared/layout/BottomNavBar';
+import Header from 'shared/layout/Header';
+import { HeaderOption } from 'shared/types/header';
 
 export default function Layout() {
   const headerOption: HeaderOption = {

apps/volunteer/src/routes/index.tsx

@@ -1,4 +1,4 @@
-import { createBrowserRouter } from 'react-router-dom';
+import { createBrowserRouter, RouterProviderProps } from 'react-router-dom';
 
 import Layout from '@/components/layout';
 import PATH from '@/constants/path';
@@ -20,7 +20,7 @@ import VolunteersPage from '@/pages/volunteers';
 import VolunteersDetailPage from '@/pages/volunteers/detail';
 import VolunteersSearchPage from '@/pages/volunteers/search';
 
-export const router = createBrowserRouter([
+export const router: RouterProviderProps['router'] = createBrowserRouter([
   {
     path: '/',
     element: <Layout />,

cz-config.js

@@ -35,7 +35,7 @@ module.exports = {
   ],
   scopes: [
     { name: 'common' },
-    { name: 'ui' },
+    { name: 'shared' },
     { name: 'volunteer' },
     { name: 'shelter' },
   ],

package.json

@@ -27,12 +27,12 @@
     "@commitlint/config-conventional": "^18.1.0",
     "commitizen": "^4.3.0",
     "cz-customizable": "^7.0.0",
-    "eslint": "^7.32.0",
+    "eslint": "^8.45.0",
     "eslint-config-custom": "workspace:*",
     "husky": "^8.0.0",
     "lint-staged": "^15.0.2",
     "packlint": "^0.2.4",
-    "prettier": "^2.5.1",
+    "prettier": "3.0.3",
     "turbo": "latest"
   }
 }

packages/ui/components/CustomButton.tsx → packages/shared/components/CustomButton.tsx

@@ -1,5 +1,5 @@
 import { Button } from '@chakra-ui/react';
 
-export function CustomButton() {
+export default function CustomButton() {
   return <Button colorScheme="blue">임시 커스텀 버튼</Button>;
 }

packages/ui/components/Header.tsx → packages/shared/components/Header.tsx

@@ -1,3 +1,3 @@
-export function Header() {
+export default function Header() {
   return <header>커스텀 헤더</header>;
 }

packages/ui/package.json → packages/shared/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "ui",
+  "name": "shared",
   "version": "0.0.0",
   "license": "MIT",
   "main": "./index.tsx",

packages/ui/tsconfig.json → packages/shared/tsconfig.json

@@ -9,7 +9,7 @@
     "target": "es6",
     "baseUrl": ".",
     "paths": {
-      "@/*": ["../../packages/ui/*"]
+      "@/*": ["../../packages/shared/*"]
     }
   }
 }

packlint.config.mjs

@@ -1,3 +1,7 @@
 export default {
-  files: ['./package.json', './packages/*/package.json', './apps/*/package.json'],
+  files: [
+    './package.json',
+    './packages/*/package.json',
+    './apps/*/package.json',
+  ],
 };