Add Likes in Post component

app/javascript/actions/requestLikes.ts

@@ -0,0 +1,59 @@
+import { Action } from 'redux';
+import { ThunkAction } from 'redux-thunk';
+
+import ILikeJSON from '../interfaces/json/ILike';
+
+import { State } from '../reducers/rootReducer';
+
+export const LIKES_REQUEST_START = 'LIKES_REQUEST_START';
+interface LikesRequestStartAction {
+  type: typeof LIKES_REQUEST_START;
+}
+
+export const LIKES_REQUEST_SUCCESS = 'LIKES_REQUEST_SUCCESS';
+interface LikesRequestSuccessAction {
+  type: typeof LIKES_REQUEST_SUCCESS;
+  likes: Array<ILikeJSON>;
+}
+
+export const LIKES_REQUEST_FAILURE = 'LIKES_REQUEST_FAILURE';
+interface LikesRequestFailureAction {
+  type: typeof LIKES_REQUEST_FAILURE;
+  error: string;
+}
+
+export type LikesRequestActionTypes =
+  LikesRequestStartAction |
+  LikesRequestSuccessAction |
+  LikesRequestFailureAction;
+
+
+const likesRequestStart = (): LikesRequestActionTypes => ({
+  type: LIKES_REQUEST_START,
+});
+
+const likesRequestSuccess = (
+  likes: Array<ILikeJSON>,
+): LikesRequestActionTypes => ({
+  type: LIKES_REQUEST_SUCCESS,
+  likes,
+});
+
+const likesRequestFailure = (error: string): LikesRequestActionTypes => ({
+  type: LIKES_REQUEST_FAILURE,
+  error,
+});
+
+export const requestLikes = (
+  postId: number,
+): ThunkAction<void, State, null, Action<string>> => async (dispatch) => {
+  dispatch(likesRequestStart());
+
+  try {
+    const response = await fetch(`/posts/${postId}/likes`);
+    const json = await response.json();
+    dispatch(likesRequestSuccess(json));
+  } catch (e) {
+    dispatch(likesRequestFailure(e));
+  }
+}

app/javascript/actions/submitLike.ts

@@ -2,20 +2,27 @@ import { Action } from "redux";
 import { ThunkAction } from "redux-thunk";
 
 import { State } from "../reducers/rootReducer";
+import ILikeJSON from "../interfaces/json/ILike";
 
 export const LIKE_SUBMIT_SUCCESS = 'LIKE_SUBMIT_SUCCESS';
 interface LikeSubmitSuccessAction {
   type: typeof LIKE_SUBMIT_SUCCESS,
   postId: number;
   isLike: boolean;
+  like: ILikeJSON;
 }
 
 export type LikeActionTypes = LikeSubmitSuccessAction;
 
-const likeSubmitSuccess = (postId: number, isLike: boolean): LikeSubmitSuccessAction => ({
+const likeSubmitSuccess = (
+  postId: number,
+  isLike: boolean,
+  like: ILikeJSON,  
+): LikeSubmitSuccessAction => ({
   type: LIKE_SUBMIT_SUCCESS,
   postId,
   isLike,
+  like,
 });
 
 export const submitLike = (
@@ -32,9 +39,10 @@ export const submitLike = (
         'X-CSRF-Token': authenticityToken,
       },
     });
+    const json = await res.json();
 
     if (res.status === 201 || res.status === 202)
-      dispatch(likeSubmitSuccess(postId, isLike));
+      dispatch(likeSubmitSuccess(postId, isLike, json));
   } catch (e) {
     console.log('An error occurred while liking a post');
   }