<template>
  <NuxtLayout>
    <h1 class="sr-only">dddd</h1>
    <NuxtPage />

    <MoleculesLoadingFull />
    <MoleculesLoadingLocal />
  </NuxtLayout>
</template>

<script setup lang="ts">
import { useNuxtApp } from "nuxt/app";
import { useGameDataStore } from "#layers/stores/useGameDataStore";
import type {
  gameData,
  GameDataMetaTag,
  GameDataValue,
} from "#layers/types/api/gameData";

const nuxtApp = useNuxtApp();
const getGameData = ref<GameDataValue | null>(null);
const metaData = ref<GameDataMetaTag | null>(null);
const { setGameData } = useGameDataStore();

// SSR에서만 접근 가능
const gameDataFromServer = import.meta.server
  ? nuxtApp.ssrContext?.event.context.gameData
  : null;

if (gameDataFromServer) {
  getGameData.value = gameDataFromServer;
  setGameData(gameDataFromServer);
}

const meta = gameDataFromServer?.meta_tag || null;

if (meta) {
  metaData.value = meta;
  useSeoMeta({
    title: meta.page_title,
    description: meta.page_desc,
    ogTitle: meta.og_title,
    ogImage: meta.og_image,
    ogDescription: meta.og_desc,
    ogUrl: meta.og_url,
    twitterImage: meta.x_image,
    twitterTitle: meta.x_title,
    twitterDescription: meta.x_desc,
  });
  useHead({
    // htmlAttrs: {
    //   lang: locale.value
    // },
    //meta: [...(updatedMetaTags.value || [])],
    //link: [...(links.value || [])]
  });
}
</script>
