Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

Issue with using the document-internationalization plugin in Sanity and troubleshooting steps.

58 replies
Last updated: Mar 8, 2022
Hello Sanity team, I am trying to use the document-internationalization plugin which works well with GROQ but I am struggling to follow the GraphQL doc (https://github.com/sanity-io/document-internationalization/blob/main/docs/graphql-intl-doc.md ). I can edit the document but once deployed, I can’t find any i18_* field. Would you have any example please? Many thanks!
Mar 3, 2022, 8:55 AM
Mar 3, 2022, 9:05 AM
Hi (Removed Name), many thanks, I’ve checked it indeed by searching, just in case, are you using GraphQL or Groq please?
Mar 3, 2022, 9:09 AM
Groq
Mar 3, 2022, 9:10 AM
sorry i haven't see you searching for GraphQL 😞
Mar 3, 2022, 9:10 AM
no problem and many thanks! Ton blog est en ligne?
Mar 3, 2022, 9:11 AM
Mon blog n'est pas en ligne encore , je lutte sur la pagination 😞 ( i'm on nextJs BTW )
Mar 3, 2022, 9:13 AM
same here, nextjs
Mar 3, 2022, 9:13 AM
i have manage to translate all my blog post , if you need help , but only with GROQ
Mar 3, 2022, 9:15 AM
Many thanks!
Mar 3, 2022, 9:16 AM
and i'm working a way to do pagination , i want to display only five article per page , but my lack of knowledge regarding NextJS is a big issue for this task 😁
Mar 3, 2022, 9:16 AM
Hi (Removed Name). Would you be able to share an example GraphQL query that attempts to fetch the internationalised content?
It would also be handy if you're able to share the URL for your GraphQL Playground. Feel free to DM that to avoid sharing it publicly
🙂.
Mar 3, 2022, 2:55 PM
Hi (Removed Name)!
Mar 3, 2022, 2:57 PM
Now I don’t think my config is right, I’ve tried to follow the guidelines and ended up with the following, which I don’t think is right:
export default createSchema({
  name: 'default',
  i18n: {
    fieldNames: {
      lang: 'i18n_lang',
      baseReference: 'i18n_base',
      references: 'i18n_refs'
    }
  },
  fields: [
    {
      name: 'i18n_lang',
      type: 'string',
      hidden: true,
    },
    {
      name: 'i18n_base',
      type: 'reference',
      hidden: true,
    },
    {
      name: 'i18n_refs',
      type: 'array',
      hidden: true,
      of: [
        {
          type: 'reference',
          to: [{type: 'schema'}],
        },
      ],
    },
  ],
  types: schemaTypes.concat([
    // =======================
    // ELEMENTS
    // =======================
    title,
    navigationItem,

    // =======================
    // DOCUMENTS
    // =======================
    page,
    headerPage,
  ]),
})
Mar 3, 2022, 2:59 PM
Page document being:
export default {
  type: 'document',
  name: 'page',
  title: 'Page',
  i18n: true,
  fields: [
    {
      name: 'title',
      type: 'title',
    },
  ],
}
Mar 3, 2022, 3:01 PM
Aha! I think I see the issue here. The fields need to be added to your individual schemas. Like this:

export default {
  type: 'document',
  name: 'page',
  title: 'Page',
  i18n: true,
  fields: [
    {
      name: 'title',
      type: 'title',
    },
    // Add the i18n fields to the schema here:
    {
      name: 'i18n_lang',
      type: 'string',
      hidden: true,
    },
    {
      name: 'i18n_base',
      type: 'reference',
      hidden: true,
    },
    {
      name: 'i18n_refs',
      type: 'array',
      hidden: true,
      of: [
        {
          type: 'reference',
          to: [{type: 'schema'}],
        },
      ],
    },
  ],
}
Let me know whether this helps
🙂.
Mar 3, 2022, 3:10 PM
I try directly but has issue doing so, I proceed right now
Mar 3, 2022, 3:11 PM
Ok, so when doing so here is what I see:
Mar 3, 2022, 3:13 PM
and was not sure whether
to: [{type: 'schema'}],
was the issue
Mar 3, 2022, 3:13 PM
This main schema is still correct please? (specifying i18 on it)
export default createSchema({
  // We name our schema
  name: 'default',
  // Then proceed to concatenate our document type
  // to the ones provided by any plugins that are installed
  i18n: {
    fieldNames: {
      lang: 'i18n_lang',
      baseReference: 'i18n_base',
      references: 'i18n_refs'
    }
  },
  types: schemaTypes.concat([
    // =======================
    // ELEMENTS
    // =======================
    title,
    navigationItem,

    // =======================
    // DOCUMENTS
    // =======================
    page,
    headerPage,
  ]),
})
Mar 3, 2022, 3:14 PM
Yes, I think you've added the
i18n
options in exactly the right spot! Let me look into that other issue.
Mar 3, 2022, 3:16 PM
Many thanks (Removed Name), that’s fantastic
Mar 3, 2022, 3:18 PM
Okay, I think I see the issue. The reference should be to the translated document type. In your case:

{
  name: 'i18n_refs',
  type: 'array',
  hidden: true,
  of: [
    {
      type: 'reference',
      to: [{type: 'page'}],
    },
  ],
},
This is because the reference is to another (translated) document of the
Page
type.
Mar 3, 2022, 3:18 PM
I adjust
Mar 3, 2022, 3:18 PM
ok makes total sense sorry about this one, and just one left as in:
Mar 3, 2022, 3:20 PM
The reference type is missing or having an invalid value for the required "to" property. It should be an array of accepted types.
Mar 3, 2022, 3:21 PM
Have you added the
i18n_lang
,
i18n_base
, and
i18n_refs
fields to all of your schemas that support i18n?
Mar 3, 2022, 3:25 PM
I double check immediately
Mar 3, 2022, 3:26 PM
all the document using i18 have it, now the elements do not have any specifications do they need it too please?
Mar 3, 2022, 3:31 PM
(namely title / item-navigation)
Mar 3, 2022, 3:31 PM
Thank you for checking. I believe it's only necessary for documents that support i18n.
Mar 3, 2022, 3:34 PM
which makes sense indeed
Mar 3, 2022, 3:36 PM
Should this field be also set to the current document type as in:
{
      name: 'i18n_base',
      type: 'reference',
      hidden: true,
    }
vs

{
  name: 'i18n_base',
  type: 'reference',
  hidden: true,
  of: [
    {type: 'page'},
  ],
},
?
Mar 3, 2022, 3:38 PM
I think you're right that the
of
option needs to be set there! The docs don't mention what this should be, so I'll need to do a little investigating here.
Mar 3, 2022, 4:15 PM
i’ve tried but didn’t resolve the issue, I keep trying
Mar 3, 2022, 4:17 PM
(Removed Name), ok the fields now appear but with null values
Mar 3, 2022, 4:34 PM
(Removed Name), I got it here:
Mar 3, 2022, 4:34 PM
so document looks like:
export default {
  type: 'document',
  name: 'page',
  title: 'Page',
  i18n: true,
  fields: [
    {
      name: 'title',
      type: 'title',
    },
    //======================= I18 requirements
    // Add the i18n fields to the schema here:
    {
      name: 'i18n_lang',
      type: 'string',
      hidden: true,
    },
    {
      name: 'i18n_base',
      type: 'array',
      hidden: true,
      of: [
            {
              type: 'reference',
              to: [{type: 'page'}],
            },
          ],
    },
    {
      name: 'i18n_refs',
      type: 'array',
      hidden: true,
      of: [
        {
          type: 'reference',
          to: [{type: 'page'}],
        },
      ],
    },
  ],
};
Mar 3, 2022, 4:35 PM
as you pointed reference was required in the same way in i18n_base as in i18n_refs
Mar 3, 2022, 4:36 PM
Many many many thanks (Removed Name)! Fantastic!
Mar 3, 2022, 4:36 PM
current document being:
export default {
  type: 'document',
  name: 'page',
  title: 'Page',
  i18n: true,
  fields: [
    {
      name: 'title',
      type: 'title',
    },
    //======================= I18 requirements
    // Add the i18n fields to the schema here:
    {
      name: 'i18n_lang',
      type: 'string',
      hidden: true,
    },
    {
      name: 'i18n_base',
      type: 'array',
      hidden: true,
      of: [
            {
              type: 'reference',
              to: [{type: 'page'}],
            },
          ],
    },
    {
      name: 'i18n_refs',
      type: 'array',
      hidden: true,
      of: [
        {
          type: 'reference',
          to: [{type: 'page'}],
        },
      ],
    },
  ],
};
Mar 3, 2022, 4:51 PM
current document being:
export default {
  type: 'document',
  name: 'page',
  title: 'Page',
  i18n: true,
  fields: [
    {
      name: 'title',
      type: 'title',
    },
    //======================= I18 requirements
    // Add the i18n fields to the schema here:
    {
      name: 'i18n_lang',
      type: 'string',
      hidden: true,
    },
    {
      name: 'i18n_base',
      type: 'array',
      hidden: true,
      of: [
            {
              type: 'reference',
              to: [{type: 'page'}],
            },
          ],
    },
    {
      name: 'i18n_refs',
      type: 'array',
      hidden: true,
      of: [
        {
          type: 'reference',
          to: [{type: 'page'}],
        },
      ],
    },
  ],
};
Mar 3, 2022, 4:51 PM
Good morning (Removed Name), I hope you’re well, I am coming back to you as I’d like to ensure the following is correct, it seems to work so also want to share:

1/ Main schema:
export default createSchema({
  name: 'default',
  types: schemaTypes.concat([
    // -- ELEMENTS
    title,
    // -- DOCUMENTS
    page,
  ]),
})
=> i18 has been removed from here, and fieldnames added in the config (config/@sanity/document-internationalization.json)


2/ document-internationalization.json:
{
    "idStructure": "delimiter",
    "referenceBehavior": "strong",
    "languages": [
        {"id": "en", "title": "English"},
        {"id": "fr", "title": "French"},
        {"id": "es", "title": "Spanish"}
    ],
    "withTranslationsMaintenance": false,
    "fieldNames": {
        "lang": "i18n_lang",
        "references": "i18n_refs",
        "baseReference": "i18n_base"
    }
}

3/ In the document page:
export default {
  type: 'document',
  name: 'page',
  title: 'Page',
  i18n: true,
  fields: [
    {
      name: 'title',
      type: 'title',
    },
    //==========================
    //======== I18 requirements
    //==========================
    {
      name: 'i18n_lang',
      type: 'string',
      hidden: true,
    },
    {
      name: 'i18n_base',
      type: 'reference',
      hidden: true,
      to: [
        { type: 'page' },
      ],
    },
    {
      name: 'i18n_refs',
      type: 'array',
      hidden: true,
      of: [
        {
          type: 'reference',
          to: [{ type: 'page' }],
        },
      ],
    },
  ],
=> i18n_base is not an array of reference: the base being the default, I suppose it only should receive one hence the direct ref. without an array:

4/ Once deployed I can query all and by country with expected results:

query AllPages {
  allCountries: allPage {
    _type
    _id
    i18n_lang
    title {
      title
    }
  }
  spanishOnly: allPage(where: { i18n_lang: { eq: "es" } }) {
    _type
    _id
    i18n_lang
    title {
      title
    }
  }
}
=>

{
  "data": {
    "allCountries": [
      {
        "_type": "page",
        "_id": "10fad58e-6eab-46f3-b704-341cf9f0dc9a",
        "i18n_lang": "en",
        "title": {
          "title": "Homepage"
        }
      },
      {
        "_type": "page",
        "_id": "10fad58e-6eab-46f3-b704-341cf9f0dc9a__i18n_es",
        "i18n_lang": "es",
        "title": {
          "title": "Casa"
        }
      },
      {
        "_type": "page",
        "_id": "10fad58e-6eab-46f3-b704-341cf9f0dc9a__i18n_fr",
        "i18n_lang": "fr",
        "title": {
          "title": "Accueil"
        }
      }
    ],
    "spanishOnly": [
      {
        "_type": "page",
        "_id": "10fad58e-6eab-46f3-b704-341cf9f0dc9a__i18n_es",
        "i18n_lang": "es",
        "title": {
          "title": "Casa"
        }
      }
    ]
  }
}
Mar 4, 2022, 6:41 AM
Morning
user E
, just in case, does the deployed gql API looks good to you please?
https://hxxbibp8.api.sanity.io/v1/graphql/production/default
Mar 8, 2022, 8:45 AM
Morning
user E
, just in case, does the deployed gql API looks good to you please?
https://hxxbibp8.api.sanity.io/v1/graphql/production/default
Mar 8, 2022, 8:45 AM
(I’d rather be sure before expanding it, many thanks in advance)
Mar 8, 2022, 8:46 AM
query AllPages {
  allCountries: allPage {
    _type
    _id
    i18n_lang
    title
    slug {
      current
    }
  }
  frenchOnly: allPage(where: { i18n_lang: { eq: "en" } }) {
    _type
    _id
    i18n_lang
    title
  }
}
Mar 8, 2022, 8:46 AM
Hi (Removed Name). I'm really glad to hear you got this working, and thanks for sharing with the community! 🙂
I'll take a look now.
Mar 8, 2022, 8:51 AM
Hi (Removed Name). I'm really glad to hear you got this working, and thanks for sharing with the community! 🙂
I'll take a look now.
Mar 8, 2022, 8:51 AM
Great, many thanks!
Mar 8, 2022, 8:52 AM
This looks awesome. I think you're spot on with the config here 🙌.
Thank you for highlighting some of the missing details in our docs. I'll pass this along so we can get it fixed!
Mar 8, 2022, 9:00 AM
This looks awesome. I think you're spot on with the config here 🙌.
Thank you for highlighting some of the missing details in our docs. I'll pass this along so we can get it fixed!
Mar 8, 2022, 9:00 AM
Perfect, glad it’s aligned and glad it’s correct! Many thanks (Removed Name)!
Mar 8, 2022, 9:01 AM
Have a nice one!
Mar 8, 2022, 9:01 AM
You too! Let us know if there is anything else we can help with 🙂.
Mar 8, 2022, 9:02 AM
Many thanks, Sanity is a very great tool, and the team is spot on!
Mar 8, 2022, 9:04 AM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?