gahusb
c9ab987e02
- SettingsScreen 컴포넌트 추가 (언어선택, BGM 토글, 앱 버전, 게임 초기화) - 게임 데이터 초기화: 2단계 확인 다이얼로그 (localStorage 전체 삭제 후 리로드) - 언어 설정: 한국어/English 세그먼트 버튼 (language 상태 persist) - BGM 토글 스위치 (bgmEnabled 상태 persist) - 마지막 저장 시각 및 오프라인 보상 최대 24시간 안내 텍스트 - BottomTabBar에 ⚙️ 설정 탭 추가 - useGameStore에 TabName 'settings', Language 타입 및 관련 액션 추가 Co-Authored-By: Paperclip <noreply@paperclip.ing>
64 lines
2.0 KiB
TypeScript
64 lines
2.0 KiB
TypeScript
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 { SettingsScreen } from '../src/components/screens/SettingsScreen';
|
|
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 />}
|
|
{activeTab === 'settings' && <SettingsScreen />}
|
|
</div>
|
|
<BottomTabBar activeTab={activeTab} onTabChange={setActiveTab} />
|
|
</div>
|
|
);
|
|
}
|