fix: removed extra loader while updating preferences

src/notification-preferences/NotificationPreferenceRow.jsx

@@ -11,7 +11,7 @@ import {
   selectPreference,
   selectPreferenceNonEditableChannels,
   selectSelectedCourseId,
-  selectNotificationPreferencesStatus,
+  selectUpdatePreferencesStatus,
 } from './data/selectors';
 import { updatePreferenceToggle } from './data/thunks';
 import { LOADING_STATUS } from '../constants';
@@ -22,7 +22,7 @@ const NotificationPreferenceRow = ({ appId, preferenceName }) => {
   const courseId = useSelector(selectSelectedCourseId());
   const preference = useSelector(selectPreference(appId, preferenceName));
   const nonEditable = useSelector(selectPreferenceNonEditableChannels(appId, preferenceName));
-  const preferencesStatus = useSelector(selectNotificationPreferencesStatus());
+  const updatePreferencesStatus = useSelector(selectUpdatePreferencesStatus());
 
   const onToggle = useCallback((event) => {
     const {
@@ -76,7 +76,7 @@ const NotificationPreferenceRow = ({ appId, preferenceName }) => {
               name={channel}
               value={preference[channel]}
               onChange={onToggle}
-              disabled={nonEditable.includes(channel) || preferencesStatus === LOADING_STATUS}
+              disabled={nonEditable.includes(channel) || updatePreferencesStatus === LOADING_STATUS}
             />
           </div>
         ))}

src/notification-preferences/data/reducers.js

@@ -15,6 +15,7 @@ export const defaultState = {
   },
   preferences: {
     status: IDLE_STATUS,
+    updatePreferenceStatus: IDLE_STATUS,
     selectedCourse: null,
     preferences: [],
     apps: [],
@@ -70,6 +71,7 @@ const notificationPreferencesReducer = (state = defaultState, action = {}) => {
         preferences: {
           ...state.preferences,
           status: SUCCESS_STATUS,
+          updatePreferenceStatus: SUCCESS_STATUS,
           ...action.payload,
         },
       };
@@ -79,6 +81,7 @@ const notificationPreferencesReducer = (state = defaultState, action = {}) => {
         preferences: {
           ...state.preferences,
           status: FAILURE_STATUS,
+          updatePreferenceStatus: FAILURE_STATUS,
           preferences: [],
           apps: [],
           nonEditable: {},
@@ -102,7 +105,7 @@ const notificationPreferencesReducer = (state = defaultState, action = {}) => {
               ? { ...preference, [notificationChannel]: value }
               : preference
           )),
-          status: LOADING_STATUS,
+          updatePreferenceStatus: LOADING_STATUS,
         },
       };
     case Actions.UPDATE_APP_PREFERENCE:

src/notification-preferences/data/selectors.js

@@ -2,6 +2,10 @@ export const selectNotificationPreferencesStatus = () => state => (
   state.notificationPreferences.preferences.status
 );
 
+export const selectUpdatePreferencesStatus = () => state => (
+  state.notificationPreferences.preferences.updatePreferenceStatus
+);
+
 export const selectPreferences = () => state => (
   state.notificationPreferences.preferences?.preferences
 );