@applica-software-guru/react-admin 1.2.123 → 1.3.126

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applica-software-guru/react-admin",
-  "version": "1.2.123",
+  "version": "1.3.126",
   "private": false,
   "repository": {
     "type": "git",

package/src/ApplicaAdmin.tsx

@@ -1,33 +1,14 @@
 import { AdminProps, AuthProvider, DataProvider } from 'react-admin';
 import { AppConfigProvider, MenuConfigProvider, MenuPropTypes, ThemeConfig, ThemeConfigProvider } from './contexts';
 import { CatchResult, useCliErrorCatcher } from './dev';
-import { Layout, LoginPage, MainIcon, Notification, SmallIcon } from './components';
+import { GenericErrorPage, Layout, LoginPage, MainIcon, Notification, SmallIcon } from './components';
 import React, { useMemo } from 'react';
-import { createI18nProvider, useI18nCatcher, useI18nLanguages } from './i18n';
-
+import { useI18nProvider } from './i18n';
 import Admin from './Admin';
-import { I18nCatcherBodyBuilderResultProps } from './i18n/useI18nCatcher';
 import { MenuProps } from './types';
 import PropTypes from 'prop-types';
 import { QueryClient } from 'react-query';
-
-const languageResponseMapper = (response: any) =>
-  response.reduce(
-    (messages: any, message: any) => ({
-      ...messages,
-      [message.lang]: {
-        ...(messages[message.lang] || {}),
-        [message.code]: message.text
-      }
-    }),
-    {}
-  );
-
-const i18nBodyRequestMapper = (lang: string, message: string): I18nCatcherBodyBuilderResultProps => ({
-  lang,
-  code: message,
-  text: message
-});
+import { ThemeCustomization } from './themes';
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -194,19 +175,6 @@ const ApplicaAdmin = ({
   enablePasswordRecover,
   ...props
 }: ApplicaAdminProps) => {
-  const languages = useI18nLanguages({
-    apiUrl,
-    endpoint: '/i18n/messages',
-    mapper: languageResponseMapper
-  });
-
-  useI18nCatcher({
-    bodyBuilder: i18nBodyRequestMapper,
-    apiUrl,
-    endpoint: '/i18n/message',
-    loading: languages?.loading,
-    enabled: development
-  });
   useCliErrorCatcher({
     apiUrl,
     endpoint: '/cli/error',
@@ -261,17 +229,25 @@ const ApplicaAdmin = ({
     },
     [logoMain, logoIcon, name, version, notification, enableNotification]
   );
+  const i18nProvider = useI18nProvider({
+    apiUrl: apiUrl,
+    defaultLocale: defaultLocale,
+    allowMissing: development,
+    createMissing: development
+  });
 
-  if (languages?.loading) {
-    return null;
+  if (i18nProvider === undefined) {
+    return <></>;
+  } else if (i18nProvider.error) {
+    return (
+      <ThemeConfigProvider initialConfig={themeConfig}>
+        <ThemeCustomization themeOverrides={theme}>
+          <GenericErrorPage />
+        </ThemeCustomization>
+      </ThemeConfigProvider>
+    );
   }
 
-  const i18nProivder = createI18nProvider({
-    languages,
-    defaultLocale,
-    allowMissing: development
-  });
-
   return (
     <AppConfigProvider>
       <MenuConfigProvider menu={menu}>
@@ -283,7 +259,7 @@ const ApplicaAdmin = ({
             queryClient={queryClient}
             dataProvider={dataProvider}
             authProvider={authProvider}
-            i18nProvider={i18nProivder}
+            i18nProvider={i18nProvider}
             loginPage={login}
             {...props}
           />

package/src/components/ra-forms/TableForm/TableFormIterator.tsx

@@ -15,14 +15,14 @@ import {
   TableRow,
   Typography
 } from '@mui/material';
-import { RaRecord, useRecordContext, useTranslate, useTranslateLabel } from 'ra-core';
+import { FormDataConsumer, RaRecord, useRecordContext, useTranslate, useTranslateLabel } from 'ra-core';
 import { styled, useTheme } from '@mui/material/styles';
 
 import { PlusCircleOutlined } from '@ant-design/icons';
 import PropTypes from 'prop-types';
 import { TableFormIteratorContext } from './TableFormIteratorContext';
 import { TableFormIteratorItem } from './TableFormIteratorItem';
-import { UseFieldArrayReturn } from 'react-hook-form';
+import { UseFieldArrayReturn, useFormContext } from 'react-hook-form';
 import get from 'lodash/get';
 
 /**
@@ -44,13 +44,27 @@ import get from 'lodash/get';
  * @returns
  */
 const TableFormIterator = (props: TableFormIteratorProps) => {
-  const { children, resource, source, label, disableActions = false, disableAdd = false, disableRemove = false, className, empty, template = {} } = props;
+  const {
+    children,
+    resource,
+    source,
+    label,
+    disableActions = false,
+    disableAdd = false,
+    disableRemove = false,
+    className,
+    empty,
+    template = {}
+  } = props;
   const [confirmIsOpen, setConfirmIsOpen] = useState<boolean>(false);
-  const { fields, remove, replace } = useArrayInput(props);
+  const { fields, remove, replace, append } = useArrayInput(props);
+  const { resetField } = useFormContext();
+
   const theme = useTheme();
   const translate = useTranslate();
   const record = useRecordContext(props);
-  const initialDefaultValue = useRef({});
+  const initialDefaultValue = useRef(template || {});
+
   const translateLabel = useTranslateLabel();
   const removeField = useCallback(
     (index: number) => {
@@ -66,6 +80,50 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
     for (const k in initialDefaultValue.current) initialDefaultValue.current[k] = null;
   }
 
+  const addField = useCallback(
+    (item: any = undefined) => {
+      let defaultValue = item;
+      if (item == null) {
+        defaultValue = initialDefaultValue.current;
+        if (
+          Children.count(children) === 1 &&
+          React.isValidElement(Children.only(children)) &&
+          // @ts-ignore
+          !Children.only(children).props.source &&
+          // Make sure it's not a FormDataConsumer
+          // @ts-ignore
+          Children.map(children, (input) => React.isValidElement(input) && input.type !== FormDataConsumer).some(Boolean)
+        ) {
+          // ArrayInput used for an array of scalar values
+          // (e.g. tags: ['foo', 'bar'])
+          defaultValue = '';
+        } else {
+          // ArrayInput used for an array of objects
+          // (e.g. authors: [{ firstName: 'John', lastName: 'Doe' }, { firstName: 'Jane', lastName: 'Doe' }])
+          defaultValue = defaultValue || ({} as Record<string, unknown>);
+          Children.forEach(children, (input) => {
+            if (React.isValidElement(input) && input.type !== FormDataConsumer && input.props.source) {
+              defaultValue[input.props.source] = input.props.defaultValue ?? null;
+            }
+          });
+        }
+      }
+      const newField = { ...defaultValue, ...template };
+      append(newField);
+      // Make sure the newly added inputs are not considered dirty by react-hook-form
+      resetField(`${source}.${fields.length}`, { defaultValue });
+    },
+    [append, children, resetField, source, fields.length, template]
+  );
+
+  // add field and call the onClick event of the button passed as addButton prop
+  const handleAddButtonClick = (originalOnClickHandler: any) => (event: MouseEvent) => {
+    addField();
+    if (originalOnClickHandler) {
+      originalOnClickHandler(event);
+    }
+  };
+
   const handleArrayClear = useCallback(() => {
     replace([]);
     setConfirmIsOpen(false);
@@ -95,7 +153,7 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
           source,
           disableAdd,
           template,
-          addButton: props?.addButton,
+          onClick: handleAddButtonClick((props?.addButton as any)?.props?.onClick)
         })}
 
         <TableContainer component={Paper} sx={{ mt: 2, border: `1px solid ${tableBorderColor}` }}>
@@ -177,34 +235,25 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
 };
 
 const AddTableRow = (props: any) => {
-  const { label, disableAdd, template = {} } = props;
-  const { append } = useArrayInput(props);
+  const { label, disableAdd, onClick } = props;
   const theme = useTheme();
   // @ts-ignore
   const tableBorderColor = theme.palette.mode === 'dark' ? theme.palette.grey.A400 : theme.palette.grey.A800;
   const iconColor = theme.palette.mode === 'light' ? '#000000' : '#FFFFFF';
 
-  const handleAddButtonClick = useCallback((
-    originalOnClickHandler: React.MouseEventHandler<Element>
-  ) => (event: React.MouseEvent<Element, MouseEvent>) => {
-    append(template);
-    originalOnClickHandler && originalOnClickHandler(event);
-  }, [append, template]);
-
   return (
     <Stack justifyContent={'space-between'} alignItems={'center'} flexDirection={'row'}>
-      <Typography>{label}</Typography>
-      {!disableAdd && (
-        React.isValidElement(props?.addButton) ?
+      {label !== false && <Typography>{label}</Typography>}
+      {!disableAdd &&
+        (React.isValidElement(props?.addButton) ? (
           React.cloneElement(props?.addButton, {
-            onClick: handleAddButtonClick(
-              props?.addButton?.props.onClick
-            ),
-          }) :
-          <IconButton size="small" color="secondary" sx={{ border: `1px solid ${tableBorderColor}` }} onClick={() => append(template)}>
+            onClick: onClick
+          })
+        ) : (
+          <IconButton size="small" color="secondary" sx={{ border: `1px solid ${tableBorderColor}` }} onClick={onClick}>
             <PlusCircleOutlined style={{ color: iconColor }} />
           </IconButton>
-      )}
+        ))}
     </Stack>
   );
 };
@@ -222,7 +271,7 @@ const StyledTableFormIterator = styled(TableFormIterator, {
 }));
 
 AddTableRow.propTypes = {
-  label: PropTypes.string,
+  label: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
   source: PropTypes.string,
   defaultValue: PropTypes.any
 };
@@ -237,7 +286,7 @@ TableFormIterator.propTypes = {
   formState: PropTypes.object,
   record: PropTypes.object,
   source: PropTypes.string,
-  label: PropTypes.string,
+  label: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
   resource: PropTypes.string,
   translate: PropTypes.func,
   disableAdd: PropTypes.bool,
@@ -261,7 +310,7 @@ export interface TableFormIteratorProps extends Partial<UseFieldArrayReturn> {
     submitFailed?: boolean;
   };
   record?: RaRecord;
-  label?: string;
+  label?: string | boolean;
   resource?: string;
   source?: string;
   sx?: SxProps;

package/src/components/ra-forms/TableForm/TableFormIteratorItem.tsx

@@ -47,14 +47,14 @@ export const TableFormIteratorItem = React.forwardRef((props: TableFormIteratorI
               resource,
               disabled,
               ...inputProps,
-              label: false
+              label: ''
             })}
           </TableCell>
         );
       })}
 
       {!disableActions && (
-        <TableCell sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', border: 0, pt: 2 }}>
+        <TableCell sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', border: 0, pt: 2.5 }}>
           <ActionsMenu horizontal>
             <Typography color="error" onClick={() => setConfirmIsOpen(true)}>
               {translate('ra.action.delete')}

package/src/components/ra-pages/GenericErrorPage.tsx

@@ -0,0 +1,23 @@
+import { useCallback } from 'react';
+import { Button, Container, Stack, Typography } from '@mui/material';
+//@ts-ignore
+import imgSrc from '../../assets/genericError.png';
+
+function GenericErrorPage() {
+  const onReload = useCallback(() => location.reload(), []);
+
+  return (
+    <Container>
+      <Stack alignItems="center" px={2} py={{ xs: 4, sm: 8 }} spacing={2} textAlign="center">
+        <img src={imgSrc} style={{ width: '100%', maxWidth: 450 }} />
+        <Typography variant="h2">Ops! An error occurred...</Typography>
+        <Typography>We&#39;re fixing the problem. Please try again later.</Typography>
+        <Button onClick={onReload} variant="contained">
+          Reload
+        </Button>
+      </Stack>
+    </Container>
+  );
+}
+
+export default GenericErrorPage;

package/src/components/ra-pages/index.ts

@@ -1,5 +1,5 @@
-import ActivatePage from './ActivatePage';
-import LoginPage from './LoginPage';
-import RecoverPage from './RecoverPage';
-import RegisterPage from './RegisterPage';
-export { ActivatePage, LoginPage, RecoverPage, RegisterPage };
+export { default as ActivatePage } from './ActivatePage';
+export { default as LoginPage } from './LoginPage';
+export { default as RecoverPage } from './RecoverPage';
+export { default as RegisterPage } from './RegisterPage';
+export { default as GenericErrorPage } from './GenericErrorPage';

package/src/hooks/index.jsx

@@ -8,3 +8,4 @@ import useThemeConfig from './useThemeConfig';
 export { useAppConfig, useMenu, useBreadcrumbs, useLocalStorage, useThemeConfig, useResourceTitle, useMenuConfig };
 export { useSx } from './mui';
 export { useRefDimensions } from './useRefDimensions';
+export { useMemoizedObject } from './useMemoizedObject';

package/src/hooks/useMemoizedObject.tsx

@@ -0,0 +1,27 @@
+import _ from 'lodash';
+import { useEffect, useState } from 'react';
+
+/**
+ * Questo hook memoizza in automatico un oggetto utilizzando il'equality check del suo valore come criterio di discriminazione.
+ * NOTA BENE!!! L'equality check di un oggetto JS è un discorso estremamente complesso.
+ * Pertanto questo hook va usato con estrema parsimonia, solo quando strettamente necessario e solo se si padroneggia a pieno il tema di cui sopra e le sue implicazioni nelle logiche di render condizionale di React
+ * @param object
+ * @returns
+ */
+function useMemoizedObject<T extends object>(object: T): T {
+  if (!_.isPlainObject(object)) {
+    throw new Error('[useMemoizedObject]: param must be a plain JS object');
+  }
+
+  const [memoObj, setMemoObj] = useState(object);
+
+  useEffect(() => {
+    if (!_.isEqual(object, memoObj)) {
+      setMemoObj(object);
+    }
+  }, [object, memoObj]);
+
+  return memoObj;
+}
+
+export { useMemoizedObject };

package/src/i18n/MissingMessageHandler.ts

@@ -0,0 +1,60 @@
+import _ from 'lodash';
+
+type IMissingMessageHandlerConstructorData = {
+  apiUrl: string;
+};
+
+type IMissingMessageHandler = {
+  handleMessage(data: { code: string; lang: string }): void;
+};
+
+class MissingMessageHandler implements IMissingMessageHandler {
+  #headers: Headers;
+  #apiUrl: string;
+  #handledMessages: Array<{ code: string; lang: string }> = [];
+
+  constructor(data: IMissingMessageHandlerConstructorData) {
+    const { apiUrl } = data ?? {};
+    if (!_.isString(apiUrl) || _.isEmpty(apiUrl)) {
+      throw new Error('[MissingMessageHandler] constructor: please provide a valid apiUrl');
+    }
+    this.#apiUrl = apiUrl;
+    this.#headers = new Headers({ Accept: 'application/json', 'Content-Type': 'application/json' });
+  }
+
+  handleMessage(data: { code: string; lang: string }): void {
+    if (!_.isPlainObject(data)) {
+      throw new Error('[MissingMessageHandler] handleMessage: please provide valid message data');
+    }
+
+    const { code, lang } = data;
+
+    if (!_.isString(code) || _.isEmpty(code)) {
+      throw new Error('[MissingMessageHandler] handleMessage: please provide valid code');
+    }
+
+    if (!_.isString(lang) || _.isEmpty(lang)) {
+      throw new Error('[MissingMessageHandler] handleMessage: please provide valid lang');
+    }
+
+    if (_.some(this.#handledMessages, (message) => _.isEqual(message, { code, lang }))) {
+      return;
+    } else {
+      this.#handledMessages.push({ code, lang });
+      fetch(`${this.#apiUrl}/i18n/message`, { method: 'put', headers: this.#headers, body: JSON.stringify({ code, lang, text: code }) })
+        .then((response) => response.json())
+        .then(() => {
+          //eslint-disable-next-line
+          console.log(`[MissingMessageHandler] handleMessage: created message for lang ${lang} and code ${code}`);
+        })
+        .catch((e) => {
+          //eslint-disable-next-line
+          console.error(e);
+          this.#handledMessages = _.reject(this.#handledMessages, (m) => _.isEqual(m, { code, lang }));
+        });
+      return;
+    }
+  }
+}
+
+export default MissingMessageHandler;

package/src/i18n/createI18nProvider.tsx

@@ -0,0 +1,97 @@
+import { Locale, TranslationMessages } from 'ra-core';
+import polyglotI18nProvider from 'ra-i18n-polyglot';
+import _ from 'lodash';
+import MissingMessageHandler from './MissingMessageHandler';
+
+type IMessage = {
+  id: string;
+  code: string;
+  lang: string;
+  text: string;
+};
+type IDictionary = { [key: string]: string };
+type ITranslations = { [key: string]: IDictionary };
+type ICreateI18nProviderData = {
+  apiUrl: string;
+  defaultLocale: string;
+  allowMissing?: boolean;
+  createMissing?: boolean;
+};
+type IPolyglotOptions = {
+  phrases?: IDictionary;
+  locale?: string;
+  allowMissing?: boolean;
+  onMissingKey?: (key: string, options: IPolyglotOptions, locale: string) => string;
+  interpolation?: {
+    prefix?: string;
+    suffix?: string;
+  };
+};
+
+function createI18nProvider(data: ICreateI18nProviderData): Promise<any> {
+  const { apiUrl, defaultLocale, allowMissing = false, createMissing = false } = data,
+    defaultLanguages: Array<Locale> = [{ locale: defaultLocale, name: defaultLocale }],
+    headers = new Headers({ Accept: 'application/json', 'Content-Type': 'application/json' }),
+    missingMessageHandler = new MissingMessageHandler({ apiUrl: apiUrl }),
+    getLanguages = (): Promise<Locale> => {
+      return fetch(`${apiUrl}/i18n/languages`, { headers: headers, method: 'get' })
+        .then((response) => response.json())
+        .then((response) => {
+          const { responseCode, locales } = response;
+          return responseCode !== 'ok' ? defaultLanguages : locales;
+        })
+        .catch(() => {
+          return Promise.resolve(defaultLanguages);
+        });
+    },
+    getMessages = (): Promise<ITranslations> => {
+      return fetch(`${apiUrl}/i18n/messages`, { headers: headers, method: 'get' })
+        .then((response) => response.json())
+        .then((response: Array<IMessage>): ITranslations => {
+          return response.reduce(
+            (messages: ITranslations, message: IMessage) => ({
+              ...messages,
+              [message.lang]: {
+                ...(messages[message.lang] || {}),
+                [message.code]: message.text
+              }
+            }),
+            {}
+          );
+        });
+    },
+    onMissingKey = (key: string, options: IPolyglotOptions, locale: string): string => {
+      if (!allowMissing) {
+        //eslint-disable-next-line
+        console.error(`Warning: Missing translation for key: "${key}"`);
+      }
+      if (createMissing) {
+        if (!_.isString(key)) {
+          //eslint-disable-next-line
+          console.error('[createI18nProvider] onMissingKey: provided key is not a string');
+        } else if (key.match(new RegExp(/[\s[\]]/, 'gm'))) {
+          //eslint-disable-next-line
+          console.error(`[createI18nProvider] onMissingKey: illegal character in key ${key}`);
+        } else {
+          missingMessageHandler.handleMessage({ code: key, lang: locale });
+        }
+      }
+      return key;
+    };
+
+  return Promise.all([getLanguages(), getMessages()]).then((responses) => {
+    const [languages, messages] = responses;
+    function getMessages(locale: string): TranslationMessages {
+      //@ts-ignore
+      return _.get(messages, locale, {});
+    }
+    return polyglotI18nProvider(getMessages, defaultLocale, languages, {
+      allowMissing: allowMissing || createMissing,
+      onMissingKey: onMissingKey
+    });
+  });
+}
+
+export type { ICreateI18nProviderData };
+
+export default createI18nProvider;

package/src/i18n/index.jsx

@@ -1,4 +1,3 @@
 export { default as createI18nProvider } from './createI18nProvider';
-export { default as useI18nCatcher } from './useI18nCatcher';
 export { default as useI18nLanguages } from './useI18nLanguages';
 export { default as useI18nProvider } from './useI18nProvider';

package/src/i18n/useI18nProvider.tsx

@@ -0,0 +1,23 @@
+import { useEffect, useState } from 'react';
+import createI18nProvider, { ICreateI18nProviderData } from './createI18nProvider';
+import { useMemoizedObject } from '../hooks';
+import { I18nProvider } from 'ra-core';
+
+function useI18nProvider(data: ICreateI18nProviderData): undefined | I18nProvider | { error: boolean } {
+  const [provider, setProvider] = useState<undefined | I18nProvider | { error: boolean }>(),
+    memoizedData = useMemoizedObject(data);
+
+  useEffect(() => {
+    createI18nProvider(memoizedData)
+      .then((provider) => {
+        setProvider(provider);
+      })
+      .catch(() => {
+        setProvider({ error: true });
+      });
+  }, [memoizedData]);
+
+  return provider;
+}
+
+export default useI18nProvider;

package/dist/i18n/useI18nCatcher.d.ts

@@ -1,28 +0,0 @@
-export type I18nCatcherBodyBuilderResultProps = {
-    lang: string;
-    code: string;
-    text: string;
-} | {
-    message: {
-        lang: string;
-        code: string;
-        text: string;
-    };
-};
-export type I18nCatcherBodyBuilderProps = (lang: string, message: string) => I18nCatcherBodyBuilderResultProps;
-export type UseI18nCatcherProps = {
-    apiUrl: string;
-    enabled?: boolean;
-    endpoint?: string;
-    loading?: boolean;
-    bodyBuilder: I18nCatcherBodyBuilderProps;
-};
-/**
- * Hook che consente di catturare ed inoltrare al server API le stringhe non tradotte.
- *
- * @param {UseI18nCatcherProps}
- * @returns {boolean}
- */
-declare const useI18nCatcher: ({ apiUrl, enabled, endpoint, loading, bodyBuilder }: UseI18nCatcherProps) => boolean;
-export default useI18nCatcher;
-//# sourceMappingURL=useI18nCatcher.d.ts.map

package/dist/i18n/useI18nCatcher.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useI18nCatcher.d.ts","sourceRoot":"","sources":["../../../src/i18n/useI18nCatcher.ts"],"names":[],"mappings":"AAOA,MAAM,MAAM,iCAAiC,GACzC;IACE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd,GACD;IACE,OAAO,EAAE;QACP,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;CACH,CAAC;AAEN,MAAM,MAAM,2BAA2B,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,iCAAiC,CAAC;AA0B/G,MAAM,MAAM,mBAAmB,GAAG;IAChC,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,2BAA2B,CAAC;CAC1C,CAAC;AAEF;;;;;GAKG;AACH,QAAA,MAAM,cAAc,wDAUjB,mBAAmB,YAmCrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/src/i18n/createI18nProvider.jsx

@@ -1,15 +0,0 @@
-import { get } from 'lodash';
-import polyglotI18nProvider from 'ra-i18n-polyglot';
-
-const createI18nProvider = ({ languages, defaultLocale, allowMissing = false }) =>
-  polyglotI18nProvider(
-    (locale) => {
-      const messages = get(languages, locale, {});
-      return messages;
-    },
-    defaultLocale,
-    [{ locale: defaultLocale }],
-    { allowMissing }
-  );
-
-export default createI18nProvider;