diff --git a/package.json b/package.json index 883d495..15b4eb2 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "@tanstack/react-router": "^1.38.1", "axios": "^1.7.2", "clsx": "^2.1.1", + "dayjs": "^1.11.11", "jotai": "^2.8.3", "js-cookie": "^3.0.5", "react": "19.0.0-beta-26f2496093-20240514", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5b38617..653e4fd 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13,13 +13,16 @@ importers: version: 5.48.0(react@19.0.0-beta-26f2496093-20240514) '@tanstack/react-router': specifier: ^1.38.1 - version: 1.43.1(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514) + version: 1.43.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514) axios: specifier: ^1.7.2 version: 1.7.2 clsx: specifier: ^2.1.1 version: 2.1.1 + dayjs: + specifier: ^1.11.11 + version: 1.11.11 jotai: specifier: ^2.8.3 version: 2.8.4(@types/react@18.3.3)(react@19.0.0-beta-26f2496093-20240514) @@ -41,10 +44,10 @@ importers: version: 1.8.1 '@tanstack/router-devtools': specifier: ^1.38.1 - version: 1.43.1(@tanstack/react-router@1.43.1)(csstype@3.1.3)(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514) + version: 1.43.1(@tanstack/react-router@1.43.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514))(csstype@3.1.3)(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514) '@tanstack/router-vite-plugin': specifier: ^1.38.0 - version: 1.43.1(vite@5.3.2) + version: 1.43.1(vite@5.3.2(@types/node@20.14.9)) '@types/js-cookie': specifier: ^3.0.6 version: 3.0.6 @@ -59,7 +62,7 @@ importers: version: 18.3.0 '@vitejs/plugin-react': specifier: ^4.2.1 - version: 4.3.1(vite@5.3.2) + version: 4.3.1(vite@5.3.2(@types/node@20.14.9)) autoprefixer: specifier: ^10.4.19 version: 10.4.19(postcss@8.4.38) @@ -83,7 +86,7 @@ importers: version: 5.3.2(@types/node@20.14.9) vite-plugin-svgr: specifier: ^4.2.0 - version: 4.2.0(typescript@5.5.2)(vite@5.3.2) + version: 4.2.0(rollup@4.18.0)(typescript@5.5.2)(vite@5.3.2(@types/node@20.14.9)) packages: @@ -942,6 +945,9 @@ packages: resolution: {integrity: sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==} engines: {node: '>=0.11'} + dayjs@1.11.11: + resolution: {integrity: sha512-okzr3f11N6WuqYtZSvm+F776mB41wRZMhKP+hc34YdW+KmtYYK9iqvHSwo2k9FEH3fhGXvOPV6yz2IcSrfRUDg==} + debug@4.3.5: resolution: {integrity: sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==} engines: {node: '>=6.0'} @@ -2111,11 +2117,13 @@ snapshots: '@pkgjs/parseargs@0.11.0': optional: true - '@rollup/pluginutils@5.1.0': + '@rollup/pluginutils@5.1.0(rollup@4.18.0)': dependencies: '@types/estree': 1.0.5 estree-walker: 2.0.2 picomatch: 2.3.1 + optionalDependencies: + rollup: 4.18.0 '@rollup/rollup-android-arm-eabi@4.18.0': optional: true @@ -2227,7 +2235,7 @@ snapshots: '@babel/types': 7.24.7 entities: 4.5.0 - '@svgr/plugin-jsx@8.1.0(@svgr/core@8.1.0)': + '@svgr/plugin-jsx@8.1.0(@svgr/core@8.1.0(typescript@5.5.2))': dependencies: '@babel/core': 7.24.7 '@svgr/babel-preset': 8.1.0(@babel/core@7.24.7) @@ -2246,25 +2254,25 @@ snapshots: '@tanstack/query-core': 5.48.0 react: 19.0.0-beta-26f2496093-20240514 - '@tanstack/react-router@1.43.1(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514)': + '@tanstack/react-router@1.43.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514)': dependencies: '@tanstack/history': 1.41.0 - '@tanstack/react-store': 0.2.1(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514) + '@tanstack/react-store': 0.2.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514) react: 19.0.0-beta-26f2496093-20240514 react-dom: 19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514) tiny-invariant: 1.3.3 tiny-warning: 1.0.3 - '@tanstack/react-store@0.2.1(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514)': + '@tanstack/react-store@0.2.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514)': dependencies: '@tanstack/store': 0.1.3 react: 19.0.0-beta-26f2496093-20240514 react-dom: 19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514) use-sync-external-store: 1.2.2(react@19.0.0-beta-26f2496093-20240514) - '@tanstack/router-devtools@1.43.1(@tanstack/react-router@1.43.1)(csstype@3.1.3)(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514)': + '@tanstack/router-devtools@1.43.1(@tanstack/react-router@1.43.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514))(csstype@3.1.3)(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514)': dependencies: - '@tanstack/react-router': 1.43.1(react-dom@19.0.0-beta-26f2496093-20240514)(react@19.0.0-beta-26f2496093-20240514) + '@tanstack/react-router': 1.43.1(react-dom@19.0.0-beta-26f2496093-20240514(react@19.0.0-beta-26f2496093-20240514))(react@19.0.0-beta-26f2496093-20240514) clsx: 2.1.1 date-fns: 2.30.0 goober: 2.1.14(csstype@3.1.3) @@ -2278,7 +2286,7 @@ snapshots: prettier: 3.3.2 zod: 3.23.8 - '@tanstack/router-plugin@1.43.1(vite@5.3.2)': + '@tanstack/router-plugin@1.43.1(vite@5.3.2(@types/node@20.14.9))': dependencies: '@babel/core': 7.24.7 '@babel/generator': 7.24.7 @@ -2295,14 +2303,15 @@ snapshots: '@types/babel__traverse': 7.20.6 babel-dead-code-elimination: 1.0.5 unplugin: 1.10.2 - vite: 5.3.2(@types/node@20.14.9) zod: 3.23.8 + optionalDependencies: + vite: 5.3.2(@types/node@20.14.9) transitivePeerDependencies: - supports-color - '@tanstack/router-vite-plugin@1.43.1(vite@5.3.2)': + '@tanstack/router-vite-plugin@1.43.1(vite@5.3.2(@types/node@20.14.9))': dependencies: - '@tanstack/router-plugin': 1.43.1(vite@5.3.2) + '@tanstack/router-plugin': 1.43.1(vite@5.3.2(@types/node@20.14.9)) transitivePeerDependencies: - '@rsbuild/core' - supports-color @@ -2362,7 +2371,7 @@ snapshots: '@types/wrap-ansi@3.0.0': {} - '@vitejs/plugin-react@4.3.1(vite@5.3.2)': + '@vitejs/plugin-react@4.3.1(vite@5.3.2(@types/node@20.14.9))': dependencies: '@babel/core': 7.24.7 '@babel/plugin-transform-react-jsx-self': 7.24.7(@babel/core@7.24.7) @@ -2527,6 +2536,7 @@ snapshots: js-yaml: 4.1.0 parse-json: 5.2.0 path-type: 4.0.0 + optionalDependencies: typescript: 5.5.2 cosmiconfig@9.0.0(typescript@5.5.2): @@ -2535,6 +2545,7 @@ snapshots: import-fresh: 3.3.0 js-yaml: 4.1.0 parse-json: 5.2.0 + optionalDependencies: typescript: 5.5.2 cross-spawn@7.0.3: @@ -2551,6 +2562,8 @@ snapshots: dependencies: '@babel/runtime': 7.24.7 + dayjs@1.11.11: {} + debug@4.3.5: dependencies: ms: 2.1.2 @@ -2737,7 +2750,7 @@ snapshots: jiti@1.21.6: {} jotai@2.8.4(@types/react@18.3.3)(react@19.0.0-beta-26f2496093-20240514): - dependencies: + optionalDependencies: '@types/react': 18.3.3 react: 19.0.0-beta-26f2496093-20240514 @@ -2812,8 +2825,9 @@ snapshots: path-to-regexp: 6.2.2 strict-event-emitter: 0.5.1 type-fest: 4.20.1 - typescript: 5.5.2 yargs: 17.7.2 + optionalDependencies: + typescript: 5.5.2 mute-stream@1.0.0: {} @@ -2941,8 +2955,9 @@ snapshots: postcss-load-config@4.0.2(postcss@8.4.38): dependencies: lilconfig: 3.1.2 - postcss: 8.4.38 yaml: 2.4.5 + optionalDependencies: + postcss: 8.4.38 postcss-nested@6.0.1(postcss@8.4.38): dependencies: @@ -3246,11 +3261,11 @@ snapshots: util-deprecate@1.0.2: {} - vite-plugin-svgr@4.2.0(typescript@5.5.2)(vite@5.3.2): + vite-plugin-svgr@4.2.0(rollup@4.18.0)(typescript@5.5.2)(vite@5.3.2(@types/node@20.14.9)): dependencies: - '@rollup/pluginutils': 5.1.0 + '@rollup/pluginutils': 5.1.0(rollup@4.18.0) '@svgr/core': 8.1.0(typescript@5.5.2) - '@svgr/plugin-jsx': 8.1.0(@svgr/core@8.1.0) + '@svgr/plugin-jsx': 8.1.0(@svgr/core@8.1.0(typescript@5.5.2)) vite: 5.3.2(@types/node@20.14.9) transitivePeerDependencies: - rollup @@ -3259,11 +3274,11 @@ snapshots: vite@5.3.2(@types/node@20.14.9): dependencies: - '@types/node': 20.14.9 esbuild: 0.21.5 postcss: 8.4.38 rollup: 4.18.0 optionalDependencies: + '@types/node': 20.14.9 fsevents: 2.3.3 webidl-conversions@3.0.1: {} diff --git a/src/utils/getPassedTimeText.ts b/src/utils/getPassedTimeText.ts new file mode 100644 index 0000000..e97506e --- /dev/null +++ b/src/utils/getPassedTimeText.ts @@ -0,0 +1,19 @@ +import dayjs from "dayjs"; + +export const getPassedTimeText = (date: string): string => { + const now = dayjs(); + const inputDate = dayjs(date); + + const diff = now.diff(inputDate, "minute"); + + if (diff < 1) { + return "방금 전"; + } + if (diff < 60) { + return `${diff}분 전`; + } + if (diff < 60 * 24) { + return `${Math.round(diff / 60)}시간 전`; + } + return `${Math.round(diff / 60 / 24)}일 전`; +};