Enable redux dev tools and refactor http requests

This commit is contained in:
Riccardo Graziosi
2022-04-09 10:45:43 +02:00
parent ad67c3986b
commit 1803c293ff
10 changed files with 27 additions and 45 deletions

View File

@@ -2,6 +2,8 @@ import { Action } from 'redux';
import { ThunkAction } from 'redux-thunk';
import { State } from '../reducers/rootReducer';
import buildRequestHeaders from '../helpers/buildRequestHeaders';
export const CHANGE_POST_BOARD_SUCCESS = 'CHANGE_POST_BOARD_SUCCESS';
export interface ChangePostBoardSuccessAction {
type: typeof CHANGE_POST_BOARD_SUCCESS;
@@ -21,11 +23,7 @@ export const changePostBoard = (
try {
const response = await fetch(`/posts/${postId}`, {
method: 'PATCH',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
},
headers: buildRequestHeaders(authenticityToken),
body: JSON.stringify({
post: {
board_id: newBoardId,

View File

@@ -2,6 +2,8 @@ import { Action } from 'redux';
import { ThunkAction } from 'redux-thunk';
import { State } from '../reducers/rootReducer';
import buildRequestHeaders from '../helpers/buildRequestHeaders';
export const CHANGE_POST_STATUS_SUCCESS = 'CHANGE_POST_STATUS_SUCCESS';
export interface ChangePostStatusSuccessAction {
type: typeof CHANGE_POST_STATUS_SUCCESS;
@@ -21,11 +23,7 @@ export const changePostStatus = (
try {
const response = await fetch(`/posts/${postId}`, {
method: 'PATCH',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
},
headers: buildRequestHeaders(authenticityToken),
body: JSON.stringify({
post: {
post_status_id: newPostStatusId,

View File

@@ -3,6 +3,7 @@ import { ThunkAction } from 'redux-thunk';
import { State } from '../reducers/rootReducer';
import ICommentJSON from '../interfaces/json/IComment';
import buildRequestHeaders from '../helpers/buildRequestHeaders';
export const COMMENT_SUBMIT_START = 'COMMENT_SUBMIT_START';
interface CommentSubmitStartAction {
@@ -57,11 +58,7 @@ export const submitComment = (
try {
const res = await fetch(`/posts/${postId}/comments`, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
},
headers: buildRequestHeaders(authenticityToken),
body: JSON.stringify({
comment: {
body,

View File

@@ -3,6 +3,7 @@ import { ThunkAction } from "redux-thunk";
import { State } from "../reducers/rootReducer";
import ILikeJSON from "../interfaces/json/ILike";
import buildRequestHeaders from "../helpers/buildRequestHeaders";
export const LIKE_SUBMIT_SUCCESS = 'LIKE_SUBMIT_SUCCESS';
interface LikeSubmitSuccessAction {
@@ -33,11 +34,7 @@ export const submitLike = (
try {
const res = await fetch(`/posts/${postId}/likes`, {
method: isLike ? 'POST' : 'DELETE',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
},
headers: buildRequestHeaders(authenticityToken),
});
const json = await res.json();

View File

@@ -2,6 +2,8 @@ import { ThunkAction } from "redux-thunk";
import { State } from "../reducers/rootReducer";
import { Action } from "redux";
import buildRequestHeaders from "../helpers/buildRequestHeaders";
export const TOGGLE_COMMENT_IS_UPDATE_SUCCESS = 'TOGGLE_COMMENT_IS_UPDATE_SUCCESS';
export interface ToggleIsUpdateSuccessAction {
type: typeof TOGGLE_COMMENT_IS_UPDATE_SUCCESS;
@@ -24,11 +26,7 @@ export const toggleCommentIsUpdate = (
try {
const response = await fetch(`/posts/${postId}/comments/${commentId}`, {
method: 'PATCH',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
},
headers: buildRequestHeaders(authenticityToken),
body: JSON.stringify({
comment: {
is_post_update: !currentIsPostUpdate,

View File

@@ -10,6 +10,7 @@ import {
import Button from '../shared/Button';
import IBoard from '../../interfaces/IBoard';
import buildRequestHeaders from '../../helpers/buildRequestHeaders';
interface Props {
board: IBoard;
@@ -93,11 +94,7 @@ class NewPost extends React.Component<Props, State> {
try {
const res = await fetch('/posts', {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
},
headers: buildRequestHeaders(authenticityToken),
body: JSON.stringify({
post: {
title,

View File

@@ -0,0 +1,7 @@
const buildRequestHeaders = (authenticityToken: string) => ({
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-Token': authenticityToken,
});
export default buildRequestHeaders;

View File

@@ -1,19 +1,15 @@
import { createStore, applyMiddleware } from 'redux';
// import { composeWithDevTools } from 'redux-devtools-extension';
import { createStore, applyMiddleware, compose } from 'redux';
import thunkMiddleware from 'redux-thunk';
import rootReducer from '../reducers/rootReducer';
// const composeEnhancers = composeWithDevTools({
// trace: true,
// });
const createStoreHelper = () => (
createStore(
rootReducer,
// composeEnhancers(
applyMiddleware(thunkMiddleware)
// )
compose(
applyMiddleware(thunkMiddleware),
(window as any).__REDUX_DEVTOOLS_EXTENSION__ && (window as any).__REDUX_DEVTOOLS_EXTENSION__()
)
)
);

View File

@@ -29,7 +29,6 @@
"version": "0.1.0",
"devDependencies": {
"@types/react-redux": "^7.1.3",
"redux-devtools-extension": "^2.13.8",
"webpack-dev-server": "^3.8.0"
}
}

View File

@@ -6106,11 +6106,6 @@ redent@^1.0.0:
indent-string "^2.1.0"
strip-indent "^1.0.1"
redux-devtools-extension@^2.13.8:
version "2.13.8"
resolved "https://registry.yarnpkg.com/redux-devtools-extension/-/redux-devtools-extension-2.13.8.tgz#37b982688626e5e4993ff87220c9bbb7cd2d96e1"
integrity sha512-8qlpooP2QqPtZHQZRhx3x3OP5skEV1py/zUdMY28WNAocbafxdG2tRD1MWE7sp8obGMNYuLWanhhQ7EQvT1FBg==
redux-thunk@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"