lint, and detect new requests

This commit is contained in:
Zoe 2020-02-24 10:17:33 +00:00
parent 72789897a0
commit 0663ab3b87
2 changed files with 24 additions and 10 deletions

View file

@ -195,7 +195,7 @@ limitations under the License.
border-radius: 3px; border-radius: 3px;
padding: 1px 5px; padding: 1px 5px;
margin-bottom: 6px; margin-bottom: 6px;
font-family: "Inconsolata", courier; font-family: $monospace-font-family;
dl { dl {
display: grid; display: grid;
@ -222,4 +222,4 @@ limitations under the License.
dt::after { dt::after {
content: ":"; content: ":";
} }
} }

View file

@ -30,7 +30,7 @@ import {
PHASE_DONE, PHASE_DONE,
PHASE_STARTED, PHASE_STARTED,
PHASE_CANCELLED, PHASE_CANCELLED,
} from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest" } from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest";
class GenericEditor extends React.PureComponent { class GenericEditor extends React.PureComponent {
// static propTypes = {onBack: PropTypes.func.isRequired}; // static propTypes = {onBack: PropTypes.func.isRequired};
@ -621,7 +621,7 @@ const PHASE_MAP = {
[PHASE_DONE]: "done", [PHASE_DONE]: "done",
[PHASE_STARTED]: "started", [PHASE_STARTED]: "started",
[PHASE_CANCELLED]: "cancelled", [PHASE_CANCELLED]: "cancelled",
} };
function VerificationRequest({txnId, request}) { function VerificationRequest({txnId, request}) {
const [, updateState] = useState(); const [, updateState] = useState();
@ -631,18 +631,18 @@ function VerificationRequest({txnId, request}) {
useEffect(() => { useEffect(() => {
request.on("change", updateState); request.on("change", updateState);
return () => request.off("change", updateState); return () => request.off("change", updateState);
}, []); }, [request]);
/* Keep re-rendering if there's a timeout */ /* Keep re-rendering if there's a timeout */
useEffect(() => { useEffect(() => {
if (timeout == 0) return; if (request.timeout == 0) return;
const id = setInterval(() => { const id = setInterval(() => {
setTimeout(request.timeout); setTimeout(request.timeout);
}, 500); }, 500);
return () => { clearInterval(id); } return () => { clearInterval(id); };
}, []); }, [request]);
return (<div className="mx_DevTools_VerificationRequest"> return (<div className="mx_DevTools_VerificationRequest">
<dl> <dl>
@ -660,7 +660,7 @@ function VerificationRequest({txnId, request}) {
</div>); </div>);
} }
class VerificationExplorer extends React.PureComponent { class VerificationExplorer extends React.Component {
static getLabel() { static getLabel() {
return _t("Verification Requests"); return _t("Verification Requests");
} }
@ -668,6 +668,20 @@ class VerificationExplorer extends React.PureComponent {
/* Ensure this.context is the cli */ /* Ensure this.context is the cli */
static contextType = MatrixClientContext; static contextType = MatrixClientContext;
onNewRequest = () => {
this.forceUpdate();
}
componentDidMount() {
const cli = this.context;
cli.on("crypto.verification.request", this.onNewRequest);
}
componentWillUnmount() {
const cli = this.context;
cli.off("crypto.verification.request", this.onNewRequest);
}
render() { render() {
const cli = this.context; const cli = this.context;
const room = this.props.room; const room = this.props.room;
@ -677,7 +691,7 @@ class VerificationExplorer extends React.PureComponent {
return (<div> return (<div>
<div className="mx_Dialog_content"> <div className="mx_Dialog_content">
{Array.from(inRoomRequests.entries()).reverse().map(([txnId, request]) => {Array.from(inRoomRequests.entries()).reverse().map(([txnId, request]) =>
<VerificationRequest txnId={txnId} request={request} key={txnId}/> <VerificationRequest txnId={txnId} request={request} key={txnId} />,
)} )}
</div> </div>
</div>); </div>);