@applica-software-guru/react-admin 1.4.226 → 1.5.230

package/src/components/third-party/{SimpleBar.jsx → SimpleBar.tsx}

@@ -1,21 +1,16 @@
-import 'simplebar/dist/simplebar.min.css';
-
-import { BrowserView, MobileView } from 'react-device-detect';
-import { alpha, styled } from '@mui/material/styles';
-
 import { Box } from '@mui/material';
-import PropTypes from 'prop-types';
-import SimpleBar from 'simplebar-react';
+import { alpha, styled } from '@mui/material/styles';
+import { BrowserView, MobileView } from 'react-device-detect';
+import { default as SimpleBarReact } from 'simplebar-react';
+import 'simplebar/dist/simplebar.min.css';
 
-// root style
 const RootStyle = styled(BrowserView)({
   flexGrow: 1,
   height: '100%',
   overflow: 'hidden'
 });
 
-// scroll bar wrapper
-const SimpleBarStyle = styled(SimpleBar)(({ theme }) => ({
+const SimpleBarStyle = styled(SimpleBarReact)(({ theme }) => ({
   maxHeight: '100%',
   '& .simplebar-scrollbar': {
     '&:before': {
@@ -35,13 +30,15 @@ const SimpleBarStyle = styled(SimpleBar)(({ theme }) => ({
     zIndex: 'inherit'
   }
 }));
-
-// ==============================|| SIMPLE SCROLL BAR  ||============================== //
-
-export default function SimpleBarScroll({ children, sx, ...other }) {
+type SimpleBarProps = {
+  children: React.ReactNode;
+  sx?: object;
+};
+function SimpleBar({ children, sx, ...other }: SimpleBarProps) {
   return (
     <>
       <RootStyle>
+        {/* @ts-ignore */}
         <SimpleBarStyle timeout={500} clickOnTrack={false} sx={sx} {...other}>
           {children}
         </SimpleBarStyle>
@@ -55,7 +52,4 @@ export default function SimpleBarScroll({ children, sx, ...other }) {
   );
 }
 
-SimpleBarScroll.propTypes = {
-  children: PropTypes.node,
-  sx: PropTypes.object
-};
+export { SimpleBar };

package/src/components/third-party/index.ts

@@ -0,0 +1 @@
+export * from './SimpleBar';

package/src/dev/CatchResult.ts

@@ -1,11 +1,11 @@
-export type CatchResultConstructorData = {
+type CatchResultConstructorData = {
   catch: boolean;
   display: boolean;
   log: boolean;
   error?: string;
 };
 
-export default class CatchResult {
+class CatchResult {
   catch: boolean;
   display: boolean;
   log: boolean;
@@ -30,3 +30,6 @@ export default class CatchResult {
     return this.display;
   }
 }
+
+export { CatchResult };
+export type { CatchResultConstructorData };

package/src/dev/ErrorEventHandler.ts

@@ -1,9 +1,10 @@
 import _ from 'lodash';
-export type IErrorEventHandlerConstructData = {
+
+type IErrorEventHandlerConstructData = {
   apiUrl: string;
 };
 
-export interface IErrorEventHandler {
+interface IErrorEventHandler {
   handle(event: ErrorEvent): void;
 }
 
@@ -37,7 +38,7 @@ class ErrorEventHandler implements IErrorEventHandler {
         message: error.message,
         line: error.lineno,
         column: error.colno,
-        stack: error.error?.stack,
+        stack: error.error?.stack
       })
     }).catch((error) => {
       // eslint-disable-next-line no-console
@@ -48,4 +49,5 @@ class ErrorEventHandler implements IErrorEventHandler {
   }
 }
 
-export default ErrorEventHandler;
+export { ErrorEventHandler };
+export type { IErrorEventHandler, IErrorEventHandlerConstructData };

package/src/dev/index.ts

@@ -1,4 +1,3 @@
-import useErrorEventCatcher from './useErrorEventCatcher';
-import CatchResult from './CatchResult';
-import ErrorEventHandler from './ErrorEventHandler';
-export { useErrorEventCatcher, CatchResult, ErrorEventHandler };
+export * from './CatchResult';
+export * from './ErrorEventHandler';
+export * from './useErrorEventCatcher';

package/src/dev/useErrorEventCatcher.ts

@@ -1,11 +1,8 @@
-/* eslint-disable prefer-spread */
-/* eslint-disable prefer-rest-params */
-/* eslint-disable no-console */
+import { CatchResult } from './CatchResult';
+import { ErrorEventHandler, IErrorEventHandler } from './ErrorEventHandler';
 import * as React from 'react';
-import ErrorEventHandler, { IErrorEventHandler } from './ErrorEventHandler';
-import CatchResult from './CatchResult';
 
-export type UseErrorEventCatcherProps = {
+type UseErrorEventCatcherProps = {
   apiUrl: string;
   enabled?: boolean;
   loading?: boolean;
@@ -13,13 +10,13 @@ export type UseErrorEventCatcherProps = {
   errorHandler?: IErrorEventHandler;
 };
 
-const useErrorEventCatcher = ({
+function useErrorEventCatcher({
   enabled = true,
   apiUrl,
   loading,
   catcherFn = (error) => new CatchResult({ catch: error != undefined, display: false, log: error != undefined, error }),
   ...props
-}: UseErrorEventCatcherProps) => {
+}: UseErrorEventCatcherProps) {
   const errorHandler = React.useMemo(() => {
     if (props.errorHandler) {
       return props.errorHandler;
@@ -33,7 +30,9 @@ const useErrorEventCatcher = ({
         return false;
       }
 
-      const catchResult = catcherFn(event instanceof ErrorEvent ? event : event?.toString()?.replace(/%s/g, () => args.shift()));
+      const catchResult = catcherFn(
+        event instanceof ErrorEvent ? event : event?.toString()?.replace(/%s/g, () => args.shift())
+      );
       if (catchResult.isCatched()) {
         return false;
       }
@@ -46,10 +45,12 @@ const useErrorEventCatcher = ({
       }
 
       if (catchResult.displayError()) {
+        // eslint-disable-next-line prefer-rest-params
         consoleError.apply(console, arguments as any);
       }
+      return false;
     },
-    [apiUrl, loading, catcherFn, enabled, errorHandler]
+    [catcherFn, errorHandler, consoleError]
   );
   React.useEffect(() => {
     window.removeEventListener('error', handleError);
@@ -59,7 +60,7 @@ const useErrorEventCatcher = ({
       window.removeEventListener('error', handleError);
       console.error = consoleError;
     };
-  }, [handleError]);
+  }, [handleError, consoleError]);
   return true;
-};
-export default useErrorEventCatcher;
+}
+export { useErrorEventCatcher };

package/src/hooks/index.ts

@@ -1,14 +1,7 @@
-export { default as useAppConfig } from './useAppConfig';
-export { default as useBreadcrumbs } from './useBreadcrumbs';
-export { default as useLocalStorage } from './useLocalStorage';
-export { default as useMenu } from './useMenu';
-export { default as useMenuConfig } from './useMenuConfig';
-export { default as useResourceTitle } from './useResourceTitle';
-export { default as useTableFormIterator } from './useTableFormIterator';
-export { default as useTableFormIteratorItem } from './useTableFormIteratorItem';
-export { default as useThemeConfig } from './useThemeConfig';
-export { useLocalizedValue, useGetLocalizedValue } from './useLocalizedValue';
-export { useMemoizedObject } from './useMemoizedObject';
-export { usePopoverState } from './usePopoverState';
-export { useRefDimensions } from './useRefDimensions';
-export { useSx } from './mui';
+export * from './mui';
+export * from './useLocalStorage';
+export * from './useLocalizedValue';
+export * from './useMemoizedObject';
+export * from './usePopoverState';
+export * from './useRefDimensions';
+export * from './useResourceTitle';

package/src/hooks/mui.ts

@@ -1,6 +1,6 @@
-import _ from 'lodash';
 import { SxProps } from '@mui/material';
-import { ComponentProps, useState, useEffect } from 'react';
+import _ from 'lodash';
+import { ComponentProps, useEffect, useState } from 'react';
 
 type IUseSxOptions = {
   defaults?: boolean;

package/src/hooks/useLocalStorage.tsx

@@ -1,7 +1,7 @@
+import { LocalStorage } from '@/utils';
 import _ from 'lodash';
 import { useEffect, useRef, useState } from 'react';
 import * as yup from 'yup';
-import { LocalStorage } from '../utils/localStorage';
 
 const localStorageInstance = new LocalStorage();
 
@@ -18,11 +18,11 @@ function buildSetter(key: string, currentValue: unknown, callback: ISetter): ISe
 
 function useLocalStorage(key: string, defaultValue?: unknown): [unknown, (newValue: unknown) => unknown] {
   yup.string().required().validateSync(key);
-  const [state, setState] = useState(localStorageInstance.get(key) ?? defaultValue),
-    defaultValueRef = useRef<unknown | undefined>(defaultValue),
-    storedDefaultValue = _.isEqual(defaultValueRef.current, defaultValue) ? defaultValueRef.current : defaultValue,
-    setterRef = useRef<{ key: string; value: unknown; setter: ISetter } | undefined>(),
-    storedSetter = setterRef.current;
+  const [state, setState] = useState(localStorageInstance.get(key) ?? defaultValue);
+  const defaultValueRef = useRef<unknown | undefined>(defaultValue);
+  const storedDefaultValue = _.isEqual(defaultValueRef.current, defaultValue) ? defaultValueRef.current : defaultValue;
+  const setterRef = useRef<{ key: string; value: unknown; setter: ISetter } | undefined>();
+  const storedSetter = setterRef.current;
 
   useEffect(() => {
     setState(localStorageInstance.get(key) ?? storedDefaultValue);
@@ -45,4 +45,4 @@ function useLocalStorage(key: string, defaultValue?: unknown): [unknown, (newVal
   return [state, setterRef.current?.setter ?? _.noop];
 }
 
-export default useLocalStorage;
+export { useLocalStorage };

package/src/hooks/useLocalizedValue.tsx

@@ -1,5 +1,5 @@
+import { IGetLocalizedValueOptions, ILocalizedValue, getLocalizedValue } from '@/utils';
 import { useLocaleState } from 'ra-core';
-import { IGetLocalizedValueOptions, ILocalizedValue, getLocalizedValue } from '../utils';
 import { useCallback } from 'react';
 
 function useLocale(locale?: string): string {
@@ -12,23 +12,23 @@ type IUseLocalizeValueOptions = IGetLocalizedValueOptions & {
   locale?: string;
 };
 function useLocalizedValue<T>(value: ILocalizedValue<T>, options?: IUseLocalizeValueOptions): T | undefined {
-  const language = useLocale(options?.locale),
-    localizedValue = getLocalizedValue<T>(value, language, options);
+  const language = useLocale(options?.locale);
+  const localizedValue = getLocalizedValue<T>(value, language, options);
 
   return localizedValue;
 }
 
 type IUseGetLocalizeValueOptions = IUseLocalizeValueOptions;
 function useGetLocalizedValue<T>(options?: IUseGetLocalizeValueOptions): (v: ILocalizedValue<T>) => T | undefined {
-  const language = useLocale(options?.locale),
-    callback = useCallback(
-      (value: ILocalizedValue<T>) => {
-        return getLocalizedValue<T>(value, language, options);
-      },
-      [language, options]
-    );
+  const language = useLocale(options?.locale);
+  const callback = useCallback(
+    (value: ILocalizedValue<T>) => {
+      return getLocalizedValue<T>(value, language, options);
+    },
+    [language, options]
+  );
 
   return callback;
 }
 
-export { useLocalizedValue, useGetLocalizedValue };
+export { useGetLocalizedValue, useLocalizedValue };

package/src/hooks/usePopoverState.tsx

@@ -1,20 +1,23 @@
 import { MouseEvent, useCallback, useState } from 'react';
 
 function usePopoverState() {
-  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null),
-    open = Boolean(anchorEl),
-    handleClick = useCallback((e: MouseEvent<HTMLElement> | undefined) => setAnchorEl(e?.currentTarget ?? null), [setAnchorEl]),
-    handleClose = useCallback(() => setAnchorEl(null), [setAnchorEl]),
-    handleToggle = useCallback(
-      (e: MouseEvent<HTMLElement> | undefined) => {
-        if (!open) {
-          handleClick(e);
-        } else {
-          handleClose();
-        }
-      },
-      [open, handleClick, handleClose]
-    );
+  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);
+  const open = Boolean(anchorEl);
+  const handleClick = useCallback(
+    (e: MouseEvent<HTMLElement> | undefined) => setAnchorEl(e?.currentTarget ?? null),
+    [setAnchorEl]
+  );
+  const handleClose = useCallback(() => setAnchorEl(null), [setAnchorEl]);
+  const handleToggle = useCallback(
+    (e: MouseEvent<HTMLElement> | undefined) => {
+      if (!open) {
+        handleClick(e);
+      } else {
+        handleClose();
+      }
+    },
+    [open, handleClick, handleClose]
+  );
 
   return {
     anchorEl: anchorEl,

package/src/hooks/useRefDimensions.ts

@@ -1,5 +1,5 @@
 import _ from 'lodash';
-import { useEffect, RefObject, useState } from 'react';
+import { RefObject, useEffect, useState } from 'react';
 
 enum DimensionType {
   CLIENT = 'client',
@@ -9,13 +9,13 @@ enum DimensionType {
 }
 
 function useRefDimensions(ref: RefObject<HTMLElement | undefined>, type?: DimensionType) {
-  const [dimensions, setDimensions] = useState({ width: 1, height: 1 }),
-    current = ref.current;
+  const [dimensions, setDimensions] = useState({ width: 1, height: 1 });
+  const current = ref.current;
 
   useEffect(() => {
     function updateDimensions() {
-      let width = 0,
-        height = 0;
+      let width = 0;
+      let height = 0;
       switch (type) {
         case DimensionType.CLIENT:
           width = current?.clientWidth ?? 0;
@@ -53,7 +53,7 @@ function useRefDimensions(ref: RefObject<HTMLElement | undefined>, type?: Dimens
     return () => {
       resizeObserver.disconnect();
     };
-  }, [current, type]);
+  }, [current, type, ref]);
 
   return dimensions;
 }

package/src/hooks/useResourceTitle.ts

@@ -1,6 +1,5 @@
-import { useRecordContext, useResourceContext, useTranslate } from 'react-admin';
-
 import { useMemo } from 'react';
+import { useRecordContext, useResourceContext, useTranslate } from 'react-admin';
 
 /**
  * Generate the title of a resource page from its name and the current record.
@@ -8,7 +7,7 @@ import { useMemo } from 'react';
  * @param title Can be the resource name, a fully qualified translation key, or a boolean to disable the title
  * @returns The title of the resource, based on the current record and the resource name
  */
-export function useResourceTitle(title: string | boolean | undefined): string | boolean | undefined {
+function useResourceTitle(title: string | boolean | undefined): string | boolean | undefined {
   const record = useRecordContext();
   const translate = useTranslate();
   const resource = useResourceContext();
@@ -31,4 +30,4 @@ export function useResourceTitle(title: string | boolean | undefined): string |
   return cardTitle;
 }
 
-export default useResourceTitle;
+export { useResourceTitle };

package/src/i18n/MissingMessageHandler.ts

@@ -41,7 +41,11 @@ class MissingMessageHandler implements IMissingMessageHandler {
       return;
     } else {
       this.#handledMessages.push({ code, lang });
-      fetch(`${this.#apiUrl}/i18n/message`, { method: 'put', headers: this.#headers, body: JSON.stringify({ code, lang, text: code }) })
+      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
@@ -57,4 +61,4 @@ class MissingMessageHandler implements IMissingMessageHandler {
   }
 }
 
-export default MissingMessageHandler;
+export { MissingMessageHandler };

package/src/i18n/createI18nProvider.tsx

@@ -1,7 +1,7 @@
-import { Locale, TranslationMessages } from 'ra-core';
-import polyglotI18nProvider from 'ra-i18n-polyglot';
+import { MissingMessageHandler } from './MissingMessageHandler';
 import _ from 'lodash';
-import MissingMessageHandler from './MissingMessageHandler';
+import { Locale, TranslationMessages } from 'ra-core';
+import { default as polyglotI18nProvider } from 'ra-i18n-polyglot';
 
 type IMessage = {
   id: string;
@@ -29,51 +29,51 @@ type IPolyglotOptions = {
 };
 
 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())
-        .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) {
+  const { apiUrl, defaultLocale, allowMissing = false, createMissing = false } = data;
+  const defaultLanguages: Array<Locale> = [{ locale: defaultLocale, name: defaultLocale }];
+  const headers = new Headers({ Accept: 'application/json', 'Content-Type': 'application/json' });
+  const missingMessageHandler = new MissingMessageHandler({ apiUrl: apiUrl });
+  function getLanguages(): Promise<Locale> {
+    return fetch(`${apiUrl}/i18n/languages`, { headers: headers, method: 'get' })
+      .then((response) => response.json())
+      .catch(() => {
+        return Promise.resolve(defaultLanguages);
+      });
+  }
+  function 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
+            }
+          }),
+          {}
+        );
+      });
+  }
+  function 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(`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 });
-        }
+        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 key;
+  }
 
   return Promise.all([getLanguages(), getMessages()]).then((responses) => {
     const [languages, messages] = responses;
@@ -89,5 +89,4 @@ function createI18nProvider(data: ICreateI18nProviderData): Promise<any> {
 }
 
 export type { ICreateI18nProviderData };
-
-export default createI18nProvider;
+export { createI18nProvider };

package/src/i18n/index.jsx

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

package/src/i18n/useI18nLanguages.ts

@@ -0,0 +1,26 @@
+import { useEffect, useState } from 'react';
+
+type UseI18nLanguagesProps = {
+  apiUrl: string;
+  endpoint?: string;
+  mapper?: (response: any) => any;
+};
+function useI18nLanguages({
+  apiUrl,
+  endpoint = '/languages/load',
+  mapper = ({ data }) => ({ data })
+}: UseI18nLanguagesProps) {
+  const [data, setData] = useState({ loading: true, languages: null });
+  useEffect(() => {
+    const headers = new Headers();
+    headers.append('Accept', 'application/json');
+    headers.append('Content-Type', 'application/json');
+    fetch(`${apiUrl}${endpoint}`, { headers })
+      .then((response) => response.json())
+      .then((response) => setData({ loading: false, ...mapper(response) }));
+  }, [apiUrl, endpoint, mapper]);
+
+  return data;
+}
+
+export { useI18nLanguages };

package/src/i18n/useI18nProvider.tsx

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

package/src/index.d.ts

@@ -0,0 +1 @@
+declare module '*.png';