next-i18next Internationalization Configuration Issue | Next.js | Page 1

Hi, I'm using next-i18next for internationalization. I want to configure the language, including the region, like de-DE, but when I switch the language to German, the URL shows like this: de-DE/privacy-policy. However, I want it to show de-de/privacy-policy (with the region in lowercase in the URL). Additionally, when I set the locales in the config file like this: locales: ["en-US", "de-DE"], the translation files are loaded correctly. But when I set it like this: locales: ["en-us", "de-de"], the translations are not loading. I need help fixing this issue. Here is the config file.

module.exports = {
i18n: {
defaultLocale: "en-us",
locales: ["en-us", "de-de"],
// localeLowerCase: true,
},
fallback: true,
nonExplicitSupportedLngs: true,

localePath:
typeof window === 'undefined'
  ? require('path').resolve('./public/locales')
  : './public/locales',
reloadOnPrerender: process.env.NODE_ENV === 'dev'

};

here is locale folder structure
public/
└── locales/
├── en-us/
│ └── common.json
└── de-de/
└── common.json

here how i am using this
import {PrivacyPolicy} from "@pages";
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
export default PrivacyPolicy;
export async function getStaticProps({ locale }: {locale:any}) {

const lacales =  await serverSideTranslations(locale, [
  'privacy-policy',
])
console.log("lacales", lacales)
return {
  props: {
   ...lacales,
    // Will be passed to the page component as props
  },
}

}

#next-i18next Internationalization Configuration Issue

};

here is locale folder structure public/ └── locales/ ├── en-us/ │ └── common.json └── de-de/ └── common.json

here is locale folder structure
public/
└── locales/
├── en-us/
│ └── common.json
└── de-de/
└── common.json