This repository has been archived on 2022-08-14. You can view files and clone it, but cannot push or open issues or pull requests.
Tom Moor 146e4da73b
feat: Document presence indicator (#1114)
* Update websockets to allow joining document-based rooms

* dynamic websocket joining

* emit user.join/leave events when entering and exiting document rooms

* presence storage

* feat: frontend presence store

* lint

* UI updates

* First pass editing state

* refactoring

* Timeout per user/doc
lint

* Document data loading refactor to keep Socket mounted

* restore: Mark as viewed functionality
Add display of 'you' to collaborators

* fix: Socket/document remount when document slug changes due to title change

* Revert unneccessary package update

* Move editing ping interval to a shared constant

* fix: Flash of sidebar when loading page directly on editing mode

* separate document and revision loading

* add comments for socket events

* fix: Socket events getting bound multiple times on reconnect

* fix: Clear client side presence state on disconnect

* fix: Don't ignore server side error
Improved documentation

* More comments / why comments

* rename Socket -> SocketPresence

* fix: Handle redis is down
remove unneccessary join

* fix: PR feedback
2020-01-02 21:17:59 -08:00

47 lines
965 B
JavaScript

// @flow
import * as React from 'react';
import Editor from 'components/Editor';
import ClickablePadding from 'components/ClickablePadding';
import plugins from './plugins';
type Props = {|
defaultValue?: string,
readOnly?: boolean,
|};
class DocumentEditor extends React.Component<Props> {
editor: ?Editor;
componentDidMount() {
if (!this.props.defaultValue) {
setImmediate(this.focusAtStart);
}
}
focusAtStart = () => {
if (this.editor) this.editor.focusAtStart();
};
focusAtEnd = () => {
if (this.editor) this.editor.focusAtEnd();
};
render() {
const { readOnly } = this.props;
return (
<React.Fragment>
<Editor
ref={ref => (this.editor = ref)}
plugins={plugins}
grow={!readOnly}
{...this.props}
/>
{!readOnly && <ClickablePadding onClick={this.focusAtEnd} grow />}
</React.Fragment>
);
}
}
export default DocumentEditor;