diff --git a/res/css/views/right_panel/_UserInfo.scss b/res/css/views/right_panel/_UserInfo.scss
index 9ce524c5ac..dc22de4713 100644
--- a/res/css/views/right_panel/_UserInfo.scss
+++ b/res/css/views/right_panel/_UserInfo.scss
@@ -264,6 +264,9 @@ limitations under the License.
display: block;
margin: 16px 0;
}
+ button.mx_UserInfo_verify {
+ width: 100%; // FIXME get rid of this once we get rid of DialogButtons here
+ }
}
.mx_UserInfo.mx_UserInfo_smallAvatar {
diff --git a/src/components/views/right_panel/EncryptionPanel.js b/src/components/views/right_panel/EncryptionPanel.js
index d45280e29c..4e147bd7a5 100644
--- a/src/components/views/right_panel/EncryptionPanel.js
+++ b/src/components/views/right_panel/EncryptionPanel.js
@@ -36,7 +36,7 @@ const EncryptionPanel = ({verificationRequest, member, onClose}) => {
setRequest(verificationRequest);
}, [verificationRequest]);
- const [phase, setPhase] = useState(false);
+ const [phase, setPhase] = useState(undefined);
const changeHandler = useCallback(() => {
// handle transitions -> cancelled for mismatches which fire a modal instead of showing a card
if (request && request.cancelled && MISMATCHES.includes(request.cancellationCode)) {
@@ -71,7 +71,7 @@ const EncryptionPanel = ({verificationRequest, member, onClose}) => {
setRequest(verificationRequest);
}, [member.userId]);
- const requested = request && phase === PHASE_REQUESTED;
+ const requested = request && (phase === PHASE_REQUESTED || phase === undefined);
if (!request || requested) {
return ;
} else {
diff --git a/src/components/views/right_panel/VerificationPanel.js b/src/components/views/right_panel/VerificationPanel.js
index 3740c6e49d..18a9024310 100644
--- a/src/components/views/right_panel/VerificationPanel.js
+++ b/src/components/views/right_panel/VerificationPanel.js
@@ -14,7 +14,8 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
-import React from 'react';
+import React from "react";
+import PropTypes from "prop-types";
import * as sdk from '../../../index';
import {verificationMethods} from 'matrix-js-sdk/src/crypto';
@@ -23,6 +24,8 @@ import {MatrixClientPeg} from "../../../MatrixClientPeg";
import {_t} from "../../../languageHandler";
import E2EIcon from "../rooms/E2EIcon";
import {
+ PHASE_UNSENT,
+ PHASE_REQUESTED,
PHASE_READY,
PHASE_DONE,
PHASE_STARTED,
@@ -31,6 +34,20 @@ import {
import Spinner from "../elements/Spinner";
export default class VerificationPanel extends React.PureComponent {
+ static propTypes = {
+ request: PropTypes.object.isRequired,
+ member: PropTypes.object.isRequired,
+ phase: PropTypes.oneOf([
+ PHASE_UNSENT,
+ PHASE_REQUESTED,
+ PHASE_READY,
+ PHASE_STARTED,
+ PHASE_CANCELLED,
+ PHASE_DONE,
+ ]).isRequired,
+ onClose: PropTypes.func.isRequired,
+ };
+
constructor(props) {
super(props);
this.state = {};
@@ -147,11 +164,11 @@ export default class VerificationPanel extends React.PureComponent {
}
render() {
- const {member} = this.props;
+ const {member, phase} = this.props;
const displayName = member.displayName || member.name || member.userId;
- switch (this.props.phase) {
+ switch (phase) {
case PHASE_READY:
return this.renderQRPhase();
case PHASE_STARTED:
@@ -174,6 +191,7 @@ export default class VerificationPanel extends React.PureComponent {
case PHASE_CANCELLED:
return this.renderCancelledPhase();
}
+ console.error("VerificationPanel unhandled phase:", phase);
return null;
}
diff --git a/src/components/views/rooms/MemberInfo.js b/src/components/views/rooms/MemberInfo.js
index 55855bbc9a..7c77c546b6 100644
--- a/src/components/views/rooms/MemberInfo.js
+++ b/src/components/views/rooms/MemberInfo.js
@@ -1113,7 +1113,8 @@ export default createReactClass({
}
}
- const avatarUrl = this.props.member.getMxcAvatarUrl();
+ const {member} = this.props;
+ const avatarUrl = member.avatarUrl || (member.getMxcAvatarUrl && member.getMxcAvatarUrl());
let avatarElement;
if (avatarUrl) {
const httpUrl = this.context.mxcUrlToHttp(avatarUrl, 800, 800);
diff --git a/src/components/views/verification/VerificationShowSas.js b/src/components/views/verification/VerificationShowSas.js
index 7b93f42983..aee0f57cf8 100644
--- a/src/components/views/verification/VerificationShowSas.js
+++ b/src/components/views/verification/VerificationShowSas.js
@@ -27,7 +27,8 @@ function capFirst(s) {
export default class VerificationShowSas extends React.Component {
static propTypes = {
- displayName: PropTypes.string.isRequired,
+ pending: PropTypes.bool,
+ displayName: PropTypes.string, // required if pending is true
onDone: PropTypes.func.isRequired,
onCancel: PropTypes.func.isRequired,
sas: PropTypes.object.isRequired,
@@ -95,7 +96,7 @@ export default class VerificationShowSas extends React.Component {
confirm =