69 lines
1.9 KiB
TypeScript
69 lines
1.9 KiB
TypeScript
|
import type { CommonProps } from '@/proxy/common'
|
||
|
|
import { Card, Tag } from '@/components/ui'
|
||
|
|
import { NotificationChannelColors } from '@/constants/notification-channel.enum'
|
||
|
|
import { NotificationDto } from '@/proxy/notification/models'
|
||
|
|
import classNames from 'classnames'
|
||
|
|
import dayjs from 'dayjs'
|
||
|
|
|
||
|
|
type EventProps = {
|
||
|
|
data: NotificationDto
|
||
|
|
compact?: boolean
|
||
|
|
}
|
||
|
|
|
||
|
|
const HighlightedText = ({ children, className }: CommonProps) => {
|
||
|
|
return (
|
||
|
|
<span className={classNames('font-semibold text-gray-900 dark:text-gray-100', className)}>
|
||
|
|
{children}
|
||
|
|
</span>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
const Event = ({ data, compact }: EventProps) => {
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
{compact ? (
|
||
|
|
<>
|
||
|
|
<div className="flex flex-col gap-y-0.5">
|
||
|
|
<HighlightedText>{data.creatorFullname}</HighlightedText>
|
||
|
|
<span className="text-xs">{dayjs(data.creationTime).format('hh:mm A')}</span>
|
||
|
|
</div>
|
||
|
|
<div className="mt-4">
|
||
|
|
<span className="mx-1">bildirim gönderdi {data.notificationType} </span>
|
||
|
|
|
||
|
|
<Tag
|
||
|
|
prefix
|
||
|
|
className="mx-1"
|
||
|
|
prefixClass={`${NotificationChannelColors[data.notificationChannel]}`}
|
||
|
|
>
|
||
|
|
{data.notificationChannel}
|
||
|
|
</Tag>
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
) : (
|
||
|
|
<div className="my-1 flex items-center">
|
||
|
|
<div>
|
||
|
|
<HighlightedText>{data.notificationType}</HighlightedText> bildirimi gönderdi.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<Tag
|
||
|
|
prefix
|
||
|
|
className="mx-1"
|
||
|
|
prefixClass={`${NotificationChannelColors[data.notificationChannel]}`}
|
||
|
|
>
|
||
|
|
{data.notificationChannel}
|
||
|
|
</Tag>
|
||
|
|
|
||
|
|
<span className="ml-3 rtl:mr-3">{dayjs(data.creationTime).format('LT')}</span>
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
{data.message && (
|
||
|
|
<Card bordered className="mt-4">
|
||
|
|
{data.message}
|
||
|
|
</Card>
|
||
|
|
)}
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Event
|