diff --git a/web/components/enum-settings-option-info.react.js b/web/components/enum-settings-option-info.react.js
--- a/web/components/enum-settings-option-info.react.js
+++ b/web/components/enum-settings-option-info.react.js
@@ -9,26 +9,35 @@
type Props = {
+optionSelected: boolean,
+valid: boolean,
+ +styleStatementBasedOnValidity: boolean,
+children: React.Node,
};
function EnumSettingsOptionInfo(props: Props): React.Node {
- const { valid, children, optionSelected } = props;
+ const {
+ optionSelected,
+ valid,
+ styleStatementBasedOnValidity,
+ children,
+ } = props;
const optionInfoClasses = React.useMemo(
() =>
classnames({
[css.optionInfo]: true,
- [css.optionInfoInvalid]: !valid,
- [css.optionInfoInvalidSelected]: !valid && optionSelected,
+ [css.optionInfoInvalid]: styleStatementBasedOnValidity && !valid,
+ [css.optionInfoInvalidSelected]:
+ styleStatementBasedOnValidity && !valid && optionSelected,
}),
- [valid, optionSelected],
+ [styleStatementBasedOnValidity, valid, optionSelected],
);
- const icon = React.useMemo(
- () => ,
- [valid],
- );
+ const icon = React.useMemo(() => {
+ if (!styleStatementBasedOnValidity) {
+ return null;
+ }
+ return ;
+ }, [styleStatementBasedOnValidity, valid]);
return (
{icon}
diff --git a/web/components/enum-settings-option.react.js b/web/components/enum-settings-option.react.js
--- a/web/components/enum-settings-option.react.js
+++ b/web/components/enum-settings-option.react.js
@@ -15,6 +15,7 @@
+statements: $ReadOnlyArray<{
+statement: string,
+isStatementValid: boolean,
+ +styleStatementBasedOnValidity: boolean,
}>,
};
@@ -23,15 +24,18 @@
const descriptionItems = React.useMemo(
() =>
- statements.map(({ statement, isStatementValid }) => (
-
- {statement}
-
- )),
+ statements.map(
+ ({ statement, isStatementValid, styleStatementBasedOnValidity }) => (
+
+ {statement}
+
+ ),
+ ),
[selected, statements],
);
diff --git a/web/modals/threads/notifications/notifications-modal.react.js b/web/modals/threads/notifications/notifications-modal.react.js
--- a/web/modals/threads/notifications/notifications-modal.react.js
+++ b/web/modals/threads/notifications/notifications-modal.react.js
@@ -32,21 +32,57 @@
const IN_BACKGROUND_TAB = 'Lives in Background tab';
const focusedStatements = [
- { statement: BANNER_NOTIFS, isStatementValid: true },
- { statement: BADGE_COUNT, isStatementValid: true },
- { statement: IN_FOCUSED_TAB, isStatementValid: true },
+ {
+ statement: BANNER_NOTIFS,
+ isStatementValid: true,
+ styleStatementBasedOnValidity: true,
+ },
+ {
+ statement: BADGE_COUNT,
+ isStatementValid: true,
+ styleStatementBasedOnValidity: true,
+ },
+ {
+ statement: IN_FOCUSED_TAB,
+ isStatementValid: true,
+ styleStatementBasedOnValidity: true,
+ },
];
const badgeOnlyStatements = [
- { statement: BANNER_NOTIFS, isStatementValid: false },
- { statement: BADGE_COUNT, isStatementValid: true },
- { statement: IN_FOCUSED_TAB, isStatementValid: true },
+ {
+ statement: BANNER_NOTIFS,
+ isStatementValid: false,
+ styleStatementBasedOnValidity: true,
+ },
+ {
+ statement: BADGE_COUNT,
+ isStatementValid: true,
+ styleStatementBasedOnValidity: true,
+ },
+ {
+ statement: IN_FOCUSED_TAB,
+ isStatementValid: true,
+ styleStatementBasedOnValidity: true,
+ },
];
const backgroundStatements = [
- { statement: BANNER_NOTIFS, isStatementValid: false },
- { statement: BADGE_COUNT, isStatementValid: false },
- { statement: IN_BACKGROUND_TAB, isStatementValid: true },
+ {
+ statement: BANNER_NOTIFS,
+ isStatementValid: false,
+ styleStatementBasedOnValidity: true,
+ },
+ {
+ statement: BADGE_COUNT,
+ isStatementValid: false,
+ styleStatementBasedOnValidity: true,
+ },
+ {
+ statement: IN_BACKGROUND_TAB,
+ isStatementValid: true,
+ styleStatementBasedOnValidity: true,
+ },
];
type Props = {
diff --git a/web/modals/threads/settings/thread-settings-privacy-tab.react.js b/web/modals/threads/settings/thread-settings-privacy-tab.react.js
--- a/web/modals/threads/settings/thread-settings-privacy-tab.react.js
+++ b/web/modals/threads/settings/thread-settings-privacy-tab.react.js
@@ -30,6 +30,7 @@
{
statement: threadTypeDescriptions[COMMUNITY_OPEN_SUBTHREAD],
isStatementValid: true,
+ styleStatementBasedOnValidity: false,
},
];
@@ -37,6 +38,7 @@
{
statement: threadTypeDescriptions[COMMUNITY_SECRET_SUBTHREAD],
isStatementValid: true,
+ styleStatementBasedOnValidity: false,
},
];