messages form

src/redux/auth/actions.ts

@@ -1,5 +1,6 @@
 import { AUTH_USER_ACTIONS } from '~/redux/auth/constants';
 import { IAuthState, IUser } from '~/redux/auth/types';
+import { IMessage } from '../types';
 
 export const userSendLoginRequest = ({
   username,
@@ -47,3 +48,9 @@ export const authGetMessages = (username: string) => ({
   type: AUTH_USER_ACTIONS.GET_MESSAGES,
   username,
 });
+
+export const authSendMessage = (message: Partial<IMessage>, onSuccess) => ({
+  type: AUTH_USER_ACTIONS.SEND_MESSAGE,
+  message,
+  onSuccess,
+});

src/redux/auth/api.ts

@@ -35,8 +35,18 @@ export const apiAuthGetUserProfile = ({
 export const apiAuthGetUserMessages = ({
   access,
   username,
-}): Promise<IResultWithStatus<{ messages: IMessage }>> =>
+}): Promise<IResultWithStatus<{ messages: IMessage[] }>> =>
   api
     .get(API.USER.MESSAGES(username), configWithToken(access))
     .then(resultMiddleware)
     .catch(errorMiddleware);
+
+export const apiAuthSendMessage = ({
+  access,
+  username,
+  message,
+}): Promise<IResultWithStatus<{ message: IMessage }>> =>
+  api
+    .post(API.USER.MESSAGE_SEND(username), { message }, configWithToken(access))
+    .then(resultMiddleware)
+    .catch(errorMiddleware);

src/redux/auth/constants.ts

@@ -12,6 +12,7 @@ export const AUTH_USER_ACTIONS = {
   OPEN_PROFILE: 'OPEN_PROFILE',
   SET_PROFILE: 'SET_PROFILE',
   GET_MESSAGES: 'GET_MESSAGES',
+  SEND_MESSAGE: 'SEND_MESSAGE',
 };
 
 export const USER_ERRORS = {

src/redux/auth/reducer.ts

@@ -19,9 +19,10 @@ const INITIAL_STATE: IAuthState = {
   profile: {
     is_loading: true,
     is_loading_messages: true,
+    is_sending_messages: false,
     user: null,
     messages: [],
-    messages_errors: {},
+    messages_error: null,
   },
 };
 

src/redux/auth/sagas.ts

@@ -9,15 +9,17 @@ import {
   authOpenProfile,
   authSetProfile,
   authGetMessages,
+  authSendMessage,
 } from '~/redux/auth/actions';
 import {
   apiUserLogin,
   apiAuthGetUser,
   apiAuthGetUserProfile,
   apiAuthGetUserMessages,
+  apiAuthSendMessage,
 } from '~/redux/auth/api';
 import { modalSetShown, modalShowDialog } from '~/redux/modal/actions';
-import { selectToken } from './selectors';
+import { selectToken, selectAuthProfile } from './selectors';
 import { IResultWithStatus } from '../types';
 import { IUser } from './types';
 import { REHYDRATE, RehydrateAction } from 'redux-persist';
@@ -128,7 +130,7 @@ function* getMessages({ username }: ReturnType<typeof authGetMessages>) {
     return yield put(
       authSetProfile({
         is_loading_messages: false,
-        messages_errors: { network: ERRORS.EMPTY_RESPONSE },
+        messages_error: ERRORS.EMPTY_RESPONSE,
       })
     );
   }
@@ -136,6 +138,44 @@ function* getMessages({ username }: ReturnType<typeof authGetMessages>) {
   yield put(authSetProfile({ is_loading_messages: false, messages }));
 }
 
+function* sendMessage({ message, onSuccess }: ReturnType<typeof authSendMessage>) {
+  const {
+    user: { username },
+  } = yield select(selectAuthProfile);
+
+  if (!username) return;
+
+  yield put(authSetProfile({ is_sending_messages: true, messages_error: null }));
+
+  const { error, data } = yield call(reqWrapper, apiAuthSendMessage, { username, message });
+
+  console.log({ error, data });
+
+  if (error || !data.message) {
+    return yield put(
+      authSetProfile({
+        is_sending_messages: false,
+        messages_error: error || ERRORS.EMPTY_RESPONSE,
+      })
+    );
+  }
+
+  const { user, messages } = yield select(selectAuthProfile);
+
+  if (user.username !== username) {
+    return yield put(authSetProfile({ is_sending_messages: false }));
+  }
+
+  yield put(
+    authSetProfile({
+      is_sending_messages: false,
+      messages: [message, ...messages],
+    })
+  );
+
+  onSuccess();
+}
+
 function* authSaga() {
   yield takeLatest(REHYDRATE, checkUserSaga);
   yield takeLatest(AUTH_USER_ACTIONS.LOGOUT, logoutSaga);
@@ -143,6 +183,7 @@ function* authSaga() {
   yield takeLatest(AUTH_USER_ACTIONS.GOT_AUTH_POST_MESSAGE, gotPostMessageSaga);
   yield takeLatest(AUTH_USER_ACTIONS.OPEN_PROFILE, openProfile);
   yield takeLatest(AUTH_USER_ACTIONS.GET_MESSAGES, getMessages);
+  yield takeLatest(AUTH_USER_ACTIONS.SEND_MESSAGE, sendMessage);
 }
 
 export default authSaga;

src/redux/auth/selectors.ts

@@ -5,3 +5,4 @@ export const selectUser = (state: IState): IState['auth']['user'] => state.auth.
 export const selectToken = (state: IState): IState['auth']['token'] => state.auth.token;
 export const selectAuthLogin = (state: IState): IState['auth']['login'] => state.auth.login;
 export const selectAuthProfile = (state: IState): IState['auth']['profile'] => state.auth.profile;
+export const selectAuthUser = (state: IState): IState['auth']['user'] => state.auth.user;

src/redux/auth/types.ts

@@ -32,8 +32,10 @@ export type IAuthState = Readonly<{
   profile: {
     is_loading: boolean;
     is_loading_messages: boolean;
+    is_sending_messages: boolean;
+
     user: IUser;
     messages: IMessage[];
-    messages_errors: Record<string, string>;
+    messages_error: string;
   };
 }>;