React-datepicker: [Demo Site] A locale object was not found for the provided string ["en-GB"].

[Joshua-rose]

Describe the bug
The locale example on the demo site is not working correctly. It is using my locale (en-US) instead of the stated locale (en-GB). It is also produces an error. Error reproduced below

To Reproduce
Steps to reproduce the behavior:

1. Go to 'https://reactdatepicker.com/#example-locale'
2. Open Dev Tools, (I am using chrome in this instance. However issue is also present in FireFox)
3. Click on the date field
4. View console.

Scroll up or down to reproduce the.

See error in Additional Context

Expected behavior
Expected date popup with correct local (en-GB in this instance).

Screenshots

Desktop (please complete the following information):

• OS: Windows
• Browser Chrome, Firefox
• Version 76.0.3809.100, 68.0.2 respectivly

Additional context
Error procuced from console

backend.js:6 A locale object was not found for the provided string ["en-GB"].
r @ backend.js:6
we @ index.js:403
(anonymous) @ index.js:552
(anonymous) @ index.js:2459
(anonymous) @ index.js:2445
(anonymous) @ index.js:2442
(anonymous) @ index.js:2654
(anonymous) @ index.js:2708
value @ index.js:2836
yi @ react-dom.production.min.js:3880
mi @ react-dom.production.min.js:3871
Jo @ react-dom.production.min.js:6116
Wo @ react-dom.production.min.js:5101
Ho @ react-dom.production.min.js:4958
Fo @ react-dom.production.min.js:4817
(anonymous) @ react-dom.production.min.js:2543
a.unstable_runWithPriority @ scheduler.production.min.js:338
cr @ react-dom.production.min.js:2513
Rr @ react-dom.production.min.js:2538
hr @ react-dom.production.min.js:2528
Ie @ react-dom.production.min.js:6706
Bn @ react-dom.production.min.js:1817
Ln @ react-dom.production.min.js:1790

[Joshua-rose]

Closed with #1872

[Snazzie]

Yep, this is silly.

[Snazzie]

This isnt fixed, even on your demo site with "en-GB" your input is still "en-US". i also get this console warning with "en-US" as locale.

[owainharris]

Same issue - not fixed.

[jimsheen]

Bump

[wviveiro]

From his commit on issue #1872 I checked he did 2 things:

1. Import the locale from date-fns to the code

import enGB from "date-fns/locale/en-GB";

1. Register the locale using react-datepicker function when component is mounted

registerLocale('gn-GB', enGB);

So, in order to make it work in my code, I did the following:

import React, { useEffect } from "react";
import DatePicker, { registerLocale } from "react-datepicker";
import enGB from "date-fns/locale/en-GB";


// REACT HOOK
const MyDatePicker = () => {
    useEffect(() => {
        registerLocale("en-GB", enGB);
    }, []);

    return (
        <DatePicker
            locale={'en-GB'}
        />
    );
};

// React Component
class MyDatePickerComponent extends React.Component {
    componentDidMount() {
        registerLocale("en-GB", enGB);
    }
    render() {
        return (
            <DatePicker
                locale={'en-GB'}
            />
        );
    }
}