Convert PersistentApp to TS
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>pull/21833/head
parent
819a2b4416
commit
a8d3bb76ef
|
@ -19,47 +19,60 @@ import React from 'react';
|
||||||
import RoomViewStore from '../../../stores/RoomViewStore';
|
import RoomViewStore from '../../../stores/RoomViewStore';
|
||||||
import ActiveWidgetStore from '../../../stores/ActiveWidgetStore';
|
import ActiveWidgetStore from '../../../stores/ActiveWidgetStore';
|
||||||
import WidgetUtils from '../../../utils/WidgetUtils';
|
import WidgetUtils from '../../../utils/WidgetUtils';
|
||||||
import * as sdk from '../../../index';
|
|
||||||
import { MatrixClientPeg } from '../../../MatrixClientPeg';
|
import { MatrixClientPeg } from '../../../MatrixClientPeg';
|
||||||
import { replaceableComponent } from "../../../utils/replaceableComponent";
|
import { replaceableComponent } from "../../../utils/replaceableComponent";
|
||||||
|
import { EventSubscription } from 'fbemitter';
|
||||||
|
import AppTile from "./AppTile";
|
||||||
|
import { Room } from "matrix-js-sdk/src/models/room";
|
||||||
|
|
||||||
|
interface IState {
|
||||||
|
roomId: string;
|
||||||
|
persistentWidgetId: string;
|
||||||
|
}
|
||||||
|
|
||||||
@replaceableComponent("views.elements.PersistentApp")
|
@replaceableComponent("views.elements.PersistentApp")
|
||||||
export default class PersistentApp extends React.Component {
|
export default class PersistentApp extends React.Component<{}, IState> {
|
||||||
state = {
|
private roomStoreToken: EventSubscription;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super({});
|
||||||
|
|
||||||
|
this.state = {
|
||||||
roomId: RoomViewStore.getRoomId(),
|
roomId: RoomViewStore.getRoomId(),
|
||||||
persistentWidgetId: ActiveWidgetStore.getPersistentWidgetId(),
|
persistentWidgetId: ActiveWidgetStore.getPersistentWidgetId(),
|
||||||
};
|
};
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
this._roomStoreToken = RoomViewStore.addListener(this._onRoomViewStoreUpdate);
|
|
||||||
ActiveWidgetStore.on('update', this._onActiveWidgetStoreUpdate);
|
|
||||||
MatrixClientPeg.get().on("Room.myMembership", this._onMyMembership);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillUnmount() {
|
public componentDidMount(): void {
|
||||||
if (this._roomStoreToken) {
|
this.roomStoreToken = RoomViewStore.addListener(this.onRoomViewStoreUpdate);
|
||||||
this._roomStoreToken.remove();
|
ActiveWidgetStore.on('update', this.onActiveWidgetStoreUpdate);
|
||||||
|
MatrixClientPeg.get().on("Room.myMembership", this.onMyMembership);
|
||||||
}
|
}
|
||||||
ActiveWidgetStore.removeListener('update', this._onActiveWidgetStoreUpdate);
|
|
||||||
|
public componentWillUnmount(): void {
|
||||||
|
if (this.roomStoreToken) {
|
||||||
|
this.roomStoreToken.remove();
|
||||||
|
}
|
||||||
|
ActiveWidgetStore.removeListener('update', this.onActiveWidgetStoreUpdate);
|
||||||
if (MatrixClientPeg.get()) {
|
if (MatrixClientPeg.get()) {
|
||||||
MatrixClientPeg.get().removeListener("Room.myMembership", this._onMyMembership);
|
MatrixClientPeg.get().removeListener("Room.myMembership", this.onMyMembership);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_onRoomViewStoreUpdate = payload => {
|
private onRoomViewStoreUpdate = (): void => {
|
||||||
if (RoomViewStore.getRoomId() === this.state.roomId) return;
|
if (RoomViewStore.getRoomId() === this.state.roomId) return;
|
||||||
this.setState({
|
this.setState({
|
||||||
roomId: RoomViewStore.getRoomId(),
|
roomId: RoomViewStore.getRoomId(),
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
_onActiveWidgetStoreUpdate = () => {
|
private onActiveWidgetStoreUpdate = (): void => {
|
||||||
this.setState({
|
this.setState({
|
||||||
persistentWidgetId: ActiveWidgetStore.getPersistentWidgetId(),
|
persistentWidgetId: ActiveWidgetStore.getPersistentWidgetId(),
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
_onMyMembership = async (room, membership) => {
|
private onMyMembership = async (room: Room, membership: string): Promise<void> => {
|
||||||
const persistentWidgetInRoomId = ActiveWidgetStore.getRoomId(this.state.persistentWidgetId);
|
const persistentWidgetInRoomId = ActiveWidgetStore.getRoomId(this.state.persistentWidgetId);
|
||||||
if (membership !== "join") {
|
if (membership !== "join") {
|
||||||
// we're not in the room anymore - delete
|
// we're not in the room anymore - delete
|
||||||
|
@ -69,7 +82,7 @@ export default class PersistentApp extends React.Component {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
public render(): JSX.Element {
|
||||||
if (this.state.persistentWidgetId) {
|
if (this.state.persistentWidgetId) {
|
||||||
const persistentWidgetInRoomId = ActiveWidgetStore.getRoomId(this.state.persistentWidgetId);
|
const persistentWidgetInRoomId = ActiveWidgetStore.getRoomId(this.state.persistentWidgetId);
|
||||||
|
|
||||||
|
@ -89,7 +102,6 @@ export default class PersistentApp extends React.Component {
|
||||||
appEvent.getStateKey(), appEvent.getContent(), appEvent.getSender(),
|
appEvent.getStateKey(), appEvent.getContent(), appEvent.getSender(),
|
||||||
persistentWidgetInRoomId, appEvent.getId(),
|
persistentWidgetInRoomId, appEvent.getId(),
|
||||||
);
|
);
|
||||||
const AppTile = sdk.getComponent('elements.AppTile');
|
|
||||||
return <AppTile
|
return <AppTile
|
||||||
key={app.id}
|
key={app.id}
|
||||||
app={app}
|
app={app}
|
Loading…
Reference in New Issue