How to select user's language preference cookie

[isorna]

Hi, I was trying to update nf_lang cookie whenever the user switched to a different language landing page, but there seems I've not understood how to reuse frontmatter data, here's my example:

/es/index.md file

---
layout: 'home'
lang: 'es-ES'
title: 'Inicio'
---

Here {{ $frontmatter.lang }} is correct!

<script lang="ts" setup>
import { onMounted } from 'vue'
import { useData } from 'vitepress'
const { frontmatter } = useData()

onMounted(() => {
  let expires = new Date()
  expires.setFullYear(expires.getFullYear()+1)
  // But here frontmatter === undefined
  document.cookie = `nf_lang=${frontmatter.lang}; expires=${expires.toUTCString()}; path=/`
})
</script>

When I use the lang switcher (or a link) to go from / or /en (english home) to /es (spanish home), the cookie should match user's preference, so that I can do a redirect on root page on next user visit:

/index.md file

<script lang="ts" setup>
import { useRouter } from 'vitepress'
import { onMounted } from 'vue'

let getUserLang = () => window.navigator.language.substring(0, 2)
// nf_lang is set up during theme setup hook:
let getCookieLang = () => document.cookie.split(';').filter((setting) => setting.indexOf('nf_lang') >= 0)[0]?.split('=')[1]
let checkUserLang = (language) => {
  let userLang = getUserLang()
  let cookieLang = getCookieLang()
  let checkLang = (lang) => (cookieLang && lang === cookieLang) ?? lang === userLang
  console.log(language.some(lang => checkLang(lang)), userLang, cookieLang, language)
  if (typeof language === 'string') {
    return checkLang(language)
  }
  return language.some(lang => checkLang(lang))
}

let { go } = useRouter()

onMounted(() => {
  if (checkUserLang(['es'])) {
    go('/es/')
  } else {
    go('/en/')
  }
})
</script>

[brc-dd]

frontmatter is a computed ref. You need to do frontmatter.value.lang to get it inside script blocks.

[isorna]

Ah ok, I missed it... thanks for the help!