[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, 224 insertions, 0 deletions

diff --git a/src/store/reducers/index.ts b/src/store/reducers/index.ts
new file mode 100644
index 00000000..0e378bc5
--- /dev/null
+++ b/src/store/reducers/index.ts
@@ -0,0 +1,7 @@
+export * from './userFollowReducer';
+export * from './userReducer';
+export * from './userMomentsReducer';
+export * from './userSocialsReducer';
+export * from './taggUsersReducer';
+export * from './userBlockReducer';
+export * from './userXReducer';
diff --git a/src/store/reducers/taggUsersReducer.ts b/src/store/reducers/taggUsersReducer.ts
new file mode 100644
index 00000000..ff30f7a0
--- /dev/null
+++ b/src/store/reducers/taggUsersReducer.ts
@@ -0,0 +1,16 @@
+import {NO_TAGG_USERS} from '../initialStates';
+import {createSlice} from '@reduxjs/toolkit';
+
+const taggUsersSlice = createSlice({
+  name: 'taggUsers',
+  initialState: NO_TAGG_USERS,
+  reducers: {
+    taggUsersFetched: (state, action) => {
+      state.recentSearches = action.payload.taggUsers;
+      state.taggUsers = action.payload.taggUsers;
+    },
+  },
+});
+
+export const {taggUsersFetched} = taggUsersSlice.actions;
+export const taggUsersReducer = taggUsersSlice.reducer;
diff --git a/src/store/reducers/userBlockReducer.ts b/src/store/reducers/userBlockReducer.ts
new file mode 100644
index 00000000..90e4a04a
--- /dev/null
+++ b/src/store/reducers/userBlockReducer.ts
@@ -0,0 +1,25 @@
+import {createSlice} from '@reduxjs/toolkit';
+import {NO_BLOCKED_USERS} from '../initialStates';
+
+const userBlockSlice = createSlice({
+  name: 'userBlock',
+  initialState: NO_BLOCKED_USERS,
+  reducers: {
+    userBlockFetched: (state, action) => {
+      state.blockedUsers = action.payload;
+    },
+
+    updateBlockedList: (state, action) => {
+      const {isBlocked, data} = action.payload;
+      if (!isBlocked) state.blockedUsers.push(data);
+      else {
+        state.blockedUsers = state.blockedUsers.filter(
+          (user) => user.username != data.username,
+        );
+      }
+    },
+  },
+});
+
+export const {userBlockFetched, updateBlockedList} = userBlockSlice.actions;
+export const userBlockReducer = userBlockSlice.reducer;
diff --git a/src/store/reducers/userFollowReducer.ts b/src/store/reducers/userFollowReducer.ts
new file mode 100644
index 00000000..55e16532
--- /dev/null
+++ b/src/store/reducers/userFollowReducer.ts
@@ -0,0 +1,27 @@
+import {createSlice} from '@reduxjs/toolkit';
+import {act} from 'react-test-renderer';
+import {NO_FOLLOW_DATA} from '../initialStates';
+
+const userFollowSlice = createSlice({
+  name: 'userFollow',
+  initialState: NO_FOLLOW_DATA,
+  reducers: {
+    userFollowFetched: (state, action) => {
+      state.followers = action.payload.followers;
+      state.following = action.payload.following;
+    },
+
+    updateFollowing: (state, action) => {
+      const {isFollowed, data} = action.payload;
+      if (!isFollowed) state.following.push(data);
+      else {
+        state.following = state.following.filter(
+          (follow) => follow.username !== data.username,
+        );
+      }
+    },
+  },
+});
+
+export const {userFollowFetched, updateFollowing} = userFollowSlice.actions;
+export const userFollowReducer = userFollowSlice.reducer;
diff --git a/src/store/reducers/userMomentsReducer.ts b/src/store/reducers/userMomentsReducer.ts
new file mode 100644
index 00000000..456ca2fa
--- /dev/null
+++ b/src/store/reducers/userMomentsReducer.ts
@@ -0,0 +1,15 @@
+import {createSlice} from '@reduxjs/toolkit';
+import {NO_MOMENTS} from '../initialStates';
+
+const userMomentsSlice = createSlice({
+  name: 'userMoments',
+  initialState: NO_MOMENTS,
+  reducers: {
+    userMomentsFetched: (state, action) => {
+      state.moments = action.payload;
+    },
+  },
+});
+
+export const {userMomentsFetched} = userMomentsSlice.actions;
+export const userMomentsReducer = userMomentsSlice.reducer;
diff --git a/src/store/reducers/userReducer.ts b/src/store/reducers/userReducer.ts
new file mode 100644
index 00000000..f43bd0bc
--- /dev/null
+++ b/src/store/reducers/userReducer.ts
@@ -0,0 +1,36 @@
+import {createSlice, Action} from '@reduxjs/toolkit';
+import {NO_USER_DATA} from '../initialStates';
+
+/**
+ * A reducer is a pure function with the sole responsibility of updating the state and nothing else.
+ * No side effects are allowed.
+ */
+
+/**
+ * Actions are a way to indicate what just happened / what is going to happen and update the state accordingly.
+ */
+
+/**
+ * Create slice allows us
+ * To initialise State , create Actions and Reducers in one go
+ * Read more here https://redux.js.org/introduction/installation
+ */
+
+const userDataSlice = createSlice({
+  name: 'userData',
+  initialState: NO_USER_DATA,
+  reducers: {
+    userLoggedIn: (state, action) => {
+      state.user = action.payload;
+    },
+
+    userDetailsFetched: (state, action) => {
+      state.profile = action.payload.profile;
+      state.avatar = action.payload.avatar;
+      state.cover = action.payload.cover;
+    },
+  },
+});
+
+export const {userLoggedIn, userDetailsFetched} = userDataSlice.actions;
+export const userDataReducer = userDataSlice.reducer;
diff --git a/src/store/reducers/userSocialsReducer.ts b/src/store/reducers/userSocialsReducer.ts
new file mode 100644
index 00000000..de79568c
--- /dev/null
+++ b/src/store/reducers/userSocialsReducer.ts
@@ -0,0 +1,21 @@
+import {createSlice} from '@reduxjs/toolkit';
+import {NO_SOCIALS} from '../initialStates';
+
+const userSocialsSlice = createSlice({
+  name: 'userSocials',
+  initialState: NO_SOCIALS,
+  reducers: {
+    individualSocialfetched: (state, actions) => {
+      state.socialAccounts[actions.payload.socialType] = actions.payload.social;
+    },
+    userSocialsFetched: (state, action) => {
+      state.socialAccounts = action.payload;
+    },
+  },
+});
+
+export const {
+  userSocialsFetched,
+  individualSocialfetched,
+} = userSocialsSlice.actions;
+export const userSocialsReducer = userSocialsSlice.reducer;
diff --git a/src/store/reducers/userXReducer.ts b/src/store/reducers/userXReducer.ts
new file mode 100644
index 00000000..154dd7dc
--- /dev/null
+++ b/src/store/reducers/userXReducer.ts
@@ -0,0 +1,77 @@
+import {ScreenType} from '../../types/types';
+import {EMPTY_SCREEN_TO_USERS_LIST, EMPTY_USER_X} from '../initialStates';
+import {createSlice} from '@reduxjs/toolkit';
+
+const userXSlice = createSlice({
+  name: 'userX',
+  initialState: EMPTY_SCREEN_TO_USERS_LIST,
+  reducers: {
+    userXRequested: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ] = EMPTY_USER_X;
+    },
+
+    userXProfileFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].profile = action.payload.data;
+    },
+
+    userXUserFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][action.payload.userId].user =
+        action.payload.user;
+    },
+
+    userXMomentsFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].moments = action.payload.data;
+    },
+    userXFollowersFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].followers = action.payload.data;
+    },
+    userXFollowingFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].following = action.payload.data;
+    },
+    userXAvatarFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].avatar = action.payload.data;
+    },
+    userXCoverFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].cover = action.payload.data;
+    },
+    userXSocialsFetched: (state, action) => {
+      state[<ScreenType>action.payload.screenType][
+        action.payload.userId
+      ].socialAccounts = action.payload.data;
+    },
+
+    resetScreen: (state, action) => {
+      for (let userId in state[<ScreenType>action.payload.screenType]) {
+        state[<ScreenType>action.payload.screenType][userId] = EMPTY_USER_X;
+      }
+    },
+  },
+});
+
+export const {
+  userXUserFetched,
+  userXRequested,
+  userXAvatarFetched,
+  userXFollowersFetched,
+  userXFollowingFetched,
+  userXCoverFetched,
+  userXMomentsFetched,
+  userXProfileFetched,
+  userXSocialsFetched,
+  resetScreen,
+} = userXSlice.actions;
+export const userXReducer = userXSlice.reducer;