mirror of
https://github.com/element-hq/element-web
synced 2024-11-27 19:56:47 +03:00
Merge pull request #183 from matrix-org/dbkr/3pid_invite_metadata
Pass room metadata from 3pid invite emails all the way through to the…
This commit is contained in:
David Baker
commit
0051c91126
4 changed files with 110 additions and 38 deletions
|
|
@ -312,7 +312,10 @@ module.exports = React.createClass({
|
|||
});
|
||||
break;
|
||||
case 'view_room':
|
||||
this._viewRoom(payload.room_id, payload.show_settings, payload.event_id, payload.invite_sign_url);
|
||||
this._viewRoom(
|
||||
payload.room_id, payload.show_settings, payload.event_id,
|
||||
payload.invite_sign_url, payload.oob_data
|
||||
);
|
||||
break;
|
||||
case 'view_prev_room':
|
||||
roomIndexDelta = -1;
|
||||
|
|
@ -350,6 +353,7 @@ module.exports = React.createClass({
|
|||
room_id: foundRoom.roomId,
|
||||
event_id: payload.event_id,
|
||||
invite_sign_url: payload.invite_sign_url,
|
||||
oob_data: payload.oob_data,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
|
@ -361,6 +365,7 @@ module.exports = React.createClass({
|
|||
room_id: result.room_id,
|
||||
event_id: payload.event_id,
|
||||
invite_sign_url: payload.invite_sign_url,
|
||||
oob_data: payload.oob_data,
|
||||
});
|
||||
});
|
||||
break;
|
||||
|
|
@ -448,7 +453,10 @@ module.exports = React.createClass({
|
|||
//
|
||||
// eventId is optional and will cause a switch to the context of that
|
||||
// particular event.
|
||||
_viewRoom: function(roomId, showSettings, eventId, invite_sign_url) {
|
||||
// @param {Object} oob_data Object of additional data about the room
|
||||
// that has been passed out-of-band (eg.
|
||||
// room name and avatar from an invite email)
|
||||
_viewRoom: function(roomId, showSettings, eventId, invite_sign_url, oob_data) {
|
||||
// before we switch room, record the scroll state of the current room
|
||||
this._updateScrollMap();
|
||||
|
||||
|
|
@ -461,6 +469,7 @@ module.exports = React.createClass({
|
|||
initialEventPixelOffset: undefined,
|
||||
page_type: this.PageTypes.RoomView,
|
||||
inviteSignUrl: invite_sign_url,
|
||||
roomOobData: oob_data,
|
||||
};
|
||||
|
||||
// if we aren't given an explicit event id, look for one in the
|
||||
|
|
@ -552,10 +561,12 @@ module.exports = React.createClass({
|
|||
room_alias: self.starting_room_alias,
|
||||
event_id: self.starting_event_id,
|
||||
invite_sign_url: self.starting_room_invite_sign_url,
|
||||
oob_data: self.starting_room_oob_data,
|
||||
});
|
||||
delete self.starting_room_alias;
|
||||
delete self.starting_event_id;
|
||||
delete self.starting_room_invite_sign_url;
|
||||
delete self.starting_room_oob_data;
|
||||
} else if (!self.state.page_type) {
|
||||
if (!self.state.currentRoom) {
|
||||
var firstRoom = null;
|
||||
|
|
@ -675,6 +686,13 @@ module.exports = React.createClass({
|
|||
var segments = screen.substring(5).split('/');
|
||||
var roomString = segments[0];
|
||||
var eventId = segments[1]; // undefined if no event id given
|
||||
|
||||
var oob_data = {
|
||||
name: params.room_name,
|
||||
avatarUrl: params.room_avatar_url,
|
||||
inviterName: params.inviter_name,
|
||||
};
|
||||
|
||||
if (roomString[0] == '#') {
|
||||
if (this.state.logged_in) {
|
||||
dis.dispatch({
|
||||
|
|
@ -682,11 +700,16 @@ module.exports = React.createClass({
|
|||
room_alias: roomString,
|
||||
event_id: eventId,
|
||||
invite_sign_url: params.signurl,
|
||||
oob_data: oob_data,
|
||||
});
|
||||
} else {
|
||||
// Okay, we'll take you here soon...
|
||||
// XXX: There are way too many of these:
|
||||
// It would probably be better to handle whether the SDK is
|
||||
// ready or not in the view_room_alias handler instead.
|
||||
this.starting_room_alias = roomString;
|
||||
this.starting_room_invite_sign_url = params.signurl;
|
||||
this.starting_room_oob_data = oob_data;
|
||||
this.starting_event_id = eventId;
|
||||
// ...but you're still going to have to log in.
|
||||
this.notifyNewScreen('login');
|
||||
|
|
@ -697,6 +720,7 @@ module.exports = React.createClass({
|
|||
room_id: roomString,
|
||||
event_id: eventId,
|
||||
invite_sign_url: params.signurl,
|
||||
oob_data: oob_data,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -884,6 +908,7 @@ module.exports = React.createClass({
|
|||
roomId={this.state.currentRoom}
|
||||
eventId={this.state.initialEventId}
|
||||
inviteSignUrl={this.state.inviteSignUrl}
|
||||
oobData={this.state.roomOobData}
|
||||
highlightedEventId={this.state.highlightedEventId}
|
||||
eventPixelOffset={this.state.initialEventPixelOffset}
|
||||
key={this.state.currentRoom}
|
||||
|
|
|
|||
|
|
@ -59,6 +59,17 @@ module.exports = React.createClass({
|
|||
// (given as part of the link in the invite email)
|
||||
inviteSignUrl: React.PropTypes.string,
|
||||
|
||||
// Any data about the room that would normally come from the Home Server
|
||||
// but has been passed out-of-band, eg. the room name and avatar URL
|
||||
// from an email invite (a workaround for the fact that we can't
|
||||
// get this information from the HS using an email invite).
|
||||
// Fields:
|
||||
// * name (string) The room's name
|
||||
// * avatarUrl (string) The mxc:// avatar URL for the room
|
||||
// * inviterName (string) The display name of the person who
|
||||
// * invited us tovthe room
|
||||
oobData: React.PropTypes.object,
|
||||
|
||||
// id of an event to jump to. If not given, will go to the end of the
|
||||
// live timeline.
|
||||
eventId: React.PropTypes.string,
|
||||
|
|
@ -1052,13 +1063,19 @@ module.exports = React.createClass({
|
|||
);
|
||||
}
|
||||
else {
|
||||
var inviterName = undefined;
|
||||
if (this.props.oobData) {
|
||||
inviterName = this.props.oobData.inviterName;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mx_RoomView">
|
||||
<RoomHeader ref="header" room={this.state.room} simpleHeader="Join room"/>
|
||||
<RoomHeader ref="header" room={this.state.room} oobData={this.props.oobData} />
|
||||
<div className="mx_RoomView_auxPanel">
|
||||
<RoomPreviewBar onJoinClick={ this.onJoinButtonClicked }
|
||||
canJoin={ true } canPreview={ false }
|
||||
spinner={this.state.joining}
|
||||
inviterName={inviterName}
|
||||
/>
|
||||
</div>
|
||||
<div className="mx_RoomView_messagePanel"></div>
|
||||
|
|
@ -1293,6 +1310,7 @@ module.exports = React.createClass({
|
|||
return (
|
||||
<div className={ "mx_RoomView" + (inCall ? " mx_RoomView_inCall" : "") } ref="roomView">
|
||||
<RoomHeader ref="header" room={this.state.room} searchInfo={searchInfo}
|
||||
oobData={this.props.oobData}
|
||||
editing={this.state.editingRoomSettings}
|
||||
onSearchClick={this.onSearchClick}
|
||||
onSettingsClick={this.onSettingsClick}
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
var React = require('react');
|
||||
var ContentRepo = require("matrix-js-sdk").ContentRepo;
|
||||
var MatrixClientPeg = require('../../../MatrixClientPeg');
|
||||
var Avatar = require('../../../Avatar');
|
||||
var sdk = require("../../../index");
|
||||
|
|
@ -21,8 +22,12 @@ var sdk = require("../../../index");
|
|||
module.exports = React.createClass({
|
||||
displayName: 'RoomAvatar',
|
||||
|
||||
// Room may be left unset here, but if it is,
|
||||
// oobData.avatarUrl should be set (else there
|
||||
// would be nowhere to get the avatar from)
|
||||
propTypes: {
|
||||
room: React.PropTypes.object.isRequired,
|
||||
room: React.PropTypes.object,
|
||||
oobData: React.PropTypes.object,
|
||||
width: React.PropTypes.number,
|
||||
height: React.PropTypes.number,
|
||||
resizeMethod: React.PropTypes.string
|
||||
|
|
@ -32,7 +37,8 @@ module.exports = React.createClass({
|
|||
return {
|
||||
width: 36,
|
||||
height: 36,
|
||||
resizeMethod: 'crop'
|
||||
resizeMethod: 'crop',
|
||||
oobData: {},
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -50,7 +56,12 @@ module.exports = React.createClass({
|
|||
|
||||
getImageUrls: function(props) {
|
||||
return [
|
||||
this.getRoomAvatarUrl(props), // highest priority
|
||||
ContentRepo.getHttpUriForMxc(
|
||||
MatrixClientPeg.get().getHomeserverUrl(),
|
||||
props.oobData.avatarUrl,
|
||||
props.width, props.height, props.resizeMethod
|
||||
), // highest priority
|
||||
this.getRoomAvatarUrl(props),
|
||||
this.getOneToOneAvatar(props),
|
||||
this.getFallbackAvatar(props) // lowest priority
|
||||
].filter(function(url) {
|
||||
|
|
@ -59,6 +70,8 @@ module.exports = React.createClass({
|
|||
},
|
||||
|
||||
getRoomAvatarUrl: function(props) {
|
||||
if (!this.props.room) return null;
|
||||
|
||||
return props.room.getAvatarUrl(
|
||||
MatrixClientPeg.get().getHomeserverUrl(),
|
||||
props.width, props.height, props.resizeMethod,
|
||||
|
|
@ -67,6 +80,8 @@ module.exports = React.createClass({
|
|||
},
|
||||
|
||||
getOneToOneAvatar: function(props) {
|
||||
if (!this.props.room) return null;
|
||||
|
||||
var mlist = props.room.currentState.members;
|
||||
var userIds = [];
|
||||
// for .. in optimisation to return early if there are >2 keys
|
||||
|
|
@ -103,14 +118,20 @@ module.exports = React.createClass({
|
|||
},
|
||||
|
||||
getFallbackAvatar: function(props) {
|
||||
if (!this.props.room) return null;
|
||||
|
||||
return Avatar.defaultAvatarUrlForString(props.room.roomId);
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
|
||||
|
||||
var roomName = this.props.room ? this.props.room.name : this.props.oobData.name;
|
||||
|
||||
return (
|
||||
<BaseAvatar {...this.props} name={this.props.room.name}
|
||||
idName={this.props.room.roomId} urls={this.state.urls} />
|
||||
<BaseAvatar {...this.props} name={roomName}
|
||||
idName={this.props.room ? this.props.room.roomId : null}
|
||||
urls={this.state.urls} />
|
||||
);
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -33,6 +33,7 @@ module.exports = React.createClass({
|
|||
|
||||
propTypes: {
|
||||
room: React.PropTypes.object,
|
||||
oobData: React.PropTypes.object,
|
||||
editing: React.PropTypes.bool,
|
||||
onSettingsClick: React.PropTypes.func,
|
||||
onSaveClick: React.PropTypes.func,
|
||||
|
|
@ -217,18 +218,27 @@ module.exports = React.createClass({
|
|||
}
|
||||
|
||||
// XXX: this is a bit inefficient - we could just compare room.name for 'Empty room'...
|
||||
var members = this.props.room.getJoinedMembers();
|
||||
var settingsHint = false;
|
||||
if (members.length === 1 && members[0].userId === MatrixClientPeg.get().credentials.userId) {
|
||||
var name = this.props.room.currentState.getStateEvents('m.room.name', '');
|
||||
if (!name || !name.getContent().name) {
|
||||
settingsHint = true;
|
||||
var members = this.props.room ? this.props.room.getJoinedMembers() : undefined;
|
||||
if (members) {
|
||||
if (members.length === 1 && members[0].userId === MatrixClientPeg.get().credentials.userId) {
|
||||
var name = this.props.room.currentState.getStateEvents('m.room.name', '');
|
||||
if (!name || !name.getContent().name) {
|
||||
settingsHint = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var roomName = 'Join Room';
|
||||
if (this.props.oobData && this.props.oobData.name) {
|
||||
roomName = this.props.oobData.name;
|
||||
} else if (this.props.room) {
|
||||
roomName = this.props.room.name;
|
||||
}
|
||||
|
||||
name =
|
||||
<div className="mx_RoomHeader_name" onClick={this.props.onSettingsClick}>
|
||||
<div className={ "mx_RoomHeader_nametext " + (settingsHint ? "mx_RoomHeader_settingsHint" : "") } title={ this.props.room.name }>{ this.props.room.name }</div>
|
||||
<div className={ "mx_RoomHeader_nametext " + (settingsHint ? "mx_RoomHeader_settingsHint" : "") } title={ roomName }>{ roomName }</div>
|
||||
{ searchStatus }
|
||||
<div className="mx_RoomHeader_settingsButton" title="Settings">
|
||||
<TintableSvg src="img/settings.svg" width="12" height="12"/>
|
||||
|
|
@ -246,36 +256,34 @@ module.exports = React.createClass({
|
|||
onValueChanged={ this.onTopicChanged }
|
||||
initialValue={ this.state.topic }/>
|
||||
} else {
|
||||
var topic = this.props.room.currentState.getStateEvents('m.room.topic', '');
|
||||
var topic = this.props.room ? this.props.room.currentState.getStateEvents('m.room.topic', '') : '';
|
||||
if (topic) topic_el = <div className="mx_RoomHeader_topic" ref="topic" title={ topic.getContent().topic }>{ topic.getContent().topic }</div>;
|
||||
}
|
||||
|
||||
var roomAvatar = null;
|
||||
if (this.props.room) {
|
||||
if (can_set_room_avatar) {
|
||||
roomAvatar = (
|
||||
<div className="mx_RoomHeader_avatarPicker">
|
||||
<div onClick={ this.onAvatarPickerClick }>
|
||||
<ChangeAvatar ref="changeAvatar" room={this.props.room} showUploadSection={false} width={48} height={48} />
|
||||
</div>
|
||||
<div className="mx_RoomHeader_avatarPicker_edit">
|
||||
<label htmlFor="avatarInput" ref="file_label">
|
||||
<img src="img/camera.svg"
|
||||
alt="Upload avatar" title="Upload avatar"
|
||||
width="17" height="15" />
|
||||
</label>
|
||||
<input id="avatarInput" type="file" onChange={ this.onAvatarSelected }/>
|
||||
</div>
|
||||
if (can_set_room_avatar) {
|
||||
roomAvatar = (
|
||||
<div className="mx_RoomHeader_avatarPicker">
|
||||
<div onClick={ this.onAvatarPickerClick }>
|
||||
<ChangeAvatar ref="changeAvatar" room={this.props.room} showUploadSection={false} width={48} height={48} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
else {
|
||||
roomAvatar = (
|
||||
<div onClick={this.props.onSettingsClick}>
|
||||
<RoomAvatar room={this.props.room} width={48} height={48}/>
|
||||
<div className="mx_RoomHeader_avatarPicker_edit">
|
||||
<label htmlFor="avatarInput" ref="file_label">
|
||||
<img src="img/camera.svg"
|
||||
alt="Upload avatar" title="Upload avatar"
|
||||
width="17" height="15" />
|
||||
</label>
|
||||
<input id="avatarInput" type="file" onChange={ this.onAvatarSelected }/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
else if (this.props.room || (this.props.oobData && this.props.oobData.name)) {
|
||||
roomAvatar = (
|
||||
<div onClick={this.props.onSettingsClick}>
|
||||
<RoomAvatar room={this.props.room} width={48} height={48} oobData={this.props.oobData} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
var leave_button;
|
||||
|
|
|
|||
Loading…
Reference in a new issue