feat: @apps-in-toss/analytics 이벤트 트래킹 구현 (JSA-32)
- src/analytics.ts: initAnalytics / trackGameEvent 유틸 추가 - _app.tsx: 앱 시작 시 Analytics.init 호출 - pages/index.tsx: app_open 이벤트 (플랫폼 시간, 보유 원소 수, 골드, 강화 레벨 합계) - FusionScreen: fusion_completed (결과 tier/name, 골드 획득, 재료 ID) - EvolutionScreen: enhancement_completed + level_up (원소 ID/이름, 새 레벨, 비용) - ShopScreen: item_purchased (아이템 ID/이름, 가격, 희귀도) - OfflineRewardModal: offline_reward_claimed (오프라인 시간, 골드, 원소 종류 수) - package.json: @apps-in-toss/analytics ^2.3.0 명시적 추가 Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
61
pages/index.tsx
Normal file
61
pages/index.tsx
Normal file
@@ -0,0 +1,61 @@
|
||||
import { css } from '@emotion/react';
|
||||
import { useEffect } from 'react';
|
||||
import { BottomTabBar } from '../src/components/BottomTabBar';
|
||||
import { OfflineRewardModal } from '../src/components/OfflineRewardModal';
|
||||
import { ElementsScreen } from '../src/components/screens/ElementsScreen';
|
||||
import { EvolutionScreen } from '../src/components/screens/EvolutionScreen';
|
||||
import { FusionScreen } from '../src/components/screens/FusionScreen';
|
||||
import { ShopScreen } from '../src/components/screens/ShopScreen';
|
||||
import { useIdleTick } from '../src/hooks/useIdleTick';
|
||||
import { useGameStore } from '../src/store/useGameStore';
|
||||
import { trackGameEvent } from '../src/analytics';
|
||||
|
||||
const rootStyle = css`
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f7f8fa;
|
||||
overflow: hidden;
|
||||
font-family:
|
||||
'Pretendard',
|
||||
-apple-system,
|
||||
BlinkMacSystemFont,
|
||||
sans-serif;
|
||||
`;
|
||||
|
||||
const contentStyle = css`
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding-bottom: 72px;
|
||||
`;
|
||||
|
||||
export default function IndexPage() {
|
||||
const { activeTab, setActiveTab, elements, gold, elementLevels } = useGameStore();
|
||||
useIdleTick();
|
||||
|
||||
useEffect(() => {
|
||||
const ownedCount = Object.values(elements).filter((c) => c > 0).length;
|
||||
const totalLevel = Object.values(elementLevels).reduce((sum, lv) => sum + lv, 0);
|
||||
trackGameEvent('app_open', {
|
||||
platform: 'web',
|
||||
platform_time: new Date().toISOString(),
|
||||
owned_element_count: ownedCount,
|
||||
gold,
|
||||
total_enhance_level: totalLevel,
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div css={rootStyle}>
|
||||
<OfflineRewardModal />
|
||||
<div css={contentStyle}>
|
||||
{activeTab === 'elements' && <ElementsScreen />}
|
||||
{activeTab === 'evolution' && <EvolutionScreen />}
|
||||
{activeTab === 'fusion' && <FusionScreen />}
|
||||
{activeTab === 'shop' && <ShopScreen />}
|
||||
</div>
|
||||
<BottomTabBar activeTab={activeTab} onTabChange={setActiveTab} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user