Andal.LND/frontend-component-header
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: fixed all review points

Browse Source
This commit is contained in:
SundasNoreen
2023-06-10 00:20:09 +05:00
parent a211547a1d
commit 4e718f85de
12 changed files with 144 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/Notifications/data/selectors.js
View File

@@ -10,12 +10,12 @@ export const selectSelectedAppNotificationIds = (appName) => state => state.noti
export const selectShowNotificationTray = () => state => state.notifications.showNotificationTray;
export const selectNotifications = () => state => state.notifications.notification;
export const selectNotifications = () => state => state.notifications.notifications;
export const selectNotificationsByIds = createSelector(
state => state.notifications.notifications,
state => state.notifications.apps[state.notifications.appName] || [],
(notifications, notificationIds) => notificationIds.map(notificationId => notifications[notificationId]),
export const selectNotificationsByIds = (appName) => createSelector(
selectNotifications(),
selectSelectedAppNotificationIds(appName),
(notifications, notificationIds) => notificationIds.map((notificationId) => notifications[notificationId]) || [],
);
export const selectSelectedAppName = () => state => state.notifications.appName;

81
src/Notifications/data/slice.js
View File

@@ -1,15 +1,17 @@
/* eslint-disable no-param-reassign */
import { createSlice } from '@reduxjs/toolkit';
export const IDLE = 'idle';
export const LOADING = 'loading';
export const LOADED = 'loaded';
export const FAILED = 'failed';
export const DENIED = 'denied';
export const RequestStatus = {
IDLE: 'idle',
LOADING: 'in-progress',
LOADED: 'successful',
FAILED: 'failed',
DENIED: 'denied',
};
const initialState = {
notificationStatus: 'idle',
appName: 'reminders',
appName: 'discussions',
appsId: [],
apps: {},
notifications: {},
@@ -26,65 +28,62 @@ const slice = createSlice({
name: 'notifications',
initialState,
reducers: {
fetchNotificationDenied: (state, { payload }) => {
state.appName = payload.appName;
state.notificationStatus = DENIED;
fetchNotificationDenied: (state) => {
state.notificationStatus = RequestStatus.DENIED;
},
fetchNotificationFailure: (state, { payload }) => {
state.appName = payload.appName;
state.notificationStatus = FAILED;
fetchNotificationFailure: (state) => {
state.notificationStatus = RequestStatus.FAILED;
},
fetchNotificationRequest: (state, { payload }) => {
if (state.appName !== payload.appName) { state.apps[payload.appName] = []; }
state.appName = payload.appName;
state.notificationStatus = LOADING;
fetchNotificationRequest: (state) => {
state.notificationStatus = RequestStatus.LOADING;
},
fetchNotificationSuccess: (state, { payload }) => {
const { notifications, numPages, currentPage } = payload;
const newNotificationIds = notifications.map(notification => notification.id.toString());
const {
newNotificationIds, notificationsKeyValuePair, numPages, currentPage,
} = payload;
const existingNotificationIds = state.apps[state.appName];
const notificationsKeyValuePair = notifications.reduce((acc, obj) => { acc[obj.id] = obj; return acc; }, {});
const currentAppCount = state.tabsCount[state.appName];
state.apps[state.appName] = Array.from(new Set([...existingNotificationIds, ...newNotificationIds]));
state.notifications = { ...state.notifications, ...notificationsKeyValuePair };
state.tabsCount.count -= currentAppCount;
state.tabsCount.count -= state.tabsCount[state.appName];
state.tabsCount[state.appName] = 0;
state.notificationStatus = LOADED;
state.notificationStatus = RequestStatus.LOADED;
state.pagination.numPages = numPages;
state.pagination.currentPage = currentPage;
},
fetchNotificationsCountDenied: (state) => {
state.notificationStatus = DENIED;
state.notificationStatus = RequestStatus.DENIED;
},
fetchNotificationsCountFailure: (state) => {
state.notificationStatus = FAILED;
state.notificationStatus = RequestStatus.FAILED;
},
fetchNotificationsCountRequest: (state) => {
state.notificationStatus = LOADING;
state.notificationStatus = RequestStatus.LOADING;
},
fetchNotificationsCountSuccess: (state, { payload }) => {
const { countByAppName, count, showNotificationTray } = payload;
const {
countByAppName, appIds, apps, count, showNotificationTray,
} = payload;
state.tabsCount = { count, ...countByAppName };
state.appsId = Object.keys(countByAppName);
state.apps = Object.fromEntries(Object.keys(countByAppName).map(key => [key, []]));
state.appsId = appIds;
state.apps = apps;
state.showNotificationTray = showNotificationTray;
state.notificationStatus = LOADED;
state.notificationStatus = RequestStatus.LOADED;
},
markNotificationsAsSeenRequest: (state) => {
state.notificationStatus = LOADING;
state.notificationStatus = RequestStatus.LOADING;
},
markNotificationsAsSeenSuccess: (state) => {
state.notificationStatus = LOADED;
state.notificationStatus = RequestStatus.LOADED;
},
markNotificationsAsSeenDenied: (state) => {
state.notificationStatus = DENIED;
state.notificationStatus = RequestStatus.DENIED;
},
markNotificationsAsSeenFailure: (state) => {
state.notificationStatus = FAILED;
state.notificationStatus = RequestStatus.FAILED;
},
markAllNotificationsAsReadRequest: (state) => {
state.notificationStatus = LOADING;
state.notificationStatus = RequestStatus.LOADING;
},
markAllNotificationsAsReadSuccess: (state) => {
const updatedNotifications = Object.fromEntries(
@@ -93,27 +92,27 @@ const slice = createSlice({
]),
);
state.notifications = updatedNotifications;
state.notificationStatus = LOADED;
state.notificationStatus = RequestStatus.LOADED;
},
markAllNotificationsAsReadDenied: (state) => {
state.notificationStatus = DENIED;
state.notificationStatus = RequestStatus.DENIED;
},
markAllNotificationsAsReadFailure: (state) => {
state.notificationStatus = FAILED;
state.notificationStatus = RequestStatus.FAILED;
},
markNotificationsAsReadRequest: (state) => {
state.notificationStatus = LOADING;
state.notificationStatus = RequestStatus.LOADING;
},
markNotificationsAsReadSuccess: (state, { payload }) => {
const date = new Date().toISOString();
state.notifications[payload.id] = { ...state.notifications[payload.id], lastRead: date };
state.notificationStatus = LOADED;
state.notificationStatus = RequestStatus.LOADED;
},
markNotificationsAsReadDenied: (state) => {
state.notificationStatus = DENIED;
state.notificationStatus = RequestStatus.DENIED;
},
markNotificationsAsReadFailure: (state) => {
state.notificationStatus = FAILED;
state.notificationStatus = RequestStatus.FAILED;
},
resetNotificationStateRequest: () => initialState,
updateAppNameRequest: (state, { payload }) => {

32
src/Notifications/data/thunks.js
View File

@@ -1,4 +1,3 @@
import { camelCaseObject } from '@edx/frontend-platform';
import {
fetchNotificationSuccess,
fetchNotificationRequest,
@@ -27,14 +26,29 @@ import {
} from './api';
import { getHttpErrorStatus } from '../utils';
export const fetchNotificationList = ({
appName, page, pageSize,
}) => (
const normalizeNotificationCounts = ({ countByAppName, count, showNotificationTray }) => {
const appIds = Object.keys(countByAppName);
const apps = appIds.reduce((acc, appId) => { acc[appId] = []; return acc; }, {});
return {
countByAppName, appIds, apps, count, showNotificationTray,
};
};
const normalizeNotifications = ({ notifications }) => {
const newNotificationIds = notifications.map(notification => notification.id.toString());
const notificationsKeyValuePair = notifications.reduce((acc, obj) => { acc[obj.id] = obj; return acc; }, {});
return {
newNotificationIds, notificationsKeyValuePair,
};
};
export const fetchNotificationList = ({ appName, page, pageSize }) => (
async (dispatch) => {
try {
dispatch(fetchNotificationRequest({ appName }));
const data = await getNotifications(appName, page, pageSize);
dispatch(fetchNotificationSuccess(data));
const normalisedData = normalizeNotifications((data));
dispatch(fetchNotificationSuccess({ ...normalisedData, numPages: data.numPages, currentPage: data.currentPage }));
} catch (error) {
if (getHttpErrorStatus(error) === 403) {
dispatch(fetchNotificationDenied(appName));
@@ -50,7 +64,13 @@ export const fetchAppsNotificationCount = () => (
try {
dispatch(fetchNotificationsCountRequest());
const data = await getNotificationCounts();
dispatch(fetchNotificationsCountSuccess(camelCaseObject(data)));
const normalisedData = normalizeNotificationCounts((data));
dispatch(fetchNotificationsCountSuccess({
...normalisedData,
countByAppName: data.countByAppName,
count: data.count,
showNotificationTray: data.showNotificationTray,
}));
} catch (error) {
if (getHttpErrorStatus(error) === 403) {
dispatch(fetchNotificationsCountDenied());