imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/nvl/rich_quoting

Browse source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

# Conflicts:
#	src/components/views/messages/TextualBody.js
This commit is contained in:
Michael Telatynski 2018-01-10 11:54:58 +00:00
commit 1bc9d344ae
No known key found for this signature in database
GPG key ID: 3F879DA5AD802A5E
187 changed files with 5637 additions and 1498 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/components/views/rooms/AppsDrawer.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
import React from 'react';
import PropTypes from 'prop-types';
import MatrixClientPeg from '../../../MatrixClientPeg';
import AppTile from '../elements/AppTile';
import Modal from '../../../Modal';
@ -27,6 +28,7 @@ import ScalarAuthClient from '../../../ScalarAuthClient';
import ScalarMessaging from '../../../ScalarMessaging';
import { _t } from '../../../languageHandler';
import WidgetUtils from '../../../WidgetUtils';
import SettingsStore from "../../../settings/SettingsStore";
// The maximum number of widgets that can be added in a room
const MAX_WIDGETS = 2;
@ -35,7 +37,7 @@ module.exports = React.createClass({
displayName: 'AppsDrawer',
propTypes: {
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
},
getInitialState: function() {
@ -131,16 +133,22 @@ module.exports = React.createClass({
'$matrix_room_id': this.props.room.roomId,
'$matrix_display_name': user ? user.displayName : this.props.userId,
'$matrix_avatar_url': user ? MatrixClientPeg.get().mxcUrlToHttp(user.avatarUrl) : '',
// TODO: Namespace themes through some standard
'$theme': SettingsStore.getValue("theme"),
};
app.id = appId;
app.name = app.name || app.type;
if (app.data) {
Object.keys(app.data).forEach((key) => {
params['$' + key] = app.data[key];
});
app.waitForIframeLoad = (app.data.waitForIframeLoad === 'false' ? false : true);
}
app.id = appId;
app.name = app.name || app.type;
app.url = this.encodeUri(app.url, params);
app.creatorUserId = (sender && sender.userId) ? sender.userId : null;
@ -224,6 +232,8 @@ module.exports = React.createClass({
userId={this.props.userId}
show={this.props.showApps}
creatorUserId={app.creatorUserId}
widgetPageTitle={(app.data && app.data.title) ? app.data.title : ''}
waitForIframeLoad={app.waitForIframeLoad}
/>);
});

17
src/components/views/rooms/AuxPanel.js
View file

@ -16,6 +16,7 @@ limitations under the License.
*/
import React from 'react';
import PropTypes from 'prop-types';
import MatrixClientPeg from "../../../MatrixClientPeg";
import sdk from '../../../index';
import dis from "../../../dispatcher";
@ -29,26 +30,26 @@ module.exports = React.createClass({
propTypes: {
// js-sdk room object
room: React.PropTypes.object.isRequired,
userId: React.PropTypes.string.isRequired,
showApps: React.PropTypes.bool,
room: PropTypes.object.isRequired,
userId: PropTypes.string.isRequired,
showApps: PropTypes.bool,
// Conference Handler implementation
conferenceHandler: React.PropTypes.object,
conferenceHandler: PropTypes.object,
// set to true to show the file drop target
draggingFile: React.PropTypes.bool,
draggingFile: PropTypes.bool,
// set to true to show the 'active conf call' banner
displayConfCallNotification: React.PropTypes.bool,
displayConfCallNotification: PropTypes.bool,
// maxHeight attribute for the aux panel and the video
// therein
maxHeight: React.PropTypes.number,
maxHeight: PropTypes.number,
// a callback which is called when the content of the aux panel changes
// content in a way that is likely to make it change size.
onResize: React.PropTypes.func,
onResize: PropTypes.func,
},
shouldComponentUpdate: function(nextProps, nextState) {

25
src/components/views/rooms/EntityTile.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const MatrixClientPeg = require('../../../MatrixClientPeg');
const sdk = require('../../../index');
@ -51,18 +52,18 @@ const EntityTile = React.createClass({
displayName: 'EntityTile',
propTypes: {
name: React.PropTypes.string,
title: React.PropTypes.string,
avatarJsx: React.PropTypes.any, // <BaseAvatar />
className: React.PropTypes.string,
presenceState: React.PropTypes.string,
presenceLastActiveAgo: React.PropTypes.number,
presenceLastTs: React.PropTypes.number,
presenceCurrentlyActive: React.PropTypes.bool,
showInviteButton: React.PropTypes.bool,
shouldComponentUpdate: React.PropTypes.func,
onClick: React.PropTypes.func,
suppressOnHover: React.PropTypes.bool,
name: PropTypes.string,
title: PropTypes.string,
avatarJsx: PropTypes.any, // <BaseAvatar />
className: PropTypes.string,
presenceState: PropTypes.string,
presenceLastActiveAgo: PropTypes.number,
presenceLastTs: PropTypes.number,
presenceCurrentlyActive: PropTypes.bool,
showInviteButton: PropTypes.bool,
shouldComponentUpdate: PropTypes.func,
onClick: PropTypes.func,
suppressOnHover: PropTypes.bool,
},
getDefaultProps: function() {

40
src/components/views/rooms/EventTile.js
View file

@ -19,6 +19,7 @@ limitations under the License.
const React = require('react');
import PropTypes from 'prop-types';
const classNames = require("classnames");
import { _t, _td } from '../../../languageHandler';
const Modal = require('../../../Modal');
@ -77,65 +78,65 @@ module.exports = withMatrixClient(React.createClass({
propTypes: {
/* MatrixClient instance for sender verification etc */
matrixClient: React.PropTypes.object.isRequired,
matrixClient: PropTypes.object.isRequired,
/* the MatrixEvent to show */
mxEvent: React.PropTypes.object.isRequired,
mxEvent: PropTypes.object.isRequired,
/* true if mxEvent is redacted. This is a prop because using mxEvent.isRedacted()
* might not be enough when deciding shouldComponentUpdate - prevProps.mxEvent
* references the same this.props.mxEvent.
*/
isRedacted: React.PropTypes.bool,
isRedacted: PropTypes.bool,
/* true if this is a continuation of the previous event (which has the
* effect of not showing another avatar/displayname
*/
continuation: React.PropTypes.bool,
continuation: PropTypes.bool,
/* true if this is the last event in the timeline (which has the effect
* of always showing the timestamp)
*/
last: React.PropTypes.bool,
last: PropTypes.bool,
/* true if this is search context (which has the effect of greying out
* the text
*/
contextual: React.PropTypes.bool,
contextual: PropTypes.bool,
/* a list of words to highlight, ordered by longest first */
highlights: React.PropTypes.array,
highlights: PropTypes.array,
/* link URL for the highlights */
highlightLink: React.PropTypes.string,
highlightLink: PropTypes.string,
/* should show URL previews for this event */
showUrlPreview: React.PropTypes.bool,
showUrlPreview: PropTypes.bool,
/* is this the focused event */
isSelectedEvent: React.PropTypes.bool,
isSelectedEvent: PropTypes.bool,
/* callback called when dynamic content in events are loaded */
onWidgetLoad: React.PropTypes.func,
onWidgetLoad: PropTypes.func,
/* a list of read-receipts we should show. Each object has a 'roomMember' and 'ts'. */
readReceipts: React.PropTypes.arrayOf(React.PropTypes.object),
readReceipts: PropTypes.arrayOf(React.PropTypes.object),
/* opaque readreceipt info for each userId; used by ReadReceiptMarker
* to manage its animations. Should be an empty object when the room
* first loads
*/
readReceiptMap: React.PropTypes.object,
readReceiptMap: PropTypes.object,
/* A function which is used to check if the parent panel is being
* unmounted, to avoid unnecessary work. Should return true if we
* are being unmounted.
*/
checkUnmounting: React.PropTypes.func,
checkUnmounting: PropTypes.func,
/* the status of this event - ie, mxEvent.status. Denormalised to here so
* that we can tell when it changes. */
eventSendStatus: React.PropTypes.string,
eventSendStatus: PropTypes.string,
/* the shape of the tile. by default, the layout is intended for the
* normal room timeline. alternative values are: "file_list", "file_grid"
@ -144,10 +145,10 @@ module.exports = withMatrixClient(React.createClass({
* boiilerplatey. So just make the necessary render decisions conditional
* for now.
*/
tileShape: React.PropTypes.string,
tileShape: PropTypes.string,
// show twelve hour timestamps
isTwelveHour: React.PropTypes.bool,
isTwelveHour: PropTypes.bool,
},
getInitialState: function() {
@ -198,6 +199,8 @@ module.exports = withMatrixClient(React.createClass({
*/
_onDecrypted: function() {
// we need to re-verify the sending device.
// (we call onWidgetLoad in _verifyEvent to handle the case where decryption
// has caused a change in size of the event tile)
this._verifyEvent(this.props.mxEvent);
this.forceUpdate();
},
@ -216,6 +219,9 @@ module.exports = withMatrixClient(React.createClass({
const verified = await this.props.matrixClient.isEventSenderVerified(mxEvent);
this.setState({
verified: verified,
}, () => {
// Decryption may have caused a change in size
this.props.onWidgetLoad();
});
},

3
src/components/views/rooms/ForwardMessage.js
View file

@ -16,6 +16,7 @@
*/
import React from 'react';
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import dis from '../../../dispatcher';
import { KeyCode } from '../../../Keyboard';
@ -25,7 +26,7 @@ module.exports = React.createClass({
displayName: 'ForwardMessage',
propTypes: {
onCancelClick: React.PropTypes.func.isRequired,
onCancelClick: PropTypes.func.isRequired,
},
componentWillMount: function() {

9
src/components/views/rooms/LinkPreviewWidget.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const sdk = require('../../../index');
const MatrixClientPeg = require('../../../MatrixClientPeg');
@ -32,10 +33,10 @@ module.exports = React.createClass({
displayName: 'LinkPreviewWidget',
propTypes: {
link: React.PropTypes.string.isRequired, // the URL being previewed
mxEvent: React.PropTypes.object.isRequired, // the Event associated with the preview
onCancelClick: React.PropTypes.func, // called when the preview's cancel ('hide') button is clicked
onWidgetLoad: React.PropTypes.func, // called when the preview's contents has loaded
link: PropTypes.string.isRequired, // the URL being previewed
mxEvent: PropTypes.object.isRequired, // the Event associated with the preview
onCancelClick: PropTypes.func, // called when the preview's cancel ('hide') button is clicked
onWidgetLoad: PropTypes.func, // called when the preview's contents has loaded
},
getInitialState: function() {

5
src/components/views/rooms/MemberDeviceInfo.js
View file

@ -15,6 +15,7 @@ limitations under the License.
*/
import React from 'react';
import PropTypes from 'prop-types';
import sdk from '../../../index';
import { _t } from '../../../languageHandler';
@ -65,6 +66,6 @@ export default class MemberDeviceInfo extends React.Component {
MemberDeviceInfo.displayName = 'MemberDeviceInfo';
MemberDeviceInfo.propTypes = {
userId: React.PropTypes.string.isRequired,
device: React.PropTypes.object.isRequired,
userId: PropTypes.string.isRequired,
device: PropTypes.object.isRequired,
};

104
src/components/views/rooms/MemberInfo.js
View file

@ -27,6 +27,7 @@ limitations under the License.
* 'isTargetMod': boolean
*/
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import dis from '../../../dispatcher';
import Modal from '../../../Modal';
@ -41,13 +42,12 @@ import AccessibleButton from '../elements/AccessibleButton';
import GeminiScrollbar from 'react-gemini-scrollbar';
import RoomViewStore from '../../../stores/RoomViewStore';
module.exports = withMatrixClient(React.createClass({
displayName: 'MemberInfo',
propTypes: {
matrixClient: React.PropTypes.object.isRequired,
member: React.PropTypes.object.isRequired,
matrixClient: PropTypes.object.isRequired,
member: PropTypes.object.isRequired,
},
getInitialState: function() {
@ -440,40 +440,57 @@ module.exports = withMatrixClient(React.createClass({
const roomId = this.props.member.roomId;
const target = this.props.member.userId;
const room = this.props.matrixClient.getRoom(roomId);
const self = this;
if (!room) {
return;
}
const powerLevelEvent = room.currentState.getStateEvents(
"m.room.power_levels", "",
);
if (!powerLevelEvent) {
return;
}
if (powerLevelEvent.getContent().users) {
const myPower = powerLevelEvent.getContent().users[this.props.matrixClient.credentials.userId];
if (parseInt(myPower) === parseInt(powerLevel)) {
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
Modal.createTrackedDialog('Promote to PL100 Warning', '', QuestionDialog, {
title: _t("Warning!"),
description:
<div>
{ _t("You will not be able to undo this change as you are promoting the user to have the same power level as yourself.") }<br />
{ _t("Are you sure?") }
</div>,
button: _t("Continue"),
onFinished: function(confirmed) {
if (confirmed) {
self._applyPowerChange(roomId, target, powerLevel, powerLevelEvent);
}
},
});
} else {
this._applyPowerChange(roomId, target, powerLevel, powerLevelEvent);
}
} else {
if (!room) return;
const powerLevelEvent = room.currentState.getStateEvents("m.room.power_levels", "");
if (!powerLevelEvent) return;
if (!powerLevelEvent.getContent().users) {
this._applyPowerChange(roomId, target, powerLevel, powerLevelEvent);
return;
}
const myUserId = this.props.matrixClient.getUserId();
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
// If we are changing our own PL it can only ever be decreasing, which we cannot reverse.
if (myUserId === target) {
Modal.createTrackedDialog('Demoting Self', '', QuestionDialog, {
title: _t("Warning!"),
description:
<div>
{ _t("You will not be able to undo this change as you are demoting yourself, if you are the last privileged user in the room it will be impossible to regain privileges.") }<br />
{ _t("Are you sure?") }
</div>,
button: _t("Continue"),
onFinished: (confirmed) => {
if (confirmed) {
this._applyPowerChange(roomId, target, powerLevel, powerLevelEvent);
}
},
});
return;
}
const myPower = powerLevelEvent.getContent().users[myUserId];
if (parseInt(myPower) === parseInt(powerLevel)) {
Modal.createTrackedDialog('Promote to PL100 Warning', '', QuestionDialog, {
title: _t("Warning!"),
description:
<div>
{ _t("You will not be able to undo this change as you are promoting the user to have the same power level as yourself.") }<br />
{ _t("Are you sure?") }
</div>,
button: _t("Continue"),
onFinished: (confirmed) => {
if (confirmed) {
this._applyPowerChange(roomId, target, powerLevel, powerLevelEvent);
}
},
});
return;
}
this._applyPowerChange(roomId, target, powerLevel, powerLevelEvent);
},
onNewDMClick: function() {
@ -713,6 +730,10 @@ module.exports = withMatrixClient(React.createClass({
if (this.props.member.userId !== this.props.matrixClient.credentials.userId) {
const dmRoomMap = new DMRoomMap(this.props.matrixClient);
// dmRooms will not include dmRooms that we have been invited into but did not join.
// Because DMRoomMap runs off account_data[m.direct] which is only set on join of dm room.
// XXX: we potentially want DMs we have been invited to, to also show up here :L
// especially as logic below concerns specially if we haven't joined but have been invited
const dmRooms = dmRoomMap.getDMRoomsForUserId(this.props.member.userId);
const RoomTile = sdk.getComponent("rooms.RoomTile");
@ -722,10 +743,15 @@ module.exports = withMatrixClient(React.createClass({
const room = this.props.matrixClient.getRoom(roomId);
if (room) {
const me = room.getMember(this.props.matrixClient.credentials.userId);
const highlight = (
room.getUnreadNotificationCount('highlight') > 0 ||
me.membership === "invite"
);
// not a DM room if we have are not joined
if (!me.membership || me.membership !== 'join') continue;
// not a DM room if they are not joined
const them = this.props.member;
if (!them.membership || them.membership !== 'join') continue;
const highlight = room.getUnreadNotificationCount('highlight') > 0 || me.membership === 'invite';
tiles.push(
<RoomTile key={room.roomId} room={room}
collapsed={false}

3
src/components/views/rooms/MemberTile.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const MatrixClientPeg = require('../../../MatrixClientPeg');
const sdk = require('../../../index');
@ -28,7 +29,7 @@ module.exports = React.createClass({
displayName: 'MemberTile',
propTypes: {
member: React.PropTypes.any.isRequired, // RoomMember
member: PropTypes.any.isRequired, // RoomMember
},
getInitialState: function() {

11
src/components/views/rooms/MessageComposer.js
View file

@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import CallHandler from '../../../CallHandler';
import MatrixClientPeg from '../../../MatrixClientPeg';
@ -423,17 +424,17 @@ export default class MessageComposer extends React.Component {
MessageComposer.propTypes = {
// a callback which is called when the height of the composer is
// changed due to a change in content.
onResize: React.PropTypes.func,
onResize: PropTypes.func,
// js-sdk Room object
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
// string representing the current voip call state
callState: React.PropTypes.string,
callState: PropTypes.string,
// callback when a file to upload is chosen
uploadFile: React.PropTypes.func.isRequired,
uploadFile: PropTypes.func.isRequired,
// string representing the current room app drawer state
showApps: React.PropTypes.bool,
showApps: PropTypes.bool,
};

29
src/components/views/rooms/MessageComposerInput.js
View file

@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import PropTypes from 'prop-types';
import type SyntheticKeyboardEvent from 'react/lib/SyntheticKeyboardEvent';
import {Editor, EditorState, RichUtils, CompositeDecorator, Modifier,
@ -78,13 +79,6 @@ function onSendMessageFailed(err, room) {
// XXX: temporary logging to try to diagnose
// https://github.com/vector-im/riot-web/issues/3148
console.log('MessageComposer got send failure: ' + err.name + '('+err+')');
if (err.name === "UnknownDeviceError") {
dis.dispatch({
action: 'unknown_device_error',
err: err,
room: room,
});
}
dis.dispatch({
action: 'message_send_failed',
});
@ -97,15 +91,15 @@ export default class MessageComposerInput extends React.Component {
static propTypes = {
// a callback which is called when the height of the composer is
// changed due to a change in content.
onResize: React.PropTypes.func,
onResize: PropTypes.func,
// js-sdk Room object
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
// called with current plaintext content (as a string) whenever it changes
onContentChanged: React.PropTypes.func,
onContentChanged: PropTypes.func,
onInputStateChanged: React.PropTypes.func,
onInputStateChanged: PropTypes.func,
};
static getKeyBinding(ev: SyntheticKeyboardEvent): string {
@ -524,7 +518,8 @@ export default class MessageComposerInput extends React.Component {
// composer. For some reason the editor won't scroll automatically if we paste
// blocks of text in or insert newlines.
if (textContent.slice(selection.start).indexOf("\n") === -1) {
this.refs.editor.refs.editor.scrollTop = this.refs.editor.refs.editor.scrollHeight;
let editorRoot = this.refs.editor.refs.editor.parentNode.parentNode;
editorRoot.scrollTop = editorRoot.scrollHeight;
}
});
}
@ -1217,15 +1212,15 @@ export default class MessageComposerInput extends React.Component {
MessageComposerInput.propTypes = {
// a callback which is called when the height of the composer is
// changed due to a change in content.
onResize: React.PropTypes.func,
onResize: PropTypes.func,
// js-sdk Room object
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
// called with current plaintext content (as a string) whenever it changes
onContentChanged: React.PropTypes.func,
onContentChanged: PropTypes.func,
onFilesPasted: React.PropTypes.func,
onFilesPasted: PropTypes.func,
onInputStateChanged: React.PropTypes.func,
onInputStateChanged: PropTypes.func,
};

7
src/components/views/rooms/PinnedEventTile.js
View file

@ -15,6 +15,7 @@ limitations under the License.
*/
import React from "react";
import PropTypes from 'prop-types';
import MatrixClientPeg from "../../../MatrixClientPeg";
import dis from "../../../dispatcher";
import AccessibleButton from "../elements/AccessibleButton";
@ -25,9 +26,9 @@ import { _t } from '../../../languageHandler';
module.exports = React.createClass({
displayName: 'PinnedEventTile',
propTypes: {
mxRoom: React.PropTypes.object.isRequired,
mxEvent: React.PropTypes.object.isRequired,
onUnpinned: React.PropTypes.func,
mxRoom: PropTypes.object.isRequired,
mxEvent: PropTypes.object.isRequired,
onUnpinned: PropTypes.func,
},
onTileClicked: function() {
dis.dispatch({

5
src/components/views/rooms/PinnedEventsPanel.js
View file

@ -15,6 +15,7 @@ limitations under the License.
*/
import React from "react";
import PropTypes from 'prop-types';
import MatrixClientPeg from "../../../MatrixClientPeg";
import AccessibleButton from "../elements/AccessibleButton";
import PinnedEventTile from "./PinnedEventTile";
@ -25,9 +26,9 @@ module.exports = React.createClass({
displayName: 'PinnedEventsPanel',
propTypes: {
// The Room from the js-sdk we're going to show pinned events for
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
onCancelClick: React.PropTypes.func,
onCancelClick: PropTypes.func,
},
getInitialState: function() {

7
src/components/views/rooms/PresenceLabel.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
import React from 'react';
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
@ -27,14 +28,14 @@ module.exports = React.createClass({
propTypes: {
// number of milliseconds ago this user was last active.
// zero = unknown
activeAgo: React.PropTypes.number,
activeAgo: PropTypes.number,
// if true, activeAgo is an approximation and "Now" should
// be shown instead
currentlyActive: React.PropTypes.bool,
currentlyActive: PropTypes.bool,
// offline, online, etc
presenceState: React.PropTypes.string,
presenceState: PropTypes.string,
},
getDefaultProps: function() {

19
src/components/views/rooms/ReadReceiptMarker.js
View file

@ -18,6 +18,7 @@ limitations under the License.
const React = require('react');
const ReactDOM = require('react-dom');
import PropTypes from 'prop-types';
const sdk = require('../../../index');
@ -40,35 +41,35 @@ module.exports = React.createClass({
propTypes: {
// the RoomMember to show the RR for
member: React.PropTypes.object.isRequired,
member: PropTypes.object.isRequired,
// number of pixels to offset the avatar from the right of its parent;
// typically a negative value.
leftOffset: React.PropTypes.number,
leftOffset: PropTypes.number,
// true to hide the avatar (it will still be animated)
hidden: React.PropTypes.bool,
hidden: PropTypes.bool,
// don't animate this RR into position
suppressAnimation: React.PropTypes.bool,
suppressAnimation: PropTypes.bool,
// an opaque object for storing information about this user's RR in
// this room
readReceiptInfo: React.PropTypes.object,
readReceiptInfo: PropTypes.object,
// A function which is used to check if the parent panel is being
// unmounted, to avoid unnecessary work. Should return true if we
// are being unmounted.
checkUnmounting: React.PropTypes.func,
checkUnmounting: PropTypes.func,
// callback for clicks on this RR
onClick: React.PropTypes.func,
onClick: PropTypes.func,
// Timestamp when the receipt was read
timestamp: React.PropTypes.number,
timestamp: PropTypes.number,
// True to show twelve hour format, false otherwise
showTwelveHour: React.PropTypes.bool,
showTwelveHour: PropTypes.bool,
},
getDefaultProps: function() {

109
src/components/views/rooms/RoomDetailList.js
View file

@ -18,121 +18,40 @@ import sdk from '../../../index';
import dis from '../../../dispatcher';
import React from 'react';
import { _t } from '../../../languageHandler';
import linkifyString from 'linkifyjs/string';
import sanitizeHtml from 'sanitize-html';
import { ContentRepo } from 'matrix-js-sdk';
import MatrixClientPeg from '../../../MatrixClientPeg';
import PropTypes from 'prop-types';
import classNames from 'classnames';
function getDisplayAliasForRoom(room) {
return room.canonicalAlias || (room.aliases ? room.aliases[0] : "");
}
const RoomDetailRow = React.createClass({
propTypes: {
room: PropTypes.shape({
name: PropTypes.string,
topic: PropTypes.string,
roomId: PropTypes.string,
avatarUrl: PropTypes.string,
numJoinedMembers: PropTypes.number,
canonicalAlias: PropTypes.string,
aliases: PropTypes.arrayOf(PropTypes.string),
worldReadable: PropTypes.bool,
guestCanJoin: PropTypes.bool,
}),
},
onClick: function(ev) {
ev.preventDefault();
dis.dispatch({
action: 'view_room',
room_id: this.props.room.roomId,
room_alias: this.props.room.canonicalAlias || (this.props.room.aliases || [])[0],
});
},
onTopicClick: function(ev) {
// When clicking a link in the topic, prevent the event being propagated
// to `onClick`.
ev.stopPropagation();
},
render: function() {
const BaseAvatar = sdk.getComponent('avatars.BaseAvatar');
const room = this.props.room;
const name = room.name || getDisplayAliasForRoom(room) || _t('Unnamed room');
const topic = linkifyString(sanitizeHtml(room.topic || ''));
const guestRead = room.worldReadable ? (
<div className="mx_RoomDirectory_perm">{ _t('World readable') }</div>
) : <div />;
const guestJoin = room.guestCanJoin ? (
<div className="mx_RoomDirectory_perm">{ _t('Guests can join') }</div>
) : <div />;
const perms = (guestRead || guestJoin) ? (<div className="mx_RoomDirectory_perms">
{ guestRead }
{ guestJoin }
</div>) : <div />;
return <tr key={room.roomId} onClick={this.onClick}>
<td className="mx_RoomDirectory_roomAvatar">
<BaseAvatar width={24} height={24} resizeMethod='crop'
name={name} idName={name}
url={ContentRepo.getHttpUriForMxc(
MatrixClientPeg.get().getHomeserverUrl(),
room.avatarUrl, 24, 24, "crop")} />
</td>
<td className="mx_RoomDirectory_roomDescription">
<div className="mx_RoomDirectory_name">{ name }</div>&nbsp;
{ perms }
<div className="mx_RoomDirectory_topic"
onClick={this.onTopicClick}
dangerouslySetInnerHTML={{ __html: topic }} />
<div className="mx_RoomDirectory_alias">{ getDisplayAliasForRoom(room) }</div>
</td>
<td className="mx_RoomDirectory_roomMemberCount">
{ room.numJoinedMembers }
</td>
</tr>;
},
});
import {roomShape} from './RoomDetailRow';
export default React.createClass({
displayName: 'RoomDetailList',
propTypes: {
rooms: PropTypes.arrayOf(PropTypes.shape({
name: PropTypes.string,
topic: PropTypes.string,
roomId: PropTypes.string,
avatarUrl: PropTypes.string,
numJoinedMembers: PropTypes.number,
canonicalAlias: PropTypes.string,
aliases: PropTypes.arrayOf(PropTypes.string),
worldReadable: PropTypes.bool,
guestCanJoin: PropTypes.bool,
})),
rooms: PropTypes.arrayOf(roomShape),
className: PropTypes.string,
},
getRows: function() {
if (!this.props.rooms) return [];
const RoomDetailRow = sdk.getComponent('rooms.RoomDetailRow');
return this.props.rooms.map((room, index) => {
return <RoomDetailRow key={index} room={room} />;
return <RoomDetailRow key={index} room={room} onClick={this.onDetailsClick} />;
});
},
onDetailsClick: function(ev, room) {
dis.dispatch({
action: 'view_room',
room_id: room.roomId,
room_alias: room.canonicalAlias || (room.aliases || [])[0],
});
},
render() {
const rows = this.getRows();
let rooms;
if (rows.length == 0) {
if (rows.length === 0) {
rooms = <i>{ _t('No rooms to show') }</i>;
} else {
rooms = <table ref="directory_table" className="mx_RoomDirectory_table">

120
src/components/views/rooms/RoomDetailRow.js Normal file
View file

@ -0,0 +1,120 @@
/*
Copyright 2017 New Vector Ltd.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import sdk from '../../../index';
import React from 'react';
import { _t } from '../../../languageHandler';
import * as linkify from 'linkifyjs';
import linkifyElement from 'linkifyjs/element';
import linkifyMatrix from '../../../linkify-matrix';
import { ContentRepo } from 'matrix-js-sdk';
import MatrixClientPeg from '../../../MatrixClientPeg';
import PropTypes from 'prop-types';
linkifyMatrix(linkify);
export function getDisplayAliasForRoom(room) {
return room.canonicalAlias || (room.aliases ? room.aliases[0] : "");
}
export const roomShape = PropTypes.shape({
name: PropTypes.string,
topic: PropTypes.string,
roomId: PropTypes.string,
avatarUrl: PropTypes.string,
numJoinedMembers: PropTypes.number,
canonicalAlias: PropTypes.string,
aliases: PropTypes.arrayOf(PropTypes.string),
worldReadable: PropTypes.bool,
guestCanJoin: PropTypes.bool,
});
export default React.createClass({
propTypes: {
room: roomShape,
// passes ev, room as args
onClick: PropTypes.func,
onMouseDown: PropTypes.func,
},
_linkifyTopic: function() {
if (this.refs.topic) {
linkifyElement(this.refs.topic, linkifyMatrix.options);
}
},
componentDidMount: function() {
this._linkifyTopic();
},
componentDidUpdate: function() {
this._linkifyTopic();
},
onClick: function(ev) {
ev.preventDefault();
if (this.props.onClick) {
this.props.onClick(ev, this.props.room);
}
},
onTopicClick: function(ev) {
// When clicking a link in the topic, prevent the event being propagated
// to `onClick`.
ev.stopPropagation();
},
render: function() {
const BaseAvatar = sdk.getComponent('avatars.BaseAvatar');
const room = this.props.room;
const name = room.name || getDisplayAliasForRoom(room) || _t('Unnamed room');
const guestRead = room.worldReadable ? (
<div className="mx_RoomDirectory_perm">{ _t('World readable') }</div>
) : <div />;
const guestJoin = room.guestCanJoin ? (
<div className="mx_RoomDirectory_perm">{ _t('Guests can join') }</div>
) : <div />;
const perms = (guestRead || guestJoin) ? (<div className="mx_RoomDirectory_perms">
{ guestRead }&nbsp;
{ guestJoin }
</div>) : <div />;
return <tr key={room.roomId} onClick={this.onClick} onMouseDown={this.props.onMouseDown}>
<td className="mx_RoomDirectory_roomAvatar">
<BaseAvatar width={24} height={24} resizeMethod='crop'
name={name} idName={name}
url={ContentRepo.getHttpUriForMxc(
MatrixClientPeg.get().getHomeserverUrl(),
room.avatarUrl, 24, 24, "crop")} />
</td>
<td className="mx_RoomDirectory_roomDescription">
<div className="mx_RoomDirectory_name">{ name }</div>&nbsp;
{ perms }
<div className="mx_RoomDirectory_topic" ref="topic" onClick={this.onTopicClick}>
{ room.topic }
</div>
<div className="mx_RoomDirectory_alias">{ getDisplayAliasForRoom(room) }</div>
</td>
<td className="mx_RoomDirectory_roomMemberCount">
{ room.numJoinedMembers }
</td>
</tr>;
},
});

25
src/components/views/rooms/RoomHeader.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import sdk from '../../../index';
import { _t } from '../../../languageHandler';
@ -39,18 +40,18 @@ module.exports = React.createClass({
displayName: 'RoomHeader',
propTypes: {
room: React.PropTypes.object,
oobData: React.PropTypes.object,
editing: React.PropTypes.bool,
saving: React.PropTypes.bool,
inRoom: React.PropTypes.bool,
collapsedRhs: React.PropTypes.bool,
onSettingsClick: React.PropTypes.func,
onPinnedClick: React.PropTypes.func,
onSaveClick: React.PropTypes.func,
onSearchClick: React.PropTypes.func,
onLeaveClick: React.PropTypes.func,
onCancelClick: React.PropTypes.func,
room: PropTypes.object,
oobData: PropTypes.object,
editing: PropTypes.bool,
saving: PropTypes.bool,
inRoom: PropTypes.bool,
collapsedRhs: PropTypes.bool,
onSettingsClick: PropTypes.func,
onPinnedClick: PropTypes.func,
onSaveClick: PropTypes.func,
onSearchClick: PropTypes.func,
onLeaveClick: PropTypes.func,
onCancelClick: PropTypes.func,
},
getDefaultProps: function() {

138
src/components/views/rooms/RoomList.js
View file

@ -18,6 +18,7 @@ limitations under the License.
'use strict';
const React = require("react");
const ReactDOM = require("react-dom");
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
const GeminiScrollbar = require('react-gemini-scrollbar');
const MatrixClientPeg = require("../../../MatrixClientPeg");
@ -28,7 +29,7 @@ const rate_limited_func = require('../../../ratelimitedfunc');
const Rooms = require('../../../Rooms');
import DMRoomMap from '../../../utils/DMRoomMap';
const Receipt = require('../../../utils/Receipt');
import FilterStore from '../../../stores/FilterStore';
import TagOrderStore from '../../../stores/TagOrderStore';
import GroupStoreCache from '../../../stores/GroupStoreCache';
const HIDE_CONFERENCE_CHANS = true;
@ -52,9 +53,9 @@ module.exports = React.createClass({
displayName: 'RoomList',
propTypes: {
ConferenceHandler: React.PropTypes.any,
collapsed: React.PropTypes.bool.isRequired,
searchFilter: React.PropTypes.string,
ConferenceHandler: PropTypes.any,
collapsed: PropTypes.bool.isRequired,
searchFilter: PropTypes.string,
},
getInitialState: function() {
@ -71,6 +72,7 @@ module.exports = React.createClass({
this.mounted = false;
const cli = MatrixClientPeg.get();
cli.on("Room", this.onRoom);
cli.on("deleteRoom", this.onDeleteRoom);
cli.on("Room.timeline", this.onRoomTimeline);
@ -83,21 +85,34 @@ module.exports = React.createClass({
cli.on("accountData", this.onAccountData);
cli.on("Group.myMembership", this._onGroupMyMembership);
const dmRoomMap = DMRoomMap.shared();
this._groupStores = {};
this._selectedTagsRoomIds = [];
this._selectedTagsUserIds = [];
this._groupStoreTokens = [];
// A map between tags which are group IDs and the room IDs of rooms that should be kept
// in the room list when filtering by that tag.
this._visibleRoomsForGroup = {
// $groupId: [$roomId1, $roomId2, ...],
};
// All rooms that should be kept in the room list when filtering.
// By default, show all rooms.
this._visibleRooms = MatrixClientPeg.get().getRooms();
// When the selected tags are changed, initialise a group store if necessary
this._filterStoreToken = FilterStore.addListener(() => {
FilterStore.getSelectedTags().forEach((tag) => {
this._tagStoreToken = TagOrderStore.addListener(() => {
(TagOrderStore.getOrderedTags() || []).forEach((tag) => {
if (tag[0] !== '+' || this._groupStores[tag]) {
return;
}
this._groupStores[tag] = GroupStoreCache.getGroupStore(tag);
this._groupStores[tag].registerListener(() => {
this.updateSelectedTagsEntities();
});
this._groupStoreTokens.push(
this._groupStores[tag].registerListener(() => {
// This group's rooms or members may have updated, update rooms for its tag
this.updateVisibleRoomsForTag(dmRoomMap, tag);
this.updateVisibleRooms();
}),
);
});
this.updateSelectedTagsEntities();
// Filters themselves have changed, refresh the selected tags
this.updateVisibleRooms();
});
this.refreshRoomList();
@ -169,8 +184,13 @@ module.exports = React.createClass({
MatrixClientPeg.get().removeListener("Group.myMembership", this._onGroupMyMembership);
}
if (this._filterStoreToken) {
this._filterStoreToken.remove();
if (this._tagStoreToken) {
this._tagStoreToken.remove();
}
if (this._groupStoreTokens.length > 0) {
// NB: GroupStore is not a Flux.Store
this._groupStoreTokens.forEach((token) => token.unregister());
}
// cancel any pending calls to the rate_limited_funcs
@ -178,11 +198,11 @@ module.exports = React.createClass({
},
onRoom: function(room) {
this._delayedRefreshRoomList();
this.updateVisibleRooms();
},
onDeleteRoom: function(roomId) {
this._delayedRefreshRoomList();
this.updateVisibleRooms();
},
onArchivedHeaderClick: function(isHidden, scrollToPosition) {
@ -259,41 +279,59 @@ module.exports = React.createClass({
this.refreshRoomList();
}, 500),
// Update which rooms and users should appear in RoomList as dictated by selected tags
updateSelectedTagsEntities: function() {
// Update which rooms and users should appear in RoomList for a given group tag
updateVisibleRoomsForTag: function(dmRoomMap, tag) {
if (!this.mounted) return;
this._selectedTagsRoomIds = [];
this._selectedTagsUserIds = [];
FilterStore.getSelectedTags().forEach((tag) => {
this._selectedTagsRoomIds = this._selectedTagsRoomIds.concat(
this._groupStores[tag].getGroupRooms().map((room) => room.roomId),
);
// TODO: Check if room has been tagged to the group by the user
// For now, only handle group tags
const store = this._groupStores[tag];
if (!store) return;
this._selectedTagsUserIds = this._selectedTagsUserIds.concat(
this._groupStores[tag].getGroupMembers().map((member) => member.userId),
this._visibleRoomsForGroup[tag] = [];
store.getGroupRooms().forEach((room) => this._visibleRoomsForGroup[tag].push(room.roomId));
store.getGroupMembers().forEach((member) => {
if (member.userId === MatrixClientPeg.get().credentials.userId) return;
dmRoomMap.getDMRoomsForUserId(member.userId).forEach(
(roomId) => this._visibleRoomsForGroup[tag].push(roomId),
);
});
// TODO: Check if room has been tagged to the group by the user
},
// Update which rooms and users should appear according to which tags are selected
updateVisibleRooms: function() {
const selectedTags = TagOrderStore.getSelectedTags();
const visibleGroupRooms = [];
selectedTags.forEach((tag) => {
(this._visibleRoomsForGroup[tag] || []).forEach(
(roomId) => visibleGroupRooms.push(roomId),
);
});
// If there are any tags selected, constrain the rooms listed to the
// visible rooms as determined by visibleGroupRooms. Here, we
// de-duplicate and filter out rooms that the client doesn't know
// about (hence the Set and the null-guard on `room`).
if (selectedTags.length > 0) {
const roomSet = new Set();
visibleGroupRooms.forEach((roomId) => {
const room = MatrixClientPeg.get().getRoom(roomId);
if (room) {
roomSet.add(room);
}
});
this._visibleRooms = Array.from(roomSet);
} else {
// Show all rooms
this._visibleRooms = MatrixClientPeg.get().getRooms();
}
this.setState({
selectedTags: FilterStore.getSelectedTags(),
selectedTags,
}, () => {
this.refreshRoomList();
});
},
isRoomInSelectedTags: function(room, me, dmRoomMap) {
// No selected tags = every room is visible in the list
if (this.state.selectedTags.length === 0) {
return true;
}
if (this._selectedTagsRoomIds.includes(room.roomId)) {
return true;
}
const dmUserId = dmRoomMap.getUserIdForRoomId(room.roomId);
return dmUserId && dmUserId !== me.userId &&
this._selectedTagsUserIds.includes(dmUserId);
},
refreshRoomList: function() {
// TODO: ideally we'd calculate this once at start, and then maintain
// any changes to it incrementally, updating the appropriate sublists
@ -321,8 +359,9 @@ module.exports = React.createClass({
lists["m.lowpriority"] = [];
lists["im.vector.fake.archived"] = [];
const dmRoomMap = new DMRoomMap(MatrixClientPeg.get());
MatrixClientPeg.get().getRooms().forEach((room) => {
const dmRoomMap = DMRoomMap.shared();
this._visibleRooms.forEach((room, index) => {
const me = room.getMember(MatrixClientPeg.get().credentials.userId);
if (!me) return;
@ -339,12 +378,6 @@ module.exports = React.createClass({
(me.membership === "leave" && me.events.member.getSender() !== me.events.member.getStateKey())) {
// Used to split rooms via tags
const tagNames = Object.keys(room.tags);
// Apply TagPanel filtering, derived from FilterStore
if (!this.isRoomInSelectedTags(room, me, dmRoomMap)) {
return;
}
if (tagNames.length) {
for (let i = 0; i < tagNames.length; i++) {
const tagName = tagNames[i];
@ -638,7 +671,6 @@ module.exports = React.createClass({
editable={false}
order="recent"
isInvite={true}
selectedRoom={self.props.selectedRoom}
incomingCall={self.state.incomingCall}
collapsed={self.props.collapsed}
searchFilter={self.props.searchFilter}
@ -652,7 +684,6 @@ module.exports = React.createClass({
emptyContent={this._getEmptyContent('m.favourite')}
editable={true}
order="manual"
selectedRoom={self.props.selectedRoom}
incomingCall={self.state.incomingCall}
collapsed={self.props.collapsed}
searchFilter={self.props.searchFilter}
@ -666,7 +697,6 @@ module.exports = React.createClass({
headerItems={this._getHeaderItems('im.vector.fake.direct')}
editable={true}
order="recent"
selectedRoom={self.props.selectedRoom}
incomingCall={self.state.incomingCall}
collapsed={self.props.collapsed}
alwaysShowHeader={true}
@ -680,7 +710,6 @@ module.exports = React.createClass({
emptyContent={this._getEmptyContent('im.vector.fake.recent')}
headerItems={this._getHeaderItems('im.vector.fake.recent')}
order="recent"
selectedRoom={self.props.selectedRoom}
incomingCall={self.state.incomingCall}
collapsed={self.props.collapsed}
searchFilter={self.props.searchFilter}
@ -696,7 +725,6 @@ module.exports = React.createClass({
emptyContent={this._getEmptyContent(tagName)}
editable={true}
order="manual"
selectedRoom={self.props.selectedRoom}
incomingCall={self.state.incomingCall}
collapsed={self.props.collapsed}
searchFilter={self.props.searchFilter}
@ -711,7 +739,6 @@ module.exports = React.createClass({
emptyContent={this._getEmptyContent('m.lowpriority')}
editable={true}
order="recent"
selectedRoom={self.props.selectedRoom}
incomingCall={self.state.incomingCall}
collapsed={self.props.collapsed}
searchFilter={self.props.searchFilter}
@ -722,7 +749,6 @@ module.exports = React.createClass({
label={_t('Historical')}
editable={false}
order="recent"
selectedRoom={self.props.selectedRoom}
collapsed={self.props.collapsed}
alwaysShowHeader={true}
startAsHidden={true}

3
src/components/views/rooms/RoomNameEditor.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const sdk = require('../../../index');
const MatrixClientPeg = require('../../../MatrixClientPeg');
import { _t } from '../../../languageHandler';
@ -25,7 +26,7 @@ module.exports = React.createClass({
displayName: 'RoomNameEditor',
propTypes: {
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
},
componentWillMount: function() {

21
src/components/views/rooms/RoomPreviewBar.js
View file

@ -18,6 +18,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const sdk = require('../../../index');
const MatrixClientPeg = require('../../../MatrixClientPeg');
@ -27,29 +28,29 @@ module.exports = React.createClass({
displayName: 'RoomPreviewBar',
propTypes: {
onJoinClick: React.PropTypes.func,
onRejectClick: React.PropTypes.func,
onForgetClick: React.PropTypes.func,
onJoinClick: PropTypes.func,
onRejectClick: PropTypes.func,
onForgetClick: PropTypes.func,
// if inviterName is specified, the preview bar will shown an invite to the room.
// You should also specify onRejectClick if specifiying inviterName
inviterName: React.PropTypes.string,
inviterName: PropTypes.string,
// If invited by 3rd party invite, the email address the invite was sent to
invitedEmail: React.PropTypes.string,
invitedEmail: PropTypes.string,
// A standard client/server API error object. If supplied, indicates that the
// caller was unable to fetch details about the room for the given reason.
error: React.PropTypes.object,
error: PropTypes.object,
canPreview: React.PropTypes.bool,
spinner: React.PropTypes.bool,
room: React.PropTypes.object,
canPreview: PropTypes.bool,
spinner: PropTypes.bool,
room: PropTypes.object,
// The alias that was used to access this room, if appropriate
// If given, this will be how the room is referred to (eg.
// in error messages).
roomAlias: React.PropTypes.string,
roomAlias: PropTypes.string,
},
getDefaultProps: function() {

13
src/components/views/rooms/RoomSettings.js
View file

@ -17,6 +17,7 @@ limitations under the License.
import Promise from 'bluebird';
import React from 'react';
import PropTypes from 'prop-types';
import { _t, _td } from '../../../languageHandler';
import MatrixClientPeg from '../../../MatrixClientPeg';
import sdk from '../../../index';
@ -60,10 +61,10 @@ const plEventsToShow = {
const BannedUser = React.createClass({
propTypes: {
canUnban: React.PropTypes.bool,
member: React.PropTypes.object.isRequired, // js-sdk RoomMember
by: React.PropTypes.string.isRequired,
reason: React.PropTypes.string,
canUnban: PropTypes.bool,
member: PropTypes.object.isRequired, // js-sdk RoomMember
by: PropTypes.string.isRequired,
reason: PropTypes.string,
},
_onUnbanClick: function() {
@ -115,8 +116,8 @@ module.exports = React.createClass({
displayName: 'RoomSettings',
propTypes: {
room: React.PropTypes.object.isRequired,
onSaveClick: React.PropTypes.func,
room: PropTypes.object.isRequired,
onSaveClick: PropTypes.func,
},
getInitialState: function() {

21
src/components/views/rooms/RoomTile.js
View file

@ -19,6 +19,7 @@ limitations under the License.
const React = require('react');
const ReactDOM = require("react-dom");
import PropTypes from 'prop-types';
const classNames = require('classnames');
const MatrixClientPeg = require('../../../MatrixClientPeg');
import DMRoomMap from '../../../utils/DMRoomMap';
@ -34,17 +35,17 @@ module.exports = React.createClass({
displayName: 'RoomTile',
propTypes: {
connectDragSource: React.PropTypes.func,
connectDropTarget: React.PropTypes.func,
onClick: React.PropTypes.func,
isDragging: React.PropTypes.bool,
connectDragSource: PropTypes.func,
connectDropTarget: PropTypes.func,
onClick: PropTypes.func,
isDragging: PropTypes.bool,
room: React.PropTypes.object.isRequired,
collapsed: React.PropTypes.bool.isRequired,
unread: React.PropTypes.bool.isRequired,
highlight: React.PropTypes.bool.isRequired,
isInvite: React.PropTypes.bool.isRequired,
incomingCall: React.PropTypes.object,
room: PropTypes.object.isRequired,
collapsed: PropTypes.bool.isRequired,
unread: PropTypes.bool.isRequired,
highlight: PropTypes.bool.isRequired,
isInvite: PropTypes.bool.isRequired,
incomingCall: PropTypes.object,
},
getDefaultProps: function() {

3
src/components/views/rooms/RoomTopicEditor.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const sdk = require('../../../index');
import { _t } from "../../../languageHandler";
@ -24,7 +25,7 @@ module.exports = React.createClass({
displayName: 'RoomTopicEditor',
propTypes: {
room: React.PropTypes.object.isRequired,
room: PropTypes.object.isRequired,
},
componentWillMount: function() {

9
src/components/views/rooms/SearchResultTile.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const sdk = require('../../../index');
module.exports = React.createClass({
@ -24,15 +25,15 @@ module.exports = React.createClass({
propTypes: {
// a matrix-js-sdk SearchResult containing the details of this result
searchResult: React.PropTypes.object.isRequired,
searchResult: PropTypes.object.isRequired,
// a list of strings to be highlighted in the results
searchHighlights: React.PropTypes.array,
searchHighlights: PropTypes.array,
// href for the highlights in this result
resultLink: React.PropTypes.string,
resultLink: PropTypes.string,
onWidgetLoad: React.PropTypes.func,
onWidgetLoad: PropTypes.func,
},
render: function() {

13
src/components/views/rooms/SearchableEntityList.js
View file

@ -14,6 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
const React = require('react');
import PropTypes from 'prop-types';
const MatrixClientPeg = require("../../../MatrixClientPeg");
const Modal = require("../../../Modal");
const sdk = require("../../../index");
@ -26,12 +27,12 @@ const SearchableEntityList = React.createClass({
displayName: 'SearchableEntityList',
propTypes: {
emptyQueryShowsAll: React.PropTypes.bool,
showInputBox: React.PropTypes.bool,
onQueryChanged: React.PropTypes.func, // fn(inputText)
onSubmit: React.PropTypes.func, // fn(inputText)
entities: React.PropTypes.array,
truncateAt: React.PropTypes.number,
emptyQueryShowsAll: PropTypes.bool,
showInputBox: PropTypes.bool,
onQueryChanged: PropTypes.func, // fn(inputText)
onSubmit: PropTypes.func, // fn(inputText)
entities: PropTypes.array,
truncateAt: PropTypes.number,
},
getDefaultProps: function() {

7
src/components/views/rooms/SimpleRoomHeader.js
View file

@ -15,6 +15,7 @@ limitations under the License.
*/
import React from 'react';
import PropTypes from 'prop-types';
import AccessibleButton from '../elements/AccessibleButton';
import sdk from '../../../index';
import { _t } from '../../../languageHandler';
@ -39,11 +40,11 @@ export default React.createClass({
displayName: 'SimpleRoomHeader',
propTypes: {
title: React.PropTypes.string,
onCancelClick: React.PropTypes.func,
title: PropTypes.string,
onCancelClick: PropTypes.func,
// `src` to a TintableSvg. Optional.
icon: React.PropTypes.string,
icon: PropTypes.string,
},
render: function() {

5
src/components/views/rooms/TopUnreadMessagesBar.js
View file

@ -18,6 +18,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
const sdk = require('../../../index');
@ -25,8 +26,8 @@ module.exports = React.createClass({
displayName: 'TopUnreadMessagesBar',
propTypes: {
onScrollUpClick: React.PropTypes.func,
onCloseClick: React.PropTypes.func,
onScrollUpClick: PropTypes.func,
onCloseClick: PropTypes.func,
},
render: function() {

3
src/components/views/rooms/UserTile.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
const React = require('react');
import PropTypes from 'prop-types';
const Avatar = require("../../../Avatar");
const MatrixClientPeg = require('../../../MatrixClientPeg');
@ -28,7 +29,7 @@ module.exports = React.createClass({
displayName: 'UserTile',
propTypes: {
user: React.PropTypes.any.isRequired, // User
user: PropTypes.any.isRequired, // User
},
render: function() {