Merge pull request #5065 from matrix-org/travis/echo/audit

Add local echo for notifications in the new room list

src/components/structures/LoggedInView.tsx

@@ -54,6 +54,7 @@ import LeftPanel from "./LeftPanel";
 import CallContainer from '../views/voip/CallContainer';
 import { ViewRoomDeltaPayload } from "../../dispatcher/payloads/ViewRoomDeltaPayload";
 import RoomListStore from "../../stores/room-list/RoomListStore";
+import NonUrgentToastContainer from "./NonUrgentToastContainer";
 import { ToggleRightPanelPayload } from "../../dispatcher/payloads/ToggleRightPanelPayload";
 
 // We need to fetch each pinned message individually (if we don't already have it)
@@ -688,6 +689,7 @@ class LoggedInView extends React.Component<IProps, IState> {
                     </DragDropContext>
                 </div>
                 <CallContainer />
+                <NonUrgentToastContainer />
             </MatrixClientContext.Provider>
         );
     }

src/components/structures/NonUrgentToastContainer.tsx

@@ -0,0 +1,63 @@
+/*
+Copyright 2020 The Matrix.org Foundation C.I.C.
+
+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 * as React from "react";
+import { ComponentClass } from "../../@types/common";
+import NonUrgentToastStore from "../../stores/NonUrgentToastStore";
+import { UPDATE_EVENT } from "../../stores/AsyncStore";
+
+interface IProps {
+}
+
+interface IState {
+    toasts: ComponentClass[],
+}
+
+export default class NonUrgentToastContainer extends React.PureComponent<IProps, IState> {
+    public constructor(props, context) {
+        super(props, context);
+
+        this.state = {
+            toasts: NonUrgentToastStore.instance.components,
+        };
+
+        NonUrgentToastStore.instance.on(UPDATE_EVENT, this.onUpdateToasts);
+    }
+
+    public componentWillUnmount() {
+        NonUrgentToastStore.instance.off(UPDATE_EVENT, this.onUpdateToasts);
+    }
+
+    private onUpdateToasts = () => {
+        this.setState({toasts: NonUrgentToastStore.instance.components});
+    };
+
+    public render() {
+        const toasts = this.state.toasts.map((t, i) => {
+            return (
+                <div className="mx_NonUrgentToastContainer_toast" key={`toast-${i}`}>
+                    {React.createElement(t, {})}
+                </div>
+            );
+        });
+
+        return (
+            <div className="mx_NonUrgentToastContainer" role="alert">
+                {toasts}
+            </div>
+        );
+    }
+}