[TMA - 398 AND TMA-430] Replace Providers with Redux Store (#125)

* First

* WIP

* Thunk

* Some more comments

* sc

* recent searches and follounfollow

* Edit profile dummy

* Block / unblock and some cleanup

* Replace auth provider

* Sc

* Delete AP  after rebase

* Discover users

* Cleanup

* More cleanup

* Replace profile provider

* Fixed build failure

* Fixed a bug reported

* Prevent app crash when backend server is down

8 files changed, 379 insertions, 0 deletions

diff --git a/src/store/actions/index.ts b/src/store/actions/index.ts
new file mode 100644
index 00000000..04fa9767
--- /dev/null
+++ b/src/store/actions/index.ts
@@ -0,0 +1,7 @@
+export * from './user';
+export * from './userFollow';
+export * from './userMoments';
+export * from './socials';
+export * from './taggUsers';
+export * from './userBlock';
+export * from './userX';
diff --git a/src/store/actions/socials.ts b/src/store/actions/socials.ts
new file mode 100644
index 00000000..f79b4ad1
--- /dev/null
+++ b/src/store/actions/socials.ts
@@ -0,0 +1,38 @@
+import {RootState} from '../rootReducer';
+import {loadSocialPosts} from '../../services';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {userSocialsFetched, individualSocialfetched} from '../reducers';
+import {loadAllSocialsForUser} from '../../utils';
+
+export const loadIndividualSocial = (
+  userId: string,
+  socialType: string,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const social = await loadSocialPosts(userId, socialType);
+    dispatch({
+      type: individualSocialfetched.type,
+      payload: {socialType, social},
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+export const loadAllSocials = (
+  userId: string,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const socials = await loadAllSocialsForUser(userId);
+    dispatch({
+      type: userSocialsFetched.type,
+      payload: socials,
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
diff --git a/src/store/actions/taggUsers.ts b/src/store/actions/taggUsers.ts
new file mode 100644
index 00000000..7f841c51
--- /dev/null
+++ b/src/store/actions/taggUsers.ts
@@ -0,0 +1,24 @@
+import {RootState} from '../rootReducer';
+import {loadRecentlySearchedUsers, getAllTaggUsers} from '../../services';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {taggUsersFetched} from '../reducers';
+import {getTokenOrLogout} from '../../utils';
+
+export const loadRecentlySearched = (): ThunkAction<
+  Promise<void>,
+  RootState,
+  unknown,
+  Action<string>
+> => async (dispatch) => {
+  try {
+    const token = await getTokenOrLogout(dispatch);
+    const recentSearches = await loadRecentlySearchedUsers();
+    const taggUsers = await getAllTaggUsers(token);
+    dispatch({
+      type: taggUsersFetched.type,
+      payload: {recentSearches, taggUsers},
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts
new file mode 100644
index 00000000..09ec8abf
--- /dev/null
+++ b/src/store/actions/user.ts
@@ -0,0 +1,52 @@
+import {RootState} from '../rootReducer';
+import {UserType} from '../../types/types';
+import {loadProfileInfo, loadAvatar, loadCover} from '../../services';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {userLoggedIn, userDetailsFetched} from '../reducers';
+import {getTokenOrLogout} from '../../utils';
+
+/**
+ * Entry point to our store.
+ * Thunk allows us to make async API calls and hence is responsible to fetch data from server.
+ */
+
+/**
+ * Lets understand Thunk.
+ * https://bloggie.io/@_ChristineOo/understanding-typings-of-redux-thunk-action
+ * https://github.com/reduxjs/redux-thunk
+ */
+
+export const loadUserData = (
+  user: UserType,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    await dispatch({type: userLoggedIn.type, payload: user});
+    const token = await getTokenOrLogout(dispatch);
+    const [profile, avatar, cover] = await Promise.all([
+      loadProfileInfo(token, user.userId),
+      loadAvatar(token, user.userId),
+      loadCover(token, user.userId),
+    ]);
+    dispatch({
+      type: userDetailsFetched.type,
+      payload: {profile, cover, avatar},
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+export const logout = (): ThunkAction<
+  Promise<void>,
+  RootState,
+  unknown,
+  Action<string>
+> => async (dispatch) => {
+  try {
+    dispatch({type: userLoggedIn.type, payload: {userId: '', username: ''}});
+  } catch (error) {
+    console.log(error);
+  }
+};
diff --git a/src/store/actions/userBlock.ts b/src/store/actions/userBlock.ts
new file mode 100644
index 00000000..f903e99e
--- /dev/null
+++ b/src/store/actions/userBlock.ts
@@ -0,0 +1,48 @@
+import {RootState} from '../rootReducer';
+import {ProfilePreviewType, UserType} from '../../types/types';
+import {blockOrUnblockUser, loadBlockedUsers} from '../../services';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {userBlockFetched, updateBlockedList, userLoggedIn} from '../reducers';
+import {getTokenOrLogout} from '../../utils';
+
+export const loadBlockedList = (
+  userId: string,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const token = await getTokenOrLogout(dispatch);
+    const blocked = await loadBlockedUsers(userId, token);
+    dispatch({
+      type: userBlockFetched.type,
+      payload: blocked,
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+export const blockUnblockUser = (
+  blocker: UserType,
+  blocked: ProfilePreviewType,
+  isBlocked: boolean,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  const token = await getTokenOrLogout(dispatch);
+  const success = blockOrUnblockUser(
+    blocker.userId,
+    blocked.id,
+    token,
+    isBlocked,
+  );
+  if (success) {
+    dispatch({
+      type: updateBlockedList.type,
+      payload: {
+        isBlocked,
+        data: blocked,
+      },
+    });
+  }
+};
diff --git a/src/store/actions/userFollow.ts b/src/store/actions/userFollow.ts
new file mode 100644
index 00000000..e23bbfc0
--- /dev/null
+++ b/src/store/actions/userFollow.ts
@@ -0,0 +1,57 @@
+import {getTokenOrLogout} from './../../utils';
+import {RootState} from '../rootReducer';
+import {ProfilePreviewType, UserType} from '../../types/types';
+import {
+  followOrUnfollowUser,
+  loadFollowers,
+  loadFollowing,
+} from '../../services';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {userFollowFetched, updateFollowing, userLoggedIn} from '../reducers';
+
+export const loadFollowData = (
+  userId: string,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const token = await getTokenOrLogout(dispatch);
+    const followers = await loadFollowers(userId, token);
+    const following = await loadFollowing(userId, token);
+    dispatch({
+      type: userFollowFetched.type,
+      payload: {followers, following},
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+export const followUnfollowUser = (
+  follower: UserType,
+  followed: ProfilePreviewType,
+  isFollowed: boolean,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const token = await getTokenOrLogout(dispatch);
+    const success = await followOrUnfollowUser(
+      follower.userId,
+      followed.id,
+      token,
+      isFollowed,
+    );
+    if (success) {
+      dispatch({
+        type: updateFollowing.type,
+        payload: {
+          isFollowed,
+          data: followed,
+        },
+      });
+    }
+  } catch (error) {
+    console.log(error);
+  }
+};
diff --git a/src/store/actions/userMoments.ts b/src/store/actions/userMoments.ts
new file mode 100644
index 00000000..dce8da8a
--- /dev/null
+++ b/src/store/actions/userMoments.ts
@@ -0,0 +1,22 @@
+import {RootState} from '../rootReducer';
+import {loadMoments} from '../../services';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {userMomentsFetched} from '../reducers';
+import {getTokenOrLogout} from '../../utils';
+
+export const loadUserMoments = (
+  userId: string,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const token = await getTokenOrLogout(dispatch);
+    const moments = await loadMoments(userId, token);
+    dispatch({
+      type: userMomentsFetched.type,
+      payload: moments,
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
diff --git a/src/store/actions/userX.ts b/src/store/actions/userX.ts
new file mode 100644
index 00000000..5468f762
--- /dev/null
+++ b/src/store/actions/userX.ts
@@ -0,0 +1,131 @@
+import {userXInStore} from './../../utils/';
+import {getTokenOrLogout, loadAllSocialsForUser} from './../../utils';
+import {UserType, ScreenType, ProfilePreviewType} from '../../types/types';
+import {RootState} from '../rootReducer';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
+import {
+  userXRequested,
+  userXAvatarFetched,
+  userXFollowersFetched,
+  userXFollowingFetched,
+  userXCoverFetched,
+  userXMomentsFetched,
+  userXProfileFetched,
+  userXSocialsFetched,
+  userXUserFetched,
+  resetScreen,
+} from '../reducers';
+import {
+  loadProfileInfo,
+  loadAvatar,
+  loadCover,
+  loadFollowers,
+  loadFollowing,
+  loadMoments,
+} from '../../services';
+
+export const loadUserX = (
+  user: UserType,
+  screenType: ScreenType,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const {userId} = user;
+    await dispatch({type: userXRequested.type, payload: {screenType, userId}});
+    await dispatch({
+      type: userXUserFetched.type,
+      payload: {screenType, userId, user},
+    });
+    const token = await getTokenOrLogout(dispatch);
+    loadProfileInfo(token, userId).then((data) =>
+      dispatch({
+        type: userXProfileFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+    loadAllSocialsForUser(userId).then((data) =>
+      dispatch({
+        type: userXSocialsFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+    loadAvatar(token, userId).then((data) =>
+      dispatch({
+        type: userXAvatarFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+    loadCover(token, userId).then((data) =>
+      dispatch({
+        type: userXCoverFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+    loadFollowers(userId, token).then((data) =>
+      dispatch({
+        type: userXFollowersFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+    loadFollowing(userId, token).then((data) =>
+      dispatch({
+        type: userXFollowingFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+    loadMoments(userId, token).then((data) =>
+      dispatch({
+        type: userXMomentsFetched.type,
+        payload: {screenType, userId, data},
+      }),
+    );
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+export const updateUserXFollowersAndFollowing = (
+  userId: string,
+  state: RootState,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    const screens = <ScreenType[]>[ScreenType.Profile, ScreenType.Search];
+    const token = await getTokenOrLogout(dispatch);
+    screens.forEach((screenType) => {
+      if (userXInStore(state, screenType, userId)) {
+        loadFollowers(userId, token).then((data) =>
+          dispatch({
+            type: userXFollowersFetched.type,
+            payload: {screenType, userId, data},
+          }),
+        );
+        loadFollowing(userId, token).then((data) =>
+          dispatch({
+            type: userXFollowingFetched.type,
+            payload: {screenType, userId, data},
+          }),
+        );
+      }
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+export const resetScreenType = (
+  screenType: ScreenType,
+): ThunkAction<Promise<void>, RootState, unknown, Action<string>> => async (
+  dispatch,
+) => {
+  try {
+    dispatch({
+      type: resetScreen.type,
+      payload: {screenType},
+    });
+  } catch (error) {
+    console.log(error);
+  }
+};