Spaces:
Sleeping
Sleeping
File size: 1,636 Bytes
13555f3 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 | // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react'
import {Utils} from '../../utils'
import IconButton from '../buttons/iconButton'
import CloseIcon from '../icons/close'
import Tooltip from '../tooltip'
import './notificationBox.scss'
type Props = {
title: string
icon?: React.ReactNode
children?: React.ReactNode
onClose?: () => void
closeTooltip?: string
className?: string
}
function renderClose(onClose?: () => void, closeTooltip?: string) {
if (!onClose) {
return null
}
if (closeTooltip) {
return (
<Tooltip title={closeTooltip}>
<IconButton
icon={<CloseIcon/>}
onClick={onClose}
/>
</Tooltip>
)
}
return (
<IconButton
icon={<CloseIcon/>}
onClick={onClose}
/>
)
}
function NotificationBox(props: Props): JSX.Element {
const className = Utils.generateClassName({
NotificationBox: true,
[props.className || '']: Boolean(props.className),
})
return (
<div className={className}>
{props.icon &&
<div className='NotificationBox__icon'>
{props.icon}
</div>}
<div className='content'>
<p className='title'>{props.title}</p>
{props.children}
</div>
{renderClose(props.onClose, props.closeTooltip)}
</div>
)
}
export default React.memo(NotificationBox)
|