From c464abaa498df44ea6d0366c64eec6be7afa4556 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 22 May 2020 14:28:01 +0100 Subject: [PATCH 1/3] Iterate toast count indicator more logically Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/ToastContainer.tsx | 14 +++++++++++--- src/stores/ToastStore.ts | 14 ++++++++++++++ 2 files changed, 25 insertions(+), 3 deletions(-) diff --git a/src/components/structures/ToastContainer.tsx b/src/components/structures/ToastContainer.tsx index 9440aa3463..c7b8e911d3 100644 --- a/src/components/structures/ToastContainer.tsx +++ b/src/components/structures/ToastContainer.tsx @@ -15,12 +15,12 @@ limitations under the License. */ import * as React from "react"; -import { _t } from '../../languageHandler'; import ToastStore, {IToast} from "../../stores/ToastStore"; import classNames from "classnames"; interface IState { toasts: IToast[]; + countSeen: number; } export default class ToastContainer extends React.Component<{}, IState> { @@ -28,6 +28,7 @@ export default class ToastContainer extends React.Component<{}, IState> { super(props, context); this.state = { toasts: ToastStore.sharedInstance().getToasts(), + countSeen: 0, }; // Start listening here rather than in componentDidMount because @@ -42,7 +43,10 @@ export default class ToastContainer extends React.Component<{}, IState> { } _onToastStoreUpdate = () => { - this.setState({toasts: ToastStore.sharedInstance().getToasts()}); + this.setState({ + toasts: ToastStore.sharedInstance().getToasts(), + countSeen: ToastStore.sharedInstance().getCountSeen(), + }); }; render() { @@ -56,7 +60,11 @@ export default class ToastContainer extends React.Component<{}, IState> { "mx_Toast_hasIcon": icon, [`mx_Toast_icon_${icon}`]: icon, }); - const countIndicator = isStacked ? _t(" (1/%(totalCount)s)", {totalCount}) : null; + + let countIndicator; + if (isStacked || this.state.countSeen > 0) { + countIndicator = ` (${this.state.countSeen + 1}/${this.state.countSeen + totalCount})`; + } const toastProps = Object.assign({}, props, { key, diff --git a/src/stores/ToastStore.ts b/src/stores/ToastStore.ts index 4f6d2963c5..b6b6f19872 100644 --- a/src/stores/ToastStore.ts +++ b/src/stores/ToastStore.ts @@ -32,6 +32,9 @@ export interface IToast[] = []; + // The count of toasts which have been seen & dealt with in this stack + // where the count resets when the stack of toasts clears. + private countSeen: number = 0; static sharedInstance() { if (!window.mx_ToastStore) window.mx_ToastStore = new ToastStore(); @@ -40,6 +43,7 @@ export default class ToastStore extends EventEmitter { reset() { this.toasts = []; + this.countSeen = 0; } /** @@ -67,6 +71,12 @@ export default class ToastStore extends EventEmitter { const length = this.toasts.length; this.toasts = this.toasts.filter(t => t.key !== key); if (length !== this.toasts.length) { + if (this.toasts.length === 0) { + this.countSeen = 0; + } else { + this.countSeen++; + } + this.emit('update'); } } @@ -74,4 +84,8 @@ export default class ToastStore extends EventEmitter { getToasts() { return this.toasts; } + + getCountSeen() { + return this.countSeen; + } } From 4e67e46863877a50e040dced1447970daa967cc5 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 22 May 2020 14:29:30 +0100 Subject: [PATCH 2/3] fix countSeen Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/ToastContainer.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/structures/ToastContainer.tsx b/src/components/structures/ToastContainer.tsx index c7b8e911d3..c88c830d59 100644 --- a/src/components/structures/ToastContainer.tsx +++ b/src/components/structures/ToastContainer.tsx @@ -28,7 +28,7 @@ export default class ToastContainer extends React.Component<{}, IState> { super(props, context); this.state = { toasts: ToastStore.sharedInstance().getToasts(), - countSeen: 0, + countSeen: ToastStore.sharedInstance().getCountSeen(), }; // Start listening here rather than in componentDidMount because From 49c0748990b00be04520bfb85b2a79589b32cb34 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 22 May 2020 14:32:41 +0100 Subject: [PATCH 3/3] delint and i18n Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/i18n/strings/en_EN.json | 1 - src/stores/ToastStore.ts | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 8ac05bf429..812ce826fc 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -2083,7 +2083,6 @@ "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.": "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.", "Tried to load a specific point in this room's timeline, but was unable to find it.": "Tried to load a specific point in this room's timeline, but was unable to find it.", "Failed to load timeline position": "Failed to load timeline position", - " (1/%(totalCount)s)": " (1/%(totalCount)s)", "Guest": "Guest", "Your profile": "Your profile", "Uploading %(filename)s and %(count)s others|other": "Uploading %(filename)s and %(count)s others", diff --git a/src/stores/ToastStore.ts b/src/stores/ToastStore.ts index b6b6f19872..89b4dc2dc1 100644 --- a/src/stores/ToastStore.ts +++ b/src/stores/ToastStore.ts @@ -34,7 +34,7 @@ export default class ToastStore extends EventEmitter { private toasts: IToast[] = []; // The count of toasts which have been seen & dealt with in this stack // where the count resets when the stack of toasts clears. - private countSeen: number = 0; + private countSeen = 0; static sharedInstance() { if (!window.mx_ToastStore) window.mx_ToastStore = new ToastStore();