@dashadmin/dash-admin 1.3.73 → 1.3.74-srcfree.2

package/src/components/i18n/BridgedLocalesMenuButton.tsx

@@ -1,160 +0,0 @@
-/**
- * BridgedLocalesMenuButton
- * 
- * A custom locale menu button that uses the bridged i18nProvider
- * instead of React Admin's context-based provider.
- * 
- * This is necessary because AppMaterialMenu renders outside AdminContext,
- * so it can't access the custom i18nProvider with getLocales().
- */
-import React, { useState, useCallback } from 'react';
-import { Menu, MenuItem, Button, Tooltip, IconButton } from '@mui/material';
-import TranslateIcon from '@mui/icons-material/Translate';
-import LanguageIcon from '@mui/icons-material/Language';
-import { useI18nBridge, useBridgedLocales } from '../../contexts/I18nBridgeContext';
-import { useLocaleState } from 'react-admin';
-import { useDispatch } from 'react-redux';
-import { DASH_REDUX_ACTIONS } from 'dash-admin-state';
-
-interface BridgedLocalesMenuButtonProps {
-    /** Show icon only (compact mode) */
-    iconOnly?: boolean;
-    /** Custom icon */
-    icon?: React.ReactNode;
-}
-
-const BridgedLocalesMenuButton: React.FC<BridgedLocalesMenuButtonProps> = ({ 
-    iconOnly = true,
-    icon = <LanguageIcon />
-}) => {
-    const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
-    const locales = useBridgedLocales();
-    const { i18nProvider, locale: currentLocale, setLocale: setBridgedLocale } = useI18nBridge();
-    // We still use RA's useLocaleState but only to SET it if needed, 
-    // though we should really just use the bridge
-    const [, setRALocale] = useLocaleState();
-
-    const handleClick = useCallback((event: React.MouseEvent<HTMLElement>) => {
-        setAnchorEl(event.currentTarget);
-    }, []);
-
-    const handleClose = useCallback(() => {
-        setAnchorEl(null);
-    }, []);
-
-    const dispatch = useDispatch(); // Add dispatch
-    
-    const handleLocaleChange = useCallback(async (locale: string) => {
-        console.log('🌐 BridgedLocalesMenuButton: Changing locale to:', locale);
-        
-        // Use bridged provider to change locale (async)
-        // This updates the actual translation provider logic/internal state
-        if (i18nProvider?.changeLocale) {
-            console.log('🌐 BridgedLocalesMenuButton: Awaiting changeLocale...');
-            try {
-                await i18nProvider.changeLocale(locale);
-                console.log('🌐 BridgedLocalesMenuButton: changeLocale complete.');
-            } catch (error) {
-                console.error('🌐 BridgedLocalesMenuButton: changeLocale failed:', error);
-            }
-        }
-        
-        // Persist locale to localStorage for persistence across page reloads
-        try {
-            localStorage.setItem('dash-user-locale', locale);
-            console.log('🌐 BridgedLocalesMenuButton: Persisted locale to localStorage:', locale);
-        } catch (e) {
-            console.warn('🌐 BridgedLocalesMenuButton: Failed to persist locale to localStorage:', e);
-        }
-        
-        // UPDATE STATE LAST (after provider is ready)
-        // This triggers re-render. Since provider is ready, translations will be correct.
-        console.log('🌐 BridgedLocalesMenuButton: Updating state...');
-        
-        // 1. Update Redux state (Critical for DASHAdmin and ResourceTemplate propagation)
-        // We pass the full object if needed, but the reducer seems to handle the payload directly or we might need to check if it expects a string or object.
-        // Looking at SettingsReducer: locale: action.payload.
-        // Looking at SettingsReducer initial state: locale is an object { languageId, locale, name, icon }.
-        // But switchLanguage action just takes 'locale'.
-        // If the reducer replaces the WHOLE state.locale object with a string, it might break other things IF they expect an object.
-        // Let's check Settting.tsx: dispatch({ type: SWITCH_LANGUAGE, payload: locale });
-        // Let's check SettingsReducer: return { ...state, locale: action.payload };
-        // If action.payload is a string 'en', then state.settings.locale becomes 'en'.
-        // DASHAdmin selectLocale returns state.settings.locale.
-        // AsyncResources expects locale (any).
-        // It seems DASHAdmin handles it being a string.
-        dispatch(DASH_REDUX_ACTIONS.switchLanguage(locale) as any);
-
-        // 2. Update Bridged Context
-        setBridgedLocale(locale);
-        
-        // 3. Update React Admin State
-        setRALocale(locale);
-        
-        handleClose();
-    }, [i18nProvider, setBridgedLocale, setRALocale, handleClose, dispatch]);
-
-    // Don't render if no locales available
-    if (!locales || locales.length <= 1) {
-        console.log('🌐 BridgedLocalesMenuButton: Not rendering - locales:', locales);
-        return null;
-    }
-
-    console.log('🌐 BridgedLocalesMenuButton: Rendering with locales:', locales, 'current:', currentLocale);
-
-    const open = Boolean(anchorEl);
-    const currentLocaleName = locales.find(l => l.locale === currentLocale)?.name || currentLocale;
-
-    return (
-        <>
-            {iconOnly ? (
-                <Tooltip title={`Language: ${currentLocaleName}`}>
-                    <IconButton
-                        onClick={handleClick}
-                        className="dash-icon-button-color dash-icon-button-bg"
-                        aria-label="change language"
-                        aria-controls={open ? 'locale-menu' : undefined}
-                        aria-haspopup="true"
-                        aria-expanded={open ? 'true' : undefined}
-                    >
-                        {icon}
-                    </IconButton>
-                </Tooltip>
-            ) : (
-                <Button
-                    onClick={handleClick}
-                    color="inherit"
-                    startIcon={icon}
-                    aria-controls={open ? 'locale-menu' : undefined}
-                    aria-haspopup="true"
-                    aria-expanded={open ? 'true' : undefined}
-                >
-                    {currentLocaleName}
-                </Button>
-            )}
-            <Menu
-                id="locale-menu"
-                anchorEl={anchorEl}
-                open={open}
-                onClose={handleClose}
-                slotProps={{
-                    list: {
-                        'aria-labelledby': 'locale-button',
-                    }
-                }}
-            >
-                {locales.map((localeOption) => (
-                    <MenuItem
-                        key={localeOption.locale}
-                        selected={localeOption.locale === currentLocale}
-                        onClick={() => handleLocaleChange(localeOption.locale)}
-                    >
-                        {localeOption.name || localeOption.locale}
-                    </MenuItem>
-                ))}
-            </Menu>
-        </>
-    );
-};
-
-export default BridgedLocalesMenuButton;

package/src/components/i18n/LangSwitcher.tsx

@@ -1,204 +0,0 @@
-import * as React from 'react';
-import { MouseEvent, useState, useRef, useEffect } from 'react';
-import { Avatar, useMediaQuery, useTheme } from '@mui/material';
-import LanguageIcon from '@mui/icons-material/Translate';
-import ReactDOM from 'react-dom';
-import { useWindowSize } from 'dash-utils';
-import { useLocales, useLocaleState } from '../../hooks/usePolyglotTranslation';
-import { useBridgedChangeLocale } from '../../contexts/I18nBridgeContext';
-const DefaultIcon = <LanguageIcon />;
-
-export interface LanguageSwitcherButtonProps {
-    icon?: React.ReactNode;
-    languages?: { locale: string; name: string }[];
-}
-
-const LangSwitcher = (props: LanguageSwitcherButtonProps) => {
-    const { icon = DefaultIcon, languages: languagesProp } = props;
-    const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
-    
-    const languages = useLocales({ locales: languagesProp });
-    const [locale, setLocale] = useLocaleState();
-    const changeBridgedLocale = useBridgedChangeLocale();
-
-    const theme = useTheme();
-    const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'));
-    const [webView, setWebView] = useState<boolean>(false);
-    const [open, setOpen] = useState(false);
-    const avatarRef = useRef<HTMLDivElement>(null);
-    const menuRef = useRef<HTMLDivElement>(null);
-    const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0 });
-    const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-
-    const windowSize = useWindowSize();
-    useEffect(() => {
-        if(document.body.classList.contains('webview')) {
-            setWebView(true)
-        } else {
-            setWebView(false)
-        }
-    }, []);
-
-    const getNameForLocale = (locale: string): string => {
-        const language = languages.find(language => language.locale === locale);
-        return language ? language.name : '';
-    };
-
-    const changeLocale = (newLocale: string) => (): void => {
-        setLocale(newLocale);
-        // Also update the bridge context so components like AppMaterialMenu re-render
-        changeBridgedLocale(newLocale);
-        setOpen(false);
-    };
-
-  const calculateMenuPosition = () => {
-    if (avatarRef.current && windowSize.width) {
-        const rect = avatarRef.current.getBoundingClientRect();
-        const menuWidth = 200; // minWidth from styles
-        
-        let left = rect.left + window.scrollX;
-        
-        // Ensure menu doesn't go off-screen using windowSize
-        if (left + menuWidth > windowSize.width) {
-            left = windowSize.width - menuWidth - 10; // 10px margin
-        }
-        if (left < 10) {
-            left = 10; // 10px margin
-        }
-        
-        setMenuPosition({ 
-            top: rect.top + window.scrollY + 30, 
-            left: left
-        });
-    }
-};
-
-    const handleLanguageMouseEnter = (e: React.MouseEvent<HTMLDivElement>) => {
-        e.preventDefault();
-        
-        // Clear any existing timeout
-        if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current);
-            timeoutRef.current = null;
-        }
-        
-        setOpen(true);
-        calculateMenuPosition();
-    };
-
-    const handleLanguageClick = (e: React.MouseEvent<HTMLDivElement>) => {
-        e.preventDefault();
-        setOpen(prevOpen => !prevOpen);
-        calculateMenuPosition();
-    };
-
-    const handleMouseLeave = () => {
-        if (!webView) {
-            // Add a small delay before closing to allow moving to menu
-            timeoutRef.current = setTimeout(() => {
-                setOpen(false);
-            }, 100);
-        }
-    };
-
-    const handleMenuMouseEnter = () => {
-        // Clear timeout when entering menu
-        if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current);
-            timeoutRef.current = null;
-        }
-    };
-
-    const handleMenuMouseLeave = () => {
-        if (!webView) {
-            setOpen(false);
-        }
-    };
-
-    // Cleanup timeout on unmount
-    useEffect(() => {
-        return () => {
-            if (timeoutRef.current) {
-                clearTimeout(timeoutRef.current);
-            }
-        };
-    }, []);
-
-    // Recalculate position on screen resize
-    useEffect(() => {
-        const handleResize = () => {
-            if (open) {
-                calculateMenuPosition();
-            }
-        };
-
-        window.addEventListener('resize', handleResize);
-        return () => window.removeEventListener('resize', handleResize);
-    }, [open, isSmallScreen]);
-
-    return (
-        <>
-            <div
-                ref={avatarRef}
-               
-                {... !webView ? { 
-                    onMouseEnter: handleLanguageMouseEnter, 
-                    onMouseLeave: handleMouseLeave 
-                } : { 
-                    onClick: handleLanguageClick 
-                }}
-            >
-                <Avatar 
-                    sizes='small' 
-                    sx={{ fontSize: '1rem' }}
-                    style={{
-                        width: '30px',
-                        height: '30px',
-                        minHeight: '30px'
-                    }}
-                  className='dash-icon-button-color dash-icon-button-bg'
-                >
-                    {getNameForLocale(locale).substring(0, 2).toUpperCase()}
-                </Avatar>
-            </div>
-
-            {open && ReactDOM.createPortal(
-                <div 
-                    ref={menuRef}
-                    className="dash-language-menu-portal"
-                    onMouseEnter={!webView ? handleMenuMouseEnter : undefined}
-                    onMouseLeave={!webView ? handleMenuMouseLeave : undefined}
-                >
-                    <div
-                        className={`dash-language-menu ${open ? 'show' : ''}`}
-                        style={{
-                            zIndex: 10000,
-                            position: 'absolute',
-                            top: menuPosition.top,
-                            left: menuPosition.left,
-                        }}
-                    >
-                        {languages.map(language => (
-                            <div
-                                key={language.locale}
-                                className={`dash-language-menu-item ${language.locale === locale ? 'selected' : ''}`}
-                                onClick={changeLocale(language.locale)}
-                                style={{
-                                    padding: '8px 16px',
-                                    cursor: 'pointer',
-                                    backgroundColor: language.locale === locale ? 'rgba(0, 0, 0, 0.08)' : 'transparent',
-                                    minWidth: '150px'
-                                }}
-                            >
-                                {language.name}
-                            </div>
-                        ))}
-                    </div>
-                </div>,
-                document.body
-            )}
-        </>
-    );
-};
-
-export default LangSwitcher;

package/src/components/loader/GlobalLoader.tsx

@@ -1,49 +0,0 @@
-/**
- * @author Francisco Aranda - @farandal - http://www.linkedin.com/in/farandal
- * @email farandal@gmail.com
- * @create date 2021-06-30
- * @desc @farandal React Boilerplate Framework - 2020
- */
-
-import { deepmerge } from '@mui/utils';
-
-import React, { PropsWithChildren, useEffect } from 'react';
-import useGlobalLoaderMgr from '../../hooks/useGlobalLoaderMgr';
-
-interface IGlobalLoader extends PropsWithChildren {
-	styles?: any;
-}
-
-const GlobalLoader: React.FC<IGlobalLoader> = ({
-	styles,
-    children,
-}) => {
-	const [loading] = useGlobalLoaderMgr();
-
-	useEffect(() => {
-		console.log('GlobalLoader loading state changed:', loading);
-	}, [loading]);
-
-    if (!loading) return null;
-
-    const wrapperStyle = deepmerge(
-        {
-            width: '100%',
-            height: '100%',
-            overflow: 'hidden',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-        },
-        styles?.wrapper
-    );
-
-    return (
-        <div className='loadingOverlay' style={wrapperStyle}>
-            {children}
-        </div>
-    );
-
-};
-
-export default GlobalLoader;

package/src/components/logs/LogFile.tsx

@@ -1,88 +0,0 @@
-import {
-  Button,
-  DialogActions,
-  DialogContent,
-  TextareaAutosize,
-} from '@mui/material';
-
-import React, { useEffect, useState } from 'react';
-import { useRecordContext } from 'react-admin';
-import useAxios from '../../hooks/axios';
-import { saveAs } from 'file-saver';
-import { ILog, ILogTxtFileComponent } from '../../interfaces/Log';
-import { IDashAutoAdminCustomFieldComponent } from 'dash-auto-admin';
-
-export const LogTxtFileComponent: React.FC<ILogTxtFileComponent> = ({
-  log,
-}) => {
-  const { axios } = useAxios();
-
-  const [logFile, setlogFile] = useState<Blob>(null);
-  const [logContent, setlogContent] = useState<string>(null);
-
-  const downloadLog = async () => {
-    let fileName = log.filepath.split('/')[log.filepath.split('/').length - 1];
-    saveAs(logFile, fileName);
-  };
-  const preLoadLog = async (logID) => {
-    if (log?.filepath) {
-      const { data: file } = await axios.get(`/system/log/${log.id}/download`, {
-        responseType: 'blob',
-      });
-
-      let fileContent = await file.text();
-
-      setlogFile(file);
-      setlogContent(fileContent);
-    } else {
-      setlogContent('Proceso completado correctamente');
-    }
-  };
-
-  useEffect(() => {
-    preLoadLog(log);
-  }, []);
-
-  return (
-    <DialogContent>
-      <TextareaAutosize
-        style={{ width: '100%' }}
-        maxRows={50}
-        defaultValue={logContent !== '' ? logContent : ' Cargando... '}
-      />
-      {log?.filepath && (
-        <DialogActions>
-          <Button onClick={() => downloadLog()}>Descargar</Button>{' '}
-        </DialogActions>
-      )}
-    </DialogContent>
-  );
-};
-
-const LogTxtFileEdit: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-  method,
-  attribute,
-}) => {
-  const log: ILog = useRecordContext();
-  return <LogTxtFileComponent log={log} />;
-};
-
-const LogTxtFileView: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-  method,
-  attribute,
-}) => {
-  const log: ILog = useRecordContext();
-  return <LogTxtFileComponent log={log} />;
-};
-
-const LogTxtFile = ({ method, attribute, resourceConfig }: IDashAutoAdminCustomFieldComponent) => {
-  switch (method) {
-    case 'edit':
-    case 'create':
-      return <LogTxtFileEdit attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-    case 'view':
-      return <LogTxtFileView attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-  }
-};
-
-export default LogTxtFile;

package/src/components/logs/LogFileById.tsx

@@ -1,68 +0,0 @@
-import {
-  Button,
-  DialogActions,
-  DialogContent,
-  TextareaAutosize,
-} from '@mui/material';
-
-import React, { useEffect, useState } from 'react';
-import useAxios from '../../hooks/axios';
-import { saveAs } from 'file-saver';
-
-interface LogFileByIdProps {
-  id: string | number;
-}
-
-export const LogFileById: React.FC<LogFileByIdProps> = ({ id }) => {
-  const { axios } = useAxios();
- 
-  const [logFile, setLogFile] = useState<Blob>(null);
-  const [logContent, setLogContent] = useState<string>(null);
-  const [filepath, setFilepath] = useState<string>(null);
-
-  const downloadLog = async () => {
-    if (filepath) {
-      let fileName = filepath.split('/')[filepath.split('/').length - 1];
-      saveAs(logFile, fileName);
-    }
-  };
-
-  const preLoadLog = async () => {
-    try {
-      const { data: file } = await axios.get(`/system/log/${id}/download`, {
-        responseType: 'blob',
-      });
-
-      const { data: logData } = await axios.get(`/system/log/${id}`);
-      setFilepath(logData.filepath);
-
-      let fileContent = await file.text();
-
-      setLogFile(file);
-      setLogContent(fileContent);
-    } catch (error) {
-      setLogContent('Error al cargar el archivo');
-    }
-  };
-
-  useEffect(() => {
-    preLoadLog();
-  }, [id]);
-
-  return (
-    <DialogContent>
-      <TextareaAutosize
-        style={{ width: '100%' }}
-        maxRows={50}
-        defaultValue={logContent !== '' ? logContent : ' Cargando... '}
-      />
-      {filepath && (
-        <DialogActions>
-          <Button onClick={downloadLog}>Descargar</Button>
-        </DialogActions>
-      )}
-    </DialogContent>
-  );
-};
-
-export default LogFileById;

package/src/components/logs/LogViewer.tsx

@@ -1,43 +0,0 @@
-import { IDashAutoAdminCustomFieldComponent } from 'dash-auto-admin';
-import React from 'react';
-import { useRecordContext } from 'react-admin';
-
-export interface ILogViewerComponent {
-	log: any;
-}
-export const LogViewerComponent: React.FC<ILogViewerComponent> = ({ log }) => {
-	return (
-		<>
-			<h1>Log</h1>
-		</>
-	);
-};
-
-const LogViewerEdit: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-	method,
-	attribute,
-}) => {
-	const log = useRecordContext();
-
-	return <>{log && <LogViewerComponent log={log} />}</>;
-};
-
-const LogViewerView: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-	method,
-	attribute,
-}) => {
-	const log: any = useRecordContext();
-	return <>{log && <LogViewerComponent log={log} />}</>;
-};
-
-const LogViewer = ({ method, attribute, resourceConfig }: IDashAutoAdminCustomFieldComponent) => {
-	switch (method) {
-		case 'edit':
-		case 'create':
-			return <LogViewerEdit attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-		case 'view':
-			return <LogViewerView attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-	}
-};
-
-export default LogViewer;

package/src/components/menu/AppMenu.tsx

@@ -1,22 +0,0 @@
-import * as React from 'react';
-
-export interface IAppMenu {
-  //hasDashboard: boolean;
-  children?: React.ReactNode;
-  autoHideScroll?: boolean;
-  [key: string]: any;
-}
-
-// Group icons
-export const AppMenu: React.FC<IAppMenu> = ({
-  hasDashboard,
-  autoHideScroll = false,
-  children,
-}) => {
-  
-  return (
-    <>
-      Deprecated
-    </>
-  );
-};

package/src/components/menu/CustomMenuItemLink.tsx

@@ -1,61 +0,0 @@
-import React, { forwardRef, useCallback, ReactElement, ReactNode } from 'react';
-import { styled } from '@mui/material/styles';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import { Link, LinkProps, useMatch } from 'react-router-dom';
-
-import { useTranslate, useBasename } from 'react-admin';
-import { useSidebarState } from 'react-admin';
-
-export type CustomMenuItemLinkProps = LinkProps & {
-	// @ts-ignore - JSX namespace issue
-	leftIcon?: JSX.Element;
-	primaryText?: ReactNode;
-};
-
-const MenuItemLink: React.FC<CustomMenuItemLinkProps> = (props /*, ref*/) => {
-	const { className, primaryText, leftIcon, onClick, ...rest } = props;
-
-	const translate = useTranslate();
-	const basename = useBasename();
-
-	const [open, setOpen] = useSidebarState();
-	const handleMenuTap = useCallback(
-		(e) => {
-			setOpen(false);
-
-			onClick && onClick(e);
-		},
-		[setOpen, onClick],
-	);
-
-	const to =
-		(typeof props.to === 'string' ? props.to : props.to.pathname) || '';
-	const match = useMatch({ path: to, end: to === `${basename}/` });
-
-	return (
-		<Link
-			className={clsx(className, {
-				[MenuItemLinkClasses.active]: !!match,
-			})}
-			//ref={ref}
-			tabIndex={0}
-			{...rest}
-			onClick={handleMenuTap}
-		>
-			{leftIcon && <span className={MenuItemLinkClasses.icon}>{leftIcon}</span>}
-			{typeof primaryText === 'string'
-				? translate(primaryText, { _: primaryText })
-				: primaryText}
-		</Link>
-	);
-};
-
-const PREFIX = 'RaMenuItemLink';
-
-export const MenuItemLinkClasses = {
-	active: `${PREFIX}-active`,
-	icon: `${PREFIX}-icon`,
-};
-
-export default MenuItemLink;