matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-10-31 01:45:39 +03:00
Code Activity

Convert UserView to TS

Browse Source 
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
Šimon Brandner
2021-09-12 09:09:16 +02:00
parent a6a56b455b
commit ff7e32cdd1
1 changed files with 31 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/components/structures/UserView.js → src/components/structures/UserView.tsx
View File

@@ -16,52 +16,61 @@ limitations under the License.
*/ */
import React from "react"; import React from "react";
import PropTypes from "prop-types";
import { MatrixClientPeg } from "../../MatrixClientPeg"; import { MatrixClientPeg } from "../../MatrixClientPeg";
import * as sdk from "../../index";
import Modal from '../../Modal'; import Modal from '../../Modal';
import { _t } from '../../languageHandler'; import { _t } from '../../languageHandler';
import HomePage from "./HomePage"; import HomePage from "./HomePage";
import { replaceableComponent } from "../../utils/replaceableComponent"; import { replaceableComponent } from "../../utils/replaceableComponent";
import { MatrixEvent } from "matrix-js-sdk/src/models/event"; import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { RoomMember } from "matrix-js-sdk/src/models/room-member"; import { RoomMember } from "matrix-js-sdk/src/models/room-member";
import ErrorDialog from "../views/dialogs/ErrorDialog";
import MainSplit from "./MainSplit";
import RightPanel from "./RightPanel";
import Spinner from "../views/elements/Spinner";
import ResizeNotifier from "../../utils/ResizeNotifier";
import { RoomState } from "matrix-js-sdk/src/models/room-state";
interface IProps {
userId?: string;
resizeNotifier: ResizeNotifier;
}
interface IState {
loading: boolean;
member?: RoomMember;
}
@replaceableComponent("structures.UserView") @replaceableComponent("structures.UserView")
export default class UserView extends React.Component { export default class UserView extends React.Component<IProps, IState> {
static get propTypes() { constructor(props: IProps) {
return { super(props);
userId: PropTypes.string, this.state = {
loading: true,
}; };
} }
constructor(props) { public componentDidMount(): void {
super(props);
this.state = {};
}
componentDidMount() {
if (this.props.userId) { if (this.props.userId) {
this._loadProfileInfo(); this.loadProfileInfo();
} }
} }
componentDidUpdate(prevProps) { public componentDidUpdate(prevProps: IProps): void {
// XXX: We shouldn't need to null check the userId here, but we declare // XXX: We shouldn't need to null check the userId here, but we declare
// it as optional and MatrixChat sometimes fires in a way which results // it as optional and MatrixChat sometimes fires in a way which results
// in an NPE when we try to update the profile info. // in an NPE when we try to update the profile info.
if (prevProps.userId !== this.props.userId && this.props.userId) { if (prevProps.userId !== this.props.userId && this.props.userId) {
this._loadProfileInfo(); this.loadProfileInfo();
} }
} }
async _loadProfileInfo() { private async loadProfileInfo(): Promise<void> {
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
this.setState({ loading: true }); this.setState({ loading: true });
let profileInfo; let profileInfo;
try { try {
profileInfo = await cli.getProfileInfo(this.props.userId); profileInfo = await cli.getProfileInfo(this.props.userId);
} catch (err) { } catch (err) {
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
Modal.createTrackedDialog(_t('Could not load user profile'), '', ErrorDialog, { Modal.createTrackedDialog(_t('Could not load user profile'), '', ErrorDialog, {
title: _t('Could not load user profile'), title: _t('Could not load user profile'),
description: ((err && err.message) ? err.message : _t("Operation failed")), description: ((err && err.message) ? err.message : _t("Operation failed")),
@@ -69,20 +78,18 @@ export default class UserView extends React.Component {
this.setState({ loading: false }); this.setState({ loading: false });
return; return;
} }
const fakeRoomState = new RoomState("roomId");
const fakeEvent = new MatrixEvent({ type: "m.room.member", content: profileInfo }); const fakeEvent = new MatrixEvent({ type: "m.room.member", content: profileInfo });
const member = new RoomMember(null, this.props.userId); const member = new RoomMember(null, this.props.userId);
member.setMembershipEvent(fakeEvent); member.setMembershipEvent(fakeEvent, fakeRoomState);
this.setState({ member, loading: false }); this.setState({ member, loading: false });
} }
render() { public render(): JSX.Element {
if (this.state.loading) { if (this.state.loading) {
const Spinner = sdk.getComponent("elements.Spinner");
return <Spinner />; return <Spinner />;
} else if (this.state.member) { } else if (this.state.member?.user) {
const RightPanel = sdk.getComponent('structures.RightPanel'); const panel = <RightPanel user={this.state.member.user} resizeNotifier={this.props.resizeNotifier} />;
const MainSplit = sdk.getComponent('structures.MainSplit');
const panel = <RightPanel user={this.state.member} />;
return (<MainSplit panel={panel} resizeNotifier={this.props.resizeNotifier}> return (<MainSplit panel={panel} resizeNotifier={this.props.resizeNotifier}>
<HomePage /> <HomePage />
</MainSplit>); </MainSplit>);