From bd2f89805d0bb1c2f1d08fe8d91099aa4f109d35 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Tue, 29 Dec 2020 20:21:24 -0500 Subject: [TMA-461] Notifications Screen (#151) * renamed ProfileStack to MainStack, created initial notifications data type * cleaned up code * added notifications to redux * finished sectioned list * updated types to make more sense * finished sectioned notifications by date * updated notification type and tested mock backend integration * finished read or unread logic * minor changes * another minor fix * finished integration * moved stuff * added ability to navigate to user profile Co-authored-by: Husam Salhab <47015061+hsalhab@users.noreply.github.com> --- src/store/actions/index.ts | 1 + src/store/actions/notifications.ts | 21 +++++++++++++++++++++ src/store/actions/user.ts | 2 +- src/store/actions/userX.ts | 2 +- src/store/initialStates.ts | 17 +++++++++++++---- src/store/reducers/index.ts | 1 + src/store/reducers/userNotificationsReducer.ts | 15 +++++++++++++++ src/store/rootReducer.ts | 2 ++ 8 files changed, 55 insertions(+), 6 deletions(-) create mode 100644 src/store/actions/notifications.ts create mode 100644 src/store/reducers/userNotificationsReducer.ts (limited to 'src/store') diff --git a/src/store/actions/index.ts b/src/store/actions/index.ts index f9fd5e9c..285ca4de 100644 --- a/src/store/actions/index.ts +++ b/src/store/actions/index.ts @@ -6,3 +6,4 @@ export * from './socials'; export * from './taggUsers'; export * from './userBlock'; export * from './userX'; +export * from './notifications'; diff --git a/src/store/actions/notifications.ts b/src/store/actions/notifications.ts new file mode 100644 index 00000000..bace1776 --- /dev/null +++ b/src/store/actions/notifications.ts @@ -0,0 +1,21 @@ +import {Action, ThunkAction} from '@reduxjs/toolkit'; +import {getNotificationsData} from '../../services'; +import {userNotificationsFetched} from '../reducers'; +import {RootState} from '../rootReducer'; + +export const loadUserNotifications = (): ThunkAction< + Promise, + RootState, + unknown, + Action +> => async (dispatch) => { + try { + const notifications = await getNotificationsData(); + dispatch({ + type: userNotificationsFetched.type, + payload: notifications, + }); + } catch (error) { + console.log(error); + } +}; diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index e77b8513..eee5fcde 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -26,7 +26,7 @@ export const loadUserData = ( const token = await getTokenOrLogout(dispatch); const [profile, avatar, cover] = await Promise.all([ loadProfileInfo(token, user.userId), - loadAvatar(token, user.userId), + loadAvatar(user.userId, false), loadCover(token, user.userId), ]); dispatch({ diff --git a/src/store/actions/userX.ts b/src/store/actions/userX.ts index 87162eb1..e313546e 100644 --- a/src/store/actions/userX.ts +++ b/src/store/actions/userX.ts @@ -52,7 +52,7 @@ export const loadUserX = ( payload: {screenType, userId, data}, }), ); - loadAvatar(token, userId).then((data) => + loadAvatar(userId, false).then((data) => dispatch({ type: userXAvatarFetched.type, payload: {screenType, userId, data}, diff --git a/src/store/initialStates.ts b/src/store/initialStates.ts index 8f4a2e84..b75569d6 100644 --- a/src/store/initialStates.ts +++ b/src/store/initialStates.ts @@ -1,11 +1,13 @@ -import {MomentCategoryType, MomentType} from '../types'; import { - ProfileType, - SocialAccountType, + MomentCategoryType, + MomentType, + NotificationType, ProfilePreviewType, + ProfileType, ScreenType, - UserXType, + SocialAccountType, UserType, + UserXType, } from '../types'; export const NO_PROFILE: ProfileType = { @@ -20,6 +22,8 @@ export const NO_PROFILE: ProfileType = { export const EMPTY_MOMENTS_LIST = []; +export const EMPTY_NOTIFICATIONS_LIST = []; + export const NO_USER: UserType = { userId: '', username: '', @@ -34,6 +38,10 @@ export const NO_USER_DATA = { cover: '', }; +export const NO_NOTIFICATIONS = { + notifications: EMPTY_NOTIFICATIONS_LIST, +}; + export const NO_FOLLOW_DATA = { followers: EMPTY_PROFILE_PREVIEW_LIST, following: EMPTY_PROFILE_PREVIEW_LIST, @@ -113,6 +121,7 @@ export const EMPTY_SCREEN_TO_USERS_LIST: Record< > = { [ScreenType.Profile]: EMPTY_USERX_LIST, [ScreenType.Search]: EMPTY_USERX_LIST, + [ScreenType.Notifications]: EMPTY_USERX_LIST, }; export const INITIAL_CATEGORIES_STATE = { diff --git a/src/store/reducers/index.ts b/src/store/reducers/index.ts index e09b41ee..f525eb81 100644 --- a/src/store/reducers/index.ts +++ b/src/store/reducers/index.ts @@ -6,3 +6,4 @@ export * from './taggUsersReducer'; export * from './userBlockReducer'; export * from './userXReducer'; export * from './momentCategoryReducer'; +export * from './userNotificationsReducer'; diff --git a/src/store/reducers/userNotificationsReducer.ts b/src/store/reducers/userNotificationsReducer.ts new file mode 100644 index 00000000..4fc196ca --- /dev/null +++ b/src/store/reducers/userNotificationsReducer.ts @@ -0,0 +1,15 @@ +import {createSlice} from '@reduxjs/toolkit'; +import {NO_NOTIFICATIONS} from '../initialStates'; + +const userNotificationsSlice = createSlice({ + name: 'userNotifications', + initialState: NO_NOTIFICATIONS, + reducers: { + userNotificationsFetched: (state, action) => { + state.notifications = action.payload; + }, + }, +}); + +export const {userNotificationsFetched} = userNotificationsSlice.actions; +export const userNotificationsReducer = userNotificationsSlice.reducer; diff --git a/src/store/rootReducer.ts b/src/store/rootReducer.ts index 8f002de0..7940b1fe 100644 --- a/src/store/rootReducer.ts +++ b/src/store/rootReducer.ts @@ -8,6 +8,7 @@ import { userBlockReducer, userXReducer, momentCategoriesReducer, + userNotificationsReducer, } from './reducers'; /** @@ -18,6 +19,7 @@ const rootReducer = combineReducers({ user: userDataReducer, follow: userFollowReducer, moments: userMomentsReducer, + notifications: userNotificationsReducer, socialAccounts: userSocialsReducer, taggUsers: taggUsersReducer, blocked: userBlockReducer, -- cgit v1.2.3-70-g09d2