Reload map on reconnect (#8848)

PSD-282
This commit is contained in:
Michael Weimann 2022-06-15 16:38:35 +02:00 committed by GitHub
parent 9333e609b0
commit aac97e01e3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 158 additions and 30 deletions

View file

@ -17,6 +17,7 @@ limitations under the License.
import React from 'react';
import { MatrixEvent } from 'matrix-js-sdk/src/models/event';
import { randomString } from 'matrix-js-sdk/src/randomstring';
import { ClientEvent, ClientEventHandlerMap } from 'matrix-js-sdk/src/matrix';
import { _t } from '../../../languageHandler';
import Modal from '../../../Modal';
@ -33,6 +34,7 @@ import LocationViewDialog from '../location/LocationViewDialog';
import Map from '../location/Map';
import SmartMarker from '../location/SmartMarker';
import { IBodyProps } from "./IBodyProps";
import { createReconnectedListener } from '../../../utils/connection';
interface IState {
error: Error;
@ -42,6 +44,7 @@ export default class MLocationBody extends React.Component<IBodyProps, IState> {
public static contextType = MatrixClientContext;
public context!: React.ContextType<typeof MatrixClientContext>;
private mapId: string;
private reconnectedListener: ClientEventHandlerMap[ClientEvent.Sync];
constructor(props: IBodyProps) {
super(props);
@ -51,6 +54,8 @@ export default class MLocationBody extends React.Component<IBodyProps, IState> {
const idSuffix = `${props.mxEvent.getId()}_${randomString(8)}`;
this.mapId = `mx_MLocationBody_${idSuffix}`;
this.reconnectedListener = createReconnectedListener(this.clearError);
this.state = {
error: undefined,
};
@ -69,10 +74,20 @@ export default class MLocationBody extends React.Component<IBodyProps, IState> {
);
};
private onError = (error) => {
this.setState({ error });
private clearError = () => {
this.context.off(ClientEvent.Sync, this.reconnectedListener);
this.setState({ error: undefined });
};
private onError = (error: Error) => {
this.setState({ error });
this.context.on(ClientEvent.Sync, this.reconnectedListener);
};
componentWillUnmount(): void {
this.context.off(ClientEvent.Sync, this.reconnectedListener);
}
render(): React.ReactElement<HTMLDivElement> {
return this.state.error ?
<LocationBodyFallbackContent error={this.state.error} event={this.props.mxEvent} /> :