From 4d14036cb995138ac2a02741828952e9345157b0 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Wed, 15 Feb 2023 21:17:00 +0530 Subject: [PATCH 1/9] message_layout_preview_update --- src/components/views/settings/FontScalingPanel.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index 2da567719e6..04e923a69b1 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -75,6 +75,15 @@ export default class FontScalingPanel extends React.Component { }); } + public async componentDidUpdate(): Promise { + //Update the layout for the preview window according to the user selection + if (this.state.layout !== SettingsStore.getValue("layout")) { + this.setState({ + layout: SettingsStore.getValue("layout"), + }); + } + } + public componentWillUnmount(): void { this.unmounted = true; } From 877774a35920a7deadd90333b96f53a04b8534a2 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Wed, 29 Mar 2023 14:43:10 +0530 Subject: [PATCH 2/9] using_settings_watcher --- .../views/settings/FontScalingPanel.tsx | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index 0ae5dc73b2b..08a6cbbe8c6 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -45,7 +45,7 @@ interface IState { export default class FontScalingPanel extends React.Component { private readonly MESSAGE_PREVIEW_TEXT = _t("Hey you. You're the best!"); - + private layoutWatcherRef: string; private unmounted = false; public constructor(props: IProps) { @@ -63,6 +63,14 @@ export default class FontScalingPanel extends React.Component { const client = MatrixClientPeg.get(); const userId = client.getUserId()!; const profileInfo = await client.getProfileInfo(userId); + this.layoutWatcherRef = SettingsStore.watchSetting("layout", null, (...[, , , value]) => { + // Update the layout for the preview window according to the user selection + if (this.state.layout !== value) { + this.setState({ + layout: value, + }); + } + }); if (this.unmounted) return; this.setState({ @@ -72,17 +80,9 @@ export default class FontScalingPanel extends React.Component { }); } - public async componentDidUpdate(): Promise { - //Update the layout for the preview window according to the user selection - if (this.state.layout !== SettingsStore.getValue("layout")) { - this.setState({ - layout: SettingsStore.getValue("layout"), - }); - } - } - public componentWillUnmount(): void { this.unmounted = true; + SettingsStore.unwatchSetting(this.layoutWatcherRef); } private onFontSizeChanged = (size: number): void => { From 3bae541b50ac6b0822a9fef25108db5c12eec9f7 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Tue, 18 Jul 2023 14:42:50 +0530 Subject: [PATCH 3/9] Update FontScalingPanel.tsx --- src/components/views/settings/FontScalingPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index 956ec2371bf..e26ab7e15a4 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -47,7 +47,7 @@ interface IState { export default class FontScalingPanel extends React.Component { private readonly MESSAGE_PREVIEW_TEXT = _t("Hey you. You're the best!"); - private layoutWatcherRef: string; + private layoutWatcherRef!: string; private unmounted = false; public constructor(props: IProps) { From 4e28b9dceee3473c597c556ff018c7697c1ece17 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Tue, 18 Jul 2023 14:51:28 +0530 Subject: [PATCH 4/9] Marked the class property as optional --- src/components/views/settings/FontScalingPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index e26ab7e15a4..f14a7abb1df 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -47,7 +47,7 @@ interface IState { export default class FontScalingPanel extends React.Component { private readonly MESSAGE_PREVIEW_TEXT = _t("Hey you. You're the best!"); - private layoutWatcherRef!: string; + private layoutWatcherRef?: string; private unmounted = false; public constructor(props: IProps) { From 48263d0f07c74625f87a05fb17264e5b181c2867 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Wed, 19 Jul 2023 12:06:51 +0530 Subject: [PATCH 5/9] Optional variable was still giving error. --- src/components/views/settings/FontScalingPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index f14a7abb1df..e26ab7e15a4 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -47,7 +47,7 @@ interface IState { export default class FontScalingPanel extends React.Component { private readonly MESSAGE_PREVIEW_TEXT = _t("Hey you. You're the best!"); - private layoutWatcherRef?: string; + private layoutWatcherRef!: string; private unmounted = false; public constructor(props: IProps) { From 40cd96923a507a01211d32b22367d83510ac9ae4 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Thu, 20 Jul 2023 15:12:15 +0530 Subject: [PATCH 6/9] Fix: typescript fail for layoutWatcherRef --- src/components/views/settings/FontScalingPanel.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index e26ab7e15a4..95eed45eea5 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -47,7 +47,7 @@ interface IState { export default class FontScalingPanel extends React.Component { private readonly MESSAGE_PREVIEW_TEXT = _t("Hey you. You're the best!"); - private layoutWatcherRef!: string; + private layoutWatcherRef?: string; private unmounted = false; public constructor(props: IProps) { @@ -84,7 +84,9 @@ export default class FontScalingPanel extends React.Component { public componentWillUnmount(): void { this.unmounted = true; - SettingsStore.unwatchSetting(this.layoutWatcherRef); + if (this.layoutWatcherRef) { + SettingsStore.unwatchSetting(this.layoutWatcherRef); + } } private onFontSizeChanged = (size: number): void => { From d6993ca6c9dff73d9f9be07a3bd40641fd2cbd3b Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Fri, 22 Sep 2023 01:33:26 +0530 Subject: [PATCH 7/9] Fix: using value from SettingStore --- src/components/views/settings/FontScalingPanel.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index c6ec09353d4..ed721f4609b 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -65,8 +65,9 @@ export default class FontScalingPanel extends React.Component { const client = MatrixClientPeg.safeGet(); const userId = client.getSafeUserId(); const profileInfo = await client.getProfileInfo(userId); - this.layoutWatcherRef = SettingsStore.watchSetting("layout", null, (...[, , , value]) => { + this.layoutWatcherRef = SettingsStore.watchSetting("layout", null, () => { // Update the layout for the preview window according to the user selection + const value = SettingsStore.getValue("layout") if (this.state.layout !== value) { this.setState({ layout: value, From e70b8f46526bd119e72fc4706e364fafa1d76269 Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Fri, 22 Sep 2023 18:23:21 +0530 Subject: [PATCH 8/9] Update src/components/views/settings/FontScalingPanel.tsx Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/settings/FontScalingPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index ed721f4609b..6cdb9955d1e 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -67,7 +67,7 @@ export default class FontScalingPanel extends React.Component { const profileInfo = await client.getProfileInfo(userId); this.layoutWatcherRef = SettingsStore.watchSetting("layout", null, () => { // Update the layout for the preview window according to the user selection - const value = SettingsStore.getValue("layout") + const value = SettingsStore.getValue("layout"); if (this.state.layout !== value) { this.setState({ layout: value, From 6a9ab1d7fdc0fae234ccdb6c826d71386aeb622b Mon Sep 17 00:00:00 2001 From: Manan Sadana Date: Fri, 22 Sep 2023 18:33:02 +0530 Subject: [PATCH 9/9] Fix: Prettier formatting added for ESList checks --- src/components/views/settings/FontScalingPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/FontScalingPanel.tsx b/src/components/views/settings/FontScalingPanel.tsx index 6cdb9955d1e..f5afa8b834a 100644 --- a/src/components/views/settings/FontScalingPanel.tsx +++ b/src/components/views/settings/FontScalingPanel.tsx @@ -67,7 +67,7 @@ export default class FontScalingPanel extends React.Component { const profileInfo = await client.getProfileInfo(userId); this.layoutWatcherRef = SettingsStore.watchSetting("layout", null, () => { // Update the layout for the preview window according to the user selection - const value = SettingsStore.getValue("layout"); + const value = SettingsStore.getValue("layout"); if (this.state.layout !== value) { this.setState({ layout: value,