From 0cbf09cdafdc7381e103b22fa6ef7b5bfebf73ac Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 05:30:35 +0900 Subject: [PATCH 1/7] fix: fix package vulnerability issue --- package-lock.json | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/package-lock.json b/package-lock.json index b5cf280..bae97ef 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3792,9 +3792,9 @@ } }, "node_modules/postcss": { - "version": "8.4.31", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", - "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", + "version": "8.4.33", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz", + "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==", "dev": true, "funding": [ { @@ -3811,7 +3811,7 @@ } ], "dependencies": { - "nanoid": "^3.3.6", + "nanoid": "^3.3.7", "picocolors": "^1.0.0", "source-map-js": "^1.0.2" }, @@ -4560,13 +4560,13 @@ } }, "node_modules/vite": { - "version": "5.0.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.2.tgz", - "integrity": "sha512-6CCq1CAJCNM1ya2ZZA7+jS2KgnhbzvxakmlIjN24cF/PXhRMzpM/z8QgsVJA/Dm5fWUWnVEsmtBoMhmerPxT0g==", + "version": "5.0.12", + "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.12.tgz", + "integrity": "sha512-4hsnEkG3q0N4Tzf1+t6NdN9dg/L3BM+q8SWgbSPnJvrgH2kgdyzfVJwbR1ic69/4uMJJ/3dqDZZE5/WwqW8U1w==", "dev": true, "dependencies": { "esbuild": "^0.19.3", - "postcss": "^8.4.31", + "postcss": "^8.4.32", "rollup": "^4.2.0" }, "bin": { @@ -7343,12 +7343,12 @@ "dev": true }, "postcss": { - "version": "8.4.31", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", - "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", + "version": "8.4.33", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz", + "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==", "dev": true, "requires": { - "nanoid": "^3.3.6", + "nanoid": "^3.3.7", "picocolors": "^1.0.0", "source-map-js": "^1.0.2" } @@ -7865,14 +7865,14 @@ } }, "vite": { - "version": "5.0.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.2.tgz", - "integrity": "sha512-6CCq1CAJCNM1ya2ZZA7+jS2KgnhbzvxakmlIjN24cF/PXhRMzpM/z8QgsVJA/Dm5fWUWnVEsmtBoMhmerPxT0g==", + "version": "5.0.12", + "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.12.tgz", + "integrity": "sha512-4hsnEkG3q0N4Tzf1+t6NdN9dg/L3BM+q8SWgbSPnJvrgH2kgdyzfVJwbR1ic69/4uMJJ/3dqDZZE5/WwqW8U1w==", "dev": true, "requires": { "esbuild": "^0.19.3", "fsevents": "~2.3.3", - "postcss": "^8.4.31", + "postcss": "^8.4.32", "rollup": "^4.2.0" } }, From bcb01737b4cf07bb3c87fcacc565240a9277426f Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 05:40:02 +0900 Subject: [PATCH 2/7] feat: add react router package --- package-lock.json | 175 +++++++++++++++++++++++++++++++++++++++++++++- package.json | 6 +- 2 files changed, 179 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index bae97ef..8ed2ff1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,8 +8,12 @@ "name": "selectime-web", "version": "0.0.0", "dependencies": { + "localforage": "^1.10.0", + "match-sorter": "^6.3.3", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "react-router-dom": "^6.21.3", + "sort-by": "^0.0.2" }, "devDependencies": { "@types/react": "^18.2.37", @@ -346,6 +350,17 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/runtime": { + "version": "7.23.9", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.9.tgz", + "integrity": "sha512-0CX6F+BI2s9dkUqr08KFrAIZgNFj75rdBU/DjCyYLIaV/quFjkk6T+EJ2LkZHyZTbEV4L5p97mNkUsHl2wLFAw==", + "dependencies": { + "regenerator-runtime": "^0.14.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.22.15", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz", @@ -934,6 +949,14 @@ "node": ">= 8" } }, + "node_modules/@remix-run/router": { + "version": "1.14.2", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.2.tgz", + "integrity": "sha512-ACXpdMM9hmKZww21yEqWwiLws/UPLhNKvimN8RrYSqPSvB3ov7sLvAcfvaxePeLvccTQKGdkDIhLYApZVDFuKg==", + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.5.2", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.5.2.tgz", @@ -2935,6 +2958,11 @@ "node": ">= 4" } }, + "node_modules/immediate": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz", + "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==" + }, "node_modules/import-fresh": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz", @@ -3425,6 +3453,22 @@ "node": ">= 0.8.0" } }, + "node_modules/lie": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz", + "integrity": "sha512-RiNhHysUjhrDQntfYSfY4MU24coXXdEOgw9WGcKHNeEwffDYbF//u87M1EWaMGzuFoSbqW0C9C6lEEhDOAswfw==", + "dependencies": { + "immediate": "~3.0.5" + } + }, + "node_modules/localforage": { + "version": "1.10.0", + "resolved": "https://registry.npmjs.org/localforage/-/localforage-1.10.0.tgz", + "integrity": "sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg==", + "dependencies": { + "lie": "3.1.1" + } + }, "node_modules/locate-path": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", @@ -3466,6 +3510,15 @@ "yallist": "^3.0.2" } }, + "node_modules/match-sorter": { + "version": "6.3.3", + "resolved": "https://registry.npmjs.org/match-sorter/-/match-sorter-6.3.3.tgz", + "integrity": "sha512-sgiXxrRijEe0SzHKGX4HouCpfHRPnqteH42UdMEW7BlWy990ZkzcvonJGv4Uu9WE7Y1f8Yocm91+4qFPCbmNww==", + "dependencies": { + "@babel/runtime": "^7.23.8", + "remove-accents": "0.5.0" + } + }, "node_modules/merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", @@ -3906,6 +3959,36 @@ "node": ">=0.10.0" } }, + "node_modules/react-router": { + "version": "6.21.3", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.3.tgz", + "integrity": "sha512-a0H638ZXULv1OdkmiK6s6itNhoy33ywxmUFT/xtSoVyf9VnC7n7+VT4LjVzdIHSaF5TIh9ylUgxMXksHTgGrKg==", + "dependencies": { + "@remix-run/router": "1.14.2" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.21.3", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.3.tgz", + "integrity": "sha512-kNzubk7n4YHSrErzjLK72j0B5i969GsuCGazRl3G6j1zqZBLjuSlYBdVdkDOgzGdPIffUOc9nmgiadTEVoq91g==", + "dependencies": { + "@remix-run/router": "1.14.2", + "react-router": "6.21.3" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/reflect.getprototypeof": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz", @@ -3926,6 +4009,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/regenerator-runtime": { + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", + "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==" + }, "node_modules/regexp.prototype.flags": { "version": "1.5.1", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz", @@ -3943,6 +4031,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/remove-accents": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.5.0.tgz", + "integrity": "sha512-8g3/Otx1eJaVD12e31UbJj1YzdtVvzH85HV7t+9MJYk/u3XmkOUJ5Ys9wQrf9PCPK8+xn4ymzqYCiZl6QWKn+A==" + }, "node_modules/resolve": { "version": "2.0.0-next.5", "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.5.tgz", @@ -4200,6 +4293,11 @@ "node": ">=8" } }, + "node_modules/sort-by": { + "version": "0.0.2", + "resolved": "https://registry.npmjs.org/sort-by/-/sort-by-0.0.2.tgz", + "integrity": "sha512-iOX5oHA4a0eqTMFiWrHYqv924UeRKFBLhym7iwSVG37Egg2wApgZKAjyzM9WZjMwKv6+8Zi+nIaJ7FYsO9EkoA==" + }, "node_modules/source-map-js": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", @@ -4962,6 +5060,14 @@ "@babel/helper-plugin-utils": "^7.22.5" } }, + "@babel/runtime": { + "version": "7.23.9", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.9.tgz", + "integrity": "sha512-0CX6F+BI2s9dkUqr08KFrAIZgNFj75rdBU/DjCyYLIaV/quFjkk6T+EJ2LkZHyZTbEV4L5p97mNkUsHl2wLFAw==", + "requires": { + "regenerator-runtime": "^0.14.0" + } + }, "@babel/template": { "version": "7.22.15", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz", @@ -5293,6 +5399,11 @@ "fastq": "^1.6.0" } }, + "@remix-run/router": { + "version": "1.14.2", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.2.tgz", + "integrity": "sha512-ACXpdMM9hmKZww21yEqWwiLws/UPLhNKvimN8RrYSqPSvB3ov7sLvAcfvaxePeLvccTQKGdkDIhLYApZVDFuKg==" + }, "@rollup/rollup-android-arm-eabi": { "version": "4.5.2", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.5.2.tgz", @@ -6729,6 +6840,11 @@ "integrity": "sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==", "dev": true }, + "immediate": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz", + "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==" + }, "import-fresh": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz", @@ -7078,6 +7194,22 @@ "type-check": "~0.4.0" } }, + "lie": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz", + "integrity": "sha512-RiNhHysUjhrDQntfYSfY4MU24coXXdEOgw9WGcKHNeEwffDYbF//u87M1EWaMGzuFoSbqW0C9C6lEEhDOAswfw==", + "requires": { + "immediate": "~3.0.5" + } + }, + "localforage": { + "version": "1.10.0", + "resolved": "https://registry.npmjs.org/localforage/-/localforage-1.10.0.tgz", + "integrity": "sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg==", + "requires": { + "lie": "3.1.1" + } + }, "locate-path": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", @@ -7110,6 +7242,15 @@ "yallist": "^3.0.2" } }, + "match-sorter": { + "version": "6.3.3", + "resolved": "https://registry.npmjs.org/match-sorter/-/match-sorter-6.3.3.tgz", + "integrity": "sha512-sgiXxrRijEe0SzHKGX4HouCpfHRPnqteH42UdMEW7BlWy990ZkzcvonJGv4Uu9WE7Y1f8Yocm91+4qFPCbmNww==", + "requires": { + "@babel/runtime": "^7.23.8", + "remove-accents": "0.5.0" + } + }, "merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", @@ -7411,6 +7552,23 @@ "integrity": "sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==", "dev": true }, + "react-router": { + "version": "6.21.3", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.3.tgz", + "integrity": "sha512-a0H638ZXULv1OdkmiK6s6itNhoy33ywxmUFT/xtSoVyf9VnC7n7+VT4LjVzdIHSaF5TIh9ylUgxMXksHTgGrKg==", + "requires": { + "@remix-run/router": "1.14.2" + } + }, + "react-router-dom": { + "version": "6.21.3", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.3.tgz", + "integrity": "sha512-kNzubk7n4YHSrErzjLK72j0B5i969GsuCGazRl3G6j1zqZBLjuSlYBdVdkDOgzGdPIffUOc9nmgiadTEVoq91g==", + "requires": { + "@remix-run/router": "1.14.2", + "react-router": "6.21.3" + } + }, "reflect.getprototypeof": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz", @@ -7425,6 +7583,11 @@ "which-builtin-type": "^1.1.3" } }, + "regenerator-runtime": { + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", + "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==" + }, "regexp.prototype.flags": { "version": "1.5.1", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz", @@ -7436,6 +7599,11 @@ "set-function-name": "^2.0.0" } }, + "remove-accents": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.5.0.tgz", + "integrity": "sha512-8g3/Otx1eJaVD12e31UbJj1YzdtVvzH85HV7t+9MJYk/u3XmkOUJ5Ys9wQrf9PCPK8+xn4ymzqYCiZl6QWKn+A==" + }, "resolve": { "version": "2.0.0-next.5", "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.5.tgz", @@ -7616,6 +7784,11 @@ "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", "dev": true }, + "sort-by": { + "version": "0.0.2", + "resolved": "https://registry.npmjs.org/sort-by/-/sort-by-0.0.2.tgz", + "integrity": "sha512-iOX5oHA4a0eqTMFiWrHYqv924UeRKFBLhym7iwSVG37Egg2wApgZKAjyzM9WZjMwKv6+8Zi+nIaJ7FYsO9EkoA==" + }, "source-map-js": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", diff --git a/package.json b/package.json index 4772803..938e77c 100644 --- a/package.json +++ b/package.json @@ -10,8 +10,12 @@ "preview": "vite preview" }, "dependencies": { + "localforage": "^1.10.0", + "match-sorter": "^6.3.3", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "react-router-dom": "^6.21.3", + "sort-by": "^0.0.2" }, "devDependencies": { "@types/react": "^18.2.37", From 5a70011bbd3c2d755c190ee73ae97c814cb1e465 Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 05:40:11 +0900 Subject: [PATCH 3/7] feat: make root route --- src/App.css | 42 ---------------------------------------- src/App.tsx | 35 --------------------------------- src/main.tsx | 24 +++++++++++++++-------- src/routes/Root/Root.tsx | 5 +++++ 4 files changed, 21 insertions(+), 85 deletions(-) delete mode 100644 src/App.css delete mode 100644 src/App.tsx create mode 100644 src/routes/Root/Root.tsx diff --git a/src/App.css b/src/App.css deleted file mode 100644 index b9d355d..0000000 --- a/src/App.css +++ /dev/null @@ -1,42 +0,0 @@ -#root { - max-width: 1280px; - margin: 0 auto; - padding: 2rem; - text-align: center; -} - -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: filter 300ms; -} -.logo:hover { - filter: drop-shadow(0 0 2em #646cffaa); -} -.logo.react:hover { - filter: drop-shadow(0 0 2em #61dafbaa); -} - -@keyframes logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} - -@media (prefers-reduced-motion: no-preference) { - a:nth-of-type(2) .logo { - animation: logo-spin infinite 20s linear; - } -} - -.card { - padding: 2em; -} - -.read-the-docs { - color: #888; -} diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index e1b572e..0000000 --- a/src/App.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import "./App.css"; -import reactLogo from "./assets/react.svg"; -import { useState } from "react"; -import viteLogo from "/vite.svg"; - -function App() { - const [count, setCount] = useState(0); - - return ( - <> -
- - Vite logo - - - React logo - -
-

Vite + React

-
- -

- Edit src/App.tsx and save to test HMR -

-
-

- Click on the Vite and React logos to learn more -

- - ); -} - -export default App; diff --git a/src/main.tsx b/src/main.tsx index 3d7150d..f651200 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,10 +1,18 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './App.tsx' -import './index.css' +import React from "react"; +import ReactDOM from "react-dom/client"; +import "./index.css"; +import { RouterProvider, createBrowserRouter } from "react-router-dom"; +import Root from "./routes/Root/Root.tsx"; -ReactDOM.createRoot(document.getElementById('root')!).render( +const router = createBrowserRouter([ + { + path: "/", + element: , + }, +]); + +ReactDOM.createRoot(document.getElementById("root")!).render( - - , -) + + +); diff --git a/src/routes/Root/Root.tsx b/src/routes/Root/Root.tsx new file mode 100644 index 0000000..def5f4c --- /dev/null +++ b/src/routes/Root/Root.tsx @@ -0,0 +1,5 @@ +const Root = () => { + return
; +}; + +export default Root; From e660a4d92891c96bdb9a8a29379c7a870a498606 Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 05:45:16 +0900 Subject: [PATCH 4/7] feat: add error page --- src/error-page.tsx | 13 +++++++++++++ src/main.tsx | 2 ++ 2 files changed, 15 insertions(+) create mode 100644 src/error-page.tsx diff --git a/src/error-page.tsx b/src/error-page.tsx new file mode 100644 index 0000000..1769e4f --- /dev/null +++ b/src/error-page.tsx @@ -0,0 +1,13 @@ +import { useRouteError } from "react-router-dom"; + +export default function ErrorPage() { + const error = useRouteError(); + console.error(error); + + return ( +
+

Oops!

+

Sorry, an unexpected error has occurred.

+
+ ); +} diff --git a/src/main.tsx b/src/main.tsx index f651200..a27e843 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -3,11 +3,13 @@ import ReactDOM from "react-dom/client"; import "./index.css"; import { RouterProvider, createBrowserRouter } from "react-router-dom"; import Root from "./routes/Root/Root.tsx"; +import ErrorPage from "./error-page"; const router = createBrowserRouter([ { path: "/", element: , + errorElement: , }, ]); From 8b9c575a441bcc0d6ea194ec837117497bbf1257 Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 05:50:45 +0900 Subject: [PATCH 5/7] feat: make create meet route --- src/main.tsx | 8 ++++++-- src/routes/CreateMeet/CreateMeet.tsx | 24 ++++++++++++++++++++++++ src/routes/Root/Root.tsx | 5 ----- 3 files changed, 30 insertions(+), 7 deletions(-) create mode 100644 src/routes/CreateMeet/CreateMeet.tsx delete mode 100644 src/routes/Root/Root.tsx diff --git a/src/main.tsx b/src/main.tsx index a27e843..3dec626 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -2,15 +2,19 @@ import React from "react"; import ReactDOM from "react-dom/client"; import "./index.css"; import { RouterProvider, createBrowserRouter } from "react-router-dom"; -import Root from "./routes/Root/Root.tsx"; +import CreateMeet from "./routes/CreateMeet/CreateMeet.tsx"; import ErrorPage from "./error-page"; const router = createBrowserRouter([ { path: "/", - element: , + element: , errorElement: , }, + { + path: "meet/:meetId", + element: , + }, ]); ReactDOM.createRoot(document.getElementById("root")!).render( diff --git a/src/routes/CreateMeet/CreateMeet.tsx b/src/routes/CreateMeet/CreateMeet.tsx new file mode 100644 index 0000000..56bef55 --- /dev/null +++ b/src/routes/CreateMeet/CreateMeet.tsx @@ -0,0 +1,24 @@ +import { Link } from "react-router-dom"; + +// TODO(세현): 모임 생성 추가 +const CreateMeet = () => { + // example + const id = 2; + + return ( + + 생성 후 이동 + + ); +}; + +export default CreateMeet; diff --git a/src/routes/Root/Root.tsx b/src/routes/Root/Root.tsx deleted file mode 100644 index def5f4c..0000000 --- a/src/routes/Root/Root.tsx +++ /dev/null @@ -1,5 +0,0 @@ -const Root = () => { - return
; -}; - -export default Root; From 56e821da7e5321781335fadf28aeb7d369d348c4 Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 06:14:34 +0900 Subject: [PATCH 6/7] feat: make meet route --- src/main.tsx | 13 +++++++++---- src/routes/Meet/Meet.tsx | 13 +++++++++++++ src/utils/jsUtils.ts | 14 ++++++++++++++ 3 files changed, 36 insertions(+), 4 deletions(-) create mode 100644 src/routes/Meet/Meet.tsx create mode 100644 src/utils/jsUtils.ts diff --git a/src/main.tsx b/src/main.tsx index 3dec626..78e25df 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -4,16 +4,21 @@ import "./index.css"; import { RouterProvider, createBrowserRouter } from "react-router-dom"; import CreateMeet from "./routes/CreateMeet/CreateMeet.tsx"; import ErrorPage from "./error-page"; +import Meet from "./routes/Meet/Meet.tsx"; +import { meetLoader } from "./routes/Meet/meetLoader.ts"; const router = createBrowserRouter([ { path: "/", element: , errorElement: , - }, - { - path: "meet/:meetId", - element: , + children: [ + { + path: "meet/:meetId", + element: , + loader: meetLoader, + }, + ], }, ]); diff --git a/src/routes/Meet/Meet.tsx b/src/routes/Meet/Meet.tsx new file mode 100644 index 0000000..6525c28 --- /dev/null +++ b/src/routes/Meet/Meet.tsx @@ -0,0 +1,13 @@ +import { parseNum } from "@/utils/jsUtils"; +import { useParams } from "react-router-dom"; + +const Meet = () => { + const { meetId: _meetId } = useParams<"meetId">(); + const meetId = _meetId ? parseNum(_meetId) : null; + if (!meetId) return <>; + + // TODO: meetId 사용해서 미팅 정보 가져오고 시간 선택 + return <>; +}; + +export default Meet; diff --git a/src/utils/jsUtils.ts b/src/utils/jsUtils.ts new file mode 100644 index 0000000..711960e --- /dev/null +++ b/src/utils/jsUtils.ts @@ -0,0 +1,14 @@ +/** + * string 으로 쓰여진 숫자를 Number로 변환하는 함수. + * 빈 스트링인 경우, 숫자형식이 아니거나 NaN인 경우 null 반환 + */ + +export const parseNum = (str: string) => { + if (str === "") return null; + + const parsed = Number(str.replace(/[^0-9+.]/g, "")); + + if (typeof parsed !== "number" || Number.isNaN(parsed)) return null; + + return parsed; +}; From d5b4399f68910db6bc30749ea84943b5b0a612ca Mon Sep 17 00:00:00 2001 From: Suebin Kim Date: Sat, 27 Jan 2024 06:22:41 +0900 Subject: [PATCH 7/7] feat: make validate utils --- src/interfaces/Common.ts | 9 +++++++++ src/utils/validateUtils.ts | 27 +++++++++++++++++++++++++++ 2 files changed, 36 insertions(+) create mode 100644 src/interfaces/Common.ts create mode 100644 src/utils/validateUtils.ts diff --git a/src/interfaces/Common.ts b/src/interfaces/Common.ts new file mode 100644 index 0000000..c1307cf --- /dev/null +++ b/src/interfaces/Common.ts @@ -0,0 +1,9 @@ +export type ValidationResult = + | { + isError: false; + errorMsg?: undefined; + } + | { + isError: true; + errorMsg: string; + }; diff --git a/src/utils/validateUtils.ts b/src/utils/validateUtils.ts new file mode 100644 index 0000000..92e5ea5 --- /dev/null +++ b/src/utils/validateUtils.ts @@ -0,0 +1,27 @@ +import { ValidationResult } from "@/interfaces/Common"; + +export const validateMeetName = (name: string): ValidationResult => { + if (name.trim().length < 3 || name.trim().length > 15) { + return { + isError: true, + errorMsg: "모임 이름은 3자 이상 15자 이내여야 합니다.", + }; + } + + return { + isError: false, + }; +}; + +export const validateUserName = (name: string): ValidationResult => { + if (name.trim().length < 1 || name.trim().length > 15) { + return { + isError: true, + errorMsg: "이름은 1자 이상 15자 이내여야 합니다.", + }; + } + + return { + isError: false, + }; +};