From f60cb3d6c55250c0d3f82641f7656a7efc89247f Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Thu, 16 Oct 2025 10:52:31 +0900
Subject: [PATCH] =?UTF-8?q?fix.=20=ED=85=9C=ED=94=8C=EB=A6=BF=20=EB=A0=88?=
 =?UTF-8?q?=EC=A7=80=EC=8A=A4=ED=8A=B8=EB=A6=AC=20composables=20=EB=A1=9C?=
 =?UTF-8?q?=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/components/layouts/Main.vue             | 12 ++++--------
 layers/composables/useGameStart.ts             | 12 ++++--------
 .../useTemplateRegistry.ts}                    | 18 +++++++++++-------
 layers/server/middleware/gameData.ts           |  8 +-------
 layers/templates/GrVisual01/index.vue          |  4 ++--
 layers/templates/GrVisual02/index.vue          |  4 ++--
 6 files changed, 24 insertions(+), 34 deletions(-)
 rename layers/{registry/index.ts => composables/useTemplateRegistry.ts} (67%)

diff --git a/layers/components/layouts/Main.vue b/layers/components/layouts/Main.vue
index 2e0eed0..53f8b2b 100644
--- a/layers/components/layouts/Main.vue
+++ b/layers/components/layouts/Main.vue
@@ -1,9 +1,8 @@
 <script setup lang="ts">
-import { templateRegistry } from '#layers/registry'
+import { useTemplateRegistry } from '#layers/composables/useTemplateRegistry'
 import type {
   PageDataValue,
   PageDataTemplate,
-  PageDataResourceContainer,
   PageDataMetaTag,
 } from '#layers/types/api/pageData'
 
@@ -13,11 +12,8 @@ interface Props {
 
 const props = defineProps<Props>()
 
-// 템플릿 레지스트리 타입 캐스팅
-const registry = templateRegistry as unknown as Record<
-  string,
-  { component: PageDataResourceContainer }
->
+// 템플릿 레지스트리 사용
+const { getTemplateComponent } = useTemplateRegistry()
 
 // 개별 메타 태그 표시 여부 확인
 const shouldShowMetaTag = computed(() => props.pageData.meta_tag_type === 2)
@@ -63,7 +59,7 @@ watchEffect(() => {
       :key="template.template_code ?? index"
     >
       <component
-        :is="registry[template.template_code]?.component"
+        :is="getTemplateComponent(template.template_code)"
         :components="template.components"
         :page-ver-tmpl-seq="template.page_ver_tmpl_seq.toString()"
       />
diff --git a/layers/composables/useGameStart.ts b/layers/composables/useGameStart.ts
index 8c8b620..bab6a3a 100644
--- a/layers/composables/useGameStart.ts
+++ b/layers/composables/useGameStart.ts
@@ -10,22 +10,20 @@ export const useCheckGameStart = () => {
   const disabledDoubleClick = ref(false) // 연속 호출 클릭 방지
   const isCheckLauncher = ref(false) // 런처 실행 로딩 상태
   const isShowDownloadLauncher = ref(false) // 런처 다운로드 표시
-  const customerService = { title: '확인', link: 'https://www.google.com' } //[TODO]
+  const customerService = { title: '확인', link: 'https://www.google.com' } //[TODO] 고객센터 링크
 
   // 로그인 모달 표시
   const showLoginModal = () => {
     modalStore.handleOpenAlert({
-      contentText: '로그인',
+      contentText: '로그인이 필요합니다.',
       confirmButtonText: '스토브 로그인',
       className: 'modal-login',
 
       confirmButtonEvent: () => {
-        modalStore.handleResetAlert()
         csrGoStoveLogin()
       },
 
       closeButtonEvent: () => {
-        modalStore.handleResetAlert()
         disabledDoubleClick.value = false
       },
     })
@@ -70,8 +68,9 @@ export const useCheckGameStart = () => {
     if (!import.meta.client) return
 
     const gameDataStore = useGameDataStore()
+    const { gameData } = storeToRefs(gameDataStore)
 
-    const stoveGameId = gameDataStore.gameData?.game_id || ''
+    const stoveGameId = gameData.value?.game_id || ''
     const accessTokenSub = useCookie('SUAT')
     const nationCookie = useCookie('NNTO').value
     const localeCookie = useCookie('LOCALE').value
@@ -124,7 +123,6 @@ export const useCheckGameStart = () => {
           confirmButtonText: '스토브 로그인',
           className: 'modal-login',
           confirmButtonEvent: () => {
-            modalStore.handleResetAlert()
             csrGoStoveLogin()
           },
         })
@@ -136,7 +134,6 @@ export const useCheckGameStart = () => {
           confirmButtonText: '스토브 로그인',
           className: 'modal-login',
           confirmButtonEvent: () => {
-            modalStore.handleResetAlert()
             csrGoStoveLogin()
           },
         })
@@ -155,7 +152,6 @@ export const useCheckGameStart = () => {
           confirmButtonText: customerService.title,
           cancelButtonText: '취소',
           confirmButtonEvent: () => {
-            modalStore.handleResetConfirm()
             window.open(customerService.link, '_blank')
           },
         })
diff --git a/layers/registry/index.ts b/layers/composables/useTemplateRegistry.ts
similarity index 67%
rename from layers/registry/index.ts
rename to layers/composables/useTemplateRegistry.ts
index 4e78bdb..a436101 100644
--- a/layers/registry/index.ts
+++ b/layers/composables/useTemplateRegistry.ts
@@ -4,13 +4,8 @@ import GrVisual03 from '#layers/templates/GrVisual03/index.vue'
 import GrGallery01 from '#layers/templates/GrGallery01/index.vue'
 import GrGallery02 from '#layers/templates/GrGallery02/index.vue'
 import GrGallery03 from '#layers/templates/GrGallery03/index.vue'
-// import GrBoard01 from "#layers/templates/GrBoard01/index.vue";
-// import GrDetail01 from "#layers/templates/GrDetail01/index.vue";
-// import GrDetail02 from "#layers/templates/GrDetail02/index.vue";
-// import GrDetail03 from "#layers/templates/GrDetail03/index.vue";
-// import GrContents01 from "#layers/templates/GrContents01/index.vue";
 
-export const templateRegistry = {
+const templateRegistry = {
   GR_VISUAL_01: { component: GrVisual01 },
   GR_VISUAL_02: { component: GrVisual02 },
   GR_VISUAL_03: { component: GrVisual03 },
@@ -24,4 +19,13 @@ export const templateRegistry = {
   // GR_CONTENTS_01: { component: GrContents01 },
 } as const
 
-export type TemplateKey = keyof typeof templateRegistry
+type TemplateKey = keyof typeof templateRegistry
+
+export const useTemplateRegistry = () => {
+  return {
+    templateRegistry,
+    getTemplateComponent: (templateCode: string) => {
+      return templateRegistry[templateCode as TemplateKey]?.component
+    },
+  }
+}
diff --git a/layers/server/middleware/gameData.ts b/layers/server/middleware/gameData.ts
index 17a3a43..5d21fc9 100644
--- a/layers/server/middleware/gameData.ts
+++ b/layers/server/middleware/gameData.ts
@@ -63,15 +63,9 @@ export default defineEventHandler(async event => {
       query: queryParams,
     })) as GameDataResponse | null
 
-    const gaId = (response as GameDataResponse | null).value?.ga_code
-
-    if (gaId) {
-      // 환경변수에 동적 설정
-      event.context.googleAnalyticsId = gaId
-    }
-
     if (response?.code === 0 && 'value' in response) {
       event.context.gameData = response.value
+      event.context.googleAnalyticsId = response.value?.ga_code
     }
   } catch (error) {
     console.error('gameData load error:', error)
diff --git a/layers/templates/GrVisual01/index.vue b/layers/templates/GrVisual01/index.vue
index db783ab..2c656e8 100644
--- a/layers/templates/GrVisual01/index.vue
+++ b/layers/templates/GrVisual01/index.vue
@@ -37,12 +37,12 @@ const buttonListData = computed(() =>
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="w-[355px] md:w-[944px]"
+        class="w-full max-w-[355px] md:max-w-[944px]"
       />
       <WidgetsDescription
         v-if="descriptionData"
         :resources-data="descriptionData"
-        class="w-[355px] md:w-[944px]"
+        class="w-full max-w-[355px] md:max-w-[944px]"
       />
       <WidgetsVideoPlay
         v-if="videoPlayData"
diff --git a/layers/templates/GrVisual02/index.vue b/layers/templates/GrVisual02/index.vue
index 237cf00..930b044 100644
--- a/layers/templates/GrVisual02/index.vue
+++ b/layers/templates/GrVisual02/index.vue
@@ -90,12 +90,12 @@ const slideItemSize = {
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="w-[355px] md:w-[944px]"
+        class="w-full max-w-[355px] md:max-w-[944px]"
       />
       <WidgetsDescription
         v-if="descriptionData"
         :resources-data="descriptionData"
-        class="w-[355px] md:w-[944px]"
+        class="w-full max-w-[355px] md:max-w-[944px]"
       />
       <WidgetsVideoPlay
         v-if="videoPlayData"