import React from 'react';
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"

import './toast.component.styles.scss'
const ToastComponent = ({success = false, ...props}) => {
    const { message, onclose } = props
    return (
        <>
            <div className="notification-container bottom-right ">
                <div className={`notification toast bottom-right ${ success ? 'success' : 'danger'}`} >
                    <button type="button" className="mb-2 close" onClick={onclose}>
                        <span>&times;</span>
                    </button>
                    <div className="notification-image">
                        {
                            !success ? 
                            <FontAwesomeIcon
                                icon='exclamation-triangle' size="2x"/>
                                :
                                <i className="icon-check"></i>
                        }
                                                                                
                    </div>
                    <div className="notification-title">
                        <strong className="mr-auto">{ !success ? <span>Error</span> :  <span>Success</span>}</strong>
                        
                    </div>
                    
                    <div className="notification-message text-wrap">                    
                        <p>{message}</p>
                    </div>
                </div>
            </div>
        </>
    )
}

export default ToastComponent