mirror of
https://github.com/Bubberstation/Bubberstation.git
synced 2025-12-11 18:22:14 +00:00
2e5642f4d9
## About The Pull Request Giant file diff, but 99% of this PR is just swapping imports We've tested changes slowly with #83789, #84660, and #87763. I think tgui-core is in a good place and the risk of not fully switching is outweighing inaction (in that people are getting confused that there's two sets of ui components #86495). This PR makes some small changes here and there that I saw, spot checks like importing `TableCell` when you don't need to, triple boolean casts `!!!` etc. ## Why It's Good For The Game Most of all, code improvement. Tgui has been sitting in limbo as I ironed out errors with tgui core. We now have one source of all components, common functions etc for tgui. This enables cross-game collaboration between the different versions of SS13 running TGUI.
76 lines
1.7 KiB
JavaScript
76 lines
1.7 KiB
JavaScript
/**
|
|
* @file
|
|
* @copyright 2020 Aleksej Komarov
|
|
* @license MIT
|
|
*/
|
|
|
|
import { Component, createRef } from 'react';
|
|
import { Button } from 'tgui-core/components';
|
|
import { shallowDiffers } from 'tgui-core/react';
|
|
|
|
import { chatRenderer } from './renderer';
|
|
|
|
export class ChatPanel extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.ref = createRef();
|
|
this.state = {
|
|
scrollTracking: true,
|
|
};
|
|
this.handleScrollTrackingChange = (value) =>
|
|
this.setState({
|
|
scrollTracking: value,
|
|
});
|
|
}
|
|
|
|
componentDidMount() {
|
|
chatRenderer.mount(this.ref.current);
|
|
chatRenderer.events.on(
|
|
'scrollTrackingChanged',
|
|
this.handleScrollTrackingChange,
|
|
);
|
|
this.componentDidUpdate();
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
chatRenderer.events.off(
|
|
'scrollTrackingChanged',
|
|
this.handleScrollTrackingChange,
|
|
);
|
|
}
|
|
|
|
componentDidUpdate(prevProps) {
|
|
requestAnimationFrame(() => {
|
|
chatRenderer.ensureScrollTracking();
|
|
});
|
|
const shouldUpdateStyle =
|
|
!prevProps || shallowDiffers(this.props, prevProps);
|
|
if (shouldUpdateStyle) {
|
|
chatRenderer.assignStyle({
|
|
width: '100%',
|
|
'white-space': 'pre-wrap',
|
|
'font-size': this.props.fontSize,
|
|
'line-height': this.props.lineHeight,
|
|
});
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const { scrollTracking } = this.state;
|
|
return (
|
|
<>
|
|
<div className="Chat" ref={this.ref} />
|
|
{!scrollTracking && (
|
|
<Button
|
|
className="Chat__scrollButton"
|
|
icon="arrow-down"
|
|
onClick={() => chatRenderer.scrollToBottom()}
|
|
>
|
|
Scroll to bottom
|
|
</Button>
|
|
)}
|
|
</>
|
|
);
|
|
}
|
|
}
|