[BUG] - en-GB locale not show dd/MM/yyyy in Date picker

[duyvinh229148]

NextUI Version

2.4.6

Describe the bug

My project using Nextjs, in layout, I use <NextUIProvider locale={"en-GB"}>{children}</NextUIProvider>, but when using DatePicker, the date is still showing MM/dd/yyyy, while I google 'en-GB', the date format is 'dd/MM/yyyy'. I realy need that date format, because my country hate MM/dd/yyyy

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Create a Nextjs project
2. In root layout.tsx, wrap children with LayoutUseClient component
3. In LayoutUseClient component, wrap children with <NextUIProvider locale={"en-GB"}>{children}</NextUIProvider>
4. In a page.tsx file, use DatePicker component, seeing that the date format is still MM/dd/yyyy

Expected behavior

The date format is dd/MM/yyyy

Screenshots or Videos

No response

Operating System Version

Linux - Fedora 39

Browser

Chrome

[linear[bot]]

ENG-1248 [BUG] - en-GB locale not show dd/MM/yyyy in Date picker

[awesome-pro]

@duyvinh229148 I used this code , and datePicker appears to be in dd/mm/yyyy format.

1. kindly check configurations or rebuild the project
2. if still the issues persists provide sandbox showing error

 <NextUIProvider
      locale="en-GB"
      navigate={(path: string) => {
        router.push(path);
      }}
    >
      <NextThemesProvider {...themeProps}>{children}</NextThemesProvider>
    </NextUIProvider>
    

[danieltan007]

here are the codesandbox link: codesandbox

[wingkwong]

may also check with other locales as well, e.g. en-US. ref: https://github.com/nextui-org/nextui/issues/3636

[thaynarbo]

pt-BR is also not working for dd/MM/yyyy which is our default format

[LucasTrombim]

pt-BR doesnt work either

[LucasTrombim]

@thaynarbo eu pesquisei sobre como o react-aria funciona, e o problema é a linguagem do seu navegador. Ele atualiza a formatação do campo de acordo com a linguagem do navegador. Teste com o navegador em português.

English:

@wingkwong I researched how react-aria works, and the problem is your browser language. It updates the field formatting according to the browser language. Test with the browser in Portuguese. This is the only "solution" that I have found.

[jawkhan]

Hey,

Is there any update on this bug, I can't seem to get the dd/MM/yyyy format required even though I have the correct locale set.

[wingkwong]

may also double check if a fixed version "@react-aria/i18n": "3.11.1" is used.

[GasparAdragna]

I had the same issue as described.

Using "@react-aria/i18n": "3.11.1" as @wingkwong suggested worked for me.

[dvlasic-dev]

Still have this problem when using it inside Next.js. I tried creating custom date-picker with react-aria, and then locale and format worked properly.

[LukasdeSouza]

@thaynarbo eu pesquisei sobre como o react-aria funciona, e o problema é a linguagem do seu navegador. Ele atualiza a formatação do campo de acordo com a linguagem do navegador. Teste com o navegador em português.

English:

@wingkwong I researched how react-aria works, and the problem is your browser language. It updates the field formatting according to the browser language. Test with the browser in Portuguese. This is the only "solution" that I have found.

@thaynarbo eu pesquisei sobre como o react-aria funciona, e o problema é a linguagem do seu navegador. Ele atualiza a formatação do campo de acordo com a linguagem do navegador. Teste com o navegador em português.

English:

@wingkwong I researched how react-aria works, and the problem is your browser language. It updates the field formatting according to the browser language. Test with the browser in Portuguese. This is the only "solution" that I have found.

PT-BR Eu coloquei no HeroUI Provider o locale="pt-BR" e funcionou

EN-US I put locale="pt-BR" in the HeroUI Provider and it worked