mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-19 09:45:37 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add prettier for codestyle and re-format everything (#1294)

Browse source
This commit is contained in:
Erik Michelson 2021-06-06 23:14:00 +02:00 • committed by GitHub
parent 8b78154075
commit 0aae1f70d2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
319 changed files with 4809 additions and 3936 deletions
Download patch file Download diff file Expand all files Collapse all files

83
src/components/notifications/ui-notification-toast.tsx
View file

@ -18,7 +18,16 @@ export interface UiNotificationProps extends UiNotification {
notificationId: number
}
export const UiNotificationToast: React.FC<UiNotificationProps> = ({ title, content, date, icon, dismissed, notificationId, durationInSecond, buttons }) => {
export const UiNotificationToast: React.FC<UiNotificationProps> = ({
title,
content,
date,
icon,
dismissed,
notificationId,
durationInSecond,
buttons
}) => {
const [eta, setEta] = useState<number>()
const interval = useRef<NodeJS.Timeout | undefined>(undefined)
@ -29,7 +38,7 @@ export const UiNotificationToast: React.FC<UiNotificationProps> = ({ title, cont
}, [])
const dismissThisNotification = useCallback(() => {
console.debug(`[Notifications] Dismissed notification ${ notificationId }`)
console.debug(`[Notifications] Dismissed notification ${notificationId}`)
dismissUiNotification(notificationId)
}, [notificationId])
@ -37,17 +46,21 @@ export const UiNotificationToast: React.FC<UiNotificationProps> = ({ title, cont
if (dismissed || !!interval.current) {
return
}
console.debug(`[Notifications] Show notification ${ notificationId }`)
console.debug(`[Notifications] Show notification ${notificationId}`)
setEta(durationInSecond * STEPS_PER_SECOND)
interval.current = setInterval(() => setEta((lastETA) => {
if (lastETA === undefined) {
return
} else if (lastETA <= 0) {
return 0
} else {
return lastETA - 1
}
}), 1000 / STEPS_PER_SECOND)
interval.current = setInterval(
() =>
setEta((lastETA) => {
if (lastETA === undefined) {
return
} else if (lastETA <= 0) {
return 0
} else {
return lastETA - 1
}
}),
1000 / STEPS_PER_SECOND
)
return () => {
deleteInterval()
}
@ -59,34 +72,36 @@ export const UiNotificationToast: React.FC<UiNotificationProps> = ({ title, cont
}
}, [dismissThisNotification, eta])
const buttonsDom = useMemo(() => buttons?.map(button => {
const buttonClick = () => {
button.onClick()
dismissThisNotification()
}
return <Button key={ button.label } size={ 'sm' } onClick={ buttonClick }
variant={ 'link' }>{ button.label }</Button>
}
), [buttons, dismissThisNotification])
const buttonsDom = useMemo(
() =>
buttons?.map((button) => {
const buttonClick = () => {
button.onClick()
dismissThisNotification()
}
return (
<Button key={button.label} size={'sm'} onClick={buttonClick} variant={'link'}>
{button.label}
</Button>
)
}),
[buttons, dismissThisNotification]
)
return (
<Toast show={ !dismissed && eta !== undefined } onClose={ dismissThisNotification }>
<Toast show={!dismissed && eta !== undefined} onClose={dismissThisNotification}>
<Toast.Header>
<strong className="mr-auto">
<ShowIf condition={ !!icon }>
<ForkAwesomeIcon icon={ icon as IconName } fixedWidth={ true } className={ 'mr-1' }/>
<strong className='mr-auto'>
<ShowIf condition={!!icon}>
<ForkAwesomeIcon icon={icon as IconName} fixedWidth={true} className={'mr-1'} />
</ShowIf>
{ title }
{title}
</strong>
<small>{ date.toRelative({ style: 'short' }) }</small>
<small>{date.toRelative({ style: 'short' })}</small>
</Toast.Header>
<Toast.Body>{ content }</Toast.Body>
<ProgressBar variant={ 'info' } now={ eta } max={ durationInSecond * STEPS_PER_SECOND } min={ 0 }/>
<div>
{
buttonsDom
}
</div>
<Toast.Body>{content}</Toast.Body>
<ProgressBar variant={'info'} now={eta} max={durationInSecond * STEPS_PER_SECOND} min={0} />
<div>{buttonsDom}</div>
</Toast>
)
}