Remove create-react-class
This commit is contained in:
Michael Telatynski
parent
672d0fe97b
commit
72498df28f
108 changed files with 3059 additions and 3545 deletions
|
|
@ -24,7 +24,6 @@ limitations under the License.
|
|||
import shouldHideEvent from '../../shouldHideEvent';
|
||||
|
||||
import React, {createRef} from 'react';
|
||||
import createReactClass from 'create-react-class';
|
||||
import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import { _t } from '../../languageHandler';
|
||||
|
|
@ -68,9 +67,8 @@ if (DEBUG) {
|
|||
debuglog = console.log.bind(console);
|
||||
}
|
||||
|
||||
export default createReactClass({
|
||||
displayName: 'RoomView',
|
||||
propTypes: {
|
||||
export default class RoomView extends React.Component {
|
||||
static propTypes = {
|
||||
ConferenceHandler: PropTypes.any,
|
||||
|
||||
// Called with the credentials of a registered user (if they were a ROU that
|
||||
|
|
@ -97,15 +95,15 @@ export default createReactClass({
|
|||
|
||||
// Servers the RoomView can use to try and assist joins
|
||||
viaServers: PropTypes.arrayOf(PropTypes.string),
|
||||
},
|
||||
};
|
||||
|
||||
statics: {
|
||||
contextType: MatrixClientContext,
|
||||
},
|
||||
static contextType = MatrixClientContext;
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
getInitialState: function() {
|
||||
const llMembers = this.context.hasLazyLoadMembersEnabled();
|
||||
return {
|
||||
this.state = {
|
||||
room: null,
|
||||
roomId: null,
|
||||
roomLoading: true,
|
||||
|
|
@ -171,10 +169,7 @@ export default createReactClass({
|
|||
|
||||
matrixClientIsReady: this.context && this.context.isInitialSyncComplete(),
|
||||
};
|
||||
},
|
||||
|
||||
// TODO: [REACT-WARNING] Replace component with real class, use constructor for refs
|
||||
UNSAFE_componentWillMount: function() {
|
||||
this.dispatcherRef = dis.register(this.onAction);
|
||||
this.context.on("Room", this.onRoom);
|
||||
this.context.on("Room.timeline", this.onRoomTimeline);
|
||||
|
|
@ -201,15 +196,15 @@ export default createReactClass({
|
|||
this._searchResultsPanel = createRef();
|
||||
|
||||
this._layoutWatcherRef = SettingsStore.watchSetting("useIRCLayout", null, this.onLayoutChange);
|
||||
},
|
||||
}
|
||||
|
||||
_onReadReceiptsChange: function() {
|
||||
_onReadReceiptsChange = () => {
|
||||
this.setState({
|
||||
showReadReceipts: SettingsStore.getValue("showReadReceipts", this.state.roomId),
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
_onRoomViewStoreUpdate: function(initial) {
|
||||
_onRoomViewStoreUpdate = initial => {
|
||||
if (this.unmounted) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -303,7 +298,7 @@ export default createReactClass({
|
|||
if (initial) {
|
||||
this._setupRoom(newState.room, newState.roomId, newState.joining, newState.shouldPeek);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
_getRoomId() {
|
||||
// According to `_onRoomViewStoreUpdate`, `state.roomId` can be null
|
||||
|
|
@ -312,9 +307,9 @@ export default createReactClass({
|
|||
// the bare room ID. (We may want to update `state.roomId` after
|
||||
// resolving aliases, so we could always trust it.)
|
||||
return this.state.room ? this.state.room.roomId : this.state.roomId;
|
||||
},
|
||||
}
|
||||
|
||||
_getPermalinkCreatorForRoom: function(room) {
|
||||
_getPermalinkCreatorForRoom(room) {
|
||||
if (!this._permalinkCreators) this._permalinkCreators = {};
|
||||
if (this._permalinkCreators[room.roomId]) return this._permalinkCreators[room.roomId];
|
||||
|
||||
|
|
@ -327,22 +322,22 @@ export default createReactClass({
|
|||
this._permalinkCreators[room.roomId].load();
|
||||
}
|
||||
return this._permalinkCreators[room.roomId];
|
||||
},
|
||||
}
|
||||
|
||||
_stopAllPermalinkCreators: function() {
|
||||
_stopAllPermalinkCreators() {
|
||||
if (!this._permalinkCreators) return;
|
||||
for (const roomId of Object.keys(this._permalinkCreators)) {
|
||||
this._permalinkCreators[roomId].stop();
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
_onWidgetEchoStoreUpdate: function() {
|
||||
_onWidgetEchoStoreUpdate = () => {
|
||||
this.setState({
|
||||
showApps: this._shouldShowApps(this.state.room),
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
_setupRoom: function(room, roomId, joining, shouldPeek) {
|
||||
_setupRoom(room, roomId, joining, shouldPeek) {
|
||||
// if this is an unknown room then we're in one of three states:
|
||||
// - This is a room we can peek into (search engine) (we can /peek)
|
||||
// - This is a room we can publicly join or were invited to. (we can /join)
|
||||
|
|
@ -404,9 +399,9 @@ export default createReactClass({
|
|||
this.setState({isPeeking: false});
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
_shouldShowApps: function(room) {
|
||||
_shouldShowApps(room) {
|
||||
if (!BROWSER_SUPPORTS_SANDBOX) return false;
|
||||
|
||||
// Check if user has previously chosen to hide the app drawer for this
|
||||
|
|
@ -417,9 +412,9 @@ export default createReactClass({
|
|||
// This is confusing, but it means to say that we default to the tray being
|
||||
// hidden unless the user clicked to open it.
|
||||
return hideWidgetDrawer === "false";
|
||||
},
|
||||
}
|
||||
|
||||
componentDidMount: function() {
|
||||
componentDidMount() {
|
||||
const call = this._getCallForRoom();
|
||||
const callState = call ? call.call_state : "ended";
|
||||
this.setState({
|
||||
|
|
@ -435,14 +430,14 @@ export default createReactClass({
|
|||
this.onResize();
|
||||
|
||||
document.addEventListener("keydown", this.onNativeKeyDown);
|
||||
},
|
||||
}
|
||||
|
||||
shouldComponentUpdate: function(nextProps, nextState) {
|
||||
shouldComponentUpdate(nextProps, nextState) {
|
||||
return (!ObjectUtils.shallowEqual(this.props, nextProps) ||
|
||||
!ObjectUtils.shallowEqual(this.state, nextState));
|
||||
},
|
||||
}
|
||||
|
||||
componentDidUpdate: function() {
|
||||
componentDidUpdate() {
|
||||
if (this._roomView.current) {
|
||||
const roomView = this._roomView.current;
|
||||
if (!roomView.ondrop) {
|
||||
|
|
@ -464,9 +459,9 @@ export default createReactClass({
|
|||
atEndOfLiveTimeline: this._messagePanel.isAtEndOfLiveTimeline(),
|
||||
});
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
componentWillUnmount: function() {
|
||||
componentWillUnmount() {
|
||||
// set a boolean to say we've been unmounted, which any pending
|
||||
// promises can use to throw away their results.
|
||||
//
|
||||
|
|
@ -543,21 +538,21 @@ export default createReactClass({
|
|||
// Tinter.tint(); // reset colourscheme
|
||||
|
||||
SettingsStore.unwatchSetting(this._layoutWatcherRef);
|
||||
},
|
||||
}
|
||||
|
||||
onLayoutChange: function() {
|
||||
onLayoutChange = () => {
|
||||
this.setState({
|
||||
useIRCLayout: SettingsStore.getValue("useIRCLayout"),
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
_onRightPanelStoreUpdate: function() {
|
||||
_onRightPanelStoreUpdate = () => {
|
||||
this.setState({
|
||||
showRightPanel: RightPanelStore.getSharedInstance().isOpenForRoom,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onPageUnload(event) {
|
||||
onPageUnload = event => {
|
||||
if (ContentMessages.sharedInstance().getCurrentUploads().length > 0) {
|
||||
return event.returnValue =
|
||||
_t("You seem to be uploading files, are you sure you want to quit?");
|
||||
|
|
@ -565,10 +560,10 @@ export default createReactClass({
|
|||
return event.returnValue =
|
||||
_t("You seem to be in a call, are you sure you want to quit?");
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
// we register global shortcuts here, they *must not conflict* with local shortcuts elsewhere or both will fire
|
||||
onNativeKeyDown: function(ev) {
|
||||
onNativeKeyDown = ev => {
|
||||
let handled = false;
|
||||
const ctrlCmdOnly = isOnlyCtrlOrCmdKeyEvent(ev);
|
||||
|
||||
|
|
@ -592,9 +587,9 @@ export default createReactClass({
|
|||
ev.stopPropagation();
|
||||
ev.preventDefault();
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onReactKeyDown: function(ev) {
|
||||
onReactKeyDown = ev => {
|
||||
let handled = false;
|
||||
|
||||
switch (ev.key) {
|
||||
|
|
@ -613,7 +608,7 @@ export default createReactClass({
|
|||
break;
|
||||
case Key.U.toUpperCase():
|
||||
if (isOnlyCtrlOrCmdIgnoreShiftKeyEvent(ev) && ev.shiftKey) {
|
||||
dis.dispatch({ action: "upload_file" })
|
||||
dis.dispatch({ action: "upload_file" });
|
||||
handled = true;
|
||||
}
|
||||
break;
|
||||
|
|
@ -623,9 +618,9 @@ export default createReactClass({
|
|||
ev.stopPropagation();
|
||||
ev.preventDefault();
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onAction: function(payload) {
|
||||
onAction = payload => {
|
||||
switch (payload.action) {
|
||||
case 'message_send_failed':
|
||||
case 'message_sent':
|
||||
|
|
@ -709,9 +704,9 @@ export default createReactClass({
|
|||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onRoomTimeline: function(ev, room, toStartOfTimeline, removed, data) {
|
||||
onRoomTimeline = (ev, room, toStartOfTimeline, removed, data) => {
|
||||
if (this.unmounted) return;
|
||||
|
||||
// ignore events for other rooms
|
||||
|
|
@ -747,51 +742,51 @@ export default createReactClass({
|
|||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onRoomName: function(room) {
|
||||
onRoomName = room => {
|
||||
if (this.state.room && room.roomId == this.state.room.roomId) {
|
||||
this.forceUpdate();
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onRoomRecoveryReminderDontAskAgain: function() {
|
||||
onRoomRecoveryReminderDontAskAgain = () => {
|
||||
// Called when the option to not ask again is set:
|
||||
// force an update to hide the recovery reminder
|
||||
this.forceUpdate();
|
||||
},
|
||||
};
|
||||
|
||||
onKeyBackupStatus() {
|
||||
onKeyBackupStatus = () => {
|
||||
// Key backup status changes affect whether the in-room recovery
|
||||
// reminder is displayed.
|
||||
this.forceUpdate();
|
||||
},
|
||||
};
|
||||
|
||||
canResetTimeline: function() {
|
||||
canResetTimeline = () => {
|
||||
if (!this._messagePanel) {
|
||||
return true;
|
||||
}
|
||||
return this._messagePanel.canResetTimeline();
|
||||
},
|
||||
};
|
||||
|
||||
// called when state.room is first initialised (either at initial load,
|
||||
// after a successful peek, or after we join the room).
|
||||
_onRoomLoaded: function(room) {
|
||||
_onRoomLoaded = room => {
|
||||
this._calculatePeekRules(room);
|
||||
this._updatePreviewUrlVisibility(room);
|
||||
this._loadMembersIfJoined(room);
|
||||
this._calculateRecommendedVersion(room);
|
||||
this._updateE2EStatus(room);
|
||||
this._updatePermissions(room);
|
||||
},
|
||||
};
|
||||
|
||||
_calculateRecommendedVersion: async function(room) {
|
||||
async _calculateRecommendedVersion(room) {
|
||||
this.setState({
|
||||
upgradeRecommendation: await room.getRecommendedVersion(),
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
_loadMembersIfJoined: async function(room) {
|
||||
async _loadMembersIfJoined(room) {
|
||||
// lazy load members if enabled
|
||||
if (this.context.hasLazyLoadMembersEnabled()) {
|
||||
if (room && room.getMyMembership() === 'join') {
|
||||
|
|
@ -808,9 +803,9 @@ export default createReactClass({
|
|||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
_calculatePeekRules: function(room) {
|
||||
_calculatePeekRules(room) {
|
||||
const guestAccessEvent = room.currentState.getStateEvents("m.room.guest_access", "");
|
||||
if (guestAccessEvent && guestAccessEvent.getContent().guest_access === "can_join") {
|
||||
this.setState({
|
||||
|
|
@ -824,17 +819,17 @@ export default createReactClass({
|
|||
canPeek: true,
|
||||
});
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
_updatePreviewUrlVisibility: function({roomId}) {
|
||||
_updatePreviewUrlVisibility({roomId}) {
|
||||
// URL Previews in E2EE rooms can be a privacy leak so use a different setting which is per-room explicit
|
||||
const key = this.context.isRoomEncrypted(roomId) ? 'urlPreviewsEnabled_e2ee' : 'urlPreviewsEnabled';
|
||||
this.setState({
|
||||
showUrlPreview: SettingsStore.getValue(key, roomId),
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
onRoom: function(room) {
|
||||
onRoom = room => {
|
||||
if (!room || room.roomId !== this.state.roomId) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -843,32 +838,32 @@ export default createReactClass({
|
|||
}, () => {
|
||||
this._onRoomLoaded(room);
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onDeviceVerificationChanged: function(userId, device) {
|
||||
onDeviceVerificationChanged = (userId, device) => {
|
||||
const room = this.state.room;
|
||||
if (!room.currentState.getMember(userId)) {
|
||||
return;
|
||||
}
|
||||
this._updateE2EStatus(room);
|
||||
},
|
||||
};
|
||||
|
||||
onUserVerificationChanged: function(userId, _trustStatus) {
|
||||
onUserVerificationChanged = (userId, _trustStatus) => {
|
||||
const room = this.state.room;
|
||||
if (!room || !room.currentState.getMember(userId)) {
|
||||
return;
|
||||
}
|
||||
this._updateE2EStatus(room);
|
||||
},
|
||||
};
|
||||
|
||||
onCrossSigningKeysChanged: function() {
|
||||
onCrossSigningKeysChanged = () => {
|
||||
const room = this.state.room;
|
||||
if (room) {
|
||||
this._updateE2EStatus(room);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
_updateE2EStatus: async function(room) {
|
||||
async _updateE2EStatus(room) {
|
||||
if (!this.context.isRoomEncrypted(room.roomId)) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -886,26 +881,26 @@ export default createReactClass({
|
|||
this.setState({
|
||||
e2eStatus: await shieldStatusForRoom(this.context, room),
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
updateTint: function() {
|
||||
updateTint() {
|
||||
const room = this.state.room;
|
||||
if (!room) return;
|
||||
|
||||
console.log("Tinter.tint from updateTint");
|
||||
const colorScheme = SettingsStore.getValue("roomColor", room.roomId);
|
||||
Tinter.tint(colorScheme.primary_color, colorScheme.secondary_color);
|
||||
},
|
||||
}
|
||||
|
||||
onAccountData: function(event) {
|
||||
onAccountData = event => {
|
||||
const type = event.getType();
|
||||
if ((type === "org.matrix.preview_urls" || type === "im.vector.web.settings") && this.state.room) {
|
||||
// non-e2ee url previews are stored in legacy event type `org.matrix.room.preview_urls`
|
||||
this._updatePreviewUrlVisibility(this.state.room);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onRoomAccountData: function(event, room) {
|
||||
onRoomAccountData = (event, room) => {
|
||||
if (room.roomId == this.state.roomId) {
|
||||
const type = event.getType();
|
||||
if (type === "org.matrix.room.color_scheme") {
|
||||
|
|
@ -918,18 +913,18 @@ export default createReactClass({
|
|||
this._updatePreviewUrlVisibility(room);
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onRoomStateEvents: function(ev, state) {
|
||||
onRoomStateEvents = (ev, state) => {
|
||||
// ignore if we don't have a room yet
|
||||
if (!this.state.room || this.state.room.roomId !== state.roomId) {
|
||||
return;
|
||||
}
|
||||
|
||||
this._updatePermissions(this.state.room);
|
||||
},
|
||||
};
|
||||
|
||||
onRoomStateMember: function(ev, state, member) {
|
||||
onRoomStateMember = (ev, state, member) => {
|
||||
// ignore if we don't have a room yet
|
||||
if (!this.state.room) {
|
||||
return;
|
||||
|
|
@ -941,17 +936,17 @@ export default createReactClass({
|
|||
}
|
||||
|
||||
this._updateRoomMembers(member);
|
||||
},
|
||||
};
|
||||
|
||||
onMyMembership: function(room, membership, oldMembership) {
|
||||
onMyMembership = (room, membership, oldMembership) => {
|
||||
if (room.roomId === this.state.roomId) {
|
||||
this.forceUpdate();
|
||||
this._loadMembersIfJoined(room);
|
||||
this._updatePermissions(room);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
_updatePermissions: function(room) {
|
||||
_updatePermissions(room) {
|
||||
if (room) {
|
||||
const me = this.context.getUserId();
|
||||
const canReact = room.getMyMembership() === "join" && room.currentState.maySendEvent("m.reaction", me);
|
||||
|
|
@ -959,11 +954,11 @@ export default createReactClass({
|
|||
|
||||
this.setState({canReact, canReply});
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
// rate limited because a power level change will emit an event for every
|
||||
// member in the room.
|
||||
_updateRoomMembers: rate_limited_func(function(dueToMember) {
|
||||
_updateRoomMembers = rate_limited_func((dueToMember) => {
|
||||
// a member state changed in this room
|
||||
// refresh the conf call notification state
|
||||
this._updateConfCallNotification();
|
||||
|
|
@ -978,9 +973,9 @@ export default createReactClass({
|
|||
this._checkIfAlone(this.state.room, memberCountInfluence);
|
||||
|
||||
this._updateE2EStatus(this.state.room);
|
||||
}, 500),
|
||||
}, 500);
|
||||
|
||||
_checkIfAlone: function(room, countInfluence) {
|
||||
_checkIfAlone(room, countInfluence) {
|
||||
let warnedAboutLonelyRoom = false;
|
||||
if (localStorage) {
|
||||
warnedAboutLonelyRoom = localStorage.getItem('mx_user_alone_warned_' + this.state.room.roomId);
|
||||
|
|
@ -993,9 +988,9 @@ export default createReactClass({
|
|||
let joinedOrInvitedMemberCount = room.getJoinedMemberCount() + room.getInvitedMemberCount();
|
||||
if (countInfluence) joinedOrInvitedMemberCount += countInfluence;
|
||||
this.setState({isAlone: joinedOrInvitedMemberCount === 1});
|
||||
},
|
||||
}
|
||||
|
||||
_updateConfCallNotification: function() {
|
||||
_updateConfCallNotification() {
|
||||
const room = this.state.room;
|
||||
if (!room || !this.props.ConferenceHandler) {
|
||||
return;
|
||||
|
|
@ -1017,7 +1012,7 @@ export default createReactClass({
|
|||
confMember.membership === "join"
|
||||
),
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
_updateDMState() {
|
||||
const room = this.state.room;
|
||||
|
|
@ -1028,9 +1023,9 @@ export default createReactClass({
|
|||
if (dmInviter) {
|
||||
Rooms.setDMRoom(room.roomId, dmInviter);
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
onSearchResultsFillRequest: function(backwards) {
|
||||
onSearchResultsFillRequest = backwards => {
|
||||
if (!backwards) {
|
||||
return Promise.resolve(false);
|
||||
}
|
||||
|
|
@ -1043,25 +1038,25 @@ export default createReactClass({
|
|||
debuglog("no more search results");
|
||||
return Promise.resolve(false);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onInviteButtonClick: function() {
|
||||
onInviteButtonClick = () => {
|
||||
// call AddressPickerDialog
|
||||
dis.dispatch({
|
||||
action: 'view_invite',
|
||||
roomId: this.state.room.roomId,
|
||||
});
|
||||
this.setState({isAlone: false}); // there's a good chance they'll invite someone
|
||||
},
|
||||
};
|
||||
|
||||
onStopAloneWarningClick: function() {
|
||||
onStopAloneWarningClick = () => {
|
||||
if (localStorage) {
|
||||
localStorage.setItem('mx_user_alone_warned_' + this.state.room.roomId, true);
|
||||
}
|
||||
this.setState({isAlone: false});
|
||||
},
|
||||
};
|
||||
|
||||
onJoinButtonClicked: function(ev) {
|
||||
onJoinButtonClicked = ev => {
|
||||
// If the user is a ROU, allow them to transition to a PWLU
|
||||
if (this.context && this.context.isGuest()) {
|
||||
// Join this room once the user has registered and logged in
|
||||
|
|
@ -1120,10 +1115,9 @@ export default createReactClass({
|
|||
return Promise.resolve();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
},
|
||||
|
||||
onMessageListScroll: function(ev) {
|
||||
onMessageListScroll = ev => {
|
||||
if (this._messagePanel.isAtEndOfLiveTimeline()) {
|
||||
this.setState({
|
||||
numUnreadMessages: 0,
|
||||
|
|
@ -1135,9 +1129,9 @@ export default createReactClass({
|
|||
});
|
||||
}
|
||||
this._updateTopUnreadMessagesBar();
|
||||
},
|
||||
};
|
||||
|
||||
onDragOver: function(ev) {
|
||||
onDragOver = ev => {
|
||||
ev.stopPropagation();
|
||||
ev.preventDefault();
|
||||
|
||||
|
|
@ -1154,9 +1148,9 @@ export default createReactClass({
|
|||
ev.dataTransfer.dropEffect = 'copy';
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onDrop: function(ev) {
|
||||
onDrop = ev => {
|
||||
ev.stopPropagation();
|
||||
ev.preventDefault();
|
||||
ContentMessages.sharedInstance().sendContentListToRoom(
|
||||
|
|
@ -1164,15 +1158,15 @@ export default createReactClass({
|
|||
);
|
||||
this.setState({ draggingFile: false });
|
||||
dis.fire(Action.FocusComposer);
|
||||
},
|
||||
};
|
||||
|
||||
onDragLeaveOrEnd: function(ev) {
|
||||
onDragLeaveOrEnd = ev => {
|
||||
ev.stopPropagation();
|
||||
ev.preventDefault();
|
||||
this.setState({ draggingFile: false });
|
||||
},
|
||||
};
|
||||
|
||||
injectSticker: function(url, info, text) {
|
||||
injectSticker(url, info, text) {
|
||||
if (this.context.isGuest()) {
|
||||
dis.dispatch({action: 'require_registration'});
|
||||
return;
|
||||
|
|
@ -1185,9 +1179,9 @@ export default createReactClass({
|
|||
return;
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
onSearch: function(term, scope) {
|
||||
onSearch = (term, scope) => {
|
||||
this.setState({
|
||||
searchTerm: term,
|
||||
searchScope: scope,
|
||||
|
|
@ -1213,9 +1207,9 @@ export default createReactClass({
|
|||
debuglog("sending search request");
|
||||
const searchPromise = eventSearch(term, roomId);
|
||||
this._handleSearchResult(searchPromise);
|
||||
},
|
||||
};
|
||||
|
||||
_handleSearchResult: function(searchPromise) {
|
||||
_handleSearchResult(searchPromise) {
|
||||
const self = this;
|
||||
|
||||
// keep a record of the current search id, so that if the search terms
|
||||
|
|
@ -1266,9 +1260,9 @@ export default createReactClass({
|
|||
searchInProgress: false,
|
||||
});
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
getSearchResultTiles: function() {
|
||||
getSearchResultTiles() {
|
||||
const SearchResultTile = sdk.getComponent('rooms.SearchResultTile');
|
||||
const Spinner = sdk.getComponent("elements.Spinner");
|
||||
|
||||
|
|
@ -1348,20 +1342,20 @@ export default createReactClass({
|
|||
onHeightChanged={onHeightChanged} />);
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
}
|
||||
|
||||
onPinnedClick: function() {
|
||||
onPinnedClick = () => {
|
||||
const nowShowingPinned = !this.state.showingPinned;
|
||||
const roomId = this.state.room.roomId;
|
||||
this.setState({showingPinned: nowShowingPinned, searching: false});
|
||||
SettingsStore.setValue("PinnedEvents.isOpen", roomId, SettingLevel.ROOM_DEVICE, nowShowingPinned);
|
||||
},
|
||||
};
|
||||
|
||||
onSettingsClick: function() {
|
||||
onSettingsClick = () => {
|
||||
dis.dispatch({ action: 'open_room_settings' });
|
||||
},
|
||||
};
|
||||
|
||||
onCancelClick: function() {
|
||||
onCancelClick = () => {
|
||||
console.log("updateTint from onCancelClick");
|
||||
this.updateTint();
|
||||
if (this.state.forwardingEvent) {
|
||||
|
|
@ -1371,23 +1365,23 @@ export default createReactClass({
|
|||
});
|
||||
}
|
||||
dis.fire(Action.FocusComposer);
|
||||
},
|
||||
};
|
||||
|
||||
onLeaveClick: function() {
|
||||
onLeaveClick = () => {
|
||||
dis.dispatch({
|
||||
action: 'leave_room',
|
||||
room_id: this.state.room.roomId,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onForgetClick: function() {
|
||||
onForgetClick = () => {
|
||||
dis.dispatch({
|
||||
action: 'forget_room',
|
||||
room_id: this.state.room.roomId,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onRejectButtonClicked: function(ev) {
|
||||
onRejectButtonClicked = ev => {
|
||||
const self = this;
|
||||
this.setState({
|
||||
rejecting: true,
|
||||
|
|
@ -1412,9 +1406,9 @@ export default createReactClass({
|
|||
rejectError: error,
|
||||
});
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onRejectAndIgnoreClick: async function() {
|
||||
onRejectAndIgnoreClick = async () => {
|
||||
this.setState({
|
||||
rejecting: true,
|
||||
});
|
||||
|
|
@ -1446,49 +1440,49 @@ export default createReactClass({
|
|||
rejectError: error,
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
onRejectThreepidInviteButtonClicked: function(ev) {
|
||||
onRejectThreepidInviteButtonClicked = ev => {
|
||||
// We can reject 3pid invites in the same way that we accept them,
|
||||
// using /leave rather than /join. In the short term though, we
|
||||
// just ignore them.
|
||||
// https://github.com/vector-im/vector-web/issues/1134
|
||||
dis.fire(Action.ViewRoomDirectory);
|
||||
},
|
||||
};
|
||||
|
||||
onSearchClick: function() {
|
||||
onSearchClick = () => {
|
||||
this.setState({
|
||||
searching: !this.state.searching,
|
||||
showingPinned: false,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onCancelSearchClick: function() {
|
||||
onCancelSearchClick = () => {
|
||||
this.setState({
|
||||
searching: false,
|
||||
searchResults: null,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
// jump down to the bottom of this room, where new events are arriving
|
||||
jumpToLiveTimeline: function() {
|
||||
jumpToLiveTimeline = () => {
|
||||
this._messagePanel.jumpToLiveTimeline();
|
||||
dis.fire(Action.FocusComposer);
|
||||
},
|
||||
};
|
||||
|
||||
// jump up to wherever our read marker is
|
||||
jumpToReadMarker: function() {
|
||||
jumpToReadMarker = () => {
|
||||
this._messagePanel.jumpToReadMarker();
|
||||
},
|
||||
};
|
||||
|
||||
// update the read marker to match the read-receipt
|
||||
forgetReadMarker: function(ev) {
|
||||
forgetReadMarker = ev => {
|
||||
ev.stopPropagation();
|
||||
this._messagePanel.forgetReadMarker();
|
||||
},
|
||||
};
|
||||
|
||||
// decide whether or not the top 'unread messages' bar should be shown
|
||||
_updateTopUnreadMessagesBar: function() {
|
||||
_updateTopUnreadMessagesBar = () => {
|
||||
if (!this._messagePanel) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -1497,12 +1491,12 @@ export default createReactClass({
|
|||
if (this.state.showTopUnreadMessagesBar != showBar) {
|
||||
this.setState({showTopUnreadMessagesBar: showBar});
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
// get the current scroll position of the room, so that it can be
|
||||
// restored when we switch back to it.
|
||||
//
|
||||
_getScrollState: function() {
|
||||
_getScrollState() {
|
||||
const messagePanel = this._messagePanel;
|
||||
if (!messagePanel) return null;
|
||||
|
||||
|
|
@ -1537,9 +1531,9 @@ export default createReactClass({
|
|||
focussedEvent: scrollState.trackedScrollToken,
|
||||
pixelOffset: scrollState.pixelOffset,
|
||||
};
|
||||
},
|
||||
}
|
||||
|
||||
onResize: function() {
|
||||
onResize = () => {
|
||||
// It seems flexbox doesn't give us a way to constrain the auxPanel height to have
|
||||
// a minimum of the height of the video element, whilst also capping it from pushing out the page
|
||||
// so we have to do it via JS instead. In this implementation we cap the height by putting
|
||||
|
|
@ -1557,16 +1551,16 @@ export default createReactClass({
|
|||
if (auxPanelMaxHeight < 50) auxPanelMaxHeight = 50;
|
||||
|
||||
this.setState({auxPanelMaxHeight: auxPanelMaxHeight});
|
||||
},
|
||||
};
|
||||
|
||||
onFullscreenClick: function() {
|
||||
onFullscreenClick = () => {
|
||||
dis.dispatch({
|
||||
action: 'video_fullscreen',
|
||||
fullscreen: true,
|
||||
}, true);
|
||||
},
|
||||
};
|
||||
|
||||
onMuteAudioClick: function() {
|
||||
onMuteAudioClick = () => {
|
||||
const call = this._getCallForRoom();
|
||||
if (!call) {
|
||||
return;
|
||||
|
|
@ -1574,9 +1568,9 @@ export default createReactClass({
|
|||
const newState = !call.isMicrophoneMuted();
|
||||
call.setMicrophoneMuted(newState);
|
||||
this.forceUpdate(); // TODO: just update the voip buttons
|
||||
},
|
||||
};
|
||||
|
||||
onMuteVideoClick: function() {
|
||||
onMuteVideoClick = () => {
|
||||
const call = this._getCallForRoom();
|
||||
if (!call) {
|
||||
return;
|
||||
|
|
@ -1584,29 +1578,29 @@ export default createReactClass({
|
|||
const newState = !call.isLocalVideoMuted();
|
||||
call.setLocalVideoMuted(newState);
|
||||
this.forceUpdate(); // TODO: just update the voip buttons
|
||||
},
|
||||
};
|
||||
|
||||
onStatusBarVisible: function() {
|
||||
onStatusBarVisible = () => {
|
||||
if (this.unmounted) return;
|
||||
this.setState({
|
||||
statusBarVisible: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
onStatusBarHidden: function() {
|
||||
onStatusBarHidden = () => {
|
||||
// This is currently not desired as it is annoying if it keeps expanding and collapsing
|
||||
if (this.unmounted) return;
|
||||
this.setState({
|
||||
statusBarVisible: false,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* called by the parent component when PageUp/Down/etc is pressed.
|
||||
*
|
||||
* We pass it down to the scroll panel.
|
||||
*/
|
||||
handleScrollKey: function(ev) {
|
||||
handleScrollKey = ev => {
|
||||
let panel;
|
||||
if (this._searchResultsPanel.current) {
|
||||
panel = this._searchResultsPanel.current;
|
||||
|
|
@ -1617,48 +1611,48 @@ export default createReactClass({
|
|||
if (panel) {
|
||||
panel.handleScrollKey(ev);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* get any current call for this room
|
||||
*/
|
||||
_getCallForRoom: function() {
|
||||
_getCallForRoom() {
|
||||
if (!this.state.room) {
|
||||
return null;
|
||||
}
|
||||
return CallHandler.getCallForRoom(this.state.room.roomId);
|
||||
},
|
||||
}
|
||||
|
||||
// this has to be a proper method rather than an unnamed function,
|
||||
// otherwise react calls it with null on each update.
|
||||
_gatherTimelinePanelRef: function(r) {
|
||||
_gatherTimelinePanelRef = r => {
|
||||
this._messagePanel = r;
|
||||
if (r) {
|
||||
console.log("updateTint from RoomView._gatherTimelinePanelRef");
|
||||
this.updateTint();
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
_getOldRoom: function() {
|
||||
_getOldRoom() {
|
||||
const createEvent = this.state.room.currentState.getStateEvents("m.room.create", "");
|
||||
if (!createEvent || !createEvent.getContent()['predecessor']) return null;
|
||||
|
||||
return this.context.getRoom(createEvent.getContent()['predecessor']['room_id']);
|
||||
},
|
||||
}
|
||||
|
||||
_getHiddenHighlightCount: function() {
|
||||
_getHiddenHighlightCount() {
|
||||
const oldRoom = this._getOldRoom();
|
||||
if (!oldRoom) return 0;
|
||||
return oldRoom.getUnreadNotificationCount('highlight');
|
||||
},
|
||||
}
|
||||
|
||||
_onHiddenHighlightsClick: function() {
|
||||
_onHiddenHighlightsClick = () => {
|
||||
const oldRoom = this._getOldRoom();
|
||||
if (!oldRoom) return;
|
||||
dis.dispatch({action: "view_room", room_id: oldRoom.roomId});
|
||||
},
|
||||
};
|
||||
|
||||
render: function() {
|
||||
render() {
|
||||
const RoomHeader = sdk.getComponent('rooms.RoomHeader');
|
||||
const ForwardMessage = sdk.getComponent("rooms.ForwardMessage");
|
||||
const AuxPanel = sdk.getComponent("rooms.AuxPanel");
|
||||
|
|
@ -2118,5 +2112,5 @@ export default createReactClass({
|
|||
</main>
|
||||
</RoomContext.Provider>
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue