Skip to content

Commit 6958a0c

Browse files
halionazhalionaz
committed
feat: init amplitude
1 parent a223b00 commit 6958a0c

6 files changed

Lines changed: 182 additions & 1 deletion

File tree

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
"check-project": "yarn type && yarn lint"
1616
},
1717
"dependencies": {
18+
"@amplitude/analytics-browser": "^2.23.5",
1819
"@stomp/stompjs": "^7.1.1",
1920
"@tanstack/react-query": "^5.79.0",
2021
"axios": "^1.9.0",

‎src/App.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import 'react-time-picker-typescript/dist/style.css';
66
import SocketProvider from './common/components/SocketProvider';
77
import { OverlayProvider } from '@/common/components/OverlayProvider';
88
import NotificationProvider from '@/common/components/NotificationProvider';
9+
import AmplitudeProvider from '@/common/utils/AmplitudeProvider';
910

1011
const queryClient = new QueryClient({
1112
defaultOptions: {
@@ -27,6 +28,7 @@ function App() {
2728
<QueryClientProvider client={queryClient}>
2829
<SocketProvider>
2930
<OverlayProvider>
31+
<AmplitudeProvider />
3032
<NotificationProvider>{router}</NotificationProvider>
3133
</OverlayProvider>
3234
</SocketProvider>

‎src/common/hooks/useEffectOnce.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { useEffect, useRef } from 'react';
2+
3+
export const useEffectOnce = (effect: React.EffectCallback) => {
4+
const hasRun = useRef(false);
5+
useEffect(() => {
6+
if (hasRun.current) return;
7+
hasRun.current = true;
8+
effect();
9+
});
10+
};

‎src/common/utils/AmplitudeProvider.tsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { useEffectOnce } from '@/common/hooks/useEffectOnce';
2+
import { initAmplitude, setInitialUserProperties } from '@/common/utils/amplitude';
3+
import { useGetUser } from '@/features/my/apis/useGetUser';
4+
5+
const AmplitudeProvider = () => {
6+
const { data: user } = useGetUser();
7+
8+
useEffectOnce(() => {
9+
initAmplitude(user?.id.toString(), () => {
10+
if (user) setInitialUserProperties(user);
11+
});
12+
});
13+
14+
return null;
15+
};
16+
17+
export default AmplitudeProvider;

‎src/common/utils/amplitude.ts‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import type { UserInterface } from '@/libs/types/user';
2+
import { identify, Identify, init, setUserId } from '@amplitude/analytics-browser';
3+
4+
const AMPLITUDE_API_KEY = import.meta.env.VITE_API_AMPLITUDE_API_KEY || '';
5+
6+
export const initAmplitude = async (userId?: string, callback?: () => void) => {
7+
init(AMPLITUDE_API_KEY, {
8+
userId,
9+
defaultTracking: true,
10+
autocapture: {
11+
elementInteractions: true,
12+
},
13+
}).promise.then(() => {
14+
callback?.();
15+
});
16+
};
17+
18+
export const setInitialUserProperties = (user: UserInterface) => {
19+
const identifyObj = new Identify();
20+
setUserId('repicka-' + user.id);
21+
identifyObj.set('id', user.id);
22+
identifyObj.set('user_name', user.nickname);
23+
identifyObj.set('isKorean', user.isKoreanUnivVerified);
24+
identifyObj.set('gender', user.gender ?? 'unknown');
25+
identifyObj.set('height', user.height ?? 'unknown');
26+
identifyObj.set('weight', user.weight ?? 'unknown');
27+
identify(identifyObj);
28+
};

‎yarn.lock‎

Lines changed: 124 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,117 @@
22
# yarn lockfile v1
33

44

5+
"@amplitude/analytics-browser@^2.23.5":
6+
version "2.23.5"
7+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-browser/-/analytics-browser-2.23.5.tgz#65849441b7a527a386cb15f1e2b06148f203cfd1"
8+
integrity sha512-R1N506rifI3/axSTM3EQkVjCgeJsmhybRONOdnA3MCJwOIC77UVEOIzTVNjnAAzgBSxDNTCy6ejGgBf3PgzBog==
9+
dependencies:
10+
"@amplitude/analytics-core" "^2.22.1"
11+
"@amplitude/analytics-remote-config" "^0.4.0"
12+
"@amplitude/plugin-autocapture-browser" "^1.11.1"
13+
"@amplitude/plugin-network-capture-browser" "^1.5.4"
14+
"@amplitude/plugin-page-view-tracking-browser" "^2.3.45"
15+
"@amplitude/plugin-web-vitals-browser" "^0.1.0-beta.20"
16+
tslib "^2.4.1"
17+
18+
"@amplitude/analytics-client-common@>=1 <3", "@amplitude/analytics-client-common@^2.3.39":
19+
version "2.3.39"
20+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-client-common/-/analytics-client-common-2.3.39.tgz#307d5713ccce4476814bec642b261c3ac6ebe917"
21+
integrity sha512-Dt31IIalME8whTXLgnKPLh9HbHTr8dC9F51reS1gngXAkOTErzAvbBl6UIc09bjqHWmimsRYgi6nflubnqwvMQ==
22+
dependencies:
23+
"@amplitude/analytics-connector" "^1.4.8"
24+
"@amplitude/analytics-core" "^2.22.1"
25+
"@amplitude/analytics-types" "^2.10.0"
26+
tslib "^2.4.1"
27+
28+
"@amplitude/analytics-connector@^1.4.8", "@amplitude/analytics-connector@^1.6.4":
29+
version "1.6.4"
30+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-connector/-/analytics-connector-1.6.4.tgz#8a811ff5c8ee46bdfea0e8f61c7578769b5778ed"
31+
integrity sha512-SpIv0IQMNIq6SH3UqFGiaZyGSc7PBZwRdq7lvP0pBxW8i4Ny+8zwI0pV+VMfMHQwWY3wdIbWw5WQphNjpdq1/Q==
32+
33+
"@amplitude/analytics-core@>=1 <2":
34+
version "1.2.8"
35+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-core/-/analytics-core-1.2.8.tgz#eb454effa04d144458035c0db5290d0e13e49b83"
36+
integrity sha512-Krxpr5uvS3HmmjvpYqPfbMbs2kcZZu09L+6KwQnPiofWRzoXWIM217fRfy6aSD/QrAoPGbZjvtVitw9cB7Cx+A==
37+
dependencies:
38+
"@amplitude/analytics-types" "^1.4.0"
39+
tslib "^2.4.1"
40+
41+
"@amplitude/analytics-core@>=1 <3", "@amplitude/analytics-core@^2.14.0-frustrationanalytics.0", "@amplitude/analytics-core@^2.22.1":
42+
version "2.22.1"
43+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-core/-/analytics-core-2.22.1.tgz#4fdec1e6dd5a71e9aa75ccf9d19fabcace1bad66"
44+
integrity sha512-nzlulhS7jYQc91wOc392avBLDAiPZmIBuJ1apA640YlleX/egVxKgZVYHH3Ge4ZNkaxoESwUb4mf2R+ZI0fXxA==
45+
dependencies:
46+
"@amplitude/analytics-connector" "^1.6.4"
47+
tslib "^2.4.1"
48+
49+
"@amplitude/analytics-remote-config@^0.4.0":
50+
version "0.4.1"
51+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-remote-config/-/analytics-remote-config-0.4.1.tgz#b62cf8aa82290f68b314197e20351b10ea44ae3e"
52+
integrity sha512-BYl6kQ9qjztrCACsugpxO+foLaQIC0aSEzoXEAb/gwOzInmqkyyI+Ub+aWTBih4xgB/lhWlOcidWHAmNiTJTNw==
53+
dependencies:
54+
"@amplitude/analytics-client-common" ">=1 <3"
55+
"@amplitude/analytics-core" ">=1 <3"
56+
"@amplitude/analytics-types" ">=1 <3"
57+
tslib "^2.4.1"
58+
59+
"@amplitude/analytics-remote-config@^0.6.3":
60+
version "0.6.3"
61+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-remote-config/-/analytics-remote-config-0.6.3.tgz#ebe6e4c2bfc18fefe7e4c4e763764f597268d0c3"
62+
integrity sha512-icE0ogCzdHAtQi9jiOFQUmKrvWQc5YEO6bLZUfQXCT/yTTNXppWnT1zHMKzXa3SMDosfrLwU/X8sro1PTI+jZQ==
63+
dependencies:
64+
"@amplitude/analytics-core" ">=1 <2"
65+
"@amplitude/analytics-types" ">=1 <2"
66+
tslib "^2.4.1"
67+
68+
"@amplitude/analytics-types@>=1 <2", "@amplitude/analytics-types@^1.4.0":
69+
version "1.4.0"
70+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-types/-/analytics-types-1.4.0.tgz#63f84e5ea5e26beeb06745732063e3787194f0d2"
71+
integrity sha512-RiMPHBqdrJ8ktTqG+Wzj2htnN/PCG9jGZG0SXtTFnWwVvcAJYbYm55/nrP1TTyrx1OlLhvF2VG3lVUP/xGAU8w==
72+
73+
"@amplitude/analytics-types@>=1 <3", "@amplitude/analytics-types@^2.10.0":
74+
version "2.10.0"
75+
resolved "https://registry.yarnpkg.com/@amplitude/analytics-types/-/analytics-types-2.10.0.tgz#b6dfe75019e078393977183999d36fd461b20b49"
76+
integrity sha512-WP8eEbJh10MmFVnxkHjg92i5DBxBFsRvSZxjDQPXEGL8ZP+i7rSsleiH2K3VrwoKksYfZ/1eAqrZvevAmjSlig==
77+
78+
"@amplitude/plugin-autocapture-browser@^1.11.1":
79+
version "1.11.1"
80+
resolved "https://registry.yarnpkg.com/@amplitude/plugin-autocapture-browser/-/plugin-autocapture-browser-1.11.1.tgz#2efbed537c3ebcca3a2666a4f22eae1402f6213b"
81+
integrity sha512-6nus1nXlH1ru/yjx07yk1cyjc9scAsE9dO4f0xxH8xpHlYQ4yVCuYApcguIpogISlPiySAxSZ+4WDreLrpQiDw==
82+
dependencies:
83+
"@amplitude/analytics-core" "^2.22.1"
84+
"@amplitude/analytics-remote-config" "^0.6.3"
85+
rxjs "^7.8.1"
86+
tslib "^2.4.1"
87+
88+
"@amplitude/plugin-network-capture-browser@^1.5.4":
89+
version "1.5.4"
90+
resolved "https://registry.yarnpkg.com/@amplitude/plugin-network-capture-browser/-/plugin-network-capture-browser-1.5.4.tgz#729ce36f0249001b8235c4ff9a0b453fcc67c4c9"
91+
integrity sha512-GRvi44tNx2TdHQ/dnC9DLqwsaBE1gC/bmHNaudTbp/nwIM8nVCAxZaXaXJEUouK7WBAamr7a3WmFruecqCeOlA==
92+
dependencies:
93+
"@amplitude/analytics-core" "^2.22.1"
94+
rxjs "^7.8.1"
95+
tslib "^2.4.1"
96+
97+
"@amplitude/plugin-page-view-tracking-browser@^2.3.45":
98+
version "2.3.45"
99+
resolved "https://registry.yarnpkg.com/@amplitude/plugin-page-view-tracking-browser/-/plugin-page-view-tracking-browser-2.3.45.tgz#d4f359b1a68e3a35dc4a2036f8e1fdc3da2dd6fe"
100+
integrity sha512-L2JH/TDTdjfexkY5hHVS3dCb4+q5H1jeIKhXUcBQ/Wx91asLY9BsH91J4bo9EK4J4Al8jVRwqJz0tIQ17qW9RQ==
101+
dependencies:
102+
"@amplitude/analytics-client-common" "^2.3.39"
103+
"@amplitude/analytics-types" "^2.10.0"
104+
tslib "^2.4.1"
105+
106+
"@amplitude/plugin-web-vitals-browser@^0.1.0-beta.20":
107+
version "0.1.0-frustrationanalytics.0"
108+
resolved "https://registry.yarnpkg.com/@amplitude/plugin-web-vitals-browser/-/plugin-web-vitals-browser-0.1.0-frustrationanalytics.0.tgz#aab05ee9b2f45d272e6634bb61973551523d67b5"
109+
integrity sha512-xv4sje6/D8r+SgNFTA22FJ5PhtdhN+VSydvs63Frll+qWlyQwaZ1IgDbPyqjzryEkldHRPD7GUaQual+geoIYg==
110+
dependencies:
111+
"@amplitude/analytics-core" "^2.14.0-frustrationanalytics.0"
112+
rxjs "^7.8.1"
113+
tslib "^2.4.1"
114+
web-vitals "^5.0.1"
115+
5116
"@ampproject/remapping@^2.2.0":
6117
version "2.3.0"
7118
resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.3.0.tgz#ed441b6fa600072520ce18b43d2c8cc8caecc7f4"
@@ -3627,6 +3738,13 @@ run-parallel@^1.1.9:
36273738
dependencies:
36283739
queue-microtask "^1.2.2"
36293740

3741+
rxjs@^7.8.1:
3742+
version "7.8.2"
3743+
resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.8.2.tgz#955bc473ed8af11a002a2be52071bf475638607b"
3744+
integrity sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==
3745+
dependencies:
3746+
tslib "^2.1.0"
3747+
36303748
safe-array-concat@^1.1.3:
36313749
version "1.1.3"
36323750
resolved "https://registry.yarnpkg.com/safe-array-concat/-/safe-array-concat-1.1.3.tgz#c9e54ec4f603b0bbb8e7e5007a5ee7aecd1538c3"
@@ -4033,7 +4151,7 @@ tsconfck@^3.0.3:
40334151
resolved "https://registry.yarnpkg.com/tsconfck/-/tsconfck-3.1.6.tgz#da1f0b10d82237ac23422374b3fce1edb23c3ead"
40344152
integrity sha512-ks6Vjr/jEw0P1gmOVwutM3B7fWxoWBL2KRDb1JfqGVawBmO5UsvmWOQFGHBPl5yxYz4eERr19E6L7NMv+Fej4w==
40354153

4036-
tslib@^2.4.0:
4154+
tslib@^2.1.0, tslib@^2.4.0, tslib@^2.4.1:
40374155
version "2.8.1"
40384156
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f"
40394157
integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==
@@ -4220,6 +4338,11 @@ warning@^4.0.0:
42204338
dependencies:
42214339
loose-envify "^1.0.0"
42224340

4341+
web-vitals@^5.0.1:
4342+
version "5.1.0"
4343+
resolved "https://registry.yarnpkg.com/web-vitals/-/web-vitals-5.1.0.tgz#2f117e92c8c4eeb107cb163cbb482ac20d685ebd"
4344+
integrity sha512-ArI3kx5jI0atlTtmV0fWU3fjpLmq/nD3Zr1iFFlJLaqa5wLBkUSzINwBPySCX/8jRyjlmy1Volw1kz1g9XE4Jg==
4345+
42234346
websocket-driver@>=0.5.1:
42244347
version "0.7.4"
42254348
resolved "https://registry.yarnpkg.com/websocket-driver/-/websocket-driver-0.7.4.tgz#89ad5295bbf64b480abcba31e4953aca706f5760"

0 commit comments

Comments
 (0)