Adding name of translating dynamically

[SaddamMohsen]

suppose that i have this links

const links = [
    { name: "home", href: `/` },
    {
      name: "invoice",
      href: `/invoice`
    },
    { name: "users", href: `/users` },
  ];

and this is the translation file for ar.ts

export default {
'sidebar.home': "الرئيسية",
    "sidebar.invoice": "الفواتير",
    "sidebar.payments": "المدفوعات",
    "sidebar.users": "إدارة المستخدمين"
} as const

and this translation for en en.ts

export default{
 "sidebar.home": "Dashboard",
    "sidebar.invoice": "Invoices",
    "sidebar.users": "Users Management",
} as const

what i need i need to apply this map and get the name of translation dynamically

 {
links.map((link) => {
        return (
          <Link
            key={link.name}
            href={link.href}
>
 {t(`sidebar.${link.name}`)}
</Link>
}

when i do this it give me error No overload matches this call. how to do that

[samit4me]

We had similar experience to this and put some comments on #375 (seems similar) on a way we achieved it, but would be great if it was baked into the library.

[QuiiBz]

This is a TypeScript thing: you have to add as const to your links variable to infer the types:

const links = [
    { name: "home", href: `/` },
    {
      name: "invoice",
      href: `/invoice`
    },
    { name: "users", href: `/users` },
] as const;

[SaddamMohsen]

This is a TypeScript thing: you have to add as const to your links variable to infer the types:

const links = [
    { name: "home", href: `/` },
    {
      name: "invoice",
      href: `/invoice`
    },
    { name: "users", href: `/users` },
] as const;

this way not working and keep give me error

[QuiiBz]

Could you share a minimal reproduction? The issue is because link.name's type is string instead of 'invoice' | 'users', so as const should fix it.

[SaddamMohsen]

Could you share a minimal reproduction? The issue is because link.name's type is string instead of 'invoice' | 'users', so as const should fix it.

as const does not fix the problem so i use this solution temporarily https://github.com/QuiiBz/next-international/issues/375

[QuiiBz]

Happy to help more if you can provide a minimal reproduction, because as const should fix the issue.

[SaddamMohsen]

Happy to help more if you can provide a minimal reproduction, because as const should fix the issue.

sorry what you mean by minimal reproduction

[aryankarim]

temp solution

scopedT(text as any)