diff --git a/next.config.js b/next.config.js index 767719fc..17549b91 100644 --- a/next.config.js +++ b/next.config.js @@ -1,4 +1,8 @@ /** @type {import('next').NextConfig} */ -const nextConfig = {} +const nextConfig = { + images: { + domains: ['cdn.cetizen.com'], + }, +} module.exports = nextConfig diff --git a/package.json b/package.json index e5e8ea5e..2d9b1989 100644 --- a/package.json +++ b/package.json @@ -59,6 +59,7 @@ "@types/react-dom": "^18", "@types/tailwindcss": "^3.1.0", "chromatic": "^7.5.4", + "encoding": "^0.1.13", "eslint": "^8", "eslint-config-next": "13.5.6", "eslint-plugin-storybook": "^0.6.15", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6d6a00a6..82ce7db2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -19,10 +19,10 @@ dependencies: version: 1.3.0(react@18.0.0) '@radix-ui/react-label': specifier: ^2.0.2 - version: 2.0.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) + version: 2.0.2(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@radix-ui/react-select': specifier: ^2.0.0 - version: 2.0.2(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + version: 2.0.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@radix-ui/react-slot': specifier: ^1.0.2 version: 1.0.2(@types/react@18.2.33)(react@18.0.0) @@ -47,12 +47,12 @@ dependencies: clsx: specifier: ^2.0.0 version: 2.0.0 - lucide-react: - specifier: ^0.291.0 - version: 0.291.0(react@18.0.0) date-fns: specifier: ^2.30.0 version: 2.30.0 + lucide-react: + specifier: ^0.291.0 + version: 0.291.0(react@18.0.0) next: specifier: 13.5.6 version: 13.5.6(@babel/core@7.23.2)(react-dom@18.0.0)(react@18.0.0) @@ -87,28 +87,28 @@ dependencies: devDependencies: '@storybook/addon-essentials': specifier: 7.5.0 - version: 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + version: 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-interactions': specifier: 7.5.0 - version: 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + version: 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-links': specifier: 7.5.0 version: 7.5.0(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-onboarding': specifier: 1.0.8 - version: 1.0.8(react-dom@18.0.0)(react@18.0.0) + version: 1.0.8(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-styling': specifier: ^1.3.7 - version: 1.3.7(@types/react-dom@18.0.0)(@types/react@18.2.33)(less@4.2.0)(postcss@8.0.0)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0) + version: 1.3.7(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(less@4.2.0)(postcss@8.0.0)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0) '@storybook/blocks': specifier: 7.5.0 - version: 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + version: 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/nextjs': specifier: 7.5.0 - version: 7.5.0(@swc/core@1.3.95)(@types/react-dom@18.0.0)(@types/react@18.2.33)(esbuild@0.18.20)(next@13.5.6)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0) + version: 7.5.0(@swc/core@1.3.95)(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(esbuild@0.18.20)(next@13.5.6)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0) '@storybook/react': specifier: 7.5.0 - version: 7.5.0(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) + version: 7.5.0(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) '@storybook/testing-library': specifier: 0.2.2 version: 0.2.2 @@ -136,6 +136,9 @@ devDependencies: chromatic: specifier: ^7.5.4 version: 7.5.4 + encoding: + specifier: ^0.1.13 + version: 0.1.13 eslint: specifier: ^8 version: 8.0.0 @@ -153,7 +156,7 @@ devDependencies: version: 15.0.2 msw: specifier: ^1.3.2 - version: 1.3.2(typescript@5.2.2) + version: 1.3.2(encoding@0.1.13)(typescript@5.2.2) postcss: specifier: ^8.0.0 version: 8.0.0 @@ -162,7 +165,7 @@ devDependencies: version: 3.0.3 storybook: specifier: 7.5.0 - version: 7.5.0 + version: 7.5.0(encoding@0.1.13) storybook-dark-mode: specifier: ^3.0.1 version: 3.0.1(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) @@ -2765,7 +2768,7 @@ packages: react-remove-scroll: 2.5.5(@types/react@18.2.33)(react@18.0.0) dev: true - /@radix-ui/react-select@2.0.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0): + /@radix-ui/react-select@2.0.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-RH5b7af4oHtkcHS7pG6Sgv5rk5Wxa7XI8W5gvB1N/yiuDGZxko1ynvOiVhFM7Cis2A8zxF9bTOUVbRDzPepe6w==} peerDependencies: '@types/react': '*' @@ -2781,30 +2784,31 @@ packages: '@babel/runtime': 7.23.2 '@radix-ui/number': 1.0.1 '@radix-ui/primitive': 1.0.1 - '@radix-ui/react-collection': 1.0.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-context': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-direction': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-dismissable-layer': 1.0.5(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@radix-ui/react-focus-guards': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-focus-scope': 1.0.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@radix-ui/react-id': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-popper': 1.1.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@radix-ui/react-portal': 1.0.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@radix-ui/react-slot': 1.0.2(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-use-previous': 1.0.1(@types/react@18.0.0)(react@18.0.0) - '@radix-ui/react-visually-hidden': 1.0.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0) - '@types/react': 18.0.0 + '@radix-ui/react-collection': 1.0.3(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-direction': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-dismissable-layer': 1.0.5(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@radix-ui/react-focus-guards': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-focus-scope': 1.0.4(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@radix-ui/react-id': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-popper': 1.1.3(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@radix-ui/react-portal': 1.0.4(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@radix-ui/react-slot': 1.0.2(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-use-previous': 1.0.1(@types/react@18.2.33)(react@18.0.0) + '@radix-ui/react-visually-hidden': 1.0.3(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@types/react': 18.2.33 '@types/react-dom': 18.0.0 aria-hidden: 1.2.3 react: 18.0.0 react-dom: 18.0.0(react@18.0.0) - react-remove-scroll: 2.5.5(@types/react@18.0.0)(react@18.0.0) + react-remove-scroll: 2.5.5(@types/react@18.2.33)(react@18.0.0) dev: false + /@radix-ui/react-separator@1.0.3(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-itYmTy/kokS21aiV5+Z56MZB54KrhPgn6eHDKkFeOLR34HMN2s8PaN47qZZAGnvupcjxHaFZnW4pQEh0BvvVuw==} peerDependencies: @@ -3162,7 +3166,7 @@ packages: - '@types/react-dom' dev: true - /@storybook/addon-controls@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): + /@storybook/addon-controls@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-X56Pd+0GH1A8ddVsziJQaJ8qCaxsWK0aLCKH5li9GLtnyIGHvd5+KvvfYEbjTkeJv3d9J7X0D4uTAH1/dsmI8w==} peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 @@ -3173,10 +3177,10 @@ packages: react-dom: optional: true dependencies: - '@storybook/blocks': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@storybook/blocks': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/client-logger': 7.5.0 '@storybook/components': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/core-events': 7.5.0 '@storybook/manager-api': 7.5.0(react-dom@18.0.0)(react@18.0.0) '@storybook/node-logger': 7.5.0 @@ -3194,7 +3198,7 @@ packages: - supports-color dev: true - /@storybook/addon-docs@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): + /@storybook/addon-docs@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-lgrum81iJT+i85kO3uOR4wR1t05x4SmJLCB2cyYohCIafiOiV4FuyYFhvT9N6UhHByOfrWgpipKgKg6zsmV2eg==} peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 @@ -3202,7 +3206,7 @@ packages: dependencies: '@jest/transform': 29.7.0 '@mdx-js/react': 2.3.0(react@18.0.0) - '@storybook/blocks': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@storybook/blocks': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/client-logger': 7.5.0 '@storybook/components': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@storybook/csf-plugin': 7.5.0 @@ -3228,7 +3232,7 @@ packages: - supports-color dev: true - /@storybook/addon-essentials@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): + /@storybook/addon-essentials@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-CKPHdQBP6psTVb3NHsP8cWSUcAA4kwzT8SrJxKddn4ecqmWJWeZo5g5y3WuqVQHlv3edpluJLQYehcVibcljag==} peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 @@ -3236,14 +3240,14 @@ packages: dependencies: '@storybook/addon-actions': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-backgrounds': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/addon-controls': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/addon-docs': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) + '@storybook/addon-controls': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) + '@storybook/addon-docs': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-highlight': 7.5.0 '@storybook/addon-measure': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-outline': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-toolbars': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@storybook/addon-viewport': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/manager-api': 7.5.0(react-dom@18.0.0)(react@18.0.0) '@storybook/node-logger': 7.5.0 '@storybook/preview-api': 7.5.0 @@ -3265,7 +3269,7 @@ packages: '@storybook/preview-api': 7.5.0 dev: true - /@storybook/addon-interactions@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): + /@storybook/addon-interactions@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-OnmFJdzoww8jhiaxY/C/tmppkMRna6f4FKrhqeBytXRai8/PmH+a6tbjrKD8ywtAIt+1MVIxY/oXxXulHtBv8Q==} peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 @@ -3278,7 +3282,7 @@ packages: dependencies: '@storybook/client-logger': 7.5.0 '@storybook/components': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/core-events': 7.5.0 '@storybook/global': 5.0.0 '@storybook/instrumenter': 7.5.0 @@ -3349,13 +3353,13 @@ packages: - '@types/react-dom' dev: true - /@storybook/addon-onboarding@1.0.8(react-dom@18.0.0)(react@18.0.0): + /@storybook/addon-onboarding@1.0.8(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-3WwCocUuTibHWO89uzAbeONEn6x9NkmxA0mOU4rYPhEsMQ4NDNDD1GXcievZmpwt5VviFgw5FRx8+BxPn54YmQ==} peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 dependencies: - '@storybook/telemetry': 7.5.2 + '@storybook/telemetry': 7.5.2(encoding@0.1.13) react: 18.0.0 react-confetti: 6.1.0(react@18.0.0) react-dom: 18.0.0(react@18.0.0) @@ -3390,7 +3394,7 @@ packages: - '@types/react-dom' dev: true - /@storybook/addon-styling@1.3.7(@types/react-dom@18.0.0)(@types/react@18.2.33)(less@4.2.0)(postcss@8.0.0)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0): + /@storybook/addon-styling@1.3.7(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(less@4.2.0)(postcss@8.0.0)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0): resolution: {integrity: sha512-JSBZMOrSw/3rlq5YoEI7Qyq703KSNP0Jd+gxTWu3/tP6245mpjn2dXnR8FvqVxCi+FG4lt2kQyPzgsuwEw1SSA==} hasBin: true peerDependencies: @@ -3415,7 +3419,7 @@ packages: '@babel/types': 7.23.0 '@storybook/api': 7.5.2(react-dom@18.0.0)(react@18.0.0) '@storybook/components': 7.5.2(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/core-common': 7.5.2 + '@storybook/core-common': 7.5.2(encoding@0.1.13) '@storybook/core-events': 7.5.2 '@storybook/manager-api': 7.5.2(react-dom@18.0.0)(react@18.0.0) '@storybook/node-logger': 7.5.2 @@ -3526,7 +3530,7 @@ packages: react-dom: 18.0.0(react@18.0.0) dev: true - /@storybook/blocks@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0): + /@storybook/blocks@7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0): resolution: {integrity: sha512-4poS7lQVKhitWKl0TPECMszOMtNamsbNvZdAZ188U/p1EzTrqLg+RT9HtsB8q8Y0owx29Nh5LdfhNOddpx23ig==} peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 @@ -3537,7 +3541,7 @@ packages: '@storybook/components': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) '@storybook/core-events': 7.5.0 '@storybook/csf': 0.1.1 - '@storybook/docs-tools': 7.5.0 + '@storybook/docs-tools': 7.5.0(encoding@0.1.13) '@storybook/global': 5.0.0 '@storybook/manager-api': 7.5.0(react-dom@18.0.0)(react@18.0.0) '@storybook/preview-api': 7.5.0 @@ -3564,11 +3568,11 @@ packages: - supports-color dev: true - /@storybook/builder-manager@7.5.0: + /@storybook/builder-manager@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-nj+n36i7Mds4RIyGJqvOB+Z47zfgbMes+6Gd6reT1vC22Yda5nAITnd2vxbYfv/sUPhIBBfuFZ/eogomgYCjKg==} dependencies: '@fal-works/esbuild-plugin-global-externals': 2.1.2 - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/manager': 7.5.0 '@storybook/node-logger': 7.5.0 '@types/ejs': 3.1.4 @@ -3588,7 +3592,7 @@ packages: - supports-color dev: true - /@storybook/builder-webpack5@7.5.0(esbuild@0.18.20)(typescript@5.2.2): + /@storybook/builder-webpack5@7.5.0(encoding@0.1.13)(esbuild@0.18.20)(typescript@5.2.2): resolution: {integrity: sha512-bZRIkJCLdwiPZIUIE5NxEHF+gTO/+4AB/t5/w7UnBhuydDgFStY3cBJHC7wp3crgRuNd4eZJYb2YCqcD/hAgVQ==} peerDependencies: typescript: '*' @@ -3599,9 +3603,9 @@ packages: '@babel/core': 7.23.2 '@storybook/channels': 7.5.0 '@storybook/client-logger': 7.5.0 - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/core-events': 7.5.0 - '@storybook/core-webpack': 7.5.0 + '@storybook/core-webpack': 7.5.0(encoding@0.1.13) '@storybook/node-logger': 7.5.0 '@storybook/preview': 7.5.0 '@storybook/preview-api': 7.5.0 @@ -3664,7 +3668,7 @@ packages: tiny-invariant: 1.3.1 dev: true - /@storybook/cli@7.5.0: + /@storybook/cli@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-f14q6sqHhDf7bFS0o/ZTgN2tM00Q0cMGMmGFXTQSCh0HXJUS4ujy/FADL+x62wUylIdr1HkIw+ONWMMqHuenEA==} hasBin: true dependencies: @@ -3673,12 +3677,12 @@ packages: '@babel/types': 7.23.0 '@ndelangen/get-tarball': 3.0.9 '@storybook/codemod': 7.5.0 - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/core-events': 7.5.0 - '@storybook/core-server': 7.5.0 + '@storybook/core-server': 7.5.0(encoding@0.1.13) '@storybook/csf-tools': 7.5.0 '@storybook/node-logger': 7.5.0 - '@storybook/telemetry': 7.5.0 + '@storybook/telemetry': 7.5.0(encoding@0.1.13) '@storybook/types': 7.5.0 '@types/semver': 7.5.4 '@yarnpkg/fslib': 2.10.3 @@ -3808,7 +3812,7 @@ packages: '@storybook/preview-api': 7.5.0 dev: true - /@storybook/core-common@7.5.0: + /@storybook/core-common@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-Gw3/rzRb5+XbwqBcr2ZNaIYGEp+WNTwaBOnMs4yp2SCrNIb0P+i3BxlVQdgABaq43EI3/bksowT6hei0jyhGhw==} dependencies: '@storybook/core-events': 7.5.0 @@ -3828,7 +3832,7 @@ packages: glob: 10.3.10 handlebars: 4.7.8 lazy-universal-dotenv: 4.0.0 - node-fetch: 2.7.0 + node-fetch: 2.7.0(encoding@0.1.13) picomatch: 2.3.1 pkg-dir: 5.0.0 pretty-hrtime: 1.0.3 @@ -3839,7 +3843,7 @@ packages: - supports-color dev: true - /@storybook/core-common@7.5.2: + /@storybook/core-common@7.5.2(encoding@0.1.13): resolution: {integrity: sha512-js7fIH4wHS08dBuIVsr3JnwMtKn5O1Izc/Zor4t6PntLWkGGX4X/GxbOkasGX5SkCT1qUtB9RpdPd1sUkLhIgw==} dependencies: '@storybook/core-events': 7.5.2 @@ -3859,7 +3863,7 @@ packages: glob: 10.3.10 handlebars: 4.7.8 lazy-universal-dotenv: 4.0.0 - node-fetch: 2.7.0 + node-fetch: 2.7.0(encoding@0.1.13) picomatch: 2.3.1 pkg-dir: 5.0.0 pretty-hrtime: 1.0.3 @@ -3882,14 +3886,14 @@ packages: ts-dedent: 2.2.0 dev: true - /@storybook/core-server@7.5.0: + /@storybook/core-server@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-7QT8uzwSJOsv9PASQ6ywepYkcEYFB7+S7Cj/0nFMh3Vl9vW96LXvEHLAo9CUhSxdEKWeTnD8DS5+j90dLhQFCA==} dependencies: '@aw-web-design/x-default-browser': 1.4.126 '@discoveryjs/json-ext': 0.5.7 - '@storybook/builder-manager': 7.5.0 + '@storybook/builder-manager': 7.5.0(encoding@0.1.13) '@storybook/channels': 7.5.0 - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/core-events': 7.5.0 '@storybook/csf': 0.1.1 '@storybook/csf-tools': 7.5.0 @@ -3898,7 +3902,7 @@ packages: '@storybook/manager': 7.5.0 '@storybook/node-logger': 7.5.0 '@storybook/preview-api': 7.5.0 - '@storybook/telemetry': 7.5.0 + '@storybook/telemetry': 7.5.0(encoding@0.1.13) '@storybook/types': 7.5.0 '@types/detect-port': 1.3.4 '@types/node': 18.18.8 @@ -3933,10 +3937,10 @@ packages: - utf-8-validate dev: true - /@storybook/core-webpack@7.5.0: + /@storybook/core-webpack@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-TI83kG5k2PIjOc+QAOHy0GxOjeLE/TQKFji/+40QJzS7h2+eJTRrO7q32Vo+IyXrkHYlwHk4KrF2LqgYQL8HaQ==} dependencies: - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/node-logger': 7.5.0 '@storybook/types': 7.5.0 '@types/node': 18.18.8 @@ -4003,10 +4007,10 @@ packages: resolution: {integrity: sha512-JDaBR9lwVY4eSH5W8EGHrhODjygPd6QImRbwjAuJNEnY0Vw4ie3bPkeGfnacB3OBW6u/agqPv2aRlR46JcAQLg==} dev: true - /@storybook/docs-tools@7.5.0: + /@storybook/docs-tools@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-NFhqbXj6Wv5YypMwDkt0z9xcfWD7M3wZhr8Z9XcXDlUUPjBrdv0cHt3rfHwEXpTfFyunbK41KQZZ3JkjiAjgTg==} dependencies: - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/preview-api': 7.5.0 '@storybook/types': 7.5.0 '@types/doctrine': 0.0.3 @@ -4089,7 +4093,7 @@ packages: resolution: {integrity: sha512-TXJJd5RAKakWx4BtpwvSNdgTDkKM6RkXU8GK34S/LhidQ5Pjz3wcnqb0TxEkfhK/ztbP8nKHqXFwLfa2CYkvQw==} dev: true - /@storybook/nextjs@7.5.0(@swc/core@1.3.95)(@types/react-dom@18.0.0)(@types/react@18.2.33)(esbuild@0.18.20)(next@13.5.6)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0): + /@storybook/nextjs@7.5.0(@swc/core@1.3.95)(@types/react-dom@18.0.0)(@types/react@18.2.33)(encoding@0.1.13)(esbuild@0.18.20)(next@13.5.6)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2)(webpack@5.89.0): resolution: {integrity: sha512-uMYD0yHc/TlfSPWhsD5zpsjbuwwRSE6AbNqYOaqwPLJewQGpL9KjYFMUFg6IZItv7JKmOVSeVKg+P2dUWhoFDA==} engines: {node: '>=16.0.0'} peerDependencies: @@ -4123,13 +4127,13 @@ packages: '@babel/preset-typescript': 7.23.2(@babel/core@7.23.2) '@babel/runtime': 7.23.2 '@storybook/addon-actions': 7.5.0(@types/react-dom@18.0.0)(@types/react@18.2.33)(react-dom@18.0.0)(react@18.0.0) - '@storybook/builder-webpack5': 7.5.0(esbuild@0.18.20)(typescript@5.2.2) - '@storybook/core-common': 7.5.0 + '@storybook/builder-webpack5': 7.5.0(encoding@0.1.13)(esbuild@0.18.20)(typescript@5.2.2) + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/core-events': 7.5.0 '@storybook/node-logger': 7.5.0 - '@storybook/preset-react-webpack': 7.5.0(@babel/core@7.23.2)(@swc/core@1.3.95)(esbuild@0.18.20)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) + '@storybook/preset-react-webpack': 7.5.0(@babel/core@7.23.2)(@swc/core@1.3.95)(encoding@0.1.13)(esbuild@0.18.20)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) '@storybook/preview-api': 7.5.0 - '@storybook/react': 7.5.0(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) + '@storybook/react': 7.5.0(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) '@types/node': 18.18.8 css-loader: 6.8.1(webpack@5.89.0) find-up: 5.0.0 @@ -4188,7 +4192,7 @@ packages: resolution: {integrity: sha512-SHpBItwar7qDZO7BBSqTNQK0yNy+RUROZUhW6wlVvsgVhIGF1bgA4pgpW1iMyfPmmGyNekE1BJjN+v8rjq9s6A==} dev: true - /@storybook/preset-react-webpack@7.5.0(@babel/core@7.23.2)(@swc/core@1.3.95)(esbuild@0.18.20)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2): + /@storybook/preset-react-webpack@7.5.0(@babel/core@7.23.2)(@swc/core@1.3.95)(encoding@0.1.13)(esbuild@0.18.20)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2): resolution: {integrity: sha512-LqrcyVpkMDxJ/+8Jay9rxNoNuCc4fDq3r6m2je6BKhw4pcxq4Q4iK5GA7hIHpYXaiFzLtSgxb3RO4Z8RNvntug==} engines: {node: '>=16.0.0'} peerDependencies: @@ -4206,10 +4210,10 @@ packages: '@babel/preset-flow': 7.22.15(@babel/core@7.23.2) '@babel/preset-react': 7.22.15(@babel/core@7.23.2) '@pmmmwh/react-refresh-webpack-plugin': 0.5.11(react-refresh@0.11.0)(webpack@5.89.0) - '@storybook/core-webpack': 7.5.0 - '@storybook/docs-tools': 7.5.0 + '@storybook/core-webpack': 7.5.0(encoding@0.1.13) + '@storybook/docs-tools': 7.5.0(encoding@0.1.13) '@storybook/node-logger': 7.5.0 - '@storybook/react': 7.5.0(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) + '@storybook/react': 7.5.0(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2) '@storybook/react-docgen-typescript-plugin': 1.0.6--canary.9.0c3f3b7.0(typescript@5.2.2)(webpack@5.89.0) '@types/node': 18.18.8 '@types/semver': 7.5.4 @@ -4308,7 +4312,7 @@ packages: react-dom: 18.0.0(react@18.0.0) dev: true - /@storybook/react@7.5.0(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2): + /@storybook/react@7.5.0(encoding@0.1.13)(react-dom@18.0.0)(react@18.0.0)(typescript@5.2.2): resolution: {integrity: sha512-1oD8sYqBZwtfBKR8zZqfhjRong4wN/4PLYMzs5wl4kYugNOeauD8zWSztnIorxzDrl2yjpwnWlRy9wXN/8FI8g==} engines: {node: '>=16.0.0'} peerDependencies: @@ -4321,7 +4325,7 @@ packages: dependencies: '@storybook/client-logger': 7.5.0 '@storybook/core-client': 7.5.0 - '@storybook/docs-tools': 7.5.0 + '@storybook/docs-tools': 7.5.0(encoding@0.1.13) '@storybook/global': 5.0.0 '@storybook/preview-api': 7.5.0 '@storybook/react-dom-shim': 7.5.0(react-dom@18.0.0)(react@18.0.0) @@ -4374,11 +4378,11 @@ packages: react-dom: 18.0.0(react@18.0.0) dev: true - /@storybook/telemetry@7.5.0: + /@storybook/telemetry@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-dvc1cjxHYGNfLEvh8eQI/R2KtMft0kUs6TJ2uXZdIX4+WqWG6mfn75sP8eyC1tcjkdslS6AmFWTfgt9EVcIPQA==} dependencies: '@storybook/client-logger': 7.5.0 - '@storybook/core-common': 7.5.0 + '@storybook/core-common': 7.5.0(encoding@0.1.13) '@storybook/csf-tools': 7.5.0 chalk: 4.1.2 detect-package-manager: 2.0.1 @@ -4390,11 +4394,11 @@ packages: - supports-color dev: true - /@storybook/telemetry@7.5.2: + /@storybook/telemetry@7.5.2(encoding@0.1.13): resolution: {integrity: sha512-tUgrcIx1vTMhTySp11JbBnWLsaMUNlil5yuOWEJy5i71E4Xy/2hYUtLfxzgXWd/0W7eTl4p2tjUk9uS8AP+S0Q==} dependencies: '@storybook/client-logger': 7.5.2 - '@storybook/core-common': 7.5.2 + '@storybook/core-common': 7.5.2(encoding@0.1.13) '@storybook/csf-tools': 7.5.2 chalk: 4.1.2 detect-package-manager: 2.0.1 @@ -6939,6 +6943,12 @@ packages: engines: {node: '>= 0.8'} dev: true + /encoding@0.1.13: + resolution: {integrity: sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==} + dependencies: + iconv-lite: 0.6.3 + dev: true + /end-of-stream@1.4.4: resolution: {integrity: sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==} dependencies: @@ -8357,7 +8367,6 @@ packages: dependencies: safer-buffer: 2.1.2 dev: true - optional: true /icss-utils@5.1.0(postcss@8.4.31): resolution: {integrity: sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==} @@ -9522,7 +9531,7 @@ packages: resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} dev: true - /msw@1.3.2(typescript@5.2.2): + /msw@1.3.2(encoding@0.1.13)(typescript@5.2.2): resolution: {integrity: sha512-wKLhFPR+NitYTkQl5047pia0reNGgf0P6a1eTnA5aNlripmiz0sabMvvHcicE8kQ3/gZcI0YiPFWmYfowfm3lA==} engines: {node: '>=14'} hasBin: true @@ -9546,7 +9555,7 @@ packages: inquirer: 8.2.6 is-node-process: 1.2.0 js-levenshtein: 1.1.6 - node-fetch: 2.7.0 + node-fetch: 2.7.0(encoding@0.1.13) outvariant: 1.4.0 path-to-regexp: 6.2.1 strict-event-emitter: 0.4.6 @@ -9673,7 +9682,7 @@ packages: resolution: {integrity: sha512-NsXBU0UgBxo2rQLOeWNZqS3fvflWePMECr8CoSWoSTqCqGbVVsvl9vZu1HfQicYN0g5piV9Gh8RTEvo/uP752w==} dev: true - /node-fetch@2.7.0: + /node-fetch@2.7.0(encoding@0.1.13): resolution: {integrity: sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==} engines: {node: 4.x || >=6.0.0} peerDependencies: @@ -9682,6 +9691,7 @@ packages: encoding: optional: true dependencies: + encoding: 0.1.13 whatwg-url: 5.0.0 dev: true @@ -11435,11 +11445,11 @@ packages: - '@types/react-dom' dev: true - /storybook@7.5.0: + /storybook@7.5.0(encoding@0.1.13): resolution: {integrity: sha512-dmvQNSuoHq1KrPcK8siApBi5n5reSf6RFAlLHYD+nhM+EP6SL2fXdVjP6ZynTUMRu1NQ5YR/oJhz/SsBzJNkcA==} hasBin: true dependencies: - '@storybook/cli': 7.5.0 + '@storybook/cli': 7.5.0(encoding@0.1.13) transitivePeerDependencies: - bufferutil - encoding diff --git a/public/images/arrow-left.svg b/public/images/arrow-left.svg new file mode 100644 index 00000000..bba35abb --- /dev/null +++ b/public/images/arrow-left.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/images/filter.svg b/public/images/filter.svg new file mode 100644 index 00000000..55db514a --- /dev/null +++ b/public/images/filter.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/app/(root)/(routes)/items/components/Item-list/ItemList.tsx b/src/app/(root)/(routes)/items/components/Item-list/ItemList.tsx new file mode 100644 index 00000000..4d644fe6 --- /dev/null +++ b/src/app/(root)/(routes)/items/components/Item-list/ItemList.tsx @@ -0,0 +1,67 @@ +import Image from 'next/image' +import TradeStateCard from '@/components/domain/card/trade-state-card' +import Assets from '@/config/assets' +import { Item } from '@/types' +import SearchInput from '../search-input' + +const list = [ + { + _id: 1, // 내려줄 때 리스트 순서 + cardId: 1, + cardTitle: '아이폰 16 팝니다', + itemName: '아이폰 16', + createdAt: '2023-11-01T08:08:00', + modifiedAt: '2023-11-01T08:08:00', + dibCount: 19, + priceRange: '10000-50000', + image: + 'https://cdn.cetizen.com/CDN/market/market_large_crop/202203/20220318/220318152808_1_2913635.jpg', + tradeState: 'impossible', + }, + { + _id: 2, // 내려줄 때 리스트 순서 + cardId: 1, + cardTitle: '아이폰 16 팝니다', + itemName: '아이폰 16', + createdAt: '2023-11-01T08:08:00', + modifiedAt: '2023-11-01T08:08:00', + dibCount: 19, + priceRange: '10000-50000', + image: + 'https://cdn.cetizen.com/CDN/market/market_large_crop/202203/20220318/220318152808_1_2913635.jpg', + tradeState: 'impossible', + }, + { + _id: 3, // 내려줄 때 리스트 순서 + cardId: 1, + cardTitle: '아이폰 16 팝니다', + itemName: '아이폰 16', + createdAt: '2023-11-01T08:08:00', + modifiedAt: '2023-11-01T08:08:00', + dibCount: 19, + priceRange: '10000-50000', + image: + 'https://cdn.cetizen.com/CDN/market/market_large_crop/202203/20220318/220318152808_1_2913635.jpg', + tradeState: 'impossible', + }, +] + +const ItemList = () => { + return ( +
+
+ +
+ 필터 아이콘{' '} +
필터
+
+
+
+ {list.map((item: Item) => ( + + ))} +
+
+ ) +} +export default ItemList diff --git a/src/app/(root)/(routes)/items/components/Item-list/index.tsx b/src/app/(root)/(routes)/items/components/Item-list/index.tsx new file mode 100644 index 00000000..cfc6d002 --- /dev/null +++ b/src/app/(root)/(routes)/items/components/Item-list/index.tsx @@ -0,0 +1,3 @@ +import ItemList from './ItemList' + +export default ItemList diff --git a/src/app/(root)/(routes)/items/components/search-input/SearchInput.tsx b/src/app/(root)/(routes)/items/components/search-input/SearchInput.tsx new file mode 100644 index 00000000..c5c09a3c --- /dev/null +++ b/src/app/(root)/(routes)/items/components/search-input/SearchInput.tsx @@ -0,0 +1,29 @@ +import React from 'react' +import Input from '@/components/ui/Input' +import { InputProps } from '@/components/ui/Input/Input' + +const SearchInput = ({ ...props }: InputProps) => { + return ( +
+ +
+ + + +
+
+ ) +} + +SearchInput.displayName = 'SearchInput' + +export default SearchInput diff --git a/src/app/(root)/(routes)/items/components/search-input/index.tsx b/src/app/(root)/(routes)/items/components/search-input/index.tsx new file mode 100644 index 00000000..9ece4bd3 --- /dev/null +++ b/src/app/(root)/(routes)/items/components/search-input/index.tsx @@ -0,0 +1,3 @@ +import SearchInput from './SearchInput' + +export default SearchInput diff --git a/src/app/(root)/(routes)/items/page.tsx b/src/app/(root)/(routes)/items/page.tsx new file mode 100644 index 00000000..c476b874 --- /dev/null +++ b/src/app/(root)/(routes)/items/page.tsx @@ -0,0 +1,16 @@ +import { FunctionComponent } from 'react' +import PageTitle from '@/components/domain/page-title' +import ItemList from './components/Item-list' + +interface ItemListPageProps {} + +const ItemListPage: FunctionComponent = ({}) => { + return ( +
+ + +
+ ) +} + +export default ItemListPage diff --git a/src/components/domain/card/trade-state-card/TradeStateCard.tsx b/src/components/domain/card/trade-state-card/TradeStateCard.tsx index 2263b072..8c40f420 100644 --- a/src/components/domain/card/trade-state-card/TradeStateCard.tsx +++ b/src/components/domain/card/trade-state-card/TradeStateCard.tsx @@ -7,6 +7,7 @@ import { Item } from '@/types' type TradeStateCardProps = { item: Item + className: string } type TradeStateMap = { [key: string]: { @@ -23,6 +24,7 @@ type TradeStateMap = { const TradeStateCard = ({ item: { image, cardTitle, tradeState, itemName, priceRange, createdAt }, + className, }: TradeStateCardProps) => { const tradeStateMap: TradeStateMap = { possible: { @@ -36,7 +38,7 @@ const TradeStateCard = ({ } return ( - + { + return ( +
+ 이전 아이콘 +

+ {title} +

+
+
+ ) +} +export default PageTitle diff --git a/src/components/domain/page-title/index.tsx b/src/components/domain/page-title/index.tsx new file mode 100644 index 00000000..f5ad8967 --- /dev/null +++ b/src/components/domain/page-title/index.tsx @@ -0,0 +1,3 @@ +import PageTitle from './PageTitle' + +export default PageTitle diff --git a/src/components/ui/Card/Card.stories.tsx b/src/components/ui/Card/Card.stories.tsx index e23a4d0f..daf821f0 100644 --- a/src/components/ui/Card/Card.stories.tsx +++ b/src/components/ui/Card/Card.stories.tsx @@ -89,7 +89,7 @@ export const Trade: Story = { return ( ) }, diff --git a/src/config/apiEndPoint.ts b/src/config/apiEndPoint.ts index d7cc5532..852201fe 100644 --- a/src/config/apiEndPoint.ts +++ b/src/config/apiEndPoint.ts @@ -1,7 +1,10 @@ +import { GetItems } from '@/services/item/item' + const ApiEndPoint = { kakaoLogin: () => '/oauth2/authorize/kakao/login', googleLogin: () => '/oauth2/authorize/google/login', test: () => '/test', + items: (cursorId: number) => `/items?cursorId=${cursorId}`, } as const export default ApiEndPoint diff --git a/src/config/assets.ts b/src/config/assets.ts index 6e2f5033..1bdefa61 100644 --- a/src/config/assets.ts +++ b/src/config/assets.ts @@ -1,4 +1,6 @@ +import ArrowLeftIcon from '/public/images/arrow-left.svg' import AlarmIcon from '/public/images/bell.svg' +import FilterIcon from '/public/images/filter.svg' import GoogleIcon from '/public/images/google.png' import KakaoIcon from '/public/images/kakao.png' import Logo from '/public/images/logo.svg' @@ -7,6 +9,8 @@ import XIcon from '/public/images/x-icon.svg' const Assets = { menuIcon: MenuIcon, + arrowLeftIcon: ArrowLeftIcon, + filterIcon: FilterIcon, alarmIcon: AlarmIcon, googleIcon: GoogleIcon, kakaoIcon: KakaoIcon, diff --git a/src/lib/msw/mocks/data/items.json b/src/lib/msw/mocks/data/items.json new file mode 100644 index 00000000..6dd4a28c --- /dev/null +++ b/src/lib/msw/mocks/data/items.json @@ -0,0 +1,254 @@ +[ + { + "_id": 1, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 2, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 3, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 4, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 5, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 6, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 7, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 8, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 9, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 10, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 11, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 3, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 1, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 2, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 3, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 1, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 2, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 3, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 1, + "cardId": 1, + "cardTitle": "갤럭시 16 팝니다", + "itemName": "갤럭시 16", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 19, + "priceRange": "10000-50000", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 2, + "cardId": 2, + "cardTitle": "아이폰 17 팝니다", + "itemName": "아이폰 17", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 18, + "priceRange": "10만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + }, + { + "_id": 3, + "cardId": 3, + "cardTitle": "아이폰 18 팝니다", + "itemName": "아이폰 18", + "createdAt": "2023-11-01T08:08:00", + "modifiedAt": "2023-11-01T08:08:00", + "dibCount": 17, + "priceRange": "20만원대", + "image": "이미지 링크", + "status": "EXCHANGEABLE" + } +] diff --git a/src/lib/msw/mocks/handlers.ts b/src/lib/msw/mocks/handlers.ts index 62ae01e5..af93c5c0 100644 --- a/src/lib/msw/mocks/handlers.ts +++ b/src/lib/msw/mocks/handlers.ts @@ -1,4 +1,5 @@ import authHandlers from './authHandlers' +import { itemHandlers } from './itemHandler' import { testHandlers } from './testHandler' -export const handlers = [...testHandlers, ...authHandlers] +export const handlers = [...testHandlers, ...authHandlers, ...itemHandlers] diff --git a/src/lib/msw/mocks/itemHandler.ts b/src/lib/msw/mocks/itemHandler.ts new file mode 100644 index 00000000..6a786b3a --- /dev/null +++ b/src/lib/msw/mocks/itemHandler.ts @@ -0,0 +1,21 @@ +import { rest } from 'msw' +import { Environment } from '@/config/environment' +import items from '@/lib/msw/mocks/data/items.json' + +const baseUrl = Environment.apiAddress() + +export const itemHandlers = [ + rest.get(`${baseUrl}/items`, async (req, res, ctx) => { + const queryString = req.url.search + const cursorId = queryString.slice(10) + const currentPage = Number(cursorId) + const PAGE_SIZE = 5 + const filterdItems = items.filter( + (item, index) => + index >= currentPage * PAGE_SIZE && + index < (currentPage + 1) * PAGE_SIZE, + ) + + return res(ctx.status(200), ctx.json(filterdItems)) + }), +] diff --git a/src/services/item/item.ts b/src/services/item/item.ts new file mode 100644 index 00000000..8ab2c505 --- /dev/null +++ b/src/services/item/item.ts @@ -0,0 +1,16 @@ +import ApiEndPoint from '@/config/apiEndPoint' +import apiClient from '../apiClient' + +export type GetItems = { + categories: string[] + priceRange: string + name: string + cursorId: number +} + +const getItems = async ({ cursorId }: GetItems) => { + const response = await apiClient.get(ApiEndPoint.items(cursorId)) + return response +} + +export { getItems } diff --git a/src/types/index.ts b/src/types/index.ts index c1ab65a9..c0629217 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -8,5 +8,5 @@ export interface Item { dibCount: number priceRange: string image: string - tradeState: 'possible' | 'impossible' + tradeState: string }