diff --git a/web/modals/threads/notifications/notifications-option-info.react.js b/web/modals/threads/notifications/enum-settings-option-info.react.js
similarity index 86%
rename from web/modals/threads/notifications/notifications-option-info.react.js
rename to web/modals/threads/notifications/enum-settings-option-info.react.js
index 0fa7bc4a3..a1b96c816 100644
--- a/web/modals/threads/notifications/notifications-option-info.react.js
+++ b/web/modals/threads/notifications/enum-settings-option-info.react.js
@@ -1,37 +1,37 @@
 // @flow
 
 import classnames from 'classnames';
 import * as React from 'react';
 
 import SWMansionIcon from '../../../SWMansionIcon.react';
 import css from './notifications-modal.css';
 
 type Props = {
   +valid: boolean,
   +children: React.Node,
 };
 
-function NotificationsOptionInfo(props: Props): React.Node {
+function EnumSettingsOptionInfo(props: Props): React.Node {
   const { valid, children } = props;
 
   const optionInfoClasses = React.useMemo(
     () =>
       classnames(css.optionInfo, {
         [css.optionInfoInvalid]: !valid,
       }),
     [valid],
   );
 
   const icon = React.useMemo(
     () => <SWMansionIcon icon={valid ? 'check' : 'cross'} size={12} />,
     [valid],
   );
   return (
     <div className={optionInfoClasses}>
       {icon}
       {children}
     </div>
   );
 }
 
-export default NotificationsOptionInfo;
+export default EnumSettingsOptionInfo;
diff --git a/web/modals/threads/notifications/notifications-option.react.js b/web/modals/threads/notifications/enum-settings-option.react.js
similarity index 80%
rename from web/modals/threads/notifications/notifications-option.react.js
rename to web/modals/threads/notifications/enum-settings-option.react.js
index 98734837f..e72f11d47 100644
--- a/web/modals/threads/notifications/notifications-option.react.js
+++ b/web/modals/threads/notifications/enum-settings-option.react.js
@@ -1,50 +1,50 @@
 // @flow
 
 import classnames from 'classnames';
 import * as React from 'react';
 
 import Radio from '../../../components/radio.react';
+import EnumSettingsOptionInfo from './enum-settings-option-info.react';
 import css from './notifications-modal.css';
-import NotificationsOptionInfo from './notifications-option-info.react';
 
 type Props = {
   +selected: boolean,
   +onSelect: () => void,
   +icon: React.Node,
   +title: string,
   +description: $ReadOnlyArray<[string, boolean]>,
 };
 
-function NotificationsOption(props: Props): React.Node {
+function EnumSettingsOption(props: Props): React.Node {
   const { icon, title, description, selected, onSelect } = props;
 
   const descriptionItems = React.useMemo(
     () =>
       description.map(([text, isValid]) => (
-        <NotificationsOptionInfo key={text} valid={isValid}>
+        <EnumSettingsOptionInfo key={text} valid={isValid}>
           {text}
-        </NotificationsOptionInfo>
+        </EnumSettingsOptionInfo>
       )),
     [description],
   );
 
   const optionContainerClasses = React.useMemo(
     () =>
       classnames(css.optionContainer, {
         [css.optionContainerSelected]: selected,
       }),
     [selected],
   );
   return (
     <div className={optionContainerClasses} onClick={onSelect}>
       <div className={css.optionIcon}>{icon}</div>
       <div className={css.optionContent}>
         <div className={css.optionTitle}>{title}</div>
         <div className={css.optionDescription}>{descriptionItems}</div>
       </div>
       <Radio checked={selected} />
     </div>
   );
 }
 
-export default NotificationsOption;
+export default EnumSettingsOption;
diff --git a/web/modals/threads/notifications/notifications-modal.react.js b/web/modals/threads/notifications/notifications-modal.react.js
index 60f016ffa..444a5f271 100644
--- a/web/modals/threads/notifications/notifications-modal.react.js
+++ b/web/modals/threads/notifications/notifications-modal.react.js
@@ -1,183 +1,183 @@
 // @flow
 
 import * as React from 'react';
 
 import {
   updateSubscription,
   updateSubscriptionActionTypes,
 } from 'lib/actions/user-actions';
 import { threadInfoSelector } from 'lib/selectors/thread-selectors';
 import {
   useServerCall,
   useDispatchActionPromise,
 } from 'lib/utils/action-utils';
 
 import Button from '../../../components/button.react';
 import { useSelector } from '../../../redux/redux-utils';
 import SWMansionIcon from '../../../SWMansionIcon.react';
 import Modal from '../../modal.react';
+import EnumSettingsOption from './enum-settings-option.react';
 import css from './notifications-modal.css';
-import NotificationsOption from './notifications-option.react';
 
 type NotificationSettings = 'focused' | 'badge-only' | 'background';
 
 type Props = {
   +threadID: string,
   +onClose: () => void,
 };
 
 function NotificationsModal(props: Props): React.Node {
   const { onClose, threadID } = props;
   const threadInfo = useSelector(state => threadInfoSelector(state)[threadID]);
   const { subscription } = threadInfo.currentUser;
 
   const initialThreadSetting = React.useMemo<NotificationSettings>(() => {
     if (!subscription.home) {
       return 'background';
     }
     if (!subscription.pushNotifs) {
       return 'badge-only';
     }
     return 'focused';
   }, [subscription.home, subscription.pushNotifs]);
 
   const [
     notificationSettings,
     setNotificationSettings,
   ] = React.useState<NotificationSettings>(initialThreadSetting);
 
   const onFocusedSelected = React.useCallback(
     () => setNotificationSettings('focused'),
     [],
   );
   const onBadgeOnlySelected = React.useCallback(
     () => setNotificationSettings('badge-only'),
     [],
   );
   const onBackgroundSelected = React.useCallback(
     () => setNotificationSettings('background'),
     [],
   );
 
   const notificationIconStyle = React.useMemo(() => ({ width: 'auto' }), []);
 
   const isFocusedSelected = notificationSettings === 'focused';
   const focusedItem = React.useMemo(() => {
     const description = [
       ['Banner notifs', true],
       ['Badge count', true],
       ['Lives in Focused tab', true],
     ];
     const icon = (
       <SWMansionIcon
         icon="all-notifs"
         size={86}
         style={notificationIconStyle}
       />
     );
     return (
-      <NotificationsOption
+      <EnumSettingsOption
         selected={isFocusedSelected}
         title="Focused (enabled)"
         description={description}
         icon={icon}
         onSelect={onFocusedSelected}
       />
     );
   }, [isFocusedSelected, notificationIconStyle, onFocusedSelected]);
 
   const isFocusedBadgeOnlySelected = notificationSettings === 'badge-only';
   const focusedBadgeOnlyItem = React.useMemo(() => {
     const description = [
       ['Banner notifs', false],
       ['Badge count', true],
       ['Lives in Focused tab', true],
     ];
     const icon = (
       <SWMansionIcon
         icon="badge-notifs"
         size={86}
         style={notificationIconStyle}
       />
     );
     return (
-      <NotificationsOption
+      <EnumSettingsOption
         selected={isFocusedBadgeOnlySelected}
         title="Focused (badge only)"
         description={description}
         icon={icon}
         onSelect={onBadgeOnlySelected}
       />
     );
   }, [isFocusedBadgeOnlySelected, notificationIconStyle, onBadgeOnlySelected]);
 
   const isBackgroundSelected = notificationSettings === 'background';
   const backgroundItem = React.useMemo(() => {
     const description = [
       ['Banner notifs', false],
       ['Badge count', false],
       ['Lives in Backgound tab', true],
     ];
     const icon = (
       <SWMansionIcon
         icon="muted-notifs"
         size={86}
         style={notificationIconStyle}
       />
     );
     return (
-      <NotificationsOption
+      <EnumSettingsOption
         selected={isBackgroundSelected}
         title="Background"
         description={description}
         icon={icon}
         onSelect={onBackgroundSelected}
       />
     );
   }, [isBackgroundSelected, notificationIconStyle, onBackgroundSelected]);
 
   const dispatchActionPromise = useDispatchActionPromise();
 
   const callUpdateSubscription = useServerCall(updateSubscription);
 
   const onClickSave = React.useCallback(() => {
     dispatchActionPromise(
       updateSubscriptionActionTypes,
       callUpdateSubscription({
         threadID: threadID,
         updatedFields: {
           home: notificationSettings !== 'background',
           pushNotifs: notificationSettings === 'focused',
         },
       }),
     );
     onClose();
   }, [
     callUpdateSubscription,
     dispatchActionPromise,
     notificationSettings,
     onClose,
     threadID,
   ]);
 
   return (
     <Modal name="Channel notifications" size="fit-content" onClose={onClose}>
       <div className={css.container}>
         <div className={css.optionsContainer}>
           {focusedItem}
           {focusedBadgeOnlyItem}
           {backgroundItem}
         </div>
         <Button
           type="primary"
           onClick={onClickSave}
           disabled={notificationSettings === initialThreadSetting}
         >
           Save
         </Button>
       </div>
     </Modal>
   );
 }
 
 export default NotificationsModal;