From b65dce8fe57b9879518ed05f0b06bf59a323b708 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sat, 2 Jul 2022 11:21:38 +0200 Subject: [PATCH 01/20] Separate labs and betas more clearly MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- .../views/dialogs/UserSettingsDialog.tsx | 23 +++++++++++++------ .../tabs/user/LabsUserSettingsTab.tsx | 9 +++++--- src/i18n/strings/en_EN.json | 4 +++- 3 files changed, 25 insertions(+), 11 deletions(-) diff --git a/src/components/views/dialogs/UserSettingsDialog.tsx b/src/components/views/dialogs/UserSettingsDialog.tsx index 8f5e1a61088..db92af16cdd 100644 --- a/src/components/views/dialogs/UserSettingsDialog.tsx +++ b/src/components/views/dialogs/UserSettingsDialog.tsx @@ -37,6 +37,20 @@ import SidebarUserSettingsTab from "../settings/tabs/user/SidebarUserSettingsTab import KeyboardUserSettingsTab from "../settings/tabs/user/KeyboardUserSettingsTab"; import { UserTab } from "./UserTab"; +/** + * Returns null if labs are disabled and no betas exist + */ +const getLabsTabLabel = (): string | null => { + const showLabs = SdkConfig.get("show_labs_settings"); + const showBetas = SettingsStore.getFeatureSettingNames().some(k => SettingsStore.getBetaInfo(k)); + + if (showBetas && showLabs) return _td("Betas & labs"); + else if (showBetas) return _td("Betas"); + else if (showLabs) return _td("Labs"); + + return null; +}; + interface IProps extends IDialogProps { initialTabId?: UserTab; } @@ -114,7 +128,6 @@ export default class UserSettingsDialog extends React.Component , "UserSettingsSidebar", )); - if (SettingsStore.getValue(UIFeature.Voip)) { tabs.push(new Tab( UserTab.Voice, @@ -124,7 +137,6 @@ export default class UserSettingsDialog extends React.Component "UserSettingsVoiceVideo", )); } - tabs.push(new Tab( UserTab.Security, _td("Security & Privacy"), @@ -132,13 +144,10 @@ export default class UserSettingsDialog extends React.Component , "UserSettingsSecurityPrivacy", )); - // Show the Labs tab if enabled or if there are any active betas - if (SdkConfig.get("show_labs_settings") - || SettingsStore.getFeatureSettingNames().some(k => SettingsStore.getBetaInfo(k)) - ) { + if (getLabsTabLabel()) { tabs.push(new Tab( UserTab.Labs, - _td("Labs"), + getLabsTabLabel(), "mx_UserSettingsDialog_labsIcon", , "UserSettingsLabs", diff --git a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx index 94f65d9de2d..9f790939103 100644 --- a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx +++ b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx @@ -163,10 +163,10 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { return (
-
{ _t("Labs") }
+
{ _t("Betas") }
{ - _t('Feeling experimental? Labs are the best way to get things early, ' + + _t('Feeling experimental? Betas are the best way to get things early, ' + 'test out new features and help shape them before they actually launch. ' + 'Learn more.', {}, { 'a': (sub) => { @@ -180,7 +180,10 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { }
{ betaSection } - { labsSections } + { SdkConfig.get("show_labs_settings") && <> +
{ _t("Labs") }
+ { labsSections } + }
); } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 906d2358d1b..46e908588e5 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1448,8 +1448,9 @@ "Your access token gives full access to your account. Do not share it with anyone.": "Your access token gives full access to your account. Do not share it with anyone.", "Clear cache and reload": "Clear cache and reload", "Keyboard": "Keyboard", + "Betas": "Betas", + "Feeling experimental? Betas are the best way to get things early, test out new features and help shape them before they actually launch. Learn more.": "Feeling experimental? Betas are the best way to get things early, test out new features and help shape them before they actually launch. Learn more.", "Labs": "Labs", - "Feeling experimental? Labs are the best way to get things early, test out new features and help shape them before they actually launch. Learn more.": "Feeling experimental? Labs are the best way to get things early, test out new features and help shape them before they actually launch. Learn more.", "Ignored/Blocked": "Ignored/Blocked", "Error adding ignored user/server": "Error adding ignored user/server", "Something went wrong. Please try again or view your console for hints.": "Something went wrong. Please try again or view your console for hints.", @@ -2776,6 +2777,7 @@ "Upload %(count)s other files|one": "Upload %(count)s other file", "Cancel All": "Cancel All", "Upload Error": "Upload Error", + "Betas & labs": "Betas & labs", "Verify other device": "Verify other device", "Verification Request": "Verification Request", "Approve widget permissions": "Approve widget permissions", From edabdb3aa7a1b63057a278d282f99afe74dc6562 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sat, 2 Jul 2022 13:02:33 +0200 Subject: [PATCH 02/20] Fix tests MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- cypress/integration/5-threads/threads.spec.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/cypress/integration/5-threads/threads.spec.ts b/cypress/integration/5-threads/threads.spec.ts index 3decae38761..fae990a7de9 100644 --- a/cypress/integration/5-threads/threads.spec.ts +++ b/cypress/integration/5-threads/threads.spec.ts @@ -48,7 +48,7 @@ describe("Threads", () => { markWindowBeforeReload(); // Turn off - cy.openUserSettings("Labs").within(() => { + cy.openUserSettings("Betas").within(() => { // initially the new property is there cy.window().should("have.prop", "beforeReload", true); @@ -61,7 +61,7 @@ describe("Threads", () => { markWindowBeforeReload(); // Turn on - cy.openUserSettings("Labs").within(() => { + cy.openUserSettings("Betas").within(() => { // initially the new property is there cy.window().should("have.prop", "beforeReload", true); From 2977d84ef92dc123cb36ca1211b7295b13a9de9c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sat, 2 Jul 2022 17:31:47 +0200 Subject: [PATCH 03/20] Capitalize `L` in `Labs` MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/dialogs/UserSettingsDialog.tsx | 2 +- src/i18n/strings/en_EN.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/dialogs/UserSettingsDialog.tsx b/src/components/views/dialogs/UserSettingsDialog.tsx index db92af16cdd..cf980efae58 100644 --- a/src/components/views/dialogs/UserSettingsDialog.tsx +++ b/src/components/views/dialogs/UserSettingsDialog.tsx @@ -44,7 +44,7 @@ const getLabsTabLabel = (): string | null => { const showLabs = SdkConfig.get("show_labs_settings"); const showBetas = SettingsStore.getFeatureSettingNames().some(k => SettingsStore.getBetaInfo(k)); - if (showBetas && showLabs) return _td("Betas & labs"); + if (showBetas && showLabs) return _td("Betas & Labs"); else if (showBetas) return _td("Betas"); else if (showLabs) return _td("Labs"); diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 46e908588e5..434135df9f6 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -2777,7 +2777,7 @@ "Upload %(count)s other files|one": "Upload %(count)s other file", "Cancel All": "Cancel All", "Upload Error": "Upload Error", - "Betas & labs": "Betas & labs", + "Betas & Labs": "Betas & Labs", "Verify other device": "Verify other device", "Verification Request": "Verification Request", "Approve widget permissions": "Approve widget permissions", From 352539cf22450a62c889555a1a7c0dad3c6cb23b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Mon, 4 Jul 2022 21:28:17 +0200 Subject: [PATCH 04/20] Use `labsSections` instead of `SdkConfig.get("show_labs_settings")` MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx index 9f790939103..110d3aa55b5 100644 --- a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx +++ b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx @@ -180,7 +180,7 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { } { betaSection } - { SdkConfig.get("show_labs_settings") && <> + { labsSections && <>
{ _t("Labs") }
{ labsSections } } From 342cbc6c37a288058cf39107fe7a74485941ad7e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Tue, 5 Jul 2022 09:02:25 +0200 Subject: [PATCH 05/20] Link to `betas.md` instead of `labs.md` MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx index 110d3aa55b5..c0da224c5bc 100644 --- a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx +++ b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx @@ -171,7 +171,7 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { 'Learn more.', {}, { 'a': (sub) => { return { sub }; From 3bd9d0bf29e2f224719b31dec06f1f87e8e01a2e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Thu, 20 Oct 2022 15:19:36 +0200 Subject: [PATCH 06/20] Change labs label back to `Labs` MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- .../views/dialogs/UserSettingsDialog.tsx | 23 +++++-------------- 1 file changed, 6 insertions(+), 17 deletions(-) diff --git a/src/components/views/dialogs/UserSettingsDialog.tsx b/src/components/views/dialogs/UserSettingsDialog.tsx index 98a983f77fc..6512d90b89d 100644 --- a/src/components/views/dialogs/UserSettingsDialog.tsx +++ b/src/components/views/dialogs/UserSettingsDialog.tsx @@ -28,7 +28,6 @@ import NotificationUserSettingsTab from "../settings/tabs/user/NotificationUserS import PreferencesUserSettingsTab from "../settings/tabs/user/PreferencesUserSettingsTab"; import VoiceUserSettingsTab from "../settings/tabs/user/VoiceUserSettingsTab"; import HelpUserSettingsTab from "../settings/tabs/user/HelpUserSettingsTab"; -import SdkConfig from "../../../SdkConfig"; import MjolnirUserSettingsTab from "../settings/tabs/user/MjolnirUserSettingsTab"; import { UIFeature } from "../../../settings/UIFeature"; import BaseDialog from "./BaseDialog"; @@ -37,20 +36,7 @@ import SidebarUserSettingsTab from "../settings/tabs/user/SidebarUserSettingsTab import KeyboardUserSettingsTab from "../settings/tabs/user/KeyboardUserSettingsTab"; import SessionManagerTab from '../settings/tabs/user/SessionManagerTab'; import { UserTab } from "./UserTab"; - -/** - * Returns null if labs are disabled and no betas exist - */ -const getLabsTabLabel = (): string | null => { - const showLabs = SdkConfig.get("show_labs_settings"); - const showBetas = SettingsStore.getFeatureSettingNames().some(k => SettingsStore.getBetaInfo(k)); - - if (showBetas && showLabs) return _td("Betas & Labs"); - else if (showBetas) return _td("Betas"); - else if (showLabs) return _td("Labs"); - - return null; -}; +import SdkConfig from "../../../SdkConfig"; interface IProps extends IDialogProps { initialTabId?: UserTab; @@ -165,10 +151,13 @@ export default class UserSettingsDialog extends React.Component undefined, )); } - if (getLabsTabLabel()) { + if ( + SdkConfig.get("show_labs_settings") + || SettingsStore.getFeatureSettingNames().some(k => SettingsStore.getBetaInfo(k)) + ) { tabs.push(new Tab( UserTab.Labs, - getLabsTabLabel(), + _td("Labs"), "mx_UserSettingsDialog_labsIcon", , "UserSettingsLabs", From 548678aaf9504bd766e718eb2bf0e8700ff00706 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Thu, 20 Oct 2022 15:20:13 +0200 Subject: [PATCH 07/20] Improve labs section copy MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- .../tabs/user/LabsUserSettingsTab.tsx | 40 +++++++++++++------ 1 file changed, 27 insertions(+), 13 deletions(-) diff --git a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx index 4322afe4e90..c24205c3881 100644 --- a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx +++ b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx @@ -154,25 +154,39 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { return (
-
{ _t("Betas") }
+
{ _t("Upcoming features") }
{ - _t('Feeling experimental? Betas are the best way to get things early, ' + - 'test out new features and help shape them before they actually launch. ' + - 'Learn more.', {}, { - 'a': (sub) => { - return { sub }; - }, - }) + _t( + "What's next for Element? " + + "Labs are the best way to get things early, " + + "test out new features and help shape them before they actually launch.", + ) }
{ betaSection } { labsSections && <> -
{ _t("Labs") }
+
{ _t("Early previews") }
+
+ { + _t( + "Feeling experimental? " + + "Try out our latest ideas in development. " + + "These features are not finalised; " + + "they may be unstable, may change, or may be dropped altogether. " + + "Learn more.", + {}, + { + 'a': (sub) => { + return { sub }; + }, + }) + } +
{ labsSections } }
From f662ed300845f96afa996a58c9dcf9c325940d37 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Thu, 20 Oct 2022 15:20:48 +0200 Subject: [PATCH 08/20] Improve labs flags copy MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- res/css/views/elements/_SettingsFlag.pcss | 4 ++ .../views/elements/SettingsFlag.tsx | 5 +++ .../tabs/user/LabsUserSettingsTab.tsx | 21 +--------- src/settings/Settings.tsx | 38 +++++++++++++------ src/settings/SettingsStore.ts | 10 +++++ 5 files changed, 46 insertions(+), 32 deletions(-) diff --git a/res/css/views/elements/_SettingsFlag.pcss b/res/css/views/elements/_SettingsFlag.pcss index a581edae67d..83c78ef39e3 100644 --- a/res/css/views/elements/_SettingsFlag.pcss +++ b/res/css/views/elements/_SettingsFlag.pcss @@ -60,4 +60,8 @@ limitations under the License. font-family: $monospace-font-family !important; background-color: $rte-code-bg-color; } + + .mx_SettingsTab_microcopy_warning::before { + content: "⚠️ "; + } } diff --git a/src/components/views/elements/SettingsFlag.tsx b/src/components/views/elements/SettingsFlag.tsx index 76348342a9b..abee2b3bff6 100644 --- a/src/components/views/elements/SettingsFlag.tsx +++ b/src/components/views/elements/SettingsFlag.tsx @@ -84,6 +84,7 @@ export default class SettingsFlag extends React.Component { ? _t(this.props.label) : SettingsStore.getDisplayName(this.props.name, this.props.level); const description = SettingsStore.getDescription(this.props.name); + const shouldWarn = SettingsStore.shouldWarn(this.props.name); let disabledDescription: JSX.Element; if (this.props.disabled && this.props.disabledDescription) { @@ -106,6 +107,10 @@ export default class SettingsFlag extends React.Component {