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 =