@brightlayer-ui/react-auth-workflow/components/Error/ErrorManager.js

Re-usable workflow components for Authentication and Registration within Eaton applications.

import React, { useCallback } from 'react';
import { BasicDialog } from '../Dialog/BasicDialog.js';
import ErrorMessageBox from './ErrorMessageBox.js';
/**
 * Component that manages the display of error messages. Can be configured to display a dialog, a message box, or neither.
 *
 * @param {ErrorManagerProps} props - props of errorManager component
 *
 * @category Component
 */
const ErrorManager = (props) => {
    const { children, mode = 'dialog', title, error = '', errorOptions, titleOptions, onClose = () => { }, dialogConfig, 
    // eslint-disable-next-line @typescript-eslint/no-unused-vars
    t = (key, _options) => key, messageBoxConfig = {
        position: 'top',
    }, } = props;
    const ErrorDialogWithProps = useCallback(() => (React.createElement(BasicDialog, { open: error.length > 0, title: t(dialogConfig?.title ?? title ?? 'Error', titleOptions), body: t(error, errorOptions), onClose: onClose, dismissButtonText: t(dialogConfig?.dismissLabel ?? 'Okay'), sx: dialogConfig?.sx })), [dialogConfig, title, error, errorOptions, titleOptions, onClose, t]);
    const ErrorMessageBoxWithProps = useCallback(() => {
        const { dismissible = true, fontColor, backgroundColor, sx } = messageBoxConfig;
        return (React.createElement(ErrorMessageBox, { title: t(messageBoxConfig?.title ?? title ?? 'Error', titleOptions), errorMessage: t(error, errorOptions), dismissible: dismissible, sx: sx, backgroundColor: backgroundColor, fontColor: fontColor, onClose: onClose }));
    }, [error, errorOptions, titleOptions, title, messageBoxConfig, onClose, t]);
    return mode === 'dialog' && error.length > 0 ? (React.createElement(React.Fragment, null,
        children,
        React.createElement(ErrorDialogWithProps, null))) : mode === 'message-box' && error.length > 0 ? (React.createElement(React.Fragment, null,
        messageBoxConfig.position !== 'bottom' && React.createElement(ErrorMessageBoxWithProps, null),
        children,
        messageBoxConfig.position === 'bottom' && React.createElement(ErrorMessageBoxWithProps, null))) : (React.createElement(React.Fragment, null, children));
};
export default ErrorManager;