core/websrc/components/RToast.tsx
Giulio De Pasquale 2cbb21f6cf code cleanup
2020-12-14 18:52:43 +00:00

48 lines
1.1 KiB
TypeScript

import React, {Component} from 'react';
import {Toast} from 'react-bootstrap';
import {socket} from "../";
type ToastProps = {
title: string,
content?: string,
bg?: string
}
type ToastState = {
lastUpdated: Date,
show: boolean
}
export class RToast extends Component<ToastProps, ToastState> {
state = {
lastUpdated: new Date(),
show: false
}
constructor(props: ToastProps) {
super(props)
}
componentDidMount() {
socket.on("connect", () => {
this.setState({show: true})
})
}
tick() {
this.setState({lastUpdated: new Date()})
}
render() {
return (
<Toast show={this.state.show} delay={5000} autohide>
<Toast.Header>
<strong className="mr-auto">{this.props.title}</strong>
<small>{this.state.lastUpdated.toLocaleTimeString('en-GB')}</small>
</Toast.Header>
{this.props.content ? <Toast.Body> {this.props.content}</Toast.Body> : null}
</Toast>
)
}
}