Source: contexts/LocaleContext.jsx

import React from 'react';

const LocaleContext = React.createContext();

/**
 * @class LocaleProvider
 * @classdesc Provides messaging context down the component tree. Usefull with oskari-ui/Message component.
 * @see {@link LocaleConsumer}
 * @param {Object} props - { bundleKey, getMessage:optional }
 * @example
 * import { Message } from 'oskari-ui';
 * import { LocaleProvider } from 'oskari-ui/util';
 *
 * const Greeting = () => (
 *     <LocaleProvider value={{bundleKey: 'helloworld'}}>
 *         <Message messageKey="hello" messageArgs={['Jack']}/>
 *     </LocaleProvider>
 * );
 */
export const LocaleProvider = LocaleContext.Provider;

/**
 * @class LocaleConsumer
 * @classdesc
 * A higher order component utilizing messaging context to the component it wraps.
 * Using LocaleConsumer and getMessage function directly should be avoided.
 * Using oskari-ui/Message component instead is encouraged.
 *
 * The context provides bundleKey string and getMessage function.
 * The getMessage function may be used when an element can't use a ReactNode as a prop. (e.g. placeholder in TextInput)
 * @see {@link LocaleProvider}
 * @param {ReactElement} Component The component to pass localizations to
 *
 * @example <caption>Modified TextInput</caption>
 * import { TextInput } from 'oskari-ui';
 * import { LocaleConsumer } from 'oskari-ui/util';
 *
 * const NameInput = LocaleConsumer(({ getMessage }) => (
 *     <TextInput placeholder={getMessage('placeholders.name')} />
 * ));
 */
export function LocaleConsumer (Component) {
    const LocalizedComponent = (props, ref) => {
        return (
            <LocaleContext.Consumer>
                {
                    value => {
                        if (!value) {
                            // No contex provider, just pass props through.
                            return <Component ref={ref} {...props} />;
                        }
                        const { bundleKey, getMessage = Oskari.getMsg.bind(null, bundleKey) } = value;
                        return <Component bundleKey={bundleKey} getMessage={getMessage} ref={ref} {...props} />;
                    }
                }
            </LocaleContext.Consumer>
        );
    };
    const name = Component.displayName || Component.name;
    LocalizedComponent.displayName = `LocaleConsumer(${name})`;
    return React.forwardRef(LocalizedComponent);
}