feat(game-ui): 토너먼트 단계별 메인 메뉴를 전환한다

app/game-frontend/src/components/main/MainMobileBottomBar.vue

@@ -4,9 +4,9 @@ import { legacyNationTextColor } from '../../utils/legacyNationColor';
 import MainNavigationLink from './MainNavigationLink.vue';
 import {
     buildGlobalNavigation,
+    buildNationNavigation,
     isNationNavigationEnabled,
     isNavigationConfigured,
-    nationNavigation,
     quickNavigation,
     type MainNavigationLink as MainNavigationLinkItem,
     type MainNavigationEntry,
@@ -18,6 +18,7 @@ import { useMenuPopup } from './useMenuPopup';
 const props = defineProps<{
     access: NationNavigationAccess;
     tournamentStage: number;
+    tournamentType: number | null;
     nationColor: string;
     npcMode: number;
     realtimeEnabled: boolean;
@@ -35,6 +36,7 @@ const emit = defineEmits<{
 
 const { setRoot, openId, close, toggle } = useMenuPopup();
 const globalEntries = computed(() => buildGlobalNavigation(props.npcMode, props.entries));
+const nationEntries = computed(() => buildNationNavigation(props.tournamentStage, props.tournamentType));
 const nationMenuColor = computed(() => props.nationColor || '#000000');
 const nationMenuTextColor = computed(() => legacyNationTextColor(nationMenuColor.value));
 const isActive = (link: MainNavigationLinkItem) =>
@@ -150,7 +152,7 @@ const onAction = (action: NonNullable<MainNavigationLinkItem['action']>) => {
                 <span class="dropup-caret" aria-hidden="true"></span>
             </button>
             <ul v-if="openId === 'nation'" id="mobile-nation-menu" class="bottom-popup" role="menu">
-                <template v-for="entry in nationNavigation" :key="entry.id">
+                <template v-for="entry in nationEntries" :key="entry.id">
                     <li v-if="entry.kind === 'link'" role="none">
                         <MainNavigationLink
                             :link="entry"

app/game-frontend/src/components/main/MainNationMenu.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import { computed } from 'vue';
 import MainNavigationLink from './MainNavigationLink.vue';
 import {
+    buildNationNavigation,
     isNationNavigationEnabled,
-    nationNavigation,
     type MainNavigationLink as MainNavigationLinkItem,
     type NationNavigationAccess,
 } from './mainNavigation';
@@ -12,10 +13,12 @@ import { legacyNationTextColor } from '../../utils/legacyNationColor';
 const props = defineProps<{
     access: NationNavigationAccess;
     tournamentStage: number;
+    tournamentType: number | null;
     nationColor: string;
 }>();
 
 const { setRoot, openId, close, toggle } = useMenuPopup();
+const entries = computed(() => buildNationNavigation(props.tournamentStage, props.tournamentType));
 const isActive = (link: MainNavigationLinkItem) =>
     link.highlightStage === props.tournamentStage ||
     link.highlightStages?.some((stage) => stage === props.tournamentStage) === true;
@@ -29,7 +32,7 @@ const isActive = (link: MainNavigationLinkItem) =>
         :class="{ 'dark-label': legacyNationTextColor(nationColor) === '#000000' }"
         aria-label="국가 메뉴"
     >
-        <template v-for="entry in nationNavigation" :key="entry.id">
+        <template v-for="entry in entries" :key="entry.id">
             <MainNavigationLink
                 v-if="entry.kind === 'link'"
                 :link="entry"

app/game-frontend/src/components/main/mainNavigation.ts

@@ -4,6 +4,7 @@ import type {
     RuntimeNavigationLink,
 } from '@sammo-ts/common/navigation/menuConfig';
 import defaultNavigationJson from '../../../../../resources/navigation.json';
+import { resolveTournamentMainPresentation } from '../../utils/tournamentNavigation';
 
 export type NationAccessRule =
     'always' | 'meeting' | 'secret' | 'nation-member' | 'nation-established' | 'nation-secret';
@@ -11,8 +12,8 @@ export type NationAccessRule =
 export type MainNavigationLink = RuntimeNavigationLink & {
     compactLabel?: string;
     access?: NationAccessRule;
-    highlightStage?: 1 | 6;
-    highlightStages?: readonly [1, 6];
+    highlightStage?: number;
+    highlightStages?: readonly number[];
     unavailableReason?: string;
 };
 
@@ -155,7 +156,6 @@ export const nationNavigation: MainNavigationEntry[] = [
             to: '/tournament',
             newTab: true,
             access: 'always',
-            highlightStages: [1, 6],
         },
         items: [
             {
@@ -246,6 +246,39 @@ export const nationNavigation: MainNavigationEntry[] = [
     { kind: 'link', id: 'my-settings', label: '화면 설정', to: '/my-settings', access: 'always' },
 ];
 
+export const buildNationNavigation = (
+    tournamentStage: number,
+    tournamentType: number | null,
+    source: MainNavigationEntry[] = nationNavigation
+): MainNavigationEntry[] =>
+    source.map((entry) => {
+        if (entry.kind !== 'split' || entry.id !== 'tournament-betting') return entry;
+
+        const presentation = resolveTournamentMainPresentation(tournamentStage, tournamentType);
+        const main: MainNavigationLink = {
+            ...entry.main,
+            label: presentation.label,
+            compactLabel: presentation.compactLabel,
+            to: presentation.to,
+            highlightStage: presentation.active ? tournamentStage : undefined,
+            highlightStages: undefined,
+        };
+        const items = entry.items.map((item) => {
+            if (item.kind !== 'link') return item;
+            if (item.id === 'tournament-menu') {
+                return {
+                    ...item,
+                    highlightStage: presentation.active && !presentation.bettingActive ? tournamentStage : undefined,
+                };
+            }
+            if (item.id === 'betting') {
+                return { ...item, highlightStage: presentation.bettingActive ? tournamentStage : undefined };
+            }
+            return item;
+        });
+        return { ...entry, main, items };
+    });
+
 export const quickNavigation: Array<QuickNavigationItem | MainNavigationDivider> = [
     { kind: 'divider', id: 'quick-nation-heading', label: '국가 정보' },
     { id: 'policy', label: '방침', tab: 'map', selector: '[data-main-target="policy"]' },
@@ -265,7 +298,8 @@ export const quickNavigation: Array<QuickNavigationItem | MainNavigationDivider>
     { id: 'diplomacy-message', label: '외교', tab: 'messages', selector: '[data-message-type="diplomacy"]' },
 ];
 
-export const isNavigationConfigured = (link: MainNavigationLink): boolean => Boolean(link.to || link.href || link.action);
+export const isNavigationConfigured = (link: MainNavigationLink): boolean =>
+    Boolean(link.to || link.href || link.action);
 
 export const isNationNavigationEnabled = (link: MainNavigationLink, access: NationNavigationAccess): boolean => {
     const rule = link.access ?? 'always';