Untitled

import React from 'react';
import PropTypes from 'prop-types';
import { Message } from 'primereact/message';
import PrimeWrapper from '../primeWrapper/primeWrapper';
import { v4 as uuidv4 } from 'uuid';

/** PrimeMessages Component */
const PrimeMessages = (props) => {
    // Destructure all props
    const { id, detail, detailKey, summary, summaryKey, severity, closable, ...rest } = props;

    return (
        <Message
            id={id ? id : uuidv4() + '_messages'}
            detail={props.evalLangText(detailKey, detail)}
            summary={props.evalLangText(summaryKey, summary)}
            severity={severity}
            closable={closable}
            {...rest}
        />
    );
};

PrimeMessages.propTypes = {
    id: PropTypes.string,
    detail: PropTypes.string,
    summary: PropTypes.string,
    detailKey: PropTypes.string,
    summaryKey: PropTypes.string,
    severity: PropTypes.string, // To control the type of message (info, success, warn, error, etc.)
    closable: PropTypes.bool,   // To control if the message is closable
};

// Export the component
export default PrimeWrapper(PrimeMessages);





import React from 'react';
import PrimeMessages from './PrimeMessages';

const TestMessages = () => {
    return (
        <div>
            <h5>Severity props usage</h5>
            <PrimeMessages severity="info" summary="Info" detail="Info Message" />
            <PrimeMessages severity="success" summary="Success" detail="Success Message" />
            <PrimeMessages severity="warn" summary="Warning" detail="Warning Message" />
            <PrimeMessages severity="error" summary="Error" detail="Error Message" />
            <PrimeMessages severity="secondary" summary="Secondary" detail="Secondary Message" />
            <PrimeMessages severity="contrast" summary="Contrast" detail="Contrast Message" />

            <h5>Closable prop usage</h5>
            <PrimeMessages severity="info" detail="This message is closable" closable={true} />
            <PrimeMessages severity="success" detail="Success Message - Closable" closable={true} />
            <PrimeMessages severity="warn" detail="Warning Message - Closable" closable={false} />
            <PrimeMessages severity="error" detail="Error Message - Closable" closable={true} />

            <h5>Custom Summary and Detail</h5>
            <PrimeMessages severity="success" summary="Custom Success" detail="This is a custom success message" />
            <PrimeMessages severity="warn" summary="Warning Alert" detail="Custom warning message." />
        </div>
    );
};

export default TestMessages;