NextJS complex routing & language support

Hi, I followed the example from here to achieve grandparent/parent/doc path. The problem i have is that I also need to integrate language support in metadata. The docs in the alternate_language parameter only include the uid, but not the grandparent/parent in the same language. One solution - though quite a costly one - would be to fetch each alternate_language doc, but i was hoping there is more elegant way by enhancing the parameters that are returned in each alternate_language doc. Does anyone already have a solution?

Thanks in advance,
Peter

Hi @peter2 ,

Thanks for this question. To make sure I understand, let me see if I get the basic issue. You have pages with grandparent/parent/doc paths, and you need to easily get the translated route. Is that correct?

Sam

In essence, yes. As an interim solution I did what i said to do as a dirty work around - here is the snippet from part of the code within getStaticProps:

let response = await Client().getByUID('posts', uid,
    { lang: 'en-gb', fetchLinks : ['category.display_name', 'category.section', 'section.display_name'] });

  if (response) {
    let altLangDocIds = [];
    response.alternate_languages.forEach(lang => {
      altLangDocIds.push(lang.id)
    })
    let docs = await Client().getByIDs(altLangDocIds, {lang: '*'});
    response.alternate_languages = docs ? docs.results : []
  } else response = null

I had a similar issue here.

I ended up doing a costly fetch on getStaticProps and created a new object to give to my layouts and language switchers

  // fetch alternate categories slugs
  var alternativeLang = [];
  await Promise.all(
    doc.alternate_languages.map(async (lang) => {
      const fetchLang = await client.getByID(lang.id);

      alternativeLang = [
        ...alternativeLang,
        {
          id: lang.id,
          uid: lang.uid,
          type: lang.type,
          url: `/${lang.lang}/blog/${fetchLang.data.category.uid}/${lang.uid}`,
          category: fetchLang.data.category.uid,
          lang: lang.lang,
        },
      ];
    })
  );

Edit: it is costly but since it's on GetStaticProps it's handled asynchronously from the user so it's not that big of a deal

Hi @peter2 and @DavidParys,

Thanks for the detail. I've submitted an issue with our dev team, and I'll let you know what I hear back.

Sam

This thread is being monitored as an open ticket in the issue tracker. We will update this post as we get more information. If you have a similar use-case, you can ‘Flag’ this topic to reopen.