From ec9dea115437d2bfc37563b219cfe79579c09b80 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=A2=E1=84=92=E1=85=A1?= Date: Tue, 12 Sep 2023 19:21:49 +0900 Subject: [PATCH 1/6] =?UTF-8?q?fix:=20ui=20=ED=8C=A8=ED=82=A4=EC=A7=80?= =?UTF-8?q?=EB=A5=BC=20=EC=82=AC=EC=9A=A9=ED=95=98=EC=A7=80=20=EB=AA=BB?= =?UTF-8?q?=ED=95=98=EB=8A=94=20=EC=9D=B4=EC=8A=88=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .pnp.cjs | 183 +++++++++++++----- apps/chooz/package.json | 1 + apps/jurumarble/package.json | 1 + .../src/lib/styles/StyledComponents.tsx | 22 +-- packages/ui/package.json | 14 +- yarn.lock | 7 +- 6 files changed, 149 insertions(+), 79 deletions(-) diff --git a/.pnp.cjs b/.pnp.cjs index a328e47e..3ddadf37 100755 --- a/.pnp.cjs +++ b/.pnp.cjs @@ -38,7 +38,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@monorepo/chooz", ["workspace:apps/chooz"]],\ ["@monorepo/hooks", ["workspace:packages/hooks"]],\ ["@monorepo/jurumarble", ["workspace:apps/jurumarble"]],\ - ["@monorepo/ui", ["workspace:packages/ui"]],\ + ["@monorepo/ui", ["virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#workspace:packages/ui", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#workspace:packages/ui", "workspace:packages/ui"]],\ ["monorepo", ["workspace:."]]\ ],\ "fallbackPool": [\ @@ -4066,7 +4066,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { "packageDependencies": [\ ["@monorepo/chooz", "workspace:apps/chooz"],\ ["@monorepo/hooks", "workspace:packages/hooks"],\ - ["@monorepo/ui", "workspace:packages/ui"],\ + ["@monorepo/ui", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#workspace:packages/ui"],\ ["@next/font", "npm:13.4.19"],\ ["@svgr/cli", "npm:7.0.0"],\ ["@svgr/webpack", "npm:6.5.1"],\ @@ -4074,20 +4074,21 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@tanstack/react-query-devtools", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:4.33.0"],\ ["@types/node", "npm:20.5.7"],\ ["@types/react", "npm:18.2.21"],\ + ["@types/styled-components", "npm:5.1.26"],\ ["axios", "npm:1.5.0"],\ - ["babel-plugin-styled-components", "virtual:181676522bcad7654c43a90fb30f8159f9163bd43d8c35fa31c9798550dff2151dbd52caa024cd2dacd66e5a091cc8337976a371d7c47691fcbc5c87bdb3bbb4#npm:2.1.4"],\ + ["babel-plugin-styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:2.1.4"],\ ["babel-preset-next", "npm:1.4.0"],\ ["css-loader", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:6.8.1"],\ ["next", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:13.4.19"],\ ["next-transpile-modules", "npm:10.0.1"],\ ["react", "npm:18.2.0"],\ ["react-device-detect", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:2.2.3"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["react-is", "npm:18.2.0"],\ ["react-slick", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:0.29.0"],\ ["slick-carousel", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:1.8.1"],\ ["style-loader", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:3.3.3"],\ - ["styled-components", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:5.3.11"],\ + ["styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:5.3.11"],\ ["typescript", "patch:typescript@npm%3A4.9.3#~builtin::version=4.9.3&hash=d73830"]\ ],\ "linkType": "SOFT"\ @@ -4113,6 +4114,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@monorepo/jurumarble", "workspace:apps/jurumarble"],\ ["@emotion/is-prop-valid", "npm:1.2.1"],\ ["@monorepo/hooks", "workspace:packages/hooks"],\ + ["@monorepo/ui", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#workspace:packages/ui"],\ ["@svgr/cli", "npm:8.1.0"],\ ["@svgr/core", "npm:8.1.0"],\ ["@svgr/plugin-jsx", "virtual:f6fc21e1196a5e36ccf7110701b6043e0b913ea4ae1d1deb9368d1ebef4cb8924deb4e8e07aafc9678d844b070003814a4413e37134a210b07db139914fa76a4#npm:8.1.0"],\ @@ -4128,7 +4130,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["lodash", "npm:4.17.21"],\ ["next", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:13.4.12"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["react-is", "npm:18.2.0"],\ ["react-toastify", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:9.1.3"],\ ["styled-components", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11"],\ @@ -4139,18 +4141,75 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { }]\ ]],\ ["@monorepo/ui", [\ - ["workspace:packages/ui", {\ - "packageLocation": "./packages/ui/",\ + ["virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#workspace:packages/ui", {\ + "packageLocation": "./.yarn/__virtual__/@monorepo-ui-virtual-8e35c521b2/1/packages/ui/",\ "packageDependencies": [\ - ["@monorepo/ui", "workspace:packages/ui"],\ + ["@monorepo/ui", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#workspace:packages/ui"],\ + ["@monorepo/hooks", "workspace:packages/hooks"],\ + ["@types/monorepo__hooks", null],\ + ["@types/node", "npm:20.5.7"],\ + ["@types/react", "npm:18.2.21"],\ + ["@types/react-dom", "npm:18.2.7"],\ + ["@types/react-is", null],\ + ["@types/styled-components", "npm:5.1.26"],\ + ["react", "npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ + ["react-is", "npm:18.2.0"],\ + ["styled-components", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11"],\ + ["typescript", "patch:typescript@npm%3A4.9.3#~builtin::version=4.9.3&hash=d73830"]\ + ],\ + "packagePeers": [\ + "@monorepo/hooks",\ + "@types/monorepo__hooks",\ + "@types/react-dom",\ + "@types/react-is",\ + "@types/react",\ + "@types/styled-components",\ + "react-dom",\ + "react-is",\ + "react",\ + "styled-components"\ + ],\ + "linkType": "SOFT"\ + }],\ + ["virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#workspace:packages/ui", {\ + "packageLocation": "./.yarn/__virtual__/@monorepo-ui-virtual-bbfb055077/1/packages/ui/",\ + "packageDependencies": [\ + ["@monorepo/ui", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#workspace:packages/ui"],\ ["@monorepo/hooks", "workspace:packages/hooks"],\ + ["@types/monorepo__hooks", null],\ ["@types/node", "npm:20.5.7"],\ ["@types/react", "npm:18.2.21"],\ + ["@types/react-dom", null],\ + ["@types/react-is", null],\ ["@types/styled-components", "npm:5.1.26"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["react-is", "npm:18.2.0"],\ - ["styled-components", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:5.3.11"],\ + ["styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:5.3.11"],\ + ["typescript", "patch:typescript@npm%3A4.9.3#~builtin::version=4.9.3&hash=d73830"]\ + ],\ + "packagePeers": [\ + "@monorepo/hooks",\ + "@types/monorepo__hooks",\ + "@types/react-dom",\ + "@types/react-is",\ + "@types/react",\ + "@types/styled-components",\ + "react-dom",\ + "react-is",\ + "react",\ + "styled-components"\ + ],\ + "linkType": "SOFT"\ + }],\ + ["workspace:packages/ui", {\ + "packageLocation": "./packages/ui/",\ + "packageDependencies": [\ + ["@monorepo/ui", "workspace:packages/ui"],\ + ["@types/node", "npm:20.5.7"],\ + ["@types/react", "npm:18.2.21"],\ + ["@types/styled-components", "npm:5.1.26"],\ ["typescript", "patch:typescript@npm%3A4.9.3#~builtin::version=4.9.3&hash=d73830"]\ ],\ "linkType": "SOFT"\ @@ -5209,7 +5268,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@types/react-dom", "npm:18.2.7"],\ ["@types/react-native", null],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["react-native", null],\ ["use-sync-external-store", "virtual:287fccd9feb4edd5a3f2f35798ab7b2d62efb7b695baf588a4eab1df65d34a1efa49f762a59ad574264bfc913641f9cf46841c273f01492440d0ef17469b3b2d#npm:1.2.0"]\ ],\ @@ -5232,7 +5291,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@types/react-dom", null],\ ["@types/react-native", null],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["react-native", null],\ ["use-sync-external-store", "virtual:287fccd9feb4edd5a3f2f35798ab7b2d62efb7b695baf588a4eab1df65d34a1efa49f762a59ad574264bfc913641f9cf46841c273f01492440d0ef17469b3b2d#npm:1.2.0"]\ ],\ @@ -5265,7 +5324,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@types/react-dom", "npm:18.2.7"],\ ["@types/tanstack__react-query", null],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["superjson", "npm:1.13.1"],\ ["use-sync-external-store", "virtual:287fccd9feb4edd5a3f2f35798ab7b2d62efb7b695baf588a4eab1df65d34a1efa49f762a59ad574264bfc913641f9cf46841c273f01492440d0ef17469b3b2d#npm:1.2.0"]\ ],\ @@ -5289,7 +5348,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@types/react-dom", null],\ ["@types/tanstack__react-query", null],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["superjson", "npm:1.13.1"],\ ["use-sync-external-store", "virtual:287fccd9feb4edd5a3f2f35798ab7b2d62efb7b695baf588a4eab1df65d34a1efa49f762a59ad574264bfc913641f9cf46841c273f01492440d0ef17469b3b2d#npm:1.2.0"]\ ],\ @@ -5585,17 +5644,17 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ],\ "linkType": "SOFT"\ }],\ - ["virtual:181676522bcad7654c43a90fb30f8159f9163bd43d8c35fa31c9798550dff2151dbd52caa024cd2dacd66e5a091cc8337976a371d7c47691fcbc5c87bdb3bbb4#npm:2.1.4", {\ - "packageLocation": "./.yarn/__virtual__/babel-plugin-styled-components-virtual-b9739b8831/0/cache/babel-plugin-styled-components-npm-2.1.4-40cd8c2d2b-d791aed68d.zip/node_modules/babel-plugin-styled-components/",\ + ["virtual:61097bbc169fab4637705d09a1bd9318cc1161163d1ff4744210fb91daa0a0f3cecb38cc5fe3ba2de304e631ca8700c2c15004e37b2b5d69e0e5d170a0576161#npm:2.1.4", {\ + "packageLocation": "./.yarn/__virtual__/babel-plugin-styled-components-virtual-a1798919fa/0/cache/babel-plugin-styled-components-npm-2.1.4-40cd8c2d2b-d791aed68d.zip/node_modules/babel-plugin-styled-components/",\ "packageDependencies": [\ - ["babel-plugin-styled-components", "virtual:181676522bcad7654c43a90fb30f8159f9163bd43d8c35fa31c9798550dff2151dbd52caa024cd2dacd66e5a091cc8337976a371d7c47691fcbc5c87bdb3bbb4#npm:2.1.4"],\ + ["babel-plugin-styled-components", "virtual:61097bbc169fab4637705d09a1bd9318cc1161163d1ff4744210fb91daa0a0f3cecb38cc5fe3ba2de304e631ca8700c2c15004e37b2b5d69e0e5d170a0576161#npm:2.1.4"],\ ["@babel/helper-annotate-as-pure", "npm:7.22.5"],\ ["@babel/helper-module-imports", "npm:7.22.5"],\ ["@babel/plugin-syntax-jsx", "virtual:bdeeb3d8269592d017c69d49d98383e742ae5ce561bce18cf6f41ef57a9de89d093f4edd5d396157ce7f8c0e09d00ae5e547cbe55d2913482f981ed40cb3d4a3#npm:7.22.5"],\ ["@types/styled-components", null],\ ["lodash", "npm:4.17.21"],\ ["picomatch", "npm:2.3.1"],\ - ["styled-components", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:5.3.11"]\ + ["styled-components", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11"]\ ],\ "packagePeers": [\ "@types/styled-components",\ @@ -5603,17 +5662,35 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ],\ "linkType": "HARD"\ }],\ - ["virtual:61097bbc169fab4637705d09a1bd9318cc1161163d1ff4744210fb91daa0a0f3cecb38cc5fe3ba2de304e631ca8700c2c15004e37b2b5d69e0e5d170a0576161#npm:2.1.4", {\ - "packageLocation": "./.yarn/__virtual__/babel-plugin-styled-components-virtual-a1798919fa/0/cache/babel-plugin-styled-components-npm-2.1.4-40cd8c2d2b-d791aed68d.zip/node_modules/babel-plugin-styled-components/",\ + ["virtual:68a9a33632f1040438a32da064a66a3854f8d30087e3e2e5450720afc4e95cc10f141c96d079565a457e8f841886d95682d41d35df360e516a21dcf2746c9021#npm:2.1.4", {\ + "packageLocation": "./.yarn/__virtual__/babel-plugin-styled-components-virtual-bb02a2a66d/0/cache/babel-plugin-styled-components-npm-2.1.4-40cd8c2d2b-d791aed68d.zip/node_modules/babel-plugin-styled-components/",\ "packageDependencies": [\ - ["babel-plugin-styled-components", "virtual:61097bbc169fab4637705d09a1bd9318cc1161163d1ff4744210fb91daa0a0f3cecb38cc5fe3ba2de304e631ca8700c2c15004e37b2b5d69e0e5d170a0576161#npm:2.1.4"],\ + ["babel-plugin-styled-components", "virtual:68a9a33632f1040438a32da064a66a3854f8d30087e3e2e5450720afc4e95cc10f141c96d079565a457e8f841886d95682d41d35df360e516a21dcf2746c9021#npm:2.1.4"],\ ["@babel/helper-annotate-as-pure", "npm:7.22.5"],\ ["@babel/helper-module-imports", "npm:7.22.5"],\ ["@babel/plugin-syntax-jsx", "virtual:bdeeb3d8269592d017c69d49d98383e742ae5ce561bce18cf6f41ef57a9de89d093f4edd5d396157ce7f8c0e09d00ae5e547cbe55d2913482f981ed40cb3d4a3#npm:7.22.5"],\ ["@types/styled-components", null],\ ["lodash", "npm:4.17.21"],\ ["picomatch", "npm:2.3.1"],\ - ["styled-components", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11"]\ + ["styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:5.3.11"]\ + ],\ + "packagePeers": [\ + "@types/styled-components",\ + "styled-components"\ + ],\ + "linkType": "HARD"\ + }],\ + ["virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:2.1.4", {\ + "packageLocation": "./.yarn/__virtual__/babel-plugin-styled-components-virtual-6c38853caf/0/cache/babel-plugin-styled-components-npm-2.1.4-40cd8c2d2b-d791aed68d.zip/node_modules/babel-plugin-styled-components/",\ + "packageDependencies": [\ + ["babel-plugin-styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:2.1.4"],\ + ["@babel/helper-annotate-as-pure", "npm:7.22.5"],\ + ["@babel/helper-module-imports", "npm:7.22.5"],\ + ["@babel/plugin-syntax-jsx", "virtual:bdeeb3d8269592d017c69d49d98383e742ae5ce561bce18cf6f41ef57a9de89d093f4edd5d396157ce7f8c0e09d00ae5e547cbe55d2913482f981ed40cb3d4a3#npm:7.22.5"],\ + ["@types/styled-components", "npm:5.1.26"],\ + ["lodash", "npm:4.17.21"],\ + ["picomatch", "npm:2.3.1"],\ + ["styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:5.3.11"]\ ],\ "packagePeers": [\ "@types/styled-components",\ @@ -6739,7 +6816,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["fibers", null],\ ["postcss", "npm:8.4.14"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["sass", null],\ ["styled-jsx", "virtual:e2c6a261950790bd3783a0504187c9c1137db68dd124b19ebbec858de182b629f0a3eca7569663c03fdc9ebf569042d983abda5d32214402ec561129d25dfad1#npm:5.1.1"],\ ["watchpack", "npm:2.4.0"],\ @@ -6783,7 +6860,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["caniuse-lite", "npm:1.0.30001524"],\ ["postcss", "npm:8.4.14"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["sass", null],\ ["styled-jsx", "virtual:e2c6a261950790bd3783a0504187c9c1137db68dd124b19ebbec858de182b629f0a3eca7569663c03fdc9ebf569042d983abda5d32214402ec561129d25dfad1#npm:5.1.1"],\ ["watchpack", "npm:2.4.0"],\ @@ -7089,7 +7166,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@types/react", "npm:18.2.21"],\ ["@types/react-dom", null],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["ua-parser-js", "npm:1.0.35"]\ ],\ "packagePeers": [\ @@ -7109,10 +7186,10 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ],\ "linkType": "SOFT"\ }],\ - ["virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0", {\ - "packageLocation": "./.yarn/__virtual__/react-dom-virtual-41ba996b32/0/cache/react-dom-npm-18.2.0-dd675bca1c-7d323310be.zip/node_modules/react-dom/",\ + ["virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0", {\ + "packageLocation": "./.yarn/__virtual__/react-dom-virtual-821b435e99/0/cache/react-dom-npm-18.2.0-dd675bca1c-7d323310be.zip/node_modules/react-dom/",\ "packageDependencies": [\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["@types/react", "npm:18.2.21"],\ ["loose-envify", "npm:1.4.0"],\ ["react", "npm:18.2.0"],\ @@ -7160,7 +7237,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["json2mq", "npm:0.2.0"],\ ["lodash.debounce", "npm:4.0.8"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["resize-observer-polyfill", "npm:1.5.1"]\ ],\ "packagePeers": [\ @@ -7445,24 +7522,24 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ],\ "linkType": "SOFT"\ }],\ - ["virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:5.3.11", {\ - "packageLocation": "./.yarn/__virtual__/styled-components-virtual-181676522b/0/cache/styled-components-npm-5.3.11-d45616b9af-10edd4dae3.zip/node_modules/styled-components/",\ + ["virtual:153feba997cc61a3cf2b119c73f0a46150f4475b2449b54a9c09ded230a7e59552f9ddaa3d6273b9d60d464227c04336d4b04595bea51827334f0e7840915565#npm:5.3.11", {\ + "packageLocation": "./.yarn/__virtual__/styled-components-virtual-dd7a05ab7b/0/cache/styled-components-npm-5.3.11-d45616b9af-10edd4dae3.zip/node_modules/styled-components/",\ "packageDependencies": [\ - ["styled-components", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:5.3.11"],\ + ["styled-components", "virtual:153feba997cc61a3cf2b119c73f0a46150f4475b2449b54a9c09ded230a7e59552f9ddaa3d6273b9d60d464227c04336d4b04595bea51827334f0e7840915565#npm:5.3.11"],\ ["@babel/helper-module-imports", "npm:7.22.5"],\ ["@babel/traverse", "npm:7.22.11"],\ ["@emotion/is-prop-valid", "npm:1.2.1"],\ ["@emotion/stylis", "npm:0.8.5"],\ ["@emotion/unitless", "npm:0.7.5"],\ - ["@types/react", "npm:18.2.21"],\ + ["@types/react", null],\ ["@types/react-dom", null],\ ["@types/react-is", null],\ - ["babel-plugin-styled-components", "virtual:181676522bcad7654c43a90fb30f8159f9163bd43d8c35fa31c9798550dff2151dbd52caa024cd2dacd66e5a091cc8337976a371d7c47691fcbc5c87bdb3bbb4#npm:2.1.4"],\ + ["babel-plugin-styled-components", "virtual:dd7a05ab7b94d6e001f7863299a30decef4594e41284c3f88bedf5e784e1a1c64ba62635b3bd2bab9f7fbe3e6b5765e85e24619c304645041e0a91c321d35b82#npm:2.1.4"],\ ["css-to-react-native", "npm:3.2.0"],\ ["hoist-non-react-statics", "npm:3.3.2"],\ - ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ - ["react-is", "npm:18.2.0"],\ + ["react", null],\ + ["react-dom", null],\ + ["react-is", null],\ ["shallowequal", "npm:1.1.0"],\ ["supports-color", "npm:5.5.0"]\ ],\ @@ -7476,24 +7553,24 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ],\ "linkType": "HARD"\ }],\ - ["virtual:153feba997cc61a3cf2b119c73f0a46150f4475b2449b54a9c09ded230a7e59552f9ddaa3d6273b9d60d464227c04336d4b04595bea51827334f0e7840915565#npm:5.3.11", {\ - "packageLocation": "./.yarn/__virtual__/styled-components-virtual-dd7a05ab7b/0/cache/styled-components-npm-5.3.11-d45616b9af-10edd4dae3.zip/node_modules/styled-components/",\ + ["virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11", {\ + "packageLocation": "./.yarn/__virtual__/styled-components-virtual-61097bbc16/0/cache/styled-components-npm-5.3.11-d45616b9af-10edd4dae3.zip/node_modules/styled-components/",\ "packageDependencies": [\ - ["styled-components", "virtual:153feba997cc61a3cf2b119c73f0a46150f4475b2449b54a9c09ded230a7e59552f9ddaa3d6273b9d60d464227c04336d4b04595bea51827334f0e7840915565#npm:5.3.11"],\ + ["styled-components", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11"],\ ["@babel/helper-module-imports", "npm:7.22.5"],\ ["@babel/traverse", "npm:7.22.11"],\ ["@emotion/is-prop-valid", "npm:1.2.1"],\ ["@emotion/stylis", "npm:0.8.5"],\ ["@emotion/unitless", "npm:0.7.5"],\ - ["@types/react", null],\ - ["@types/react-dom", null],\ + ["@types/react", "npm:18.2.21"],\ + ["@types/react-dom", "npm:18.2.7"],\ ["@types/react-is", null],\ - ["babel-plugin-styled-components", "virtual:dd7a05ab7b94d6e001f7863299a30decef4594e41284c3f88bedf5e784e1a1c64ba62635b3bd2bab9f7fbe3e6b5765e85e24619c304645041e0a91c321d35b82#npm:2.1.4"],\ + ["babel-plugin-styled-components", "virtual:61097bbc169fab4637705d09a1bd9318cc1161163d1ff4744210fb91daa0a0f3cecb38cc5fe3ba2de304e631ca8700c2c15004e37b2b5d69e0e5d170a0576161#npm:2.1.4"],\ ["css-to-react-native", "npm:3.2.0"],\ ["hoist-non-react-statics", "npm:3.3.2"],\ - ["react", null],\ - ["react-dom", null],\ - ["react-is", null],\ + ["react", "npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ + ["react-is", "npm:18.2.0"],\ ["shallowequal", "npm:1.1.0"],\ ["supports-color", "npm:5.5.0"]\ ],\ @@ -7507,23 +7584,23 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ],\ "linkType": "HARD"\ }],\ - ["virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11", {\ - "packageLocation": "./.yarn/__virtual__/styled-components-virtual-61097bbc16/0/cache/styled-components-npm-5.3.11-d45616b9af-10edd4dae3.zip/node_modules/styled-components/",\ + ["virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:5.3.11", {\ + "packageLocation": "./.yarn/__virtual__/styled-components-virtual-68a9a33632/0/cache/styled-components-npm-5.3.11-d45616b9af-10edd4dae3.zip/node_modules/styled-components/",\ "packageDependencies": [\ - ["styled-components", "virtual:8ec4233c825b2c709f2ff549456a05fb98060d621f5df14748cda36fdb51190eccc2e438466f7464c85557cdad97eb73aa6580e78bca957a1149bfc58c6ddf34#npm:5.3.11"],\ + ["styled-components", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:5.3.11"],\ ["@babel/helper-module-imports", "npm:7.22.5"],\ ["@babel/traverse", "npm:7.22.11"],\ ["@emotion/is-prop-valid", "npm:1.2.1"],\ ["@emotion/stylis", "npm:0.8.5"],\ ["@emotion/unitless", "npm:0.7.5"],\ ["@types/react", "npm:18.2.21"],\ - ["@types/react-dom", "npm:18.2.7"],\ + ["@types/react-dom", null],\ ["@types/react-is", null],\ - ["babel-plugin-styled-components", "virtual:61097bbc169fab4637705d09a1bd9318cc1161163d1ff4744210fb91daa0a0f3cecb38cc5fe3ba2de304e631ca8700c2c15004e37b2b5d69e0e5d170a0576161#npm:2.1.4"],\ + ["babel-plugin-styled-components", "virtual:68a9a33632f1040438a32da064a66a3854f8d30087e3e2e5450720afc4e95cc10f141c96d079565a457e8f841886d95682d41d35df360e516a21dcf2746c9021#npm:2.1.4"],\ ["css-to-react-native", "npm:3.2.0"],\ ["hoist-non-react-statics", "npm:3.3.2"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"],\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"],\ ["react-is", "npm:18.2.0"],\ ["shallowequal", "npm:1.1.0"],\ ["supports-color", "npm:5.5.0"]\ diff --git a/apps/chooz/package.json b/apps/chooz/package.json index ef1f2f4c..8b008237 100644 --- a/apps/chooz/package.json +++ b/apps/chooz/package.json @@ -35,6 +35,7 @@ "@svgr/webpack": "^6.5.1", "@types/node": "20.5.7", "@types/react": "18.2.21", + "@types/styled-components": "^5", "typescript": "4.9.3" } } diff --git a/apps/jurumarble/package.json b/apps/jurumarble/package.json index 70cafe8c..a23384a3 100644 --- a/apps/jurumarble/package.json +++ b/apps/jurumarble/package.json @@ -14,6 +14,7 @@ "dependencies": { "@emotion/is-prop-valid": "^1.2.1", "@monorepo/hooks": "workspace:*", + "@monorepo/ui": "workspace:*", "@tanstack/react-query": "^4.33.0", "@tanstack/react-query-devtools": "^4.33.0", "axios": "^1.5.0", diff --git a/apps/jurumarble/src/lib/styles/StyledComponents.tsx b/apps/jurumarble/src/lib/styles/StyledComponents.tsx index 589a428e..ad61786f 100644 --- a/apps/jurumarble/src/lib/styles/StyledComponents.tsx +++ b/apps/jurumarble/src/lib/styles/StyledComponents.tsx @@ -2,30 +2,18 @@ import StyledComponentsRegistry from "lib/registory"; import { PropsWithChildren } from "react"; -import { StyleSheetManager, ThemeProvider } from "styled-components"; +import { ThemeProvider } from "styled-components"; import { jurumarbleTheme } from "./theme"; -import isPropValid from "@emotion/is-prop-valid"; import GlobalStyles from "./globalStyles"; +import { theme } from "@monorepo/ui"; function StyledComponents({ children }: PropsWithChildren) { return ( - {/* - @NOTE : 참고 https://styled-components.com/docs/api#stylesheetmanagers - porps를 전달할 때 isPropValid를 사용하여 styled-components에서 지원하지 않는 props를 제거한다. - */} - {/* { - return typeof elementToBeRendered === "string" ? isPropValid(propName) : true; - }} - > */} - - <> - - {children} - + + + {children} - {/* */} ); } diff --git a/packages/ui/package.json b/packages/ui/package.json index 527be9d3..ee1dd356 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -6,17 +6,17 @@ "main": "index.ts", "author": "", "license": "ISC", - "dependencies": { - "@monorepo/hooks": "workspace:*", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-is": "^18.2.0", - "styled-components": "^5.3.6" - }, "devDependencies": { "@types/node": "20.5.7", "@types/react": "18.2.21", "@types/styled-components": "^5", "typescript": "4.9.3" + }, + "peerDependencies": { + "@monorepo/hooks": "workspace:*", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-is": "^18.2.0", + "styled-components": "^5.3.6" } } diff --git a/yarn.lock b/yarn.lock index 1fe479fe..77007b3d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1561,6 +1561,7 @@ __metadata: "@tanstack/react-query-devtools": ^4.20.4 "@types/node": 20.5.7 "@types/react": 18.2.21 + "@types/styled-components": ^5 axios: ^1.3.2 babel-plugin-styled-components: ^2.0.7 babel-preset-next: ^1.4.0 @@ -1596,6 +1597,7 @@ __metadata: dependencies: "@emotion/is-prop-valid": ^1.2.1 "@monorepo/hooks": "workspace:*" + "@monorepo/ui": "workspace:*" "@svgr/cli": ^8.0.1 "@svgr/core": ^8.0.0 "@svgr/plugin-jsx": ^8.0.1 @@ -1624,15 +1626,16 @@ __metadata: version: 0.0.0-use.local resolution: "@monorepo/ui@workspace:packages/ui" dependencies: - "@monorepo/hooks": "workspace:*" "@types/node": 20.5.7 "@types/react": 18.2.21 "@types/styled-components": ^5 + typescript: 4.9.3 + peerDependencies: + "@monorepo/hooks": "workspace:*" react: ^18.2.0 react-dom: ^18.2.0 react-is: ^18.2.0 styled-components: ^5.3.6 - typescript: 4.9.3 languageName: unknown linkType: soft From 73a198f7ea5ec04c8268768652129b2b948d8c39 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=A2=E1=84=92=E1=85=A1?= Date: Tue, 12 Sep 2023 22:13:08 +0900 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20useState=EB=A5=BC=20=EC=82=AC?= =?UTF-8?q?=EC=9A=A9=ED=95=98=EC=A7=80=20=EC=95=8A=EA=B3=A0,=20setQueryDat?= =?UTF-8?q?a=EB=A5=BC=20=EC=9D=B4=EC=9A=A9=ED=95=98=EC=97=AC=20=EB=8D=B0?= =?UTF-8?q?=EC=9D=B4=ED=84=B0=EB=A5=BC=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/my/components/UserInfoContainer.tsx | 5 ++-- .../my/edit/services/useEditProfileService.ts | 6 ++-- apps/chooz/hooks/useGetUserInfo.ts | 29 ++++++++----------- 3 files changed, 17 insertions(+), 23 deletions(-) diff --git a/apps/chooz/app/my/components/UserInfoContainer.tsx b/apps/chooz/app/my/components/UserInfoContainer.tsx index 47f32b3a..e4e8c99b 100644 --- a/apps/chooz/app/my/components/UserInfoContainer.tsx +++ b/apps/chooz/app/my/components/UserInfoContainer.tsx @@ -10,9 +10,8 @@ import Image from "next/image"; function UserInfoContainer() { const { data: userInfo } = useGetUserInfo(); - if (!userInfo) return <>; - - const { gender, username, age, mbti, imageUrl } = userInfo; + if (!userInfo) return null; + const { gender, username, age, mbti, imageUrl } = userInfo!; return ( <> diff --git a/apps/chooz/app/my/edit/services/useEditProfileService.ts b/apps/chooz/app/my/edit/services/useEditProfileService.ts index e09b68e7..4f24ce81 100644 --- a/apps/chooz/app/my/edit/services/useEditProfileService.ts +++ b/apps/chooz/app/my/edit/services/useEditProfileService.ts @@ -10,12 +10,12 @@ export default function useEditProfileService() { const { categoryList, onClickCategory } = useClickCategory(); - const { userInfo, setUserInfo } = useGetUserInfo(); + const { data: userInfo, setUserInfo } = useGetUserInfo(); - const { username, mbti, imageUrl } = userInfo; + const { username, mbti, imageUrl } = userInfo!; const onChangeUsername = (e: React.ChangeEvent) => { - setUserInfo((prevUserInfo) => ({ ...prevUserInfo, username: e.target.value })); + setUserInfo({ ...userInfo, username: e.target.value }); }; const onChangeMbti = (value: string) => { diff --git a/apps/chooz/hooks/useGetUserInfo.ts b/apps/chooz/hooks/useGetUserInfo.ts index 3da5a42d..30fe7546 100644 --- a/apps/chooz/hooks/useGetUserInfo.ts +++ b/apps/chooz/hooks/useGetUserInfo.ts @@ -1,25 +1,20 @@ import { reactQueryKeys } from "lib/queryKeys"; -import { useQuery } from "@tanstack/react-query"; +import { useQuery, useQueryClient } from "@tanstack/react-query"; import { getUserInfo } from "lib/apis/user"; -import { useState } from "react"; +import { GetUserInfoResponse } from "types/user"; -export function useGetUserInfo() { - const [userInfo, setUserInfo] = useState({ - gender: "MALE", - username: "", - age: "", - mbti: "", - imageUrl: "", - }); +type SetUserInfoProps = Omit; +export function useGetUserInfo() { const { data } = useQuery(reactQueryKeys.userInfo(), getUserInfo, { - onSuccess: (data) => { - /** - * @Todo state를 사용 안하고 할 수 있는 방법 없을까? - */ - setUserInfo(data); - }, + suspense: true, }); - return { data, userInfo, setUserInfo }; + const qc = useQueryClient(); + + const setUserInfo = (userInfo: SetUserInfoProps) => { + qc.setQueryData(reactQueryKeys.userInfo(), userInfo); + }; + + return { data, setUserInfo }; } From c0e1c413899383590bd4d91a1a3beecf6f487b69 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=A2=E1=84=92=E1=85=A1?= Date: Tue, 12 Sep 2023 23:51:07 +0900 Subject: [PATCH 3/6] =?UTF-8?q?fix:=20=EB=94=94=EC=9E=90=EC=9D=B8=EC=9D=B4?= =?UTF-8?q?=20=EA=B9=A8=EC=A7=80=EB=8A=94=20=ED=98=84=EC=83=81=EC=9D=B4=20?= =?UTF-8?q?=EB=B0=9C=EC=83=9D=ED=95=B4=20=EC=9B=90=EC=9D=B8=20=ED=8C=8C?= =?UTF-8?q?=EC=95=85=EA=B9=8C=EC=A7=80=20=EC=A3=BC=EC=84=9D=20=EC=B2=98?= =?UTF-8?q?=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/chooz/app/my/components/VoteItemDesktop.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/apps/chooz/app/my/components/VoteItemDesktop.tsx b/apps/chooz/app/my/components/VoteItemDesktop.tsx index a0b82acb..24ce55e5 100644 --- a/apps/chooz/app/my/components/VoteItemDesktop.tsx +++ b/apps/chooz/app/my/components/VoteItemDesktop.tsx @@ -128,7 +128,10 @@ const Message = styled.span` display: flex; align-items: center; justify-content: center; - width: 46px; + /** + * 디자인이 깨져 임시 주석처리 + * width: 46px; + */ padding: 4px 6px; border-radius: 4px; ${({ theme }) => css` From 3527bd5bcc7c3cbc3e9a22776bc7e767f85d2a35 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=A2=E1=84=92=E1=85=A1?= Date: Tue, 12 Sep 2023 23:53:36 +0900 Subject: [PATCH 4/6] =?UTF-8?q?feat:=20=EB=A1=9C=EB=94=A9,=20=EC=97=90?= =?UTF-8?q?=EB=9F=AC=20=EB=B0=94=EC=9A=B4=EB=8D=94=EB=A6=AC=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/chooz/app/my/page.tsx | 7 ++++-- apps/chooz/lib/AsyncBoundary.tsx | 10 ++++++++ apps/chooz/lib/ErrorBoundary.tsx | 41 ++++++++++++++++++++++++++++++++ 3 files changed, 56 insertions(+), 2 deletions(-) create mode 100644 apps/chooz/lib/AsyncBoundary.tsx create mode 100644 apps/chooz/lib/ErrorBoundary.tsx diff --git a/apps/chooz/app/my/page.tsx b/apps/chooz/app/my/page.tsx index da019e85..dddf01ee 100644 --- a/apps/chooz/app/my/page.tsx +++ b/apps/chooz/app/my/page.tsx @@ -2,7 +2,7 @@ import { media } from "@monorepo/ui/styles/media"; import { MY_PAGE_VOTE_TYPE } from "lib/constants"; -import { useState } from "react"; +import { Suspense, useState } from "react"; import styled, { css } from "styled-components"; import TabContainer from "./components/TabContainer"; import VoteList from "./components/VoteList"; @@ -10,6 +10,7 @@ import CountVoteContainer from "./components/VoteCountContainer"; import { MyVoteListType } from "types/my"; import useInfiniteMyVoteListService from "./services/useInfiniteMyPageVoteListService"; import UserInfoContainer from "./components/UserInfoContainer"; +import { AsyncBoundary } from "../../lib/AsyncBoundary"; function MyPage() { const [selectedTab, setSelectedTab] = useState("created"); @@ -26,7 +27,9 @@ function MyPage() { return ( - + + + diff --git a/apps/chooz/lib/AsyncBoundary.tsx b/apps/chooz/lib/AsyncBoundary.tsx new file mode 100644 index 00000000..1ba9ae19 --- /dev/null +++ b/apps/chooz/lib/AsyncBoundary.tsx @@ -0,0 +1,10 @@ +import { PropsWithChildren, Suspense } from "react"; +import GlobalErrorBoundary from "./ErrorBoundary"; + +export const AsyncBoundary = ({ children }: PropsWithChildren) => { + return ( + }> + }>{children} + + ); +}; diff --git a/apps/chooz/lib/ErrorBoundary.tsx b/apps/chooz/lib/ErrorBoundary.tsx new file mode 100644 index 00000000..354789eb --- /dev/null +++ b/apps/chooz/lib/ErrorBoundary.tsx @@ -0,0 +1,41 @@ +import type { ErrorInfo, ReactNode } from "react"; +import { Component } from "react"; + +interface State { + hasError: boolean; +} + +interface Props { + errorComponent: ReactNode; + children: ReactNode; + /** + * onError에서 callback으로 받은 error, errorInfo를 이용하여 에러를 수집합니다. + * ex) sentry, datadog 등 + * */ + onError?: (error: Error, errorInfo: ErrorInfo) => void; +} + +class GlobalErrorBoundary extends Component { + constructor(props: Props) { + super(props); + this.state = { hasError: false }; + } + + static getDerivedStateFromError(_: Error): State { + return { hasError: true }; + } + + componentDidCatch(error: Error, errorInfo: ErrorInfo): void { + this.props.onError?.(error, errorInfo); + } + + render(): ReactNode { + if (this.state.hasError) { + return this.props.errorComponent; + } + + return this.props.children; + } +} + +export default GlobalErrorBoundary; From b5b01c86df1b7d4d993afa810456d7e1188c9208 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=A2=E1=84=92=E1=85=A1?= Date: Sat, 16 Sep 2023 02:22:52 +0900 Subject: [PATCH 5/6] =?UTF-8?q?fix:=20styled-components=20=EB=9D=BC?= =?UTF-8?q?=EC=9D=B4=EB=B8=8C=EB=9F=AC=EB=A6=AC=EC=99=80=20=EC=9D=B4?= =?UTF-8?q?=EB=A6=84=EC=9D=B4=20=EC=A4=91=EB=B3=B5=EB=90=98=EB=8A=94=20?= =?UTF-8?q?=EB=B2=84=EA=B7=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .pnp.cjs | 2 +- packages/ui/{styled-components.d.ts => styled.d.ts} | 0 2 files changed, 1 insertion(+), 1 deletion(-) rename packages/ui/{styled-components.d.ts => styled.d.ts} (100%) diff --git a/.pnp.cjs b/.pnp.cjs index 3ddadf37..2f7a7d9a 100755 --- a/.pnp.cjs +++ b/.pnp.cjs @@ -7265,7 +7265,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) { ["@types/react-dom", "npm:18.2.7"],\ ["clsx", "npm:1.2.1"],\ ["react", "npm:18.2.0"],\ - ["react-dom", "virtual:040d27df013de8c2443d97cd34785bd6338b0d64a4a625937768b1a38353fca7b8404d53a1248b5c67570c2a031bc43d100149c15012f4485eb41e15d763240d#npm:18.2.0"]\ + ["react-dom", "virtual:a9e685c95fc9c2c05e15b14465ecc20924383932b7a1aa62172e110ba174ebedc352c8daf5023eb54ef5f0a5595ca6cf8763ef2477e003ebd1850bfb16231d67#npm:18.2.0"]\ ],\ "packagePeers": [\ "@types/react-dom",\ diff --git a/packages/ui/styled-components.d.ts b/packages/ui/styled.d.ts similarity index 100% rename from packages/ui/styled-components.d.ts rename to packages/ui/styled.d.ts From b9795bc8bae88cf09be9fd440bd2900a79363d4d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E1=84=8B=E1=85=B5=E1=84=8C=E1=85=A2=E1=84=92=E1=85=A1?= Date: Sat, 16 Sep 2023 02:24:58 +0900 Subject: [PATCH 6/6] =?UTF-8?q?refactor:=20=EB=8B=A4=EB=A5=B8=20=EC=9B=8C?= =?UTF-8?q?=ED=81=AC=EC=8A=A4=ED=8E=98=EC=9D=B4=EC=8A=A4=EC=97=90=EB=8F=84?= =?UTF-8?q?=20=EB=8F=99=EC=9D=BC=ED=95=9C=20=EB=84=A4=EC=9D=B4=EB=B0=8D?= =?UTF-8?q?=EC=9D=84=20=EC=82=AC=EC=9A=A9=ED=95=98=EB=8A=94=20=EC=95=88?= =?UTF-8?q?=ED=8B=B0=20=ED=8C=A8=ED=84=B4=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/chooz/{styled-compoenets.d.ts => types/styled.d.ts} | 0 .../{lib/styles/styled-components.d.ts => types/styled.d.ts} | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) rename apps/chooz/{styled-compoenets.d.ts => types/styled.d.ts} (100%) rename apps/jurumarble/src/{lib/styles/styled-components.d.ts => types/styled.d.ts} (70%) diff --git a/apps/chooz/styled-compoenets.d.ts b/apps/chooz/types/styled.d.ts similarity index 100% rename from apps/chooz/styled-compoenets.d.ts rename to apps/chooz/types/styled.d.ts diff --git a/apps/jurumarble/src/lib/styles/styled-components.d.ts b/apps/jurumarble/src/types/styled.d.ts similarity index 70% rename from apps/jurumarble/src/lib/styles/styled-components.d.ts rename to apps/jurumarble/src/types/styled.d.ts index d92e116c..186f12b3 100644 --- a/apps/jurumarble/src/lib/styles/styled-components.d.ts +++ b/apps/jurumarble/src/types/styled.d.ts @@ -1,5 +1,5 @@ import "styled-components"; -import { ThemeColors, ThemeMedia, ThemeTypography } from "./theme"; +import { ThemeColors, ThemeMedia, ThemeTypography } from "../lib/styles/theme"; declare module "styled-components" { export interface DefaultTheme {